/* True Causes — "chamber" theme. One layer over the existing CSS: tokens first, then the few
   rules that change shape (cards, buttons, rail, headings). Bottle green and brass on a cool
   mist ground; Noto Serif Display for headings, Commissioner for everything read and pressed.
   Both cover Latin, Cyrillic and Greek; CJK falls back to the system's own faces. */

/* fonts: served from this site (static/fonts/), never from a third party.
   Noto Serif Display and Commissioner, both SIL Open Font License 1.1 */
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:300;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-300.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:300;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-ext-300.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:300;font-display:swap;src:url(/static/fonts/noto-serif-display-cyrillic-300.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:300;font-display:swap;src:url(/static/fonts/noto-serif-display-greek-300.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-ext-400.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/noto-serif-display-cyrillic-400.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/noto-serif-display-greek-400.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/noto-serif-display-latin-ext-500.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/noto-serif-display-cyrillic-500.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Noto Serif Display";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/noto-serif-display-greek-500.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/commissioner-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/commissioner-latin-ext-400.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/commissioner-cyrillic-400.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/commissioner-greek-400.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/commissioner-latin-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/commissioner-latin-ext-500.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/commissioner-cyrillic-500.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/commissioner-greek-500.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/commissioner-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/commissioner-latin-ext-600.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/commissioner-cyrillic-600.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/commissioner-greek-600.woff2) format("woff2");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}

:root{
  /* app tokens */
  --paper:#F2F3EF; --card:#FFFFFF; --ink:#1B2925; --faint:#65706A; --line:#D8DCD4;
  --spruce:#163A30; --sage:#3F7562; --sprucesoft:#E8EEE9; --amber:#3F7562; --ambersoft:#E8EEE9;
  --slate:#45647D; --slatesoft:#E5EBF0; --rust:#A4533A; --rustsoft:#F4E6DF; --notice:#B8955B;
  --sage-rail:#C9A96E; --clay-rail:#D99A78;
  --brass:#A8864F; --brass-soft:#F1EADC; --rail:#0F2620;
  --display:"Noto Serif Display","Iowan Old Style",Georgia,serif;
  --text:"Commissioner",ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  /* landing-page tokens (pages/welcome.html, about.html) */
  --page:#F2F3EF; --rule:#D8DCD4; --parch:#1B2925; --parch-dim:#46524D; --parch-faint:#65706A;
  --amber-soft:#E8EEE9; --moss:#3F7562; --steel:#45647D;
  --serif:var(--display); --sans:var(--text);
}

/* ── type ─────────────────────────────────────────────── */
body{font-family:var(--text);font-feature-settings:"tnum" 1,"lnum" 1;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility}
h1,h2,.hero h1,.sec-head h2{font-family:var(--display);font-weight:400;letter-spacing:-.018em;line-height:1.08}
h1{font-size:44px}
h2{font-size:26px;font-weight:400}
h3{font-family:var(--display);font-weight:500;letter-spacing:-.005em}
.hero h1{font-size:clamp(42px,6vw,76px);font-weight:300;letter-spacing:-.025em;line-height:1.02}
.mono,.tag,.stage .n,.bar div,.help{font-family:var(--text);font-feature-settings:"tnum" 1}
.mono{letter-spacing:.06em}
a{color:var(--spruce);text-decoration-color:rgba(168,134,79,.55);text-underline-offset:3px}
.brand,.mast a{font-family:var(--display);letter-spacing:.02em}

/* ── surfaces: hairlines, no drop shadows, one quiet radius ── */
.card{border-radius:4px;border-color:var(--line);box-shadow:none;padding:16px 20px;margin:10px 0}
.instrument,.skim-grid a,.btn.line{border-radius:3px}
.skim-grid a{border-color:var(--line);border-left-color:var(--brass)}
.skim-grid a b,.skim-grid a::after{color:var(--spruce)}
section,.top,.readout,ol.stages,ol.stages li{border-color:var(--rule)}
ol.stages li::before{color:var(--brass);border-color:var(--brass);font-family:var(--display);font-size:13px}

/* ── controls ─────────────────────────────────────────── */
button,.btn{border-radius:3px;font-weight:500;letter-spacing:.015em;padding:9px 18px;font-size:13.5px}
button:not(.ghost):not(.segbtn):not(.xp):not(.xx):not([class*="xd"]),.btn:not(.ghost):not(.line){background:var(--spruce);color:#F4EFE4}
button:not(.ghost):not(:disabled):hover,.btn.solid:hover{background:var(--rail)}
.btn.solid{background:var(--spruce);color:#F4EFE4}
.ghost{border-color:#C9CEC6;color:var(--spruce)}
.ghost:hover{border-color:var(--brass)}
.amberb{background:var(--sage)}
input,textarea,select{border-radius:3px;background:#FFFFFF;border-color:#CDD2CA}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(168,134,79,.18)}
:focus-visible{outline:2px solid var(--brass)!important;outline-offset:2px}
.tag{border-radius:2px;letter-spacing:.03em;padding:2px 7px}
.seg{border-radius:4px}.segbtn{border-radius:3px}
.segbtn.on,.segbtn:has(input:checked),.segbtn:has(input:checked):hover{background:var(--spruce);color:#F4EFE4}
.dot.on{background:var(--brass);border-color:var(--brass)}
#busybar{background:var(--brass)}

/* ── the room's rail: the one rich surface ────────────── */
.rail{background:var(--rail);padding:26px 18px;border-right:1px solid rgba(201,169,110,.18)}
.rail a{color:#B9C7BF}
.rail>div:first-child,.rail>div:first-child a{font-family:var(--display)!important;font-size:17px!important;color:#E7DCC6!important;letter-spacing:.02em}
.stage{border-radius:3px;padding:8px 10px;font-size:14.5px;color:#DCE4DF}
.stage .n{background:transparent;border:1px solid rgba(201,169,110,.55);color:#C9A96E;font-size:11.5px}
.done .n{background:transparent;border-color:#C9A96E;color:#C9A96E}
.now{background:rgba(201,169,110,.12);box-shadow:inset 2px 0 0 #C9A96E}
.now .n{background:#C9A96E;border-color:#C9A96E;color:var(--rail)}
.rh,.rnote{color:#A9B9B0}
.main{padding:34px 40px 70px;max-width:940px}
@media(max-width:760px){.main{padding:18px 14px 56px}h1{font-size:30px}h2{font-size:21px}}
.grid>.card{margin:0}
:lang(ja) .mono,:lang(zh) .mono,:lang(ja) .tag,:lang(zh) .tag{letter-spacing:0}
