:root{--bg:#f7f7f4;--surface:#fff;--surface-2:#f0efe9;--text:#1b1d22;--muted:#5d6270;--line:#e2e1da;--accent:#2c4fd6;--accent-soft:#e8edfc;--ok:#1f8a4c;--warn:#b36b00;--radius:10px;--font:"Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;--mono:ui-monospace, "SFMono-Regular", Menlo, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#14161b;--surface:#1c1f26;--surface-2:#232731;--text:#e8e9ec;--muted:#9aa0ad;--line:#2e323d;--accent:#7b96ff;--accent-soft:#232c4d;--ok:#4cc37f;--warn:#e0a040;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;line-height:1.65}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:960px;margin:0 auto;padding:0 16px}main.container{padding-top:28px;padding-bottom:64px}.nav{background:var(--surface);border-bottom:1px solid var(--line);z-index:10;position:sticky;top:0}.nav-inner{align-items:center;gap:20px;height:56px;display:flex}.brand{letter-spacing:-.02em;color:var(--text);font-size:18px;font-weight:800}.brand span{color:var(--accent)}.nav-links{white-space:nowrap;flex:1;gap:16px;display:flex}.nav-links a{color:var(--muted);font-size:15px}.nav-links a:hover{color:var(--text);text-decoration:none}.nav-user{color:var(--muted);white-space:nowrap;align-items:center;gap:12px;font-size:14px;display:flex}h1{letter-spacing:-.02em;margin:0 0 8px;font-size:28px;line-height:1.3}h2{letter-spacing:-.01em;margin:32px 0 12px;font-size:20px}.lead{color:var(--muted);margin:0 0 24px}.muted{color:var(--muted)}.small{font-size:13px}.grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;display:grid}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);color:inherit;padding:18px;display:block}a.card:hover{border-color:var(--accent);text-decoration:none}.card h3{margin:0 0 6px;font-size:17px}.card p{color:var(--muted);margin:0;font-size:14px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--surface-2);color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 9px;font-size:12px;display:inline-block}.chip.accent{background:var(--accent-soft);color:var(--accent);border-color:#0000}a.chip:hover{border-color:var(--accent);text-decoration:none}.chip.active{background:var(--accent);color:#fff;border-color:var(--accent)}.topic-list{flex-direction:column;gap:10px;display:flex}.topic-row{flex-direction:column;gap:4px;display:flex}.topic-row .title{color:var(--text);font-weight:700}.topic-row .en{color:var(--muted);margin-left:6px;font-size:14px;font-weight:400}.definition{background:var(--accent-soft);border-left:4px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;margin:16px 0;padding:14px 16px}.keywords{flex-wrap:wrap;gap:8px;margin:8px 0 0;display:flex}.keyword{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:4px 10px;font-size:14px}.prose{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 22px 20px}.prose h3{margin:22px 0 8px;font-size:17px}.prose ul,.prose ol{padding-left:20px}.prose li{margin:3px 0}.prose table{border-collapse:collapse;width:100%;margin:10px 0;font-size:14px;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--line);text-align:left;vertical-align:top;padding:7px 10px}.prose th{background:var(--surface-2)}.prose code{font-family:var(--mono);background:var(--surface-2);border-radius:4px;padding:1px 5px;font-size:.9em}.diagram{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);text-align:center;padding:16px;overflow-x:auto}.form{flex-direction:column;gap:12px;max-width:380px;display:flex}.form label{color:var(--muted);flex-direction:column;gap:4px;font-size:14px;display:flex}input,select,textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 12px}input:focus,textarea:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}.btn{font:inherit;cursor:pointer;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:8px;padding:10px 16px;font-weight:600}.btn:disabled{opacity:.6;cursor:default}.btn.ghost{color:var(--accent);background:0 0}.error{color:#d23b3b;white-space:pre-line;font-size:14px}.search{gap:8px;margin:0 0 16px;display:flex}.search input{flex:1}.hero{padding:24px 0 8px}.hero h1{font-size:32px}.features{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:8px;display:grid}.feature{border-radius:var(--radius);background:var(--surface-2);padding:14px 16px;font-size:14px}.feature b{margin-bottom:2px;font-size:15px;display:block}.soon{color:var(--warn);margin-left:4px;font-size:11px}@media (max-width:600px){h1{font-size:24px}.nav-inner{gap:14px}.nav-nick{display:none}.diagram svg{min-width:620px}.hero h1{font-size:26px}.nav-links{gap:12px}.prose{padding:4px 14px 16px}}.review{max-width:720px;margin:0 auto}.review-top{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.review-card{padding:22px}.review-write{flex-direction:column;gap:6px;margin:18px 0 14px;display:flex}.review-write textarea{resize:vertical;min-height:96px}.keyword.hit{border-color:var(--ok);color:var(--ok);font-weight:600}.keyword.miss{opacity:.75;border-style:dashed}.grades{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px;display:grid}.grade{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--surface-2);color:var(--text);border-radius:8px;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;display:flex}.grade span{color:var(--muted);font-size:12px}.grade:hover:not(:disabled){border-color:var(--accent)}.grade:disabled{opacity:.6;cursor:default}.grade-again b{color:#d23b3b}.grade-good b{color:var(--ok)}.grade-easy b{color:var(--accent)}.kbd{font-family:var(--mono);opacity:.7;border:1px solid;border-radius:4px;margin-left:4px;padding:0 5px;font-size:11px}button.chip{font:inherit;font-size:12px}@media (max-width:600px){.grades{grid-template-columns:repeat(2,1fr)}.kbd{display:none}}