main{max-width:900px}
.intro{font-size:13px;color:var(--accent);margin:16px 0 24px}
.pick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pick-grid button{min-height:62px;text-align:left;font-weight:600}
.pick-grid button[aria-pressed=true]{background:#304026;border-color:var(--accent);color:var(--accent)}
.pick-grid button:disabled{cursor:default;opacity:.4}
.row h2,.row p{margin:0}
#selection-status{margin:16px 0 4px;color:var(--accent)}
.setup{margin:0 0 24px;color:var(--muted);font-size:14px}
.setup p,.about-line p{max-width:75ch;line-height:1.65}
.setup summary,.about-line summary{color:var(--text)}
summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
#route-heading{margin:28px 0 10px}
#route-heading h2{margin-bottom:8px;line-height:1.4}
#route-heading p{font-size:14px}
.route-timing{font-size:12px;color:var(--muted);margin-left:6px;display:inline-block}
.about-line{font-size:14px;border-top:1px solid var(--line);margin-bottom:16px}
.about-line p{color:var(--muted);margin:8px 0 14px}
.guide{margin-top:18px}
#current{min-height:180px;padding:20px 0}
#current h3{font-size:21px}
.step-action{line-height:1.7;margin:8px 0 12px}
.step-state{font-size:14px;color:var(--muted);line-height:1.65;margin:8px 0 14px}
progress{width:100%;height:6px;accent-color:var(--accent);margin-top:18px}
.controls{display:flex;justify-content:space-between;gap:12px}
.controls button{min-width:130px}
.controls #next{background:#304026;border-color:var(--accent)}
.stack{padding:14px 16px;background:#101712;border:1px solid var(--line);border-radius:10px;margin:16px 0}
.stack h4{margin:0 0 10px;color:var(--accent);font-size:14px}
.stack ol{padding-left:24px;margin:0}
.stack li{padding:5px 0;font-size:14px;line-height:1.55}
.stack li::marker{color:var(--muted)}
.stack small{display:block;margin-top:12px}
.interaction{border-top:1px solid var(--line);margin-top:18px;font-size:14px}
.interaction>summary{font-weight:600;color:var(--accent);padding:4px 0;min-height:44px}
.interaction-body{padding:8px 0 4px}
.interaction-status{display:inline-block;font-size:12px;color:var(--accent);border:1px solid var(--line);border-radius:6px;padding:3px 8px}
.interaction-status.backup{color:#e8c991;border-color:#766846}
.interaction-instruction{line-height:1.6;margin:12px 0}
.interaction dl{margin:0}
.interaction dl>div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;margin:9px 0}
.interaction dt{font-weight:600;color:var(--muted)}
.interaction dd{margin:0;line-height:1.6}
.interaction-caveat{color:var(--muted);font-size:13px;line-height:1.6;margin:12px 0 0}
.interaction-warning{color:#e8c991;border-left:2px solid #bfa475;padding-left:10px;font-size:13px;line-height:1.6;margin:12px 0 0}
#all-steps{padding-left:24px}
#all-steps>li{margin:16px 0;padding:8px;border-radius:6px;line-height:1.7}
#all-steps>li.active{background:#2a3924;border-left:2px solid var(--accent)}
#all-steps .stack{margin-top:12px}
.step-count{color:var(--accent);font-size:13px;margin-bottom:6px}
.pause{color:#e8c991}
#how-you-win p{line-height:1.7;max-width:75ch}
.line-finish{border-bottom:1px solid var(--line);margin-bottom:16px;color:var(--accent)}
@media(max-width:580px){
  .pick-grid{grid-template-columns:1fr 1fr}
  .pick-grid button{font-size:14px}
  .guide .row button{font-size:12px}
  #current{min-height:160px}
  #current h3{font-size:19px}
  .controls button{min-width:0;flex:1}
  .interaction dl>div{grid-template-columns:1fr;gap:2px}
  .route-timing{margin-left:0}
  #all-steps{padding-left:18px}
  #all-steps>li{padding:8px 4px}
}
