:root{--green:#80c241;--ink:#1c2126;--paper:#10151ac7;--paper-line:#ffffff24;--text:#eef1f2;--text-dim:#aeb8bd;--ink-line:#10151a;--sticker:#fff;--sticker-ink:#16181a;--sticker-dim:#5c666d;--sticker-shadow:0 3px 0 #10151ad9;font-family:Avenir Next,Segoe UI,Hiragino Kaku Gothic ProN,Yu Gothic,Noto Sans JP,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:#10151a;height:100%;overflow:hidden}.app{position:fixed;inset:0}.app canvas{touch-action:none}.start-screen{z-index:30;background:#6cb032;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0;overflow:hidden}.start-board{background:var(--sticker);width:100%;max-width:520px;color:var(--sticker-ink);border:3px solid var(--ink-line);box-shadow:0 6px 0 var(--ink-line);border-radius:22px;padding:24px 28px 22px;position:relative;overflow:hidden}.logo{width:100%;max-width:400px;margin:4px auto 0;display:block}.start-tagline{text-align:center;color:#5c666d;margin-top:6px;font-size:13.5px;font-weight:600}.board-band{background:var(--green);border-top:3px solid var(--ink-line);border-bottom:3px solid var(--ink-line);color:#fff;letter-spacing:.04em;justify-content:space-between;align-items:center;margin:16px -28px 0;padding:6px 20px;font-size:13px;font-weight:700;display:flex}.start-text{text-align:center;color:#4a5158;max-width:400px;margin:18px auto 0;font-size:14px;line-height:1.65}.start-button{font:inherit;letter-spacing:.02em;color:var(--ink-line);background:var(--green);border:3px solid var(--ink-line);cursor:pointer;box-shadow:0 4px 0 var(--ink-line);border-radius:14px;margin:20px auto 0;padding:12px 44px;font-size:16px;font-weight:800;transition:transform .1s,box-shadow .1s,background-color .1s;display:block}.start-button:hover:not(:disabled){background:#8ecf51}.start-button:active:not(:disabled){box-shadow:0 1px 0 var(--ink-line);transform:translateY(3px)}.start-button:focus-visible{outline-offset:3px;outline:3px solid #2f5d0f}.start-button:disabled{opacity:.6;cursor:wait}.start-controls{text-align:left;border-top:2px dashed #d5dade;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 18px;margin-top:22px;padding-top:16px;list-style:none;display:grid}.start-controls li{align-items:center;gap:8px;min-width:0;display:flex}.start-keys{flex:none;gap:3px;display:inline-flex}.start-controls kbd{font:inherit;color:var(--sticker-ink);background:var(--sticker);border:2px solid var(--ink-line);white-space:nowrap;border-bottom-width:3px;border-radius:7px;padding:2px 6px;font-size:10.5px;font-weight:700;line-height:1.2}.start-action{color:#5c666d;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;overflow:hidden}.start-quality{border-top:2px dashed #d5dade;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;padding-top:12px;display:flex}.start-quality-label{color:#5c666d;font-size:12.5px;font-weight:700}.quality-select{font:inherit;color:var(--sticker-ink);background:var(--sticker);border:2px solid var(--ink-line);cursor:pointer;box-shadow:var(--sticker-shadow);border-radius:11px;padding:6px 10px;font-size:12.5px;font-weight:700}.quality-select:hover{background:#f1f3f5}.start-foot{letter-spacing:.03em;color:#868f95;justify-content:center;align-items:baseline;gap:7px;margin-top:16px;font-size:11.5px;display:flex}.start-foot strong{font-variant-numeric:tabular-nums;color:#16181a;font-size:13px}.lang-switch{background:var(--sticker);border:2px solid var(--ink-line);box-shadow:var(--sticker-shadow);border-radius:11px;gap:2px;padding:2px;display:inline-flex}.lang-option{font:inherit;color:var(--sticker-dim);cursor:pointer;background:0 0;border:none;border-radius:7px;padding:6px 9px;font-size:12px;font-weight:700;line-height:1.1;transition:color .12s,background-color .12s}.lang-option:hover{color:var(--sticker-ink)}.lang-option-active,.lang-option-active:hover{color:#122408;background:var(--green)}.lang-switch-board{position:absolute;top:12px;right:12px}.hud-top{z-index:20;pointer-events:none;align-items:stretch;gap:10px;display:flex;position:fixed;top:14px;left:14px;right:14px}.hud-clock,.hud-phase,.hud-station,.hud-occupancy{background:var(--sticker);border:2px solid var(--ink-line);color:var(--sticker-ink);box-shadow:var(--sticker-shadow);border-radius:12px;align-items:center;padding:8px 14px;display:flex}.hud-occupancy{flex-direction:column;align-items:flex-end;gap:2px;min-width:88px}.hud-occupancy-pct{font-variant-numeric:tabular-nums;font-size:16px;font-weight:700;line-height:1.1}.hud-occupancy-label{opacity:.85;text-transform:lowercase;font-size:11px}.hud-clock{font-variant-numeric:tabular-nums;font-size:18px;font-weight:600}.hud-station{flex-direction:column;align-items:flex-start;gap:2px;margin-right:auto}.hud-station-label{color:var(--sticker-dim);font-size:11px}.hud-station-name{font-size:16px;font-weight:600}.hud-jy{background:var(--green);color:#fff;border:2px solid var(--ink-line);border-radius:7px;margin-right:4px;padding:0 6px;font-size:12px;font-weight:700}.hud-kanji{color:var(--sticker-dim);margin-left:4px}.hud-phase{font-size:13px;font-weight:700}.hud-phase-dwell{color:#3f7413;border-color:#4d8a1f}.hud-phase-brake,.hud-phase-depart{color:#9a7b00}.hud-phase-emergency{color:#b3261e;border-color:#b3261e}.hud-emergency{z-index:20;font:inherit;color:#fff;border:2px solid var(--ink-line);cursor:pointer;box-shadow:var(--sticker-shadow);background:#c22a21;border-radius:11px;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .1s,background-color .1s;display:flex;position:fixed;bottom:72px;left:50%;transform:translate(-50%)}.hud-emergency:hover{background:#a91f17}.hud-emergency:active{transform:translate(-50%,2px);box-shadow:0 1px #10151ad9}.hud-emergency-dot{border:3px solid #fff;border-radius:50%;flex:none;width:13px;height:13px}.hud-reticle{z-index:15;pointer-events:none;background:#ffffff8c;border-radius:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;position:fixed;top:50%;left:50%;box-shadow:0 0 4px #00000080}.hud-bottom{z-index:20;align-items:center;gap:8px;display:flex;position:fixed;bottom:14px;right:14px}.hud-button{font:inherit;color:var(--sticker-ink);background:var(--sticker);border:2px solid var(--ink-line);cursor:pointer;box-shadow:var(--sticker-shadow);border-radius:11px;padding:8px 14px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .1s,background-color .1s}.hud-button:hover{background:#f1f3f5}.hud-button:active{transform:translateY(2px);box-shadow:0 1px #10151ad9}.hud-volume{width:90px;accent-color:var(--green)}.quality-select-hud{padding:7px 10px;font-size:13px}.joystick{border:1px solid var(--paper-line);z-index:25;touch-action:none;background:#ffffff12;border-radius:50%;width:128px;height:128px;position:fixed;bottom:26px;left:26px}.joystick-knob{background:#ffffff38;border:1px solid #ffffff4d;border-radius:50%;width:52px;height:52px;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%}.touch-sit{z-index:25;font:inherit;color:var(--sticker-ink);background:var(--sticker);border:2px solid var(--ink-line);border-radius:14px;padding:13px 20px;font-size:15px;font-weight:700;position:fixed;bottom:96px;right:24px;box-shadow:0 4px #10151ad9}@media (width<=720px){.hud-station-name{font-size:13px}.hud-clock{font-size:15px}.hud-occupancy{min-width:72px;padding:6px 10px}.hud-occupancy-pct{font-size:14px}.hud-occupancy-label{font-size:10px}.hud-emergency{border-radius:14px;padding:11px 16px;font-size:14px;bottom:156px;left:auto;right:24px;transform:none}.hud-emergency:active{transform:translateY(2px)}.hud-bottom{flex-wrap:wrap;justify-content:center;left:14px;right:14px}.hud-volume{width:70px}.joystick{bottom:64px}.lang-option{padding:6px 7px;font-size:11px}.start-board{padding:18px 20px 20px}.board-band{margin-left:-20px;margin-right:-20px}.start-text{font-size:13.5px}}@media (width<=460px){.start-controls{grid-template-columns:minmax(0,1fr);gap:7px}.lang-switch-board{top:10px;right:10px}}