
*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4}
body{margin:0}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0}
a{text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit;margin:0}
button{background:transparent}
table{text-indent:0;border-color:inherit}

/* Locally hosted utility subset used by the static pages. Keeping these rules
   here removes the render-blocking Tailwind CDN runtime from every page. */
.block{display:block}.hidden{display:none}.flex{display:flex}
.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}
.gap-4{gap:1rem}.mx-auto{margin-left:auto;margin-right:auto}.max-w-7xl{max-width:80rem}
.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-8{padding:2rem}
.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}
.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-6{margin-bottom:1.5rem}.ml-1{margin-left:.25rem}.pl-3{padding-left:.75rem}
.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}.space-y-1\.5>:not([hidden])~:not([hidden]){margin-top:.375rem}.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}
.w-16{width:4rem}.w-56{width:14rem}.w-full{width:100%}.overflow-x-auto{overflow-x:auto}.whitespace-nowrap{white-space:nowrap}
.list-none{list-style-type:none}.list-disc{list-style-type:disc}.list-decimal{list-style-type:decimal}.list-inside{list-style-position:inside}.border-collapse{border-collapse:collapse}
.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}
.border{border-width:1px}.border-l-4{border-left-width:4px}
.border-amber-100{border-color:#fef3c7}.border-amber-200{border-color:#fde68a}.border-amber-500{border-color:#f59e0b}
.border-emerald-100{border-color:#d1fae5}.border-emerald-200{border-color:#a7f3d0}.border-emerald-500{border-color:#10b981}
.border-indigo-100{border-color:#e0e7ff}.border-indigo-200{border-color:#c7d2fe}.border-indigo-500{border-color:#6366f1}
.border-pink-100{border-color:#fce7f3}.border-pink-200{border-color:#fbcfe8}.border-pink-500{border-color:#ec4899}
.border-red-200{border-color:#fecaca}.border-rose-100{border-color:#ffe4e6}.border-rose-200{border-color:#fecdd3}.border-rose-500{border-color:#f43f5e}
.border-violet-100{border-color:#ede9fe}.border-violet-200{border-color:#ddd6fe}.border-violet-500{border-color:#8b5cf6}
.bg-amber-50{background-color:#fffbeb}.bg-amber-100{background-color:#fef3c7}.bg-amber-200{background-color:#fde68a}
.bg-emerald-50{background-color:#ecfdf5}.bg-emerald-100{background-color:#d1fae5}.bg-emerald-200{background-color:#a7f3d0}
.bg-indigo-50{background-color:#eef2ff}.bg-indigo-100{background-color:#e0e7ff}.bg-indigo-200{background-color:#c7d2fe}
.bg-pink-50{background-color:#fdf2f8}.bg-pink-100{background-color:#fce7f3}.bg-pink-200{background-color:#fbcfe8}
.bg-red-50{background-color:#fef2f2}.bg-rose-50{background-color:#fff1f2}.bg-rose-100{background-color:#ffe4e6}.bg-rose-200{background-color:#fecdd3}
.bg-slate-900{background-color:#0f172a}.bg-violet-50{background-color:#f5f3ff}.bg-violet-100{background-color:#ede9fe}.bg-violet-200{background-color:#ddd6fe}
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--gradient-from),var(--gradient-to))}
.from-amber-100{--gradient-from:#fef3c7}.to-amber-50{--gradient-to:#fffbeb}.from-emerald-100{--gradient-from:#d1fae5}.to-emerald-50{--gradient-to:#ecfdf5}
.from-indigo-100{--gradient-from:#e0e7ff}.to-indigo-50{--gradient-to:#eef2ff}.from-pink-100{--gradient-from:#fce7f3}.to-pink-50{--gradient-to:#fdf2f8}
.from-rose-100{--gradient-from:#ffe4e6}.to-rose-50{--gradient-to:#fff1f2}.from-violet-100{--gradient-from:#ede9fe}.to-violet-50{--gradient-to:#f5f3ff}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}
.text-\[10px\]{font-size:10px}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}
.text-left{text-align:left}.text-center{text-align:center}.leading-relaxed{line-height:1.625}.uppercase{text-transform:uppercase}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.opacity-60{opacity:.6}
.text-amber-600{color:#d97706}.text-amber-700{color:#b45309}.text-amber-800{color:#92400e}.text-amber-900{color:#78350f}
.text-emerald-300{color:#6ee7b7}.text-emerald-600{color:#059669}.text-emerald-700{color:#047857}.text-emerald-800{color:#065f46}.text-emerald-900{color:#064e3b}
.text-indigo-600{color:#4f46e5}.text-indigo-700{color:#4338ca}.text-indigo-800{color:#3730a3}
.text-pink-600{color:#db2777}.text-pink-700{color:#be185d}.text-pink-800{color:#9d174d}.text-pink-900{color:#831843}
.text-red-600{color:#dc2626}.text-red-800{color:#991b1b}.text-rose-600{color:#e11d48}.text-rose-700{color:#be123c}.text-rose-800{color:#9f1239}
.text-slate-400{color:#94a3b8}.text-slate-500{color:#64748b}.text-slate-600{color:#475569}.text-slate-700{color:#334155}
.text-violet-500{color:#8b5cf6}.text-violet-600{color:#7c3aed}.text-violet-700{color:#6d28d9}.text-violet-800{color:#5b21b6}.text-violet-900{color:#4c1d95}.text-white{color:#fff}.text-white\/70{color:rgba(255,255,255,.7)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1)}.transition{transition:color .15s,background-color .15s,border-color .15s,opacity .15s,box-shadow .15s,transform .15s}.hover\:opacity-90:hover{opacity:.9}
@media(min-width:768px){.md\:block{display:block}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-base{font-size:1rem;line-height:1.5rem}}

  :root{ --ink:#1e1b4b; --accent:#7c3aed; --accent2:#db2777; }
  html{scroll-behavior:smooth}
  body{font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;background:#f6f4ff;color:#1e1b4b}
  .grad{background:linear-gradient(135deg,#4c1d95 0%,#7c3aed 45%,#db2777 100%)}
  .grad-text{background:linear-gradient(135deg,#7c3aed,#db2777);-webkit-background-clip:text;background-clip:text;color:transparent}
  .card{background:#fff;border-radius:1.25rem;box-shadow:0 4px 24px rgba(76,29,149,.08);border:1px solid #ede9fe}
  .tag{display:inline-block;padding:.2rem .7rem;border-radius:999px;font-size:.75rem;font-weight:600}
  .navlink{display:flex;align-items:center;gap:.6rem;padding:.65rem 1rem;border-radius:.75rem;font-size:.9rem;color:#4b4869;transition:.15s}
  .navlink:hover{background:#ede9fe;color:#4c1d95}
  .navlink.active{background:linear-gradient(135deg,#7c3aed,#db2777);color:#fff;font-weight:600}
  .phase{display:none}
  .phase.active{display:block;animation:fade .35s ease}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .quiz-opt{display:block;width:100%;text-align:left;padding:.8rem 1rem;border:2px solid #e5e0f8;border-radius:.8rem;margin-bottom:.6rem;transition:.15s;background:#fff}
  .quiz-opt:hover{border-color:#7c3aed;background:#f5f1ff}
  .quiz-opt.correct{border-color:#16a34a;background:#f0fdf4}
  .quiz-opt.wrong{border-color:#dc2626;background:#fef2f2}
  details summary{cursor:pointer;font-weight:600}
  .video-link{display:flex;gap:.9rem;align-items:flex-start;padding:.9rem 1rem;border:1px solid #ede9fe;border-radius:.9rem;background:#fbfaff;transition:.15s}
  .video-link:hover{border-color:#7c3aed;box-shadow:0 4px 14px rgba(124,58,237,.12)}
  ::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#c4b5fd;border-radius:8px}
  @media (max-width:900px){#sidebar{display:none}}


:root{--surface:#fff;--muted:#64748b;--line:#e2e8f0;--focus:#2563eb}
body{min-height:100vh;background:#f8fafc;color:#172033}
a{color:inherit}.skip-link{position:fixed;left:1rem;top:-4rem;z-index:1000;background:#111827;color:#fff;padding:.75rem 1rem;border-radius:.6rem}.skip-link:focus{top:1rem}
.site-header{background:linear-gradient(135deg,#312e81 0%,#6d28d9 52%,#be185d 100%);color:#fff}.brand{display:flex;align-items:center;gap:.75rem;font-weight:800}.brand-mark{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:.8rem;background:rgba(255,255,255,.16);font-size:.78rem;letter-spacing:.08em}
.site-shell{display:grid;grid-template-columns:17rem minmax(0,1fr);gap:2rem;max-width:78rem;margin:0 auto;padding:2rem 1.5rem 5rem}.site-sidebar{position:relative}.site-nav{position:sticky;top:1.5rem}.site-nav a{display:block;padding:.75rem .9rem;border-radius:.7rem;color:#475569;font-size:.9rem;line-height:1.35}.site-nav a:hover{background:#f1f5f9;color:#312e81}.site-nav a[aria-current=page]{background:#ede9fe;color:#5b21b6;font-weight:800}
.phase-toc{margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--line)}.phase-toc a{font-size:.82rem;padding:.45rem .7rem}.content-column{min-width:0}.breadcrumbs{display:flex;gap:.45rem;align-items:center;margin:0 0 1rem;color:#64748b;font-size:.82rem}.breadcrumbs a:hover{text-decoration:underline}.phase.active{display:block;animation:none}.phase>div.card{padding:clamp(1.25rem,3vw,2.5rem)}
.content-meta{margin-top:.75rem;color:#64748b;font-size:.78rem;line-height:1.5}.page-summary{margin-top:1.25rem;padding:1rem 1.1rem;border:1px solid #dbeafe;border-radius:.85rem;background:#f8fbff;color:#334155;font-size:.92rem;line-height:1.75}.page-summary strong{color:#312e81}.answer-section{margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.answer-section h2{font-size:1.2rem;font-weight:800;color:#1e293b}.answer-section>p{margin-top:.75rem;color:#475569;line-height:1.75}.answer-list{display:grid;gap:.8rem;margin-top:1.25rem}.answer-list>div{padding:1rem 1.1rem;border:1px solid #e2e8f0;border-radius:.85rem;background:#f8fafc}.answer-list dt{font-weight:800;color:#312e81}.answer-list dd{margin-top:.35rem;color:#475569;line-height:1.65}
.topic-card{scroll-margin-top:1rem}.topic-card>summary{display:flex;align-items:center;min-height:3.25rem;padding-right:2.25rem;position:relative;list-style:none;font-size:1rem;line-height:1.5}.topic-card>summary::-webkit-details-marker{display:none}.topic-card>summary::after{content:'+';position:absolute;right:.2rem;font-size:1.4rem;font-weight:400;color:#64748b}.topic-card[open]>summary::after{content:'−'}.topic-card>summary:focus-visible,.site-nav a:focus-visible,.phase-links a:focus-visible,.mobile-menu summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.deep-dive{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e2e8f0}.deep-dive h3{margin:1.5rem 0 .55rem;font-size:1rem;font-weight:800;color:#1e293b}.deep-dive p{margin:.55rem 0;color:#334155;line-height:1.82}.deep-dive ul,.deep-dive ol{margin:.6rem 0;padding-left:1.3rem;color:#334155}.deep-dive li{margin:.45rem 0;line-height:1.72}.deep-dive table{width:100%;margin:1rem 0;border-collapse:collapse;font-size:.86rem}.deep-dive th,.deep-dive td{padding:.7rem;border:1px solid #dbe4ef;text-align:left;vertical-align:top}.deep-dive th{background:#f1f5f9;color:#1e293b}.evidence-note,.practice-note,.caution-note{margin:1rem 0;padding:1rem 1.1rem;border-radius:.85rem;line-height:1.75}.evidence-note{background:#eff6ff;border-left:4px solid #2563eb}.practice-note{background:#ecfdf5;border-left:4px solid #059669}.caution-note{background:#fff7ed;border-left:4px solid #ea580c}.source-list{margin-top:1.2rem;padding:1rem 1.1rem;border-radius:.85rem;background:#f8fafc;border:1px solid #e2e8f0}.source-list strong{display:block;margin-bottom:.45rem}.source-list a{color:#1d4ed8;text-decoration:underline;text-underline-offset:2px}.evidence-badge{display:inline-flex;align-items:center;padding:.28rem .65rem;border-radius:999px;background:#eef2ff;color:#4338ca;font-size:.72rem;font-weight:800;letter-spacing:.02em}.concept-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:1rem 0}.concept-grid>div{padding:1rem;border:1px solid #dbeafe;border-radius:.85rem;background:#f8fbff}.note-box,.application-box,.warning-box{margin:1rem 0!important;padding:1rem 1.1rem;border-radius:.85rem;line-height:1.75}.note-box{background:#fff7ed;border-left:4px solid #ea580c}.application-box{background:#ecfdf5;border-left:4px solid #059669}.warning-box{background:#fef2f2;border-left:4px solid #dc2626}.numbered-steps{counter-reset:steps;list-style:none;padding-left:0!important}.numbered-steps li{position:relative;padding:.7rem .7rem .7rem 2.7rem;border-bottom:1px solid #e2e8f0}.numbered-steps li::before{counter-increment:steps;content:counter(steps);position:absolute;left:.35rem;top:.58rem;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:50%;background:#ede9fe;color:#5b21b6;font-weight:800}.roadmap-card{display:flex;color:inherit;transition:transform .15s ease,box-shadow .15s ease}.roadmap-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(76,29,149,.11)}.roadmap-card:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.phase-links{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}.phase-links a{display:block;padding:1rem 1.1rem;border:1px solid #ddd6fe;border-radius:1rem;background:#fff;box-shadow:0 4px 16px rgba(30,41,59,.06)}.phase-links a:last-child{text-align:right}.mobile-menu{display:none}.mobile-menu summary{cursor:pointer;min-height:2.75rem;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.35);border-radius:.75rem;padding:.4rem .8rem}.mobile-menu nav{display:grid;gap:.4rem;margin-top:.75rem;padding:.75rem;background:#fff;color:#334155;border-radius:.8rem;box-shadow:0 18px 40px rgba(15,23,42,.25)}.mobile-menu a{padding:.65rem;border-radius:.55rem}.mobile-menu a[aria-current=page]{background:#ede9fe;color:#5b21b6;font-weight:700}
.site-footer{border-top:1px solid #e2e8f0;background:#fff}.site-footer>div{max-width:78rem;margin:auto;padding:1.5rem;color:#64748b;font-size:.78rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.quiz-opt{cursor:pointer;min-height:3rem}.result[role=status]{min-height:1.75rem}
@media(max-width:900px){.site-shell{display:block;padding:1.25rem 1rem 5rem}.site-sidebar{display:none}.mobile-menu{display:block}.phase-links{grid-template-columns:1fr}.phase-links a:last-child{text-align:left}.deep-dive table{font-size:.78rem}.deep-dive th,.deep-dive td{padding:.55rem}.concept-grid{grid-template-columns:1fr}.card{border-radius:1rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phase.active{animation:none}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}
