:root{--bg: #fbfaf7;--bg-rgb: 251, 250, 247;--surface: #ffffff;--card: #ffffff;--ink: #1b2430;--ink-rgb: 27, 36, 48;--muted: #5c6675;--rule: #e6e3dc;--ac: #c2410c;--ac-rgb: 194, 65, 12;--ac-soft: #f4845f;--ac-soft-rgb: 244, 132, 95;--mint: #0f766e;--mint-rgb: 15, 118, 110;--mint-soft: #2a9d8f;--mint-soft-rgb: 42, 157, 143;--danger: #b91c1c;--danger-rgb: 185, 28, 28;--on-ink: #f4f1ea;--on-ink-muted: #a9b1bd;--viz-1: #2563eb;--viz-1-rgb: 37, 99, 235;--viz-1-soft: #7ea6ff;--viz-2: #b45309;--viz-3: #7c3aed;--shadow-1: 0 1px 2px rgba(var(--ink-rgb), .04), 0 1px 1px rgba(var(--ink-rgb), .03);--shadow-2: 0 2px 4px rgba(var(--ink-rgb), .04), 0 8px 24px rgba(var(--ink-rgb), .07);--shadow-3: 0 4px 8px rgba(var(--ink-rgb), .05), 0 24px 48px rgba(var(--ink-rgb), .12);--ease-settle: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--t-micro: .16s;--t-base: .32s;--t-slow: .7s;--sp-1: .25rem;--sp-2: .5rem;--sp-3: .75rem;--sp-4: 1rem;--sp-5: 1.25rem;--sp-6: 1.5rem;--sp-7: 2rem;--sp-8: 3rem;--sp-9: 4.5rem;--sp-10: 6rem;--r-xs: 6px;--r-sm: 8px;--r-md: 10px;--r-lg: 14px;--r-xl: 20px;--r-2xl: 28px;--r-pill: 999px;--fs-1: .7rem;--fs-2: .75rem;--fs-3: .8rem;--fs-4: .85rem;--fs-5: .9rem;--fs-6: .95rem;--fs-7: 1.05rem;--fs-8: clamp(1.9rem, 1.4rem + 2vw, 2.6rem);--fs-9: clamp(2.4rem, 1.5rem + 3.6vw, 4.2rem);--fs-10: clamp(2.8rem, 1.4rem + 5.6vw, 5.6rem);--w-main: 1120px;--w-read: 720px;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard Variable,Pretendard,Noto Sans KR,system-ui,sans-serif;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}::selection{background:rgba(var(--ac-soft-rgb),.3)}h1,h2,h3,h4{word-break:keep-all;line-height:1.25;letter-spacing:-.02em}h1{font-size:var(--fs-8);font-weight:800;margin:0 0 var(--sp-4);letter-spacing:-.03em}h2{font-size:1.45rem;font-weight:750;margin:var(--sp-8) 0 var(--sp-4)}h3{font-size:1.1rem;font-weight:700;margin:var(--sp-6) 0 var(--sp-2)}p{margin:0 0 var(--sp-4);word-break:keep-all}code,pre,kbd,samp,.num{font-family:DM Mono,Noto Sans KR,monospace}.num{font-variant-numeric:tabular-nums}a{color:var(--ac);text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}:focus-visible{outline:2px solid var(--ac);outline-offset:2px;border-radius:4px}main{max-width:var(--w-main);margin:0 auto;padding:var(--sp-8) var(--sp-5) var(--sp-9)}@media(max-width:480px){main{padding:var(--sp-6) var(--sp-4) var(--sp-8)}}.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--on-ink);padding:var(--sp-2) var(--sp-4)}.skip-link:focus{left:var(--sp-4);z-index:100}.page-head{position:relative;margin-bottom:var(--sp-8);max-width:820px}.page-head h1{font-size:var(--fs-9);line-height:1.08;margin-bottom:var(--sp-4)}.page-head h1 em{font-style:normal;color:var(--ac)}.page-head .lede{font-size:1.15rem}.prose{max-width:var(--w-read);font-size:1.04rem}.prose h2{font-size:1.5rem;margin-top:var(--sp-9);padding-top:var(--sp-2);position:relative}.prose{counter-reset:sec}.prose h2{counter-increment:sec}.prose h2:before{content:counter(sec,decimal-leading-zero);display:block;font-family:DM Mono,Noto Sans KR,monospace;font-size:var(--fs-2);font-weight:500;letter-spacing:.08em;color:var(--ac);margin-bottom:var(--sp-3)}.prose>h2:first-child{margin-top:var(--sp-5)}.prose strong:not(.callout-label){font-weight:700;background:linear-gradient(transparent 62%,rgba(var(--ac-soft-rgb),.22) 62%)}.prose table{width:100%;border-collapse:separate;border-spacing:0;margin:var(--sp-5) 0 var(--sp-6);font-size:var(--fs-6);background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-1)}.prose th,.prose td{border-bottom:1px solid var(--rule);padding:var(--sp-3) var(--sp-4);text-align:left;vertical-align:top}.prose tr:last-child td{border-bottom:0}.prose th{background:rgba(var(--mint-rgb),.07);font-weight:700;color:var(--ink);font-size:var(--fs-5)}.prose tbody tr{transition:background var(--t-micro) var(--ease-settle)}.prose tbody tr:hover{background:rgba(var(--ac-soft-rgb),.05)}.prose td strong{background:none}.prose blockquote{margin:var(--sp-6) 0;padding:var(--sp-4) var(--sp-6);border-left:4px solid var(--ac);background:rgba(var(--ac-rgb),.05);border-radius:0 var(--r-lg) var(--r-lg) 0;font-size:1.08rem}.prose blockquote p:last-child{margin-bottom:0}.prose ul,.prose ol{padding-left:1.4rem}.prose li{margin-bottom:var(--sp-2)}.prose li::marker{color:var(--ac)}.prose pre{background:var(--ink);color:var(--on-ink);border-radius:var(--r-lg);padding:var(--sp-5);overflow-x:auto;font-size:var(--fs-6);line-height:1.8;box-shadow:var(--shadow-2)}@media(max-width:768px){.prose table{display:block;overflow-x:auto}}.card{position:relative;display:block;background:var(--card);border:1px solid var(--rule);border-radius:var(--r-xl);padding:var(--sp-6);color:inherit;box-shadow:var(--shadow-1);overflow:hidden;isolation:isolate;transition:border-color var(--t-base) var(--ease-settle),transform var(--t-base) var(--ease-settle),box-shadow var(--t-base) var(--ease-settle)}.card:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%),rgba(var(--ac-soft-rgb),.12),transparent 45%);opacity:0;transition:opacity var(--t-base) var(--ease-settle)}a.card:hover{text-decoration:none;border-color:rgba(var(--ac-rgb),.35);transform:translateY(-3px);box-shadow:var(--shadow-3)}a.card:hover:before{opacity:1}.card h3{margin:0 0 var(--sp-2);font-size:1.15rem}.card p{margin:0;color:var(--muted);font-size:var(--fs-5)}.card .go{display:inline-flex;align-items:center;gap:var(--sp-1);margin-top:var(--sp-4);font-size:var(--fs-4);font-weight:600;color:var(--ac)}.card .go:after{content:"→";transition:transform var(--t-base) var(--ease-settle)}a.card:hover .go:after{transform:translate(4px)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-5)}.chip{display:inline-flex;align-items:center;gap:var(--sp-1);padding:.15rem var(--sp-3);border-radius:var(--r-pill);font-size:var(--fs-2);font-family:DM Mono,Noto Sans KR,monospace;letter-spacing:.04em;background:rgba(var(--mint-rgb),.1);color:var(--mint);white-space:nowrap}a.chip{transition:background var(--t-micro) var(--ease-settle),transform var(--t-micro) var(--ease-settle)}a.chip:hover{text-decoration:none;background:rgba(var(--mint-rgb),.18);transform:translateY(-1px)}.chip-ac{background:rgba(var(--ac-rgb),.1);color:var(--ac)}.btn{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-6);border-radius:var(--r-pill);background:var(--ac);color:var(--surface);font-weight:700;border:1px solid transparent;cursor:pointer;font-size:var(--fs-6);box-shadow:0 6px 20px rgba(var(--ac-rgb),.28);transition:transform var(--t-micro) var(--ease-settle),box-shadow var(--t-base) var(--ease-settle),background var(--t-micro) var(--ease-settle)}.btn:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 10px 28px rgba(var(--ac-rgb),.36)}.btn:active{transform:translateY(0)}.btn .arr{transition:transform var(--t-base) var(--ease-settle)}.btn:hover .arr{transform:translate(3px)}.btn-ghost{background:transparent;color:var(--ink);border-color:var(--rule);box-shadow:none}.btn-ghost:hover{background:var(--surface);border-color:var(--ink);box-shadow:var(--shadow-2)}.eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:DM Mono,Noto Sans KR,monospace;font-size:var(--fs-2);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--sp-3)}.eyebrow a{color:var(--muted)}.eyebrow a:hover{color:var(--ac)}.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 4px rgba(var(--ac-rgb),.15)}.lede{color:var(--muted);font-size:var(--fs-7);max-width:var(--w-read);line-height:1.75}.muted{color:var(--muted)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;margin:var(--sp-10) 0 var(--sp-6)}.section-head h2{margin:0;font-size:var(--fs-8);letter-spacing:-.03em}.section-head p{margin:var(--sp-2) 0 0;color:var(--muted)}.section-head .more{font-weight:600;font-size:var(--fs-5)}.js [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity var(--t-slow) var(--ease-settle),transform var(--t-slow) var(--ease-settle);transition-delay:calc(var(--i, 0) * 70ms)}.js [data-reveal].in{opacity:1;transform:none}.site-nav{position:sticky;top:0;z-index:50;background:rgba(var(--bg-rgb),.78);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color var(--t-base) var(--ease-settle),box-shadow var(--t-base) var(--ease-settle)}.site-nav.scrolled{border-bottom-color:var(--rule);box-shadow:0 6px 24px rgba(var(--ink-rgb),.05)}.site-nav .bar{max-width:var(--w-main);margin:0 auto;padding:var(--sp-3) var(--sp-5);display:flex;align-items:center;gap:var(--sp-5);flex-wrap:wrap}.site-nav .brand{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:800;letter-spacing:-.02em;color:var(--ink);font-size:1.12rem}.site-nav .brand:hover{text-decoration:none}.site-nav .brand svg{width:28px;height:28px;transition:transform var(--t-base) var(--ease-spring)}.site-nav .brand:hover svg{transform:rotate(-12deg) scale(1.08)}.site-nav .brand span{color:var(--ac)}.site-nav ul{list-style:none;margin:0 0 0 auto;padding:var(--sp-1);display:flex;gap:var(--sp-1);background:rgba(var(--ink-rgb),.04);border-radius:var(--r-pill)}.site-nav li a{display:block;color:var(--ink);font-size:var(--fs-5);font-weight:600;padding:var(--sp-1) var(--sp-4);white-space:nowrap;border-radius:var(--r-pill);transition:background var(--t-micro) var(--ease-settle),color var(--t-micro) var(--ease-settle)}.site-nav li a:hover{text-decoration:none;background:rgba(var(--ink-rgb),.06)}.site-nav li a[aria-current=page]{background:var(--surface);color:var(--ac);box-shadow:var(--shadow-1)}.read-progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:linear-gradient(90deg,var(--ac),var(--ac-soft),var(--mint-soft));transform-origin:0 50%;transform:scaleX(var(--p, 0))}@media(max-width:480px){.site-nav .bar{gap:var(--sp-3);padding:var(--sp-3) var(--sp-4)}.site-nav ul{margin-left:0;width:100%;justify-content:space-between}.site-nav li a{font-size:var(--fs-4);padding:var(--sp-1) var(--sp-3)}}@media(max-width:360px){.site-nav li a{padding:var(--sp-1) var(--sp-2)}}.site-footer{background:var(--ink);color:var(--on-ink-muted);margin-top:var(--sp-10);padding:var(--sp-9) var(--sp-5) var(--sp-7);font-size:var(--fs-3);position:relative;overflow:hidden}.site-footer .inner{max-width:calc(var(--w-main) - 2 * var(--sp-5));margin:0 auto;position:relative}.site-footer .big{font-size:var(--fs-9);font-weight:800;letter-spacing:-.04em;line-height:1.05;color:var(--on-ink);margin:0 0 var(--sp-7)}.site-footer .big span{color:var(--ac-soft)}.site-footer .links{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-5);margin-bottom:var(--sp-7);font-size:var(--fs-6)}.site-footer .links a{color:var(--on-ink);font-weight:600}.site-footer .legal{border-top:1px solid rgba(var(--bg-rgb),.12);padding-top:var(--sp-5)}.site-footer p{margin:0 0 var(--sp-1)}.site-footer a{color:var(--on-ink-muted)}.site-footer strong{color:var(--on-ink)}.q-card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-xl);padding:var(--sp-6);margin:var(--sp-5) 0;box-shadow:var(--shadow-1);transition:border-color var(--t-base) var(--ease-settle),box-shadow var(--t-base) var(--ease-settle)}.q-card[data-done="1"]{border-color:rgba(var(--mint-rgb),.4)}.q-card .q{font-weight:700;font-size:1.08rem;margin-bottom:var(--sp-4);display:flex;gap:var(--sp-3);align-items:baseline}.q-card .qn{flex:none;font-family:DM Mono,monospace;font-size:var(--fs-3);font-weight:400;color:var(--ac);background:rgba(var(--ac-rgb),.08);padding:.05rem var(--sp-2);border-radius:var(--r-xs)}.q-card .choices{display:grid;gap:var(--sp-2)}.q-card .choice{text-align:left;background:var(--bg);border:1.5px solid var(--rule);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);font:inherit;color:inherit;cursor:pointer;display:flex;gap:var(--sp-3);align-items:baseline;transition:border-color var(--t-micro) var(--ease-settle),background var(--t-micro) var(--ease-settle),transform var(--t-micro) var(--ease-settle)}.q-card .choice:hover:not(:disabled){border-color:var(--ac);background:var(--surface);transform:translate(3px)}.q-card .choice:disabled{cursor:default}.q-card .choice:disabled:not(.correct):not(.picked){opacity:.55}.q-card .choice.correct{border-color:var(--mint);background:rgba(var(--mint-rgb),.08);animation:pop var(--t-base) var(--ease-spring)}.q-card .choice.picked:not(.correct){border-color:rgba(var(--ac-rgb),.5)}.q-card .mark{flex:none;display:inline-grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;font-family:DM Mono,monospace;font-size:var(--fs-3);color:var(--muted);background:rgba(var(--ink-rgb),.06)}.q-card .choice.correct .mark{background:var(--mint);color:var(--surface)}.q-card .sol{margin:var(--sp-4) 0 0;padding:var(--sp-4) var(--sp-5);border-radius:var(--r-lg);background:rgba(var(--mint-rgb),.07);border-left:3px solid var(--mint);font-size:var(--fs-6);animation:rise var(--t-base) var(--ease-settle)}.q-card .sol[hidden]{display:none}.q-card .sol:focus{outline:none}@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.025)}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.done-mark{color:var(--mint);font-family:DM Mono,monospace}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.js [data-reveal]{opacity:1;transform:none}}
