:root{
  --bg:#F6F3EA; --card:#FFFFFF; --ink:#28251E; --sub:#645D50; --line:#E2DCC9;
  --accent:#2F5D8A; --accent-soft:#2F5D8A22;
  --wood:#2D806E; --fire:#77251D; --earth:#99761F; --metal:#52677B; --water:#272F6D;
  --wood-soft:#DDEFE8; --fire-soft:#F7DCD6; --earth-soft:#F4E8C8; --metal-soft:#DEE6ED; --water-soft:#DDE0F1;
  --radius-card:20px;
  --shadow-card:0 1px 2px #1A160E0A,0 6px 18px #1A160E0F;
  --shadow-lift:0 2px 4px #1A160E12,0 14px 34px #1A160E1A;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#16181D; --card:#1D2026; --ink:#E5E1D6; --sub:#A39E92; --line:#2B2F37;
    --accent:#9CC0E4; --accent-soft:#9CC0E422;
    --wood:#5EB59E; --fire:#D55549; --earth:#DFBD5C; --metal:#BCD0DC; --water:#6F7DCA;
    --wood-soft:#1E3630; --fire-soft:#3B2624; --earth-soft:#38311F; --metal-soft:#2A343E; --water-soft:#262A48;
    --shadow-card:0 1px 2px #00000040,0 8px 22px #00000059;
    --shadow-lift:0 2px 4px #00000059,0 16px 38px #00000080;
  }
}
:root[data-theme="dark"]{
  --bg:#16181D; --card:#1D2026; --ink:#E5E1D6; --sub:#A39E92; --line:#2B2F37;
  --accent:#9CC0E4; --accent-soft:#9CC0E422;
  --wood:#5EB59E; --fire:#D55549; --earth:#DFBD5C; --metal:#BCD0DC; --water:#6F7DCA;
  --wood-soft:#1E3630; --fire-soft:#3B2624; --earth-soft:#38311F; --metal-soft:#2A343E; --water-soft:#262A48;
  --shadow-card:0 1px 2px #00000040,0 8px 22px #00000059;
  --shadow-lift:0 2px 4px #00000059,0 16px 38px #00000080;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard","Noto Sans KR",system-ui,sans-serif;line-height:1.7;font-size:1rem}
a{color:var(--accent)}
.top{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.top .brand{font-weight:800;text-decoration:none;color:var(--ink);font-size:1.05rem}
.top nav a{margin-left:14px;text-decoration:none;font-size:.9rem;font-weight:700}
main{max-width:680px;margin:0 auto;padding:16px 16px 40px}
h1{font-size:1.5rem;line-height:1.3;margin:6px 0 10px}
h2{font-size:1.05rem;margin:22px 0 8px}
.crumb{font-size:.8rem;color:var(--sub);margin:0}
.hanja{font-weight:400;color:var(--sub);margin-left:8px;font-size:.85em}
.kind{display:inline-block;margin-left:10px;padding:1px 9px;border:1px solid var(--line);border-radius:99px;font-size:.68rem;font-weight:700;color:var(--sub);vertical-align:middle}
.lead{font-size:1.02rem;font-weight:600;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-card);padding:14px 16px;margin:0 0 14px}
.animal{color:var(--sub);font-size:.9rem;margin:0 0 10px}
.body p,.topic p,.extra p{margin:0 0 12px}
a.term{text-decoration:none;border-bottom:1px dashed var(--accent)}
.cond table{width:100%;border-collapse:collapse;font-size:.88rem;margin-top:8px}
.cond th,.cond td{text-align:left;vertical-align:top;padding:7px 8px;border-top:1px solid var(--line)}
.cond th{white-space:nowrap;color:var(--sub);font-weight:600;width:8.5em}
.note{font-size:.82rem;color:var(--sub)}
.toc ol{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:14px 0;list-style:none}
.toc a{display:inline-block;min-height:44px;line-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:99px;background:var(--card);text-decoration:none;font-size:.88rem;font-weight:700}
.cta{display:flex;align-items:center;justify-content:center;min-height:48px;margin:26px 0 8px;border-radius:14px;background:var(--accent);color:var(--bg);text-decoration:none;font-weight:800}
.ad-slot[hidden]{display:none}
.grid,.list{display:grid;gap:8px;padding:0;margin:10px 0 18px;list-style:none}
.grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
.list{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.grid a,.list a{display:flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);text-decoration:none;color:var(--ink);font-weight:700;font-size:.92rem}
.grid .hanja,.list .hanja{margin-left:6px;font-size:.8em}
.foot{padding:20px 16px 36px;border-top:1px solid var(--line);color:var(--sub);font-size:.78rem}
.foot p{margin:0 0 6px;max-width:680px;margin-left:auto;margin-right:auto}
