/* 詞彙頁：純靜態、給搜尋引擎與第一次來的人看。
   刻意跟主應用程式分開——主站是一支應用程式（要載 25MB 的辨識元件），
   這些頁必須很輕才有機會被收錄與快速開啟。 */
:root { color-scheme: light dark;
  --bg:#F0EFEC; --card:#FFF; --text:#1B1A17; --muted:#62605A; --line:rgba(20,20,26,.1); --ink:#1E1D1A; }
@media (prefers-color-scheme:dark){ :root{ --bg:#2D2D2B; --card:#363634; --text:#F2F1EF; --muted:#A8A5A0; --line:rgba(255,255,255,.08); --ink:#F2F1EF; } }
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text);
  font:16px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Noto Sans TC",sans-serif}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:12px;top:12px;background:var(--card);padding:8px 14px;border-radius:8px;z-index:9}
.site-header,.site-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;
  max-width:880px;margin:0 auto;padding:16px 20px}
.site-footer{justify-content:center;gap:8px;color:var(--muted);font-size:.875rem;padding-bottom:40px}
.brand{font-weight:700;color:inherit;text-decoration:none}
.header-return{color:var(--muted);text-decoration:none;font-size:.9375rem}
.header-return:hover{color:var(--text)}
main{max-width:880px;margin:0 auto;padding:0 20px 24px}
.crumb{font-size:.8125rem;color:var(--muted);margin:4px 0 14px}
.crumb a{color:inherit}
h1{font-size:1.625rem;line-height:1.4;margin:0 0 10px}
h2{font-size:1.125rem;margin:32px 0 12px}
.lead{font-size:1.0625rem;margin:0 0 18px}
.demo{width:100%;max-width:560px;aspect-ratio:4/3;background:#101215;border-radius:16px;display:block;border:1px solid var(--line)}
.note,.src,.fine{color:var(--muted);font-size:.875rem}
.fine{margin-top:28px}
.cta{display:inline-block;background:var(--ink);color:var(--bg);text-decoration:none;
  font-weight:600;padding:13px 24px;border-radius:999px;margin:6px 0 4px}
.words{display:flex;flex-wrap:wrap;gap:8px}
.words a{display:inline-block;background:var(--card);border:1px solid var(--line);
  color:inherit;text-decoration:none;padding:8px 15px;border-radius:999px;font-size:.9375rem}
.words a:hover{border-color:var(--text)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  text-decoration:none;color:inherit;display:block}
.card img{width:100%;height:auto;display:block;background:#101215}
.card span{display:block;padding:10px 12px;font-weight:600}
.card:hover{border-color:var(--text)}
