@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#101b22;--panel:#14252d;--line:#2c4149;--text:#eff2e8;--muted:#97adb2;--mint:#71e5c0;--amber:#ffc86b;--violet:#c1a6ff;--red:#ff8c7a;font-family:'DM Sans',system-ui,sans-serif;font-size:14px;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 12%,#223a40 0,transparent 65%);min-height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--amber);outline-offset:5px}button{touch-action:manipulation}a{color:var(--mint)}.shell{width:min(860px,calc(100% - 48px));margin:auto;padding:22px 0 20px}.masthead{display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.01em;color:#b9c7c8}.masthead i{font-style:normal;color:#627d84;margin:0 9px}.playtest{text-transform:uppercase;font-size:9px;letter-spacing:.14em;color:#90a8ae}.masthead>div{display:flex;gap:22px}.text-button{padding:4px 0;background:none;border:0;color:#cbd5d5;font-size:12px}.text-button:hover{color:var(--mint)}.title-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0 18px}.title-row>div:first-child{display:flex;align-items:baseline;gap:19px}h1{font-family:Georgia,'Times New Roman',serif;font-size:48px;line-height:1.1;letter-spacing:-1.9px;font-weight:400;margin:0}h1 span{color:var(--mint)}.title-row p{margin:0;color:#b6c8c7;font-size:13px}.edition{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.live-dot{width:5px;height:5px;border-radius:50%;background:var(--mint);box-shadow:0 0 12px #71e5c060}.game{background:var(--panel);border:1px solid #35494f;border-radius:15px;overflow:hidden;box-shadow:0 18px 70px #0003}.hud{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;padding:15px 27px 13px;border-bottom:1px solid var(--line);background:#14232b}.label{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.13em;font-weight:600}.hud strong{font-family:'Manrope',system-ui,sans-serif;font-size:27px;font-weight:600;line-height:1.35;font-variant-numeric:tabular-nums;letter-spacing:-.9px}.score-group strong{color:var(--mint)}.best-group strong{font-size:22px;color:#b1c0c2}.time-group{text-align:right}.time-group.urgent strong{color:var(--amber)}.combo-group{position:relative}.combo-meter{display:inline-flex;gap:3px;margin-left:10px;vertical-align:middle}.combo-meter i{width:4px;height:13px;background:#385056;border-radius:2px}.combo-meter i.filled{background:var(--mint);box-shadow:0 0 8px #71e5c035}.stage{position:relative;width:100%;aspect-ratio:720/500;background:radial-gradient(ellipse at center,#1b3138,#11222b);isolation:isolate}canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.junctions{position:absolute;inset:0}.junction{position:absolute;transform:translate(-50%,-50%);width:clamp(44px,9.7%,77px);aspect-ratio:1;border:1px solid #557079;border-radius:50%;background:linear-gradient(145deg,#2c4650,#1b333d);display:grid;place-items:center;box-shadow:0 4px 10px #06121880,0 0 0 5px #162a334d;touch-action:none;user-select:none;-webkit-user-select:none;padding:0;transition:background .15s,border-color .15s}.junction:hover{background:#345763;border-color:#9bb8be}.junction:active{background:#405d65}.junction svg{width:49%;height:49%;fill:none;stroke:#c4d7d9;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .13s}.junction .key{position:absolute;bottom:5px;font-size:7px;line-height:1;color:#819aa1;opacity:.6}.junction.near{border-color:var(--pulse-color,var(--mint));box-shadow:0 0 0 4px #83cdb20b,0 0 18px #71e5c014}.junction.near svg{stroke:var(--pulse-color,var(--mint))}.junction.pressing{border-color:var(--mint)}.source-label,.gate-label{position:absolute;top:10%;font-size:8px;letter-spacing:.18em;font-weight:600;color:#7e969f;pointer-events:none}.source-label{left:3.7%}.gate-label{right:2%;font-size:7px;writing-mode:vertical-rl;top:36%;transform:translateX(18px)}.route-status{position:absolute;left:20%;right:20%;top:5%;font-size:11px;letter-spacing:.01em;color:var(--muted);text-align:center;pointer-events:none}.stage-flash{pointer-events:none;position:absolute;inset:0;border:0 solid var(--red);border-radius:0;z-index:3}.stage-flash.missed{animation:missflash .5s ease-out}.stage-flash.level-up{animation:levelflash .8s ease-out}@keyframes missflash{0%{box-shadow:inset 0 0 60px #ff8c7a35}100%{box-shadow:inset 0 0 0 transparent}}@keyframes levelflash{0%{box-shadow:inset 0 0 65px #71e5c025}100%{box-shadow:inset 0 0 0 transparent}}.stream-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:53px;padding:11px 26px;border-top:1px solid var(--line);background:#14232b}.up-next{display:flex;align-items:center;gap:17px}.up-next>.label{white-space:nowrap}#queue{display:flex;gap:13px;align-items:center}.queue-item{display:inline-flex;gap:6px;align-items:center}.queue-shape{font-size:16px;line-height:1}.queue-lane{color:#9bb2b8;font-size:9px;text-transform:uppercase;letter-spacing:.04em}.queue-item:not(:first-child){opacity:.57}.chances{display:flex;align-items:center;gap:9px;font-size:10px;color:#a8bdc0;white-space:nowrap}#lives{display:flex;gap:4px}#lives i{width:6px;height:6px;background:var(--mint);border-radius:50%}#lives i.lost{background:#425259}.run-progress{height:2px;background:#1e343b}.run-progress i{display:block;height:100%;background:var(--mint);width:0}.below-board{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 2px 0}.below-board p{font-size:11px;color:#a4babd;margin:0;line-height:1.5}.actions{display:flex;gap:7px;flex-shrink:0}.icon-button{border:1px solid #39515b;padding:7px 12px;background:transparent;color:#bfcecf;border-radius:5px;font-size:10px}.icon-button:hover:not(:disabled){background:#28414a}.cost-line{display:flex;gap:20px;align-items:baseline;margin-top:23px;padding-top:15px;border-top:1px solid #30434b}.cost-line>.label{max-width:150px;flex:0 0 145px;font-size:8px;line-height:1.7}.cost-line p{margin:0;color:#9bafb4;font-size:11px;line-height:1.65}.storage-note{font-size:9px;color:#6f8a94;margin:12px 0 0}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0e1d278c;backdrop-filter:blur(3px);z-index:5}.overlay[hidden]{display:none}.overlay-card{width:min(355px,86%);text-align:center;background:#172a32f5;border:1px solid #4b6166;border-radius:12px;padding:28px 28px 22px;box-shadow:0 12px 55px #0005}.eyebrow{text-transform:uppercase;font-size:9px;letter-spacing:.15em;font-weight:600;color:var(--mint);line-height:1.6}h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:35px;letter-spacing:-1px;margin:12px 0}p{line-height:1.6}.overlay-card p{color:#b8cacc;font-size:13px;margin:12px 0}.color-legend{display:flex;justify-content:center;gap:20px;font-size:23px;margin:15px 0 20px}.amber{color:var(--amber)}.mint{color:var(--mint)}.violet{color:var(--violet)}.primary{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;background:var(--mint);color:#102b25;border:0;border-radius:5px;padding:13px 19px;font-weight:700;font-size:13px;box-shadow:0 3px 15px #71e5c014}.primary:hover{background:#97efd4}.primary:active{transform:translateY(1px)}.overlay-card small{display:block;color:#94adb3;font-size:10px;margin-top:13px}.result-score{font-family:'Manrope',system-ui,sans-serif;font-size:58px;font-weight:600;letter-spacing:-3px;line-height:1.2;color:var(--mint);margin:8px 0}.result-stats{display:flex;justify-content:center;gap:28px;margin:14px 0 22px}.result-stats b{display:block;font-size:20px;font-variant-numeric:tabular-nums}.result-stats span{font-size:9px;color:#91aaaf;text-transform:uppercase;letter-spacing:.08em}.new-best{color:var(--amber);font-size:10px;letter-spacing:.1em;text-transform:uppercase}.pause-title{margin-bottom:20px}.paused-caption{color:#afc2c4}dialog{width:min(520px,calc(100% - 30px));max-height:85svh;overflow-y:auto;background:#192e37;color:var(--text);border:1px solid #4a636a;border-radius:12px;padding:32px;box-shadow:0 20px 80px #0008}dialog::backdrop{background:#08151dd9;backdrop-filter:blur(4px)}dialog h2{font-size:34px}dialog h3{font-weight:600;font-size:13px;margin:24px 0 5px}dialog p,dialog li{font-size:13px;color:#b8cacc;line-height:1.7}dialog ol{padding-left:20px}dialog li{padding-left:5px;margin:17px 0}dialog b{color:var(--text)}dialog .primary{margin-top:24px}.dialog-close{position:absolute;top:13px;right:14px;width:34px;height:34px;font-size:25px;line-height:1;border:0;background:transparent;color:#aac1c6}.dialog-tip{border-left:2px solid #6c8e93;padding-left:14px}.keyboard-note{font-size:11px!important;color:#92adb5!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(min-width:700px) and (max-height:850px){.shell{max-width:700px;padding-top:16px}.title-row{margin:10px 0 12px}h1{font-size:42px}.hud{padding-top:10px;padding-bottom:10px}.stage{aspect-ratio:720/450}.cost-line{margin-top:16px}}
@media(max-width:600px){.shell{width:calc(100% - 24px);padding:16px 0 18px}.masthead{font-size:10px}.masthead>div{gap:14px}.text-button{font-size:10px}.playtest{font-size:8px}.title-row{margin:16px 0 15px}.title-row>div:first-child{display:block}h1{font-size:43px}.title-row p{font-size:11px;margin-top:4px}.edition{font-size:8px;letter-spacing:.02em}.hud{padding:12px 15px 10px;grid-template-columns:1.05fr 1.05fr .9fr 1fr}.hud strong{font-size:23px}.best-group strong{font-size:19px}.label{font-size:8px}.combo-meter{margin-left:6px;gap:2px}.combo-meter i{height:10px;width:3px}.stage{aspect-ratio:720/600}.junction{width:46px}.junction .key{display:none}.junction svg{width:48%}.gate-label{display:none}.source-label{font-size:6px;top:10%}.route-status{font-size:9px;left:15%;right:15%;top:6%}.stream-bar{padding:11px 12px;gap:8px;min-height:55px}.up-next{gap:10px}#queue{gap:8px}.queue-lane{font-size:7px}.queue-item{gap:4px}.queue-shape{font-size:13px}.chances{gap:5px;font-size:8px}#lives{gap:3px}#lives i{width:5px;height:5px}.below-board{align-items:flex-start;flex-direction:column;gap:11px}.below-board p{font-size:10px}.actions{width:100%;gap:8px}.icon-button{flex:1;padding:10px 9px;font-size:11px}.cost-line{display:block;margin-top:17px;padding-top:12px}.cost-line>.label{max-width:none;margin-bottom:7px}.cost-line p{font-size:10px}.overlay-card{padding:19px 19px 16px;width:83%;max-width:310px}.overlay-card h2{font-size:30px;margin:9px 0}.overlay-card p{font-size:11px;margin:9px 0}.overlay-card .eyebrow{font-size:8px}.overlay-card .color-legend{font-size:20px;margin:9px 0 13px}.overlay-card .primary{padding:11px 15px;font-size:12px}.overlay-card small{font-size:9px;margin-top:9px}.result-score{font-size:46px}.result-stats{margin:10px 0 15px}.result-stats b{font-size:17px}.result-stats span{font-size:8px}dialog{padding:27px 22px}}
@media(max-width:350px){.masthead i{margin:0 4px}.masthead>div{gap:10px}.edition{font-size:7px}.junction{width:44px}.hud{padding-left:12px;padding-right:12px}.overlay-card{padding:15px 17px}.overlay-card h2{font-size:27px}.title-row{margin:12px 0}.cost-line{margin-top:14px}}
#motion{z-index:3;pointer-events:none}.source-label,.gate-label,.route-status{z-index:4}.junctions{z-index:2}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}dialog::backdrop,.overlay{backdrop-filter:none}}

/* Keep the embedded height independent of the outer frame's current height. */
@media(min-width:700px){body.embedded .shell{max-width:700px;padding-top:16px}body.embedded .title-row{margin:10px 0 12px}body.embedded h1{font-size:42px}body.embedded .hud{padding-top:10px;padding-bottom:10px}body.embedded .stage{aspect-ratio:720/450}body.embedded .cost-line{margin-top:16px}}