/* Series theme (shared with FLIP): porcelain ground, ink type, navy for the computed answer, signal red for the user's own mark. */
:root{--paper:#eceef1;--ink:#16202e;--muted:#66707d;--line:#d3d7dd;--orange:#e5322d;--navy:#1f3b5c;color-scheme:light}
html,body{background:#e2e5e9}
body{font-family:"Zen Kaku Gothic New",system-ui,sans-serif;color:var(--ink)}
main{background:var(--paper)}
header a{font:900 20px/1.2 "Zen Kaku Gothic New",sans-serif;letter-spacing:.04em}
header a span{font:400 11px/1.4 "Zen Kaku Gothic New",sans-serif;letter-spacing:.02em;color:var(--muted)}
header button{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted)}
h1{font-weight:900;font-size:clamp(28px,8vw,38px);letter-spacing:-.02em;line-height:1.3}
#prompt{color:var(--muted)}
nav button{border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink)}
nav button.selected{background:var(--ink);border-color:var(--ink);color:#fff}
.board{background:#fff;border-radius:22px;box-shadow:inset 0 0 0 1.5px var(--ink)}
.board:has(#marks circle){box-shadow:inset 0 0 0 1.5px var(--ink)}
.board-head,.board-foot{font-family:"Zen Kaku Gothic New",sans-serif;color:var(--muted)}
#figure{fill:var(--navy)}
#result{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 10px 24px #16202e14}
#result>.eyebrow,.eyebrow{font-family:"Zen Kaku Gothic New",sans-serif;color:var(--muted);letter-spacing:.04em}
.metric strong{font:800 clamp(64px,20vw,84px)/1 "Big Shoulders Display",sans-serif;letter-spacing:.01em;font-variant-numeric:tabular-nums;color:var(--navy)}
.metric span{color:var(--muted)}
.facts{border-color:var(--line)}
.facts b{font-family:"Big Shoulders Display",sans-serif;font-weight:700;font-size:18px;letter-spacing:.02em}
.you{color:var(--orange)}.truth{color:var(--navy)}
.primary,.decide{background:var(--ink);color:#fff;border-radius:16px;font-weight:700;letter-spacing:.06em}
.decide span{color:var(--orange)}
.secondary{background:transparent;border:1.5px solid var(--ink);border-radius:16px;color:var(--ink);font-weight:700}
#analysis{background:var(--paper);border:1px solid var(--line);border-radius:16px}
pre{color:var(--navy)}
.scan{background:linear-gradient(transparent,#1f3b5c14,transparent)}
dialog{background:var(--paper);border-radius:18px}
input{background:#fff;border-color:var(--line);border-radius:12px}
button:focus-visible,svg:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
footer{color:var(--muted)}
.notes summary{color:var(--ink);font-weight:700}
@media(min-width:650px){main{border-color:var(--line)}}
/* Links between the four apps: a bar fixed to the bottom of every screen */
:root{--series-h:58px}body{padding-bottom:calc(var(--series-h) + env(safe-area-inset-bottom))!important}.series{position:fixed;left:0;right:0;bottom:0;z-index:15;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:8px max(12px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom));margin:0;background:#fffffff0;border-top:1px solid #d3d7dd;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font:700 13px/1 "Zen Kaku Gothic New",system-ui,sans-serif}.series span{display:none}.series a{display:flex;align-items:center;justify-content:center;min-height:42px;border-radius:12px;color:#16202e;text-decoration:none;letter-spacing:.04em}.series a[aria-current]{background:#16202e;color:#fff;pointer-events:none}.series a:focus-visible{outline:3px solid #e5322d;outline-offset:2px}@media(min-width:700px){.series{left:50%;right:auto;transform:translateX(-50%);width:min(520px,100%);border:1px solid #d3d7dd;border-bottom:0;border-radius:16px 16px 0 0}}
