/* ============================================================
   base.css — design tokens, reset, typography, theme
   Palette: "Washi · Ai · Shu" — a warm Japanese-paper base with
   indigo (藍, calm focus) for structure and vermillion (朱, energy)
   as the action accent; matcha green for progress. Tuned for long,
   comfortable study sessions per color-usability research:
     · warm off-white base (inviting, low glare) — never pure white
     · dark theme on warm charcoal — never pure black, soft off-white
       text, and desaturated accents so colors don't glare on dark
     · reading text kept at AA contrast; warm accent draws the eye
       to actions, calm indigo to reference labels.
   ============================================================ */
:root{
  --paper:#f6f3ec; --paper-2:#ece6d9; --card:#fffdf8;
  --ink:#2a2a31; --ink-soft:#6a6457; --ink-faint:#9a917f;
  --accent:#bf463b; --accent-deep:#9c352c; --accent-soft:#f7e7e2;
  --indigo:#33518e; --line:#e4ddcd; --line-soft:#efe9dc;
  --green:#4f8a55; --green-soft:#dde9d8; --gold:#b27e2c;
  --shadow:rgba(74,60,40,.08); --shadow-2:rgba(74,60,40,.15);
  --font-ui:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-display:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-jp:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  --radius:14px; --topbar-h:66px;
}
html[data-theme="dark"]{
  --paper:#161821; --paper-2:#1e212c; --card:#20242f;
  --ink:#e6e8ee; --ink-soft:#a3aabb; --ink-faint:#6f7686;
  --accent:#e0695a; --accent-deep:#f0897c; --accent-soft:#2f2420;
  --indigo:#84a4e2; --line:#2b303c; --line-soft:#242a34;
  --green:#5cb377; --green-soft:#1c3025; --gold:#d7a948;
  --shadow:rgba(0,0,0,.45); --shadow-2:rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  background:var(--paper); color:var(--ink); font-family:var(--font-ui);
  line-height:1.55; -webkit-font-smoothing:antialiased; min-height:100vh;
  overflow-x:hidden;
  transition:background .35s ease,color .35s ease;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
ruby rt{font-family:var(--font-jp);font-size:.54em;color:var(--ink-faint);font-weight:400;letter-spacing:.02em}
body.no-furigana rt{visibility:hidden}
body.no-furigana .reading{visibility:hidden}

/* shared focus ring for keyboard users */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* lightweight scrollbars */
*{scrollbar-width:thin}

/* utility */
.jp{font-family:var(--font-jp)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}