:root{--bg:#f7f8fc;--card:#fff;--ink:#141627;--muted:#5b6078;--line:#e4e7f2;--brand:#1a1a2e;--accent:#ff6b35;--accent2:#3b5bdb;--chip:#eef1fb}
@media (prefers-color-scheme:dark){:root{--bg:#0f1020;--card:#171a2e;--ink:#eef0fa;--muted:#a3a8c3;--line:#2a2e4a;--brand:#0b0c18;--chip:#22263f}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif}
a{color:var(--accent2);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:960px;margin:0 auto;padding:0 16px}
.top{background:var(--brand);color:#fff;position:sticky;top:0;z-index:5}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px}
.brand{color:#fff;font-weight:800;letter-spacing:.5px;white-space:nowrap}.brand b{color:var(--accent)}
.menu{display:flex;align-items:center;gap:14px;font-size:14px}.menu a{color:#fff;white-space:nowrap}
@media (max-width:520px){.menu a:not(.btn){display:none}}
.btn{display:inline-block;background:var(--accent);color:#fff!important;font-weight:700;padding:12px 20px;border-radius:12px;text-decoration:none!important}
.btn:hover{filter:brightness(1.05)}.btn-sm{padding:7px 12px;border-radius:10px;font-size:13px}
.crumbs{font-size:13px;color:var(--muted);margin:16px 0 8px;display:flex;flex-wrap:wrap;gap:6px}.crumbs .sep{opacity:.5}
h1{font-size:clamp(26px,5vw,38px);line-height:1.25;margin:8px 0 12px}h2{font-size:21px;margin:28px 0 12px}
.lead{font-size:17px;color:var(--muted);max-width:720px}.muted{color:var(--muted)}
.hero{padding:18px 0 8px}.hero .btn{margin-top:8px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:18px 0}
.card{display:block;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;color:var(--ink)}
.card:hover{border-color:var(--accent2);text-decoration:none}.card h2{margin:0 0 6px;font-size:19px}.card p{margin:4px 0}
.chips{display:flex;flex-wrap:wrap;gap:10px}.chip{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 14px;color:var(--ink);font-weight:700}
.chip small{font-weight:400;color:var(--muted);margin-left:4px}
.links{padding-left:20px}.links li{margin:6px 0}
.ko{font-family:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif}
.wordlist{list-style:none;padding:0;margin:16px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;counter-reset:w}
.wordlist li a{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"ko rom" "mean mean";gap:2px 10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;color:var(--ink)}
.wordlist li a:hover{border-color:var(--accent2);text-decoration:none}
.wordlist .ko{grid-area:ko;font-size:19px;font-weight:700}.wordlist .rom{grid-area:rom;color:var(--muted);align-self:center;font-size:14px}.wordlist .mean{grid-area:mean;color:var(--muted);font-size:14px}
.pager{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}.pager a,.pager span{min-width:38px;text-align:center;padding:7px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card)}
.pager span{background:var(--accent2);color:#fff;border-color:var(--accent2)}
.word{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;margin:10px 0 20px}
.wordhead h1{font-size:clamp(40px,9vw,64px);margin:0}
.romline{margin:4px 0;color:var(--muted);display:flex;align-items:center;gap:12px;flex-wrap:wrap}.romline .rom{font-size:18px}
.headmeaning{font-size:22px;font-weight:700;margin:6px 0 10px}
.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{background:var(--chip);border-radius:999px;padding:4px 12px;font-size:13px;color:var(--ink)}
.sense{border-top:1px solid var(--line);padding-top:14px;margin-top:14px;position:relative}
.sense .num{position:absolute;right:0;top:14px;background:var(--chip);border-radius:999px;width:26px;height:26px;display:grid;place-items:center;font-size:13px;font-weight:700}
.meaning{font-size:18px;margin:0 0 8px}.lbl{display:inline-block;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-right:6px}
.facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:6px 0}.facts div{display:flex;gap:6px}.facts dt{color:var(--muted)}.facts dd{margin:0;font-weight:600}
.example{margin:10px 0 0;background:var(--chip);border-radius:14px;padding:12px 14px}.example figcaption{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.example p{margin:4px 0}.example .ko{font-size:17px;font-weight:600}
.say{border:0;background:transparent;cursor:pointer;font-size:16px;padding:2px 4px}.say.big{background:var(--chip);color:var(--ink);border-radius:999px;padding:6px 12px;font-size:14px}
.cta{background:linear-gradient(135deg,#1a1a2e,#3b3f8f);color:#fff;border-radius:20px;padding:22px;margin:24px 0}
.cta h2{margin:0 0 6px;color:#fff}.cta p{color:#dfe2ff;margin:0 0 14px}
.related{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.related a{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--ink)}.related .ko{font-weight:700}.related .mean{color:var(--muted);font-size:14px}
.otherlangs{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}.otherlangs a{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--ink)}
.landing section{margin-top:22px}.landing p{max-width:760px}
.faq{border:1px solid var(--line);border-radius:14px;background:var(--card)}.faq details{padding:14px 16px;border-top:1px solid var(--line)}.faq details:first-child{border-top:0}.faq summary{font-weight:700;cursor:pointer}.faq p{margin:8px 0 0;color:var(--muted)}
.guide h2{margin-top:30px}.guide p,.guide li{max-width:780px}.meta{color:var(--muted);font-size:14px;margin:0 0 8px}
.note{background:var(--chip);border-left:4px solid var(--accent);border-radius:10px;padding:12px 14px}
.glist{padding-left:22px}.glist li{margin:6px 0}
.tbl{overflow-x:auto;margin:12px 0}.tbl table{border-collapse:collapse;min-width:100%;background:var(--card);border:1px solid var(--line);border-radius:12px}
.tbl th,.tbl td{border:1px solid var(--line);padding:9px 12px;text-align:left;vertical-align:top;font-size:15px}.tbl th{background:var(--chip)}
.letters{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:12px 0}
.letter{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 8px;cursor:pointer;color:var(--ink);font:inherit}
.letter:hover{border-color:var(--accent2)}.letter .big{font-size:34px;font-weight:800;line-height:1.2}.letter .nm{font-size:13px;color:var(--muted)}.letter .rm{font-weight:700}.letter .ht{font-size:13px;color:var(--muted);text-align:center}.letter .spk{font-size:13px}
.sources a{word-break:break-word}
.prevnext{display:flex;justify-content:space-between;gap:10px;margin:20px 0;flex-wrap:wrap}
.foot{border-top:1px solid var(--line);margin-top:40px;padding:22px 0 30px;font-size:14px;color:var(--muted)}
.langs{display:flex;flex-wrap:wrap;gap:8px 12px;margin-bottom:10px}.langs span[aria-current]{font-weight:700;color:var(--ink)}.langs .lbl{text-transform:none;letter-spacing:0;font-size:14px}
