/* Demoted titles (one h1 per page): an h2.h1 starts from the browser h1 defaults, then takes every h1 rule below. */
:where(h2.h1){font-size:2em;margin-block:.67em}
:root{--black:#1b201f;--cream:#f0e7ce;--brass:#d2a64f;--red:#b52d2f;--green:#28664f;--steel:#79817d;--line:rgba(240,231,206,.22);font:16px/1.45 ui-sans-serif,system-ui,sans-serif;color:var(--cream);background:var(--black);color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;min-width:300px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.015) 0 2px,transparent 2px 7px),var(--black);min-height:100vh}
button,a,input{font:inherit}
button{color:inherit;cursor:pointer}
.skip{position:fixed;top:-5rem;left:1rem;background:#fff;color:#000;padding:.7rem;z-index:30}
.skip:focus{top:1rem}
:focus-visible{outline:3px solid var(--brass);outline-offset:3px}
header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:10px clamp(14px,4vw,60px);border-bottom:4px solid var(--brass);background:#171b1a;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none;font-weight:800}
.brand small{display:block;font-size:0.75rem;letter-spacing:.15em;text-transform:uppercase;color:#aaa58f}
.badge{width:46px;height:46px;border:2px solid var(--brass);border-radius:5px;display:grid;place-items:center;color:var(--brass)}
nav{display:flex;gap:8px}
nav button{width:auto;min-width:44px;min-height:44px;border:1px solid var(--line);background:transparent;padding:0 14px}
main{max-width:1560px;margin:auto}
.home{padding:clamp(50px,8vw,120px) clamp(18px,6vw,90px)}
.token{display:inline-block;border:1px solid var(--brass);color:var(--brass);padding:6px 9px;font-size:0.75rem;text-transform:uppercase;letter-spacing:.15em}
.home h1{font:700 clamp(3.1rem,8vw,8rem)/.88 ui-serif,Georgia,serif;letter-spacing:-.05em;margin:28px 0}
.home h1 em{font-style:normal;color:var(--red)}
.home>p{max-width:58ch;color:#c2baa5;font-size:1.08rem}
.modes{display:grid;grid-template-columns:1.2fr 1fr;gap:11px;max-width:920px;margin-top:40px}
.modes button{min-height:185px;border:2px solid var(--brass);background:#232927;padding:22px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;box-shadow:5px 5px 0 #080a09}
.modes button:first-child{background:var(--brass);color:var(--black)}
.modes span{margin-bottom:auto;font-size:0.75rem;text-transform:uppercase;letter-spacing:.14em}
.modes b{font:700 1.55rem ui-serif,Georgia}
.modes small{margin-top:6px;opacity:1}
.archive-bar{display:flex;flex-wrap:wrap;align-items:end;gap:8px;max-width:920px;margin-top:18px;padding:13px;border:1px solid var(--line);background:#232927}
.archive-bar label{display:grid;gap:5px;flex:1;color:#d2c9b1;font-size:0.75rem;text-transform:uppercase;letter-spacing:.09em}
.archive-bar input{min-height:44px;border:1px solid var(--brass);background:#171b1a;color:var(--cream);padding:0 12px;color-scheme:dark}
.archive-bar button{min-height:44px;border:0;background:var(--brass);color:var(--black);font-weight:850;padding:0 18px}
.archive-bar small{flex-basis:auto;width:100%;min-width:0;align-self:stretch;color:#aaa28d;font-size:0.75rem;overflow-wrap:anywhere}
.career-strip{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));max-width:920px;margin-top:18px;border:1px solid var(--line)}
.career-strip div{padding:13px;border-right:1px solid var(--line)}
.career-strip div:last-child{border:0}
.career-strip b,.career-strip span{display:block}
.career-strip b{font:700 1.4rem ui-serif,Georgia;color:var(--brass)}
.career-strip span{font-size:0.75rem;text-transform:uppercase;color:#bbb39d}
.badge-case{max-width:920px;border-bottom:1px solid var(--line);padding:13px 0}
.badge-case summary{cursor:pointer;color:var(--brass);font-size:0.75rem;text-transform:uppercase;letter-spacing:.12em}
.badge-case ul{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:0;list-style:none}
.badge-case li{border:1px solid var(--line);padding:9px;opacity:.45}
.badge-case li.earned{opacity:1;border-color:var(--brass);background:#232927}
.badge-case b,.badge-case span{display:block}
.badge-case span{font-size:0.75rem;color:#bdb59f}
.local-ledger{max-width:920px;margin-top:14px;border:1px solid var(--line);background:#232927;padding:14px}.local-ledger>div{display:grid;gap:3px}.local-ledger>div>span,.local-ledger summary{color:var(--brass);font-size:0.75rem;text-transform:uppercase;letter-spacing:.12em}.local-ledger ul,.local-ledger ol{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:7px}.local-ledger li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:9px;min-width:0}.local-ledger li b,.local-ledger li span{display:block;overflow-wrap:anywhere}.local-ledger li span{font-size:0.75rem;color:#bdb59f}.local-ledger button,.dialog-actions button,#history-play{min-height:44px;border:1px solid var(--brass);background:transparent;color:var(--cream);padding:0 12px}.local-ledger [data-discard-draft]{border-color:var(--red)}
.frame-head{display:grid;grid-template-columns:160px 1fr auto;gap:18px;align-items:end;padding:25px clamp(12px,3vw,46px) 18px}
.frame-head>button{border:0;background:none;text-align:left}
.frame-head>div>span{color:var(--brass);font-size:0.75rem;text-transform:uppercase}
.frame-head h1,.frame-head h2.h1{font:700 clamp(2.2rem,4vw,4.3rem)/.95 ui-serif,Georgia;margin:4px 0}
.tick{border-left:2px solid var(--brass);padding-left:18px}
.tick span,.tick b{display:block}
.tick span{font-size:0.75rem;text-transform:uppercase}
.tick b{font-size:1.7rem}
.workspace{display:grid;grid-template-columns:minmax(500px,1fr) 300px 240px;gap:12px;padding:0 clamp(12px,3vw,46px) 60px}
.diagram{min-width:0;max-width:100%}
.diagram svg{width:100%;background:#e8dfc7;border:10px solid #343a37;box-shadow:inset 0 0 0 2px var(--brass)}
.tracks path{fill:none;stroke:#333;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}
.tracks path+path{stroke-width:8}
.tracks path::after{stroke-dasharray:3}
.diagram #nodes circle{fill:#f2ead4;stroke:#333;stroke-width:3}
.diagram #nodes text{fill:#222;text-anchor:middle;font:bold 13px system-ui}
.train rect{fill:var(--red);stroke:#222;stroke-width:2}
.train.freight rect{fill:#586d6b}
.train.mail rect{fill:#b77a36}
.train.passenger rect{fill:#386f89}
.train text{fill:#fff;text-anchor:middle;font:bold 12px system-ui}
.orders{margin-top:9px}
.orders>span,.frame-label{font-size:0.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--brass)}
#train-orders{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:7px;margin-top:7px}
.order{border:1px solid var(--line);padding:9px;background:#232927}
.order span,.order b,.order small{display:block}
.order span{color:var(--brass);font-weight:900}
.order small{font-size:0.75rem;color:#aaa58f}
.order.done{border-color:var(--green);opacity:.65}
.order.active{border-color:var(--red)}
.lever-frame,.logbook{border:2px solid #080a09;background:#343a37;padding:14px;box-shadow:inset 0 0 0 1px var(--brass);align-self:start}
.lever{margin:14px 0}
.lever>span,.signals span{font-size:0.75rem;text-transform:uppercase;color:#bab39e}
.lever button{width:100%;min-height:62px;border:1px solid #111;background:#252a28;display:flex;align-items:center;justify-content:space-between;padding:10px}
.lever button i{width:22px;height:45px;border-radius:10px;background:linear-gradient(90deg,#695021,var(--brass),#695021);transform:rotate(-18deg)}
.lever button[aria-pressed=true] i{transform:rotate(18deg)}
.signals{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:18px 0}
.signals button{width:100%;min-height:48px;background:var(--green);border:2px solid #111}
.signals button.hold{background:var(--red)}
.lever-frame>.advance,.lever-frame>button{width:100%;min-height:47px;margin-top:7px;border:1px solid var(--line);background:transparent}
.lever-frame>.advance{background:var(--brass);color:var(--black);font-weight:900}
.lever-frame>p{min-height:70px;font-size:0.75rem;color:#c6bea9}
.lever-frame>.special-notice{min-height:0;margin:10px 0;padding:9px;border-left:3px solid var(--red);background:#252a28;color:#eee4ca}
.logbook ol{padding-left:0;list-style:none;max-height:300px;overflow:auto}
.logbook li{font-size:0.75rem;border-bottom:1px solid var(--line);padding:7px 0}
.logbook li span{display:inline-grid;place-items:center;width:23px;height:23px;border:1px solid var(--brass);margin-right:6px}
.logbook dl div{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:7px 0;font-size:0.75rem}
.logbook dd{margin:0;font-weight:900;color:var(--brass)}
.complete{margin:clamp(50px,9vw,130px) clamp(18px,8vw,120px);max-width:950px;border:2px solid var(--brass);padding:clamp(25px,5vw,60px);background:#262c2a;box-shadow:8px 8px 0 #080a09}
.complete>span{color:var(--brass);text-transform:uppercase;letter-spacing:.15em}
.complete h1,.complete h2.h1{font:700 clamp(3rem,7vw,7rem)/.9 ui-serif,Georgia}
.complete>div{border-block:1px solid var(--line);padding:20px 0;margin:25px 0}
.complete>div b,.complete>div small{display:block}
.complete>div b{font-size:2.4rem;color:var(--brass)}
.complete>.result-report{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;border:0;padding:0}
.result-report div{border:1px solid var(--line);padding:12px;min-width:0}
.result-report div b,.result-report div span{display:block}
.result-report div b{font-size:1.05rem;color:var(--cream)}
.result-report div span{font-size:0.75rem;text-transform:uppercase;color:#bcb49d}
.new-badges{color:var(--brass);font-weight:750}
.complete>.register-replay{border:1px solid var(--line);padding:12px;background:#1b201f}
.register-replay>div{display:flex;justify-content:space-between;align-items:center}
.register-replay button{min-height:44px;border:1px solid var(--brass);background:transparent;color:var(--cream)}
.register-replay ol{max-height:190px;overflow:auto;padding:0;list-style:none}
.register-replay li{display:grid;grid-template-columns:32px 1fr;gap:7px;padding:7px;border-top:1px solid var(--line);font-size:0.75rem}
.register-replay li span{color:var(--brass);font-weight:900}
.register-replay li.playing{background:var(--brass);color:var(--black)}
.register-replay li.playing span{color:var(--black)}
.complete>button{min-height:48px;border:1px solid var(--line);background:transparent;padding:0 18px;margin:4px}
.complete>button:first-of-type{background:var(--brass);color:var(--black)}
footer{border-top:1px solid var(--line);padding:22px clamp(14px,4vw,60px);display:flex;justify-content:space-between;font-size:0.75rem;color:#aaa58f}
footer a{color:inherit;margin-left:14px}
.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,12px);background:var(--brass);color:var(--black);padding:10px 14px;opacity:0;transition:.2s;z-index:30}
.toast.show{opacity:1;transform:translate(-50%,0)}
dialog{width:min(590px,calc(100% - 24px));background:#343a37;color:var(--cream);border:2px solid var(--brass);padding:28px}
dialog::backdrop{background:rgba(0,0,0,.75)}
dialog form button{float:right;width:44px;height:44px;border:1px solid var(--line);background:transparent}
dialog>span{color:var(--brass);text-transform:uppercase;font-size:0.75rem}
dialog h2{font:700 2.3rem ui-serif,Georgia}
dialog>label{display:flex;align-items:center;gap:10px;min-height:46px;border-bottom:1px solid var(--line)}
.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dialog-actions button:first-child{background:var(--brass);color:var(--black)}.history-dialog ol{list-style:none;padding:0;display:grid;gap:7px}.history-dialog li{display:grid;grid-template-columns:34px 1fr;gap:8px;padding:10px;border:1px solid var(--line)}.history-dialog li.playing{background:var(--brass);color:var(--black)}.history-dialog li span{display:grid;place-items:center;font-weight:900}
.data{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:18px}
.data button,.data label{min-height:44px;border:1px solid var(--line);display:grid;place-items:center;background:transparent}
.data button:last-child{grid-column:1/-1;color:#ff9294}
.data input{position:absolute;opacity:0}
html[data-contrast=high]{--black:#000;--cream:#fff;--line:#fff;--brass:#ffda77;--red:#ff4245;--green:#42d795}
html[data-contrast=high] .signals button{color:#000}
html[data-large=yes]{font-size:19px}
html[data-motion=reduced] *{transition:none!important}
.lever button i{transition:.2s}

@media(max-width:1220px){.workspace{grid-template-columns:minmax(500px,1fr) 300px}
.logbook{grid-column:1/-1}
}
@media(max-width:850px){.workspace{grid-template-columns:1fr}
.frame-head{grid-template-columns:1fr auto}
.frame-head>button{grid-column:1/-1}
.lever-frame{order:2}
.logbook{order:3}
.modes{grid-template-columns:1fr}
.badge-case ul{grid-template-columns:1fr 1fr}
}
@media(max-width:580px){header{height:68px}
.brand small{display:none}
nav button{padding-inline:9px}
.home{padding:40px 15px 55px}
.home h1{font-size:3.2rem}
.frame-head{padding:18px 12px}
.frame-head h1,.frame-head h2.h1{font-size:2.4rem}
.workspace{padding:0 10px 50px}
.diagram svg{min-width:560px}
.signals{grid-template-columns:1fr}
.complete h1,.complete h2.h1{font-size:3.5rem}
.archive-bar{align-items:stretch;flex-direction:column}
.local-ledger li{grid-template-columns:1fr 1fr}.local-ledger li div{grid-column:1/-1}.dialog-actions{grid-template-columns:1fr}
.career-strip{grid-template-columns:1fr}
.career-strip div{border-right:0;border-bottom:1px solid var(--line)}
.badge-case ul,.complete>.result-report{grid-template-columns:1fr 1fr}
footer{flex-direction:column;gap:10px}
}

@media(max-width:360px){.home{padding-inline:10px}.workspace{padding-inline:6px}.frame-head{padding-inline:8px}.complete{margin-inline:8px;padding-inline:18px}}

@media(pointer:coarse){button{min-height:44px}}

/* Portfolio signature: lever frame paired with a working timetable. */
.home[hidden]{display:none!important}
.rail-intro{min-width:0}.rail-intro>p{max-width:58ch;color:#c2baa5;font-size:1.08rem}.mini-frame{position:relative;min-height:260px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr auto;gap:12px;padding:24px;border:2px solid var(--brass);background:repeating-linear-gradient(90deg,#202624 0 2px,#171c1b 2px 38px);box-shadow:9px 9px 0 #080a09}
.mini-frame span{display:grid;place-items:center;border:1px solid var(--line);font:800 1rem ui-serif,Georgia}.mini-frame i{position:absolute;width:18px;height:82px;top:57px;border:2px solid var(--cream);border-radius:12px;background:linear-gradient(90deg,#111,#555,#111);transform-origin:50% 90%}.mini-frame i:nth-of-type(1){left:27%;transform:rotate(-23deg)}.mini-frame i:nth-of-type(2){right:27%;transform:rotate(23deg)}
.mini-frame b{display:grid;place-items:center;align-self:end;width:46px;height:46px;margin:auto;border-radius:50%;background:var(--red);border:4px solid #111;color:#111}.mini-frame b:nth-of-type(2){background:var(--green)}.mini-frame small{grid-column:1/-1;text-align:center;color:var(--brass);letter-spacing:.24em}
.rail-register{display:grid;gap:12px;align-content:start;padding:18px;border:1px solid var(--line);background:#1b201f;box-shadow:5px 5px 0 #080a09}.rail-register>.archive-bar,.rail-register>.career-strip,.rail-register>.badge-case,.rail-register>.local-ledger{max-width:none;margin-top:0}
@media(min-width:920px){
  .home{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px 30px;align-items:start}.home>.rail-intro{grid-column:1/8}.rail-intro h1{font-size:clamp(3.2rem,6.8vw,7rem);margin-bottom:18px}.home>.mini-frame{grid-column:9/-1;grid-row:1}.home>.modes{grid-column:1/7;grid-template-columns:1fr;max-width:none;margin-top:0;gap:8px}.home>.modes button{min-height:112px;display:grid;grid-template-columns:120px 1fr;grid-template-rows:auto auto;padding:16px 20px;border-width:1px;box-shadow:none}.home>.modes button span{grid-row:1/3;margin:0;padding-right:16px;border-right:1px dashed currentColor;align-self:stretch;display:flex;align-items:center}.home>.modes button b,.home>.modes button small{padding-left:18px}.home>.modes button:first-child{border-left:10px solid var(--red)}
  .home>.rail-register{grid-column:7/-1;grid-row:2}.rail-register>.career-strip{grid-template-columns:1fr}.rail-register>.career-strip div{display:grid;grid-template-columns:80px 1fr;align-items:center;border-right:0;border-bottom:1px solid var(--line)}
  .complete{max-width:1240px;display:grid;grid-template-columns:minmax(220px,.45fr) minmax(0,1.55fr);gap:14px 28px;background:repeating-linear-gradient(0deg,#262c2a 0 39px,#2c3330 40px);position:relative}.complete::after{content:"LINE CLEAR";position:absolute;right:30px;top:26px;padding:8px 12px;border:3px double var(--red);color:var(--red);font-weight:900;transform:rotate(4deg)}
  .complete>span,.complete>h1,.complete>h2.h1,.complete>p{grid-column:2}.complete>h1,.complete>h2.h1{margin-block:5px}.complete>div:not(.result-report){grid-column:1;grid-row:1/span 3;display:flex;flex-direction:column;justify-content:center;border:2px solid var(--brass);padding:22px;margin:0;background:#171b1a}.complete>div:not(.result-report) b{font-size:3rem}
  .complete>.result-report,.complete>.new-badges,.complete>.register-replay{grid-column:1/-1}.complete>.register-replay{grid-row:auto;display:block}.complete>button{justify-self:start;margin-left:0}
}
@media(max-width:919px){.mini-frame{max-width:420px;margin:26px 0}.rail-register{margin-top:20px}.home>.modes{max-width:none}.complete{width:auto}}
@media(max-width:480px){.mini-frame{min-height:220px;padding:16px}.mini-frame i{top:45px;height:68px}.rail-register{padding:10px}.home>.modes button{min-height:150px}}

.badge-case summary,.local-ledger summary{min-height:44px;display:flex;align-items:center}

button{min-width:44px;min-height:44px}
header a,footer a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
dialog label,details>summary,.file-button{min-height:44px}

#archive-status{display:block;flex-basis:auto;align-self:stretch;width:100%;min-width:0;padding:8px 10px;border:1px dashed var(--brass);background:#121615;color:#e5dec6;font:600 0.75rem ui-monospace,monospace;overflow-wrap:anywhere}
.campaign-picker{border:2px solid var(--brass);padding:10px;background:#151918;box-shadow:3px 3px 0 #070807}.campaign-picker summary{color:var(--cream);font:700 0.75rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em;cursor:pointer}.campaign-picker ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px}.campaign-picker li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:8px;border-top:1px solid var(--line);padding:7px;min-width:0}.campaign-picker li>span{font:700 0.75rem ui-monospace,monospace;color:var(--brass)}.campaign-picker b,.campaign-picker small{display:block;overflow-wrap:anywhere}.campaign-picker small{font:600 0.75rem ui-monospace,monospace;color:#b9b49f}.campaign-picker button{border:1px solid var(--brass);background:#202624;padding-inline:10px}.campaign-picker button:disabled{opacity:.35}.campaign-picker li.complete{border-left:4px solid var(--green)}.rail-register>.campaign-picker{max-width:none;margin:0}.shortcut-help{font:600 0.75rem ui-monospace,monospace;color:#c8c2ac;border-top:1px dashed var(--line);padding-top:8px}
@media(max-width:480px){.campaign-picker li{grid-template-columns:30px minmax(0,1fr)}.campaign-picker button{grid-column:2;justify-self:start}}
.guide-page{width:min(1120px,100%);padding:clamp(38px,7vw,90px) clamp(16px,5vw,60px)}.guide-page article{border:3px double var(--brass);background:repeating-linear-gradient(0deg,#1b201f 0 39px,#202624 40px);box-shadow:8px 8px 0 #090b0a;padding:clamp(24px,5vw,56px)}.guide-kicker{color:var(--brass);font:700 0.75rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.15em}.guide-page h1{font:700 clamp(2.7rem,7vw,6rem)/.92 ui-serif,Georgia;margin:18px 0}.guide-page h1 em{font-style:normal;color:var(--brass)}.guide-lead{max-width:68ch;color:#ddd5bc;font-size:1.08rem}.guide-page section{margin-top:38px;padding-top:18px;border-top:2px solid var(--brass)}.guide-page h2{font:700 clamp(1.5rem,3vw,2.2rem) ui-monospace,monospace;text-transform:uppercase}.guide-page li{margin-block:.7rem}.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.guide-grid p,.guide-page details{border:1px solid var(--line);background:#121615;padding:14px;margin:8px 0}.guide-page details summary{cursor:pointer;color:var(--brass);font-weight:750}.guide-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:38px}.guide-actions a{min-height:48px;display:inline-flex;align-items:center;padding:0 16px;border:2px solid var(--brass);color:var(--cream);text-decoration:none}.guide-actions a:first-child{background:var(--brass);color:#161a18;font-weight:900}@media(max-width:600px){.guide-grid{grid-template-columns:1fr}.guide-page article{padding-inline:17px}}
.more-games{max-width:920px;margin:34px auto 0;padding:20px;border:1px solid var(--line);border-radius:0}
.more-games h2{font-size:1rem;margin:0 0 6px}
.more-games p{margin:0 0 14px;font-size:0.82rem;opacity:.85}
.more-games ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.more-games li{display:grid;gap:2px;min-width:0}
.more-games li a{display:flex;align-items:center;min-height:44px;font-size:0.88rem;overflow-wrap:anywhere}
.more-games li span{font-size:0.75rem;opacity:.8}

.advance-help{margin:.4rem 0 0;font-size:0.8125rem;color:#c2b89f}
.advance-help.warning{color:#f0b8a2}

#log li.held b,#log li.held{color:#f0c98a}
#log li.held::after{content:'held';float:right;font-size:0.75rem;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
#log li.empty{opacity:.75}
#playback li.held i{font-style:normal;font-size:0.75rem;padding:.1rem .4rem;border-radius:99px;background:rgba(240,201,138,.18);color:#f0c98a;margin-left:.4rem}

.stats-board .stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem;margin:.75rem 0}
.stats-board .stat-grid div{padding:.7rem .8rem;border:1px solid rgba(240,232,214,.2);border-radius:10px}
.stats-board .stat-grid b{display:block;font-size:1.35rem}
.stats-board .stat-grid span{font-size:0.8125rem;opacity:.8}
.stat-grades{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.stat-grades li{display:grid;grid-template-columns:1fr auto;gap:.25rem .75rem;font-size:0.875rem;padding:.4rem .1rem;border-bottom:1px solid rgba(240,232,214,.16)}
.stat-grades li i{grid-column:1/-1;display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,#d9a441 var(--share,0%),rgba(255,255,255,.1) var(--share,0%))}
.stat-grades li.empty{grid-template-columns:1fr;opacity:.8}

.coach{position:sticky;bottom:1rem;z-index:5;margin:1rem auto 0;max-width:44rem;padding:1rem 1.1rem;border:2px solid #d9a441;border-radius:14px;background:#241f18;box-shadow:0 14px 40px rgba(0,0,0,.55)}
.coach b{display:block;font-size:0.8125rem;letter-spacing:.08em;text-transform:uppercase;color:#d9a441}
.coach p{margin:.4rem 0 .8rem;font-size:0.9375rem}
.coach div{display:flex;flex-wrap:wrap;gap:.6rem}
.coach button{min-height:44px;padding:0 1.1rem;border-radius:9px;border:1px solid rgba(240,232,214,.25);background:transparent;color:inherit;font:inherit;cursor:pointer}
.coach button#coach-next{background:#d9a441;border-color:#d9a441;color:#1a1611;font-weight:600}
.coach-target{outline:3px dashed #d9a441;outline-offset:3px}

.keys{display:grid;gap:.45rem;margin:.75rem 0}
.keys div{display:grid;grid-template-columns:minmax(8rem,auto) 1fr;gap:.75rem;font-size:0.875rem;align-items:baseline}
.keys dt{font-weight:600;color:#d9a441}
.keys dd{margin:0}
@media (max-width:520px){.keys div{grid-template-columns:1fr}}

.update-prompt{position:fixed;z-index:40;right:16px;bottom:16px;max-width:min(340px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:4px;background:#232928;color:var(--cream);box-shadow:0 14px 40px rgba(0,0,0,.3)}
.update-prompt-text{margin:0;font-size:.875rem;line-height:1.45}
.update-prompt-actions{display:flex;flex-wrap:wrap;gap:8px}
.update-prompt button{min-width:44px;min-height:44px;padding:0 16px;border-radius:4px;font:inherit;font-size:.875rem;cursor:pointer}
.update-prompt-reload{border:1px solid transparent;background:var(--brass);color:#1b201f;font-weight:700}
.update-prompt-dismiss{border:1px solid var(--line);background:transparent;color:inherit}
@media(prefers-reduced-motion:no-preference){.update-prompt{animation:update-prompt-in .18s ease-out}
@keyframes update-prompt-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(max-width:560px){.update-prompt{left:12px;right:12px;bottom:84px;max-width:none}}

/* Wave 3 polish: scrollable junction, lever state tags, due-next strip, share, archive strip. */
.map-shell{min-width:0}
.map-scroll{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-inline:contain}
.map-scroll:focus-visible{outline:3px solid var(--brass);outline-offset:2px}
.map-scroll-note{display:none;margin:.45rem 0 0;font-size:0.75rem;line-height:1.5;color:#c9c0a6}
.map-shell[data-scrollable=yes] .map-scroll-note{display:block}
.map-shell[data-scrollable=yes] .map-scroll{box-shadow:inset -14px 0 14px -14px #000,inset 14px 0 14px -14px #000;scrollbar-width:thin}
.lever-copy{display:grid;gap:.1rem;min-width:0;text-align:left}
.lever-state{display:block;font-style:normal;font-size:0.75rem;line-height:1.4;color:#c9c0a6;overflow-wrap:anywhere}
.lever button{gap:.5rem}
.signals button{display:grid;gap:.15rem;min-height:44px}
.signals button b{font-size:0.9375rem}
.due-next{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:0 0 .55rem;padding:.5rem .6rem;border:1px solid var(--line);border-radius:8px;background:rgba(23,27,26,.7)}
.due-next>span{font-size:0.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brass)}
.due-next b{display:grid;gap:.1rem;padding:.3rem .55rem;border:1px solid var(--line);border-radius:6px;font-size:0.8125rem}
.due-next b small{font-size:0.75rem;font-weight:400;color:#c9c0a6}
.due-next b.due-now{border-color:var(--brass);background:rgba(210,166,79,.16)}
.order.due-now{box-shadow:inset 0 0 0 2px var(--brass)}
.next-try{margin:.6rem 0 0;padding:.7rem .85rem;border-left:4px solid var(--brass);background:rgba(210,166,79,.12);font-size:0.875rem;line-height:1.5;text-align:left}
.share-panel{margin:1rem auto 0;max-width:640px;padding:.85rem;border:1px solid var(--line);border-radius:10px;background:rgba(23,27,26,.85);display:grid;gap:.55rem;justify-items:start;text-align:left}
.share-panel>b{font-size:0.875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--brass)}
.share-panel pre{margin:0;width:100%;overflow-x:auto;white-space:pre-wrap;word-break:break-word;font:0.8125rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cream)}
.share-panel button{min-height:44px;border:0;border-radius:6px;background:var(--brass);color:var(--black);font-weight:850;padding:0 18px}
.share-panel span{font-size:0.8125rem;color:var(--brass);min-height:1.2em}
.archive-strip{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0 0;padding:0;width:100%}
.archive-strip button{min-height:44px;min-width:44px;display:grid;gap:.1rem;justify-items:center;align-content:center;padding:.35rem .5rem;border:1px solid var(--line);border-radius:6px;background:#171b1a;color:var(--cream)}
.archive-strip li[data-played=yes] button{border-color:var(--brass);background:#232825}
.archive-strip u{font-style:normal;text-decoration:none;font-size:0.75rem;line-height:1;color:var(--brass)}
.archive-strip span{font-size:0.75rem;color:#c9c0a6}
.archive-strip b{font-size:0.75rem;font-weight:850;color:var(--brass)}

.share-panel[hidden],.depth-sum[hidden],.sealed-views[hidden]{display:none}
.signals .lever-state{color:#fff}
html[data-contrast=high] .signals .lever-state{color:#000}
@media(min-width:920px){.complete>.next-try,.complete>.share-panel{grid-column:1/-1;max-width:none}.complete>button{align-self:start}}

/* Play screen in one view: a compact frame line, the junction scaled to fit (no sideways dragging on a phone),
   the movement card, and the levers, signals and Advance in reach. */
.frame-head{padding:8px clamp(12px,3vw,46px) 6px;align-items:center}
.frame-head h1,.frame-head h2.h1{font-size:clamp(1.6rem,2.8vw,2.4rem);margin:2px 0 0}
.tick b{font-size:1.5rem}
.workspace{padding-bottom:20px}
.diagram svg{display:block;max-height:calc(var(--ux-fit-h,400px) - 150px);min-height:180px}
.orders{margin-top:6px}
.due-next{margin-bottom:4px;padding:.3rem .5rem}
#train-orders{gap:5px;margin-top:4px}
.lever-frame,.logbook{padding:10px 12px}
.lever{margin:8px 0}
.lever button{min-height:52px;padding:6px 10px}
.lever button i{height:34px}
.signals{margin:10px 0}
.lever-frame>p{min-height:0}
.lever-frame>.advance-help:empty{display:none}
.lever-frame{display:grid;grid-template-columns:1fr 1fr;column-gap:6px;align-content:start}
.lever-frame>*{grid-column:1/-1}
.lever-frame>#rewind,.lever-frame>#redo,.lever-frame>#hint,.lever-frame>#restart{grid-column:auto;font-size:.8125rem}
.lever-frame>.shortcut-help{display:none}
@media(max-width:850px){
.frame-head{grid-template-columns:auto 1fr!important;gap:2px 10px}
.frame-head>button{grid-column:1!important;grid-row:1}
.frame-head>.tick{grid-column:2;grid-row:1;justify-self:end;text-align:right}
.frame-head>div:not(.tick){grid-column:1/-1;grid-row:2}
.frame-head h1,.frame-head h2.h1{font-size:1.35rem}
.workspace{gap:8px}
.diagram svg{min-width:0!important;max-height:none;min-height:0;border-width:5px}
.diagram #nodes text{font-size:20px}
.train text{font-size:17px}
.map-shell[data-scrollable] .map-scroll-note{display:none}
.lever-frame{grid-template-columns:repeat(4,1fr)}
.lever-frame>.frame-label{display:none}
.lever-frame>.lever{grid-column:span 2;margin:0 0 6px}
.lever-frame>.signals{grid-column:1/-1;margin:0 0 6px;grid-template-columns:1fr 1fr!important}
.lever>span,.signals span{font-size:.625rem}
.lever button{min-height:48px}
.lever-copy small{font-size:.625rem}
.lever-frame>.advance{margin-top:0}
.lever-frame>#rewind,.lever-frame>#redo,.lever-frame>#hint,.lever-frame>#restart{font-size:0;padding:0 2px;min-height:44px}
.lever-frame>#rewind::before{content:'Rewind';font-size:.75rem}
.lever-frame>#redo::before{content:'Redo';font-size:.75rem}
.lever-frame>#hint::before{content:'Suggestion';font-size:.75rem}
.lever-frame>#restart::before{content:'Reset';font-size:.75rem}
.diagram{display:contents}
.map-shell{order:1}
.orders{order:2;margin:0}
.orders>span{display:none}
.due-next{display:none}
#train-orders{grid-template-columns:1fr 1fr;margin:0;gap:5px}
#train-orders>*{padding:5px 8px;min-height:0}
.diagram svg{height:180px}
.due-next b{padding:.2rem .4rem}
.lever-frame{order:3}
.logbook{order:4}
.lever-frame>.special-notice{font-size:.75rem;margin:0 0 6px;padding:6px 8px}
}
