:root{color-scheme:dark;--bg:#0b0c10;--panel:#111318;--muted:#93949e;--ink:#f5f4ed;--acid:#e8ff65;--line:#292b32;--green:#70ed89;--red:#f26781;--yellow:#f9dd66;--blue:#6fb9ff;--orange:#f7a265;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--acid);outline-offset:5px}button{color:inherit}button,fieldset{margin:0}button{border:0}button:disabled{opacity:.45}[hidden]{display:none!important}a{color:inherit;text-decoration:none}.app{max-width:1680px;margin:auto;padding:0 40px}.topbar{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{font-size:29px;font-weight:950;font-stretch:condensed;letter-spacing:-1.6px;display:flex;align-items:center}.brand svg{width:25px;height:33px;fill:var(--acid);margin-right:11px}.brand-mark{font-size:11px;align-self:flex-start;margin:9px 0 0 4px;letter-spacing:0}.edition{display:flex;align-items:center;gap:10px;letter-spacing:2px;font-size:12px;font-weight:700;color:#c6c6cb}.live-dot{height:6px;width:6px;background:var(--acid);border-radius:100%}.slash{color:#545661;margin:0 8px}.top-actions{display:flex;gap:12px}.quiet{background:transparent;border:1px solid var(--line);border-radius:5px;padding:10px 12px;font-size:14px;color:#cbcbd0}.quiet:hover:not(:disabled){border-color:#72757f}.arena{display:grid;grid-template-columns:250px minmax(320px,1fr) 210px;gap:24px;min-height:660px;height:calc(100svh - 164px);max-height:910px;position:relative}.setlist{padding-top:43px;z-index:2}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700;color:var(--muted);display:flex;gap:9px;align-items:center}.tiny-line{width:20px;height:2px;background:var(--acid)}.track-number{font-family:monospace;margin-top:38px;color:var(--acid);font-size:17px}.track-number span{font-size:11px;color:var(--muted);letter-spacing:1px;margin-left:9px}h1{font-size:clamp(39px,3.8vw,60px);font-weight:950;line-height:.93;letter-spacing:-2.7px;margin:18px 0 13px;transform:skew(-5deg);transform-origin:left}h1 span{color:var(--acid)}.artist{font-size:14px;color:#aeafb7;margin-bottom:19px}.track-tags{display:flex;gap:7px;flex-wrap:wrap}.track-tags span{font-family:monospace;font-size:11px;border:1px solid #34353d;padding:5px 7px;color:#b9bbc3;border-radius:3px}.divider{height:1px;background:var(--line);margin:25px 0}fieldset{border:0;padding:0;margin-bottom:21px;min-width:0}legend{padding:0;font-size:12px;font-weight:700;letter-spacing:1.5px;color:#c1c2c8;margin-bottom:11px}.choice-row{display:flex;gap:6px}.choice-row label{flex:1;cursor:pointer;position:relative}.choice-row input{position:absolute;opacity:0;width:1px;height:1px}.choice-row label>span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px solid #34363f;border-radius:4px;padding:12px 3px;font-size:13px;color:#c0c1c9;background:#12141a;min-height:42px}.choice-row small{font-size:9px;letter-spacing:.9px;color:#9da0aa}.choice-row input:checked+span{border-color:var(--acid);color:var(--acid);background:#e8ff6509}.choice-row input:checked+span small{color:#d1dc9a}.choice-row input:focus-visible+span{outline:2px solid white;outline-offset:3px}fieldset:disabled{opacity:.5}.mode-hint{font-size:13px;line-height:1.5;color:#a8abb4;min-height:39px;margin:-6px 0 17px}.play-button{background:var(--acid);color:#12150a;display:flex;justify-content:space-between;align-items:center;width:100%;min-height:56px;font-size:14px;letter-spacing:1px;font-weight:800;padding:15px 18px;border-radius:4px;box-shadow:0 4px 26px #dbff4412;transition:filter .15s,transform .15s}.play-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.play-button:active{transform:translateY(1px)}.play-triangle{font-size:12px}.button-arrow{font-size:22px}.start-hint{font-size:11px;color:#9698a3;text-align:center;margin:11px 0 22px}.track-progress{margin-top:18px}.time-row{display:flex;justify-content:space-between;color:#a8aab4;font-family:monospace;font-size:11px}.time-row span:nth-child(2){font-family:Arial,sans-serif;letter-spacing:1px;font-size:10px}.progress-rail{height:3px;background:#2c2e37;margin-top:11px}.progress-rail>div{width:0;height:100%;background:var(--acid)}.session-note{font-size:10px;line-height:1.8;letter-spacing:2px;color:#696c77;margin-top:27px}.stage{position:relative;min-width:0;overflow:hidden;background:radial-gradient(ellipse at 50% 57%,#49504213,transparent 65%)}.stage::before{content:"";position:absolute;width:100%;height:240px;top:12%;background:radial-gradient(ellipse,#c8e6610c,transparent 65%);pointer-events:none}.stage-top{position:absolute;top:40px;left:5%;right:5%;display:flex;justify-content:space-between;z-index:2;align-items:center;font-size:11px;letter-spacing:1.5px}.stage-status{border:1px solid #474e38;background:#161b12;padding:8px 11px;color:#cedb9d;border-radius:3px;font-size:10px}.stage-sub{color:#838693}canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.announcement{position:absolute;left:0;right:0;top:28%;text-align:center;pointer-events:none;transition:opacity .25s;z-index:3}.announcement span{display:block;font-size:10px;letter-spacing:2.6px;color:#aeb99b;margin-bottom:14px}.announcement strong{font-size:clamp(32px,4vw,60px);font-weight:950;letter-spacing:-2px;transform:skew(-5deg);display:block;text-shadow:0 0 30px #080a0d}.announcement.countdown strong{font-size:90px;color:var(--acid)}.announcement.invisible{opacity:0}.judgment{position:absolute;top:59%;width:100%;text-align:center;font-weight:900;letter-spacing:3px;font-size:26px;color:var(--acid);pointer-events:none;opacity:0;text-shadow:0 2px 15px #000}.judgment.show{animation:judge .42s ease-out}.judgment.good{color:#fff}.judgment.miss{color:#f78090}.streak-callout{position:absolute;top:52%;text-align:center;width:100%;font-size:13px;font-weight:700;letter-spacing:2px;color:#e4e6e0;opacity:0;pointer-events:none}.streak-callout.show{animation:judge 1.1s ease-out}.fret-controls{position:absolute;bottom:12%;left:7%;right:7%;height:58px;display:flex;gap:8px;z-index:4;touch-action:none}.fret{--fret:var(--green);position:relative;width:20%;height:100%;border-radius:50%;border:2px solid var(--fret);background:linear-gradient(#20242c,#101218);box-shadow:0 0 12px color-mix(in srgb,var(--fret) 12%,transparent),inset 0 -6px 0 #0005;color:var(--fret);font-size:17px;font-family:monospace;font-weight:700;transform:perspective(170px) rotateX(30deg);touch-action:none;user-select:none;transition:filter .08s}.fret::before{content:"";position:absolute;inset:5px;border:1px solid color-mix(in srgb,var(--fret) 40%,transparent);border-radius:100%}.fret.active{background:var(--fret);color:#111;box-shadow:0 0 25px color-mix(in srgb,var(--fret) 50%,transparent)}.fret.disabled-lane{opacity:.2}.red{--fret:var(--red)}.yellow{--fret:var(--yellow)}.blue{--fret:var(--blue)}.orange{--fret:var(--orange)}.hit-line-label{position:absolute;bottom:7%;text-align:center;width:100%;font-size:10px;letter-spacing:2px;color:#838891}.touch-strum{position:absolute;bottom:1%;left:25%;width:50%;padding:9px;background:#272a32;border:1px solid #656974;border-radius:4px;font-size:13px;touch-action:none;z-index:5}.scoreboard{padding-top:47px;z-index:2}.score-label{font-size:11px;font-weight:700;letter-spacing:1.7px;color:#91959f}.score-value{font-size:39px;letter-spacing:-1px;font-weight:750;font-variant-numeric:tabular-nums;margin-top:12px;font-family:monospace}.score-divider{height:1px;background:var(--line);margin:23px 0 27px}.streak-wrap{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.streak-value{font-size:56px;letter-spacing:-2px;font-weight:750;margin-top:6px}.multiplier-ring{border:4px solid #30352a;border-right-color:#e8ff65;border-radius:50%;width:72px;height:72px;display:grid;place-items:center;background:#e8ff6505}.multiplier-ring>span{font-size:29px;font-weight:700}.multiplier-ring small{font-size:18px;margin-left:2px;color:#aebda0}.accuracy-row{display:flex;justify-content:space-between;align-items:center;margin:16px 0;font-size:11px;letter-spacing:.7px;color:#9296a2}.accuracy-row strong{font-size:17px;letter-spacing:0;color:#ededeb;font-family:monospace}.crowd-block{margin-top:34px}.meter-title{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.6px;color:#8c929e}.meter-title span:last-child{color:var(--acid)}.crowd-rail{height:7px;background:#242830;border-radius:2px;margin-top:13px;overflow:hidden}.crowd-rail>div{background:linear-gradient(90deg,#578978,var(--acid));width:55%;height:100%;transition:width .2s}.meter-ticks{display:flex;justify-content:space-between;color:#747985;font-size:9px;letter-spacing:1px;margin-top:8px}.overdrive-block{padding:22px 17px 17px;margin-top:35px;border:1px solid #363c2c;border-radius:5px;background:linear-gradient(125deg,#e8ff6505,transparent)}.overdrive-title{display:flex;align-items:center;font-size:13px;font-weight:750;font-style:italic;letter-spacing:1px;color:#d7e4af}.overdrive-title svg{height:20px;width:15px;fill:var(--acid);margin-right:7px}.drive-bars{display:flex;gap:4px;height:18px;margin-top:20px}.drive-bars i{flex:1;background:#2e3427;border-radius:1px;transform:skew(-12deg)}.drive-bars i.filled{background:var(--acid);box-shadow:0 0 8px #e8ff6528}.overdrive-block p{font-size:12px;line-height:1.65;color:#989f90;margin:14px 0}.overdrive-block button{background:#1c2117;border:1px solid #596143;border-radius:3px;font-size:10px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:5px;padding:9px 7px;color:var(--acid)}kbd{display:inline-block;border:1px solid #40444e;background:#171a20;border-radius:3px;font-size:10px;color:#bfc2cc;padding:4px 5px;line-height:1;min-width:21px;text-align:center;font-family:monospace}.personal-best{display:flex;justify-content:space-between;margin-top:27px;font-size:10px;letter-spacing:.8px;color:#888d98}.personal-best strong{font-family:monospace;color:#b4b9c1;font-size:13px}.bottom-bar{display:flex;align-items:center;justify-content:space-between;min-height:70px;border-top:1px solid var(--line);gap:20px}.control-guide{display:flex;gap:22px;align-items:center;color:#9499a5;font-size:11px}.control-guide>span{display:flex;align-items:center;gap:5px}.volume-control{display:flex;align-items:center;gap:11px;color:#9399a5;font-size:10px;letter-spacing:1px}.volume-control input{width:75px;accent-color:var(--acid);height:3px;cursor:pointer}.volume-control button{background:transparent;color:#c0c8ae;font-size:21px;padding:4px}.status-message{color:#ffd99c;font-size:14px;line-height:1.5;text-align:center}.status-message:not(:empty){padding:12px}.game-dialog{color:var(--ink);width:min(510px,calc(100% - 32px));max-height:90svh;border:1px solid #535b3c;background:#12151b;border-radius:8px;padding:34px;box-shadow:0 20px 100px #000a}.game-dialog::backdrop{background:#05070be3;backdrop-filter:blur(8px)}.close-dialog{position:absolute;right:14px;top:10px;background:none;font-size:30px;color:#a9aeb8}.game-dialog h2{font-size:39px;letter-spacing:-1.4px;line-height:1.05;margin:20px 0}.game-dialog p{color:#aeb4bf;font-size:14px;line-height:1.65}.instructions{list-style:none;counter-reset:steps;padding:0;margin:25px 0}.instructions li{counter-increment:steps;position:relative;padding-left:40px;margin-bottom:20px}.instructions li:before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:1px;color:var(--acid);font-family:monospace;font-size:14px}.instructions strong{display:block;font-size:16px;margin-bottom:5px}.instructions span{display:block;font-size:14px;line-height:1.5;color:#aeb4bf}.instructions b{color:#e1e6d6}.game-dialog .help-footnote{font-size:12px;margin:20px 0}.results{text-align:center}.results .eyebrow{justify-content:center}.result-stars{letter-spacing:7px;font-size:33px;color:var(--acid);margin:22px 0}.result-stars span{color:#393e42}.result-total{font-size:55px;font-family:monospace;font-weight:750;letter-spacing:-2px}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.result-grid strong{font-size:28px;display:block;font-family:monospace}.result-grid span{font-size:10px;letter-spacing:.6px;color:#a1a8b4;display:block;margin-top:7px}.new-best{color:var(--acid);font-size:12px;letter-spacing:2px;margin:19px}.back-button{background:none;color:#a4acb7;font-size:14px;margin-top:18px;padding:8px}.is-overdrive .stage{background:radial-gradient(ellipse at 50% 65%,#a0c52726,transparent 68%)}.is-overdrive .overdrive-block{border-color:var(--acid);box-shadow:0 0 25px #e8ff6510}.is-overdrive .multiplier-ring{border-color:var(--acid)}
@keyframes judge{0%{opacity:1;transform:translateY(5px) scale(1.04)}25%{opacity:1}100%{opacity:0;transform:translateY(-18px) scale(1)}}
@media(min-height:950px) and (min-width:1050px){.setlist,.scoreboard{padding-top:65px}.divider{margin:32px 0}.track-number{margin-top:50px}.mode-hint{margin-bottom:24px}.score-divider{margin:33px 0}.crowd-block{margin-top:43px}.overdrive-block{margin-top:45px}}
@media(max-width:1150px){.app{padding:0 24px}.arena{grid-template-columns:215px minmax(280px,1fr) 175px;gap:16px}.score-value{font-size:32px}.overdrive-block{padding:17px 11px}.edition{display:none}.track-tags{gap:4px}.track-tags span{font-size:10px;padding:4px}.track-number span{font-size:9px}.choice-row label>span{font-size:12px}.choice-row small{font-size:8px}.control-guide{gap:14px}.score-label{font-size:10px}.multiplier-ring{height:62px;width:62px}.fret-controls{gap:5px;height:50px}}
@media(max-width:850px){.app{padding:0 16px}.topbar{height:74px}.brand{font-size:26px}.top-actions{gap:7px}.quiet{padding:8px 10px}.top-actions .quiet span:not(#pauseIcon){display:none}.arena{grid-template-columns:190px minmax(280px,1fr);height:calc(100svh - 200px);min-height:625px;gap:10px}.scoreboard{grid-column:1/-1;grid-row:2;display:flex;align-items:center;padding:16px 0;gap:20px;height:90px;border-top:1px solid var(--line)}.scoreboard>.score-label{max-width:50px;font-size:9px;line-height:1.6}.score-value{font-size:28px;margin:0 -6px 0 -10px}.score-divider,.crowd-block,.personal-best,.accuracy-row,.overdrive-title,.drive-bars,.overdrive-block p{display:none}.streak-wrap{margin:0;gap:15px}.streak-value{font-size:28px;margin-top:4px}.streak-wrap .score-label{font-size:9px}.multiplier-ring{height:46px;width:46px;border-width:3px}.multiplier-ring>span{font-size:20px}.overdrive-block{margin:0 0 0 auto;padding:0;border:0;min-width:150px}.overdrive-block button{padding:13px 10px}.arena{margin-bottom:90px}.bottom-bar{min-height:64px}.control-guide{gap:12px}.control-guide>span:last-child{display:none}.volume-control span{display:none}.setlist{padding-top:33px}.track-number{margin-top:30px}.stage-top{top:32px}.stage-sub{display:none}.track-number span{font-size:8px;margin-left:6px}.session-note{display:none}.fret{font-size:15px}.fret-controls{gap:5px;height:50px}}
@media(max-width:560px){.app{padding:0 12px}.topbar{height:63px}.brand{font-size:24px}.brand svg{width:20px;height:28px;margin-right:7px}.brand-mark{margin-top:6px}.quiet{font-size:14px}.arena{display:grid;grid-template-columns:1fr;height:auto;min-height:0;gap:0;margin-bottom:0}.setlist{padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.setlist>.eyebrow{grid-column:1/-1;font-size:9px;margin-bottom:13px}.track-number,.divider,.session-note,.start-hint{display:none}h1{grid-column:1;grid-row:2/4;font-size:37px;letter-spacing:-1.5px;line-height:.92;margin:0 0 13px}.artist{grid-column:2;grid-row:2;font-size:12px;align-self:end;margin:0 0 9px}.track-tags{grid-column:2;grid-row:3;align-self:start}.track-tags span{font-size:8px;padding:4px}.setlist fieldset{margin:8px 0 9px}legend{font-size:10px;margin-bottom:8px}.choice-row{gap:4px}.choice-row label>span{min-height:38px;font-size:11px;padding:8px 3px}.choice-row small{display:none}.mode-hint{grid-column:1/-1;min-height:0;margin:0 0 12px;font-size:12px}.play-button{min-height:47px;padding:11px 15px;font-size:12px}.setlist .play-button{grid-column:1}.track-progress{grid-column:2;align-self:center;margin:0}.time-row{font-size:10px;flex-wrap:wrap;gap:6px}.time-row span:nth-child(2){order:3;width:100%;text-align:center;font-size:8px}.stage{height:440px;margin-top:5px;grid-row:2}.stage-top{top:16px;left:2%;right:2%}.stage-status{font-size:8px;padding:6px 8px}.stage-sub{display:block;font-size:8px}.announcement{top:25%}.announcement strong{font-size:38px}.announcement span{font-size:8px}.fret-controls{height:43px;bottom:12%;gap:6px}.hit-line-label{font-size:8px;letter-spacing:1.5px;bottom:6.5%}.scoreboard{grid-row:3;gap:10px;height:75px;padding:12px 0}.scoreboard>.score-label{font-size:8px;max-width:35px}.score-value{font-size:23px;letter-spacing:-.8px;margin:0}.streak-wrap{gap:9px}.streak-value{font-size:23px}.streak-wrap .score-label{font-size:8px;letter-spacing:.6px}.multiplier-ring{width:36px;height:36px;border-width:2px}.multiplier-ring>span{font-size:16px}.multiplier-ring small{font-size:12px}.overdrive-block{min-width:0;flex:1;max-width:132px}.overdrive-block button{padding:10px 6px;font-size:8px;gap:4px}.overdrive-block kbd{font-size:8px;padding:4px}.bottom-bar{min-height:57px;gap:6px}.control-guide{font-size:10px;gap:8px}.control-guide>span:nth-last-child(2){display:none}kbd{font-size:9px;min-width:17px;padding:4px}.volume-control{gap:7px}.volume-control input{width:52px}.game-dialog{padding:27px 23px}.game-dialog h2{font-size:32px}.result-total{font-size:46px}.result-grid strong{font-size:24px}.result-stars{font-size:28px}.touch-strum{padding:7px;bottom:0;font-size:10px}.playing .setlist fieldset,.playing .mode-hint{display:none}.playing .setlist{padding-top:15px}.playing .setlist .play-button{margin-top:5px;min-height:39px}.playing .stage{height:max(390px,calc(100svh - 338px))}.playing .setlist>.eyebrow{display:none}.playing h1{font-size:29px}.playing .artist{font-size:11px}.playing .track-tags span{font-size:8px}.control-guide #strumGuide{display:none}}
@media(prefers-reduced-motion:reduce){.judgment.show,.streak-callout.show{animation:none;opacity:1}.play-button,.announcement,.fret{transition:none}}
/* Keep the full control stack clear of the footer at short desktop heights. */
@media(min-width:851px){.arena{min-height:745px}.setlist{padding-top:32px}.track-number{margin-top:24px}h1{font-size:50px}.artist{margin-top:0;margin-bottom:15px}.divider{margin:18px 0}fieldset{margin-bottom:16px}.start-hint{margin-bottom:12px}.track-progress{margin-top:14px}}
.artist,.mode-hint,.choice-row label>span{font-size:14px}.track-tags span,.start-hint,.time-row,.time-row span:nth-child(2),.score-label,.accuracy-row,.meter-title,.meter-ticks,.drive-bars+p,.personal-best,.stage-status,.stage-sub,.hit-line-label,.control-guide,.volume-control,.overdrive-block button,.result-grid span{font-size:12px;letter-spacing:.4px}.choice-row small{font-size:12px;letter-spacing:0}.difficulty-row label>span{font-size:13px}.difficulty-row small{font-size:10px}.time-row{gap:6px}.mode-hint{min-height:42px}.scoreboard .meter-title{flex-wrap:wrap;gap:7px}.personal-best{gap:10px;line-height:1.4}
@media(max-width:1150px) and (min-width:851px){.difficulty-row{gap:4px}.difficulty-row label>span{font-size:12px}.track-tags span{font-size:11px}.overdrive-block button{flex-wrap:wrap;justify-content:center;gap:8px}.arena{min-height:770px}.time-row span:nth-child(2){font-size:10px}}
@media(max-width:850px) and (min-width:561px){.arena{min-height:725px}.choice-row label>span{font-size:12px}.time-row{flex-wrap:wrap}.time-row span:nth-child(2){order:3;width:100%;text-align:center}.track-tags span{font-size:11px}.scoreboard>.score-label{max-width:65px}.overdrive-block button{font-size:11px}}
@media(max-width:560px){.artist{font-size:12px}.track-tags span{font-size:10px}.mode-hint{font-size:13px;min-height:0}.choice-row label>span{font-size:12px}.time-row{font-size:12px}.time-row span:nth-child(2){font-size:10px}.stage-status,.stage-sub,.hit-line-label{font-size:10px}.scoreboard>.score-label{display:none}.streak-wrap .score-label{font-size:10px}.score-value{font-size:24px}.overdrive-block button{font-size:10px;flex-wrap:wrap;justify-content:center;padding:8px 4px}.overdrive-block kbd{display:none}.control-guide{font-size:12px;gap:6px}.volume-control{font-size:12px}.setlist .play-button{font-size:12px}.stage{height:440px}.result-grid span{font-size:11px}}

/* Instrument choices stay beside the chart on every screen size. */
.stage-top{gap:10px;flex-wrap:wrap;align-items:center;z-index:5;left:3%;right:3%}
.instrument-picker{display:flex;gap:4px;border:1px solid #383e33;border-radius:5px;padding:4px;margin:0;background:#10150f;min-width:0;letter-spacing:0}
.instrument-picker label{position:relative;cursor:pointer}
.instrument-picker input{position:absolute;opacity:0;width:1px;height:1px}
.instrument-picker label>span{display:block;border-radius:3px;padding:9px 12px;font-size:14px;font-weight:700;color:#aeb6a2}
.instrument-picker input:checked+span{background:var(--acid);color:#15190c}
.instrument-picker input:focus-visible+span{outline:2px solid white;outline-offset:2px}
.instrument-picker:disabled{opacity:.7}.instrument-picker:disabled label{cursor:default}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.drum-labels{position:absolute;bottom:8%;left:7%;right:7%;display:flex;gap:8px;text-align:center;pointer-events:none;color:#c8cfba;font-size:12px}
.drum-labels span{width:20%}.drum-labels span.disabled-lane{opacity:.3}

.is-drums .hit-line-label{bottom:4%}
@media(max-width:560px){.stage-top{top:12px;left:2%;right:2%}.instrument-picker{padding:3px}.instrument-picker label>span{padding:7px 10px}.drum-labels{gap:6px}.is-drums .hit-line-label{bottom:3%}}

/* Five round drum receptors, ordered to match the reference highway. */
.is-drums .fret{border-radius:50%;border:3px solid var(--fret);background:radial-gradient(ellipse at 50% 42%,#232029 0%,#08080c 62%);transform:perspective(170px) rotateX(48deg);box-shadow:0 0 9px color-mix(in srgb,var(--fret) 45%,transparent),inset 0 0 0 2px #e4e4d966,inset 0 0 10px color-mix(in srgb,var(--fret) 35%,transparent);font-size:14px;color:#d5d1cf}
.is-drums .fret:before{inset:6px;border-radius:50%;border-color:var(--fret);opacity:.7}
.is-drums .fret.active{background:radial-gradient(ellipse,#fff2bc,var(--fret));box-shadow:0 0 24px var(--fret);color:#111}
.is-drums .drum-labels{bottom:auto;top:89%;align-items:flex-start;line-height:1.2;gap:8px}
.is-drums .hit-line-label{display:none}
.kick-button{position:absolute;bottom:0;left:12%;right:12%;width:76%;min-height:44px;padding:7px 10px;border-radius:4px;border:1px solid #bf8fe9;background:linear-gradient(#23162f,#110d17);color:#dfc4f5;font-size:12px;letter-spacing:.8px;z-index:4;touch-action:none;user-select:none}
.kick-button.active{background:#c696ff;color:#1b082a;box-shadow:0 0 18px #c696ff77}
.is-drums .stage{background:radial-gradient(ellipse at 50% 80%,#bf622b12,transparent 65%)}
@media(max-width:560px){.is-drums .drum-labels{font-size:12px;gap:6px;top:88.5%}.kick-button{bottom:0;min-height:30px;padding:5px 8px}.is-drums .fret{font-size:12px}.is-drums .control-guide>span:first-child kbd{display:none}.is-drums .control-guide{flex-wrap:wrap}.is-drums #kickGuide{display:flex}.is-drums .control-guide>span:last-child{display:none}}

/* The live concert sits behind the readable foreground highway. */
#performance{z-index:0;pointer-events:none}#highway{z-index:1}.stage{isolation:isolate;border-left:1px solid #e4eac80d;border-right:1px solid #e4eac80d}.stage::before{display:none}.stage-top{z-index:5}.stage-status{background:#11180de8}.instrument-picker{background:#10150fed}.announcement{top:40%;z-index:3}.judgment{z-index:3;top:64%}.streak-callout{z-index:3;top:59%}.drum-labels,.hit-line-label{z-index:4}.fret-controls{z-index:4}.kick-button{z-index:4}.stage-top{top:20px}.stage-status,.instrument-picker{box-shadow:0 2px 12px #0005}
@media(max-width:560px){.stage-top{top:12px}.announcement{top:41%}.announcement strong{font-size:32px}.announcement span{font-size:9px}.judgment{top:63%;font-size:22px}.streak-callout{top:57%;font-size:12px}}

/* Upload a personal song and make its playable charts in place. */
.auto-chart{margin-top:20px;padding:14px;border:1px solid #414638;border-radius:6px;background:#e8ff6505;min-width:0}
.auto-chart-heading{font-size:12px;font-weight:750;letter-spacing:1.2px;color:var(--acid);margin-bottom:10px}
.upload-button{width:100%;min-height:42px;padding:10px;border-radius:4px;border:1px solid #70794c;background:#202719;color:#edf5d6;font-size:14px;font-weight:700}
.upload-button:hover:not(:disabled){border-color:var(--acid);background:#2a341f}
.auto-chart p{font-size:14px;line-height:1.45;margin:10px 0 0;color:#b8c0ae}
.auto-chart .upload-limits{font-size:12px;color:#929a9f}.auto-chart #chartStatus:empty{display:none}.auto-chart #chartStatus.error{color:#ffb49e}
.text-button{display:inline-block;background:none;padding:7px 0;font-size:14px;line-height:1.4;color:var(--acid);text-align:left;text-decoration:underline;text-underline-offset:3px}
#demoButton{margin-top:5px}#uploadProgress{margin-top:10px;display:flex;align-items:center;gap:12px}#chartProgress{min-width:0;width:100%;height:7px;accent-color:var(--acid)}
#trackTitle.custom-title{font-size:clamp(28px,2.7vw,42px);line-height:1.05;letter-spacing:-1px;overflow-wrap:anywhere}
.auto-chart-busy #playButton{opacity:.45}
@media(min-width:851px){.setlist{min-height:0;overflow-y:auto;padding-right:8px;padding-bottom:26px;scrollbar-width:thin;scrollbar-color:#414638 transparent}.stage{min-height:0}}
@media(min-width:561px) and (max-width:850px){.arena{height:calc(100svh - 140px);min-height:800px;grid-template-rows:minmax(0,1fr) 90px;margin-bottom:0;max-height:none}.setlist{min-height:0;overflow-y:auto;padding-right:6px;padding-bottom:25px;scrollbar-width:thin}.stage{min-height:0}}
@media(max-width:560px){.auto-chart{grid-column:1/-1;grid-row:4;margin:0 0 8px;padding:12px}.auto-chart-heading{margin-bottom:8px}.auto-chart .upload-limits{line-height:1.45}.setlist #difficultyGroup{grid-column:1}.setlist #modeGroup{grid-column:2}.playing .auto-chart{display:none}.playing.auto-chart-busy .auto-chart{display:block}#trackTitle.custom-title{font-size:28px}.auto-chart p{font-size:14px}}
.chart-preview{margin-top:12px;padding-top:10px;border-top:1px solid #414638}.chart-preview label{display:flex;justify-content:space-between;font-size:14px;color:#d0d8c8;margin-top:9px}.chart-preview input{width:100%;margin:12px 0;accent-color:var(--acid)}.chart-preview canvas{display:block;width:100%;height:58px;margin-top:10px;background:#090d12;border-radius:3px}.chart-preview p{font-size:12px}.previewing .auto-chart{display:block}.previewing .scoreboard{opacity:.5}
#chartTargetGroup{margin:12px 0}#chartTargetGroup legend{font-size:12px;letter-spacing:.5px}#chartTargetGroup .choice-row span{font-size:14px;min-height:40px}.auto-chart-busy #chartTargetGroup{display:block}
.chart-preview #chartMapping{font-size:14px}

/* The overview belongs to the setup panel, not the stage's canvas layer. */
.chart-preview canvas{position:static;inset:auto}
.mobile-back,.mobile-play,.mobile-tip{display:none}
.game-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}.game-tools button{min-height:44px;font-size:14px;padding:9px 6px}
.song-setlist{margin:20px 0;border-top:1px solid var(--line);padding-top:17px;min-width:0}.song-setlist-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px}.song-setlist-heading h2{font-size:12px;letter-spacing:1.7px;margin:0;color:#e9efdf}.song-setlist-heading>span{font-size:12px;color:#a4ae9c;white-space:nowrap}
.setlist-add{margin-bottom:12px;min-height:48px;width:100%}#setlistAddStatus{font-size:13px;line-height:1.5;color:#dce9c3;margin:0 0 12px;overflow-wrap:anywhere}#setlistAddStatus:empty,.form-error:empty{display:none}#setlistAddStatus.error,.form-error{color:#ffb49e}#setlistUploadProgress{margin-bottom:14px}#setlistChartProgress{width:100%;accent-color:var(--acid)}#setlistSaveActions>button{min-width:90px}.tools-dialog select:focus-visible{outline:2px solid var(--acid);outline-offset:3px}
.setlist-search{display:block;width:100%;min-height:44px;padding:10px 12px;border:1px solid #424b38;border-radius:5px;background:#11150f;color:#f5f4ed;font:inherit;font-size:16px;margin-bottom:9px}.setlist-search::placeholder{color:#a4ae9c}.setlist-entries{display:grid;gap:7px;max-height:245px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.setlist-track{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 8px;width:100%;min-height:68px;padding:11px 12px;text-align:left;border:1px solid #38412f;border-radius:5px;background:#171c14;color:#f5f4ed;cursor:pointer;font:inherit}.setlist-track strong{grid-column:1/-1;font-size:15px;line-height:1.3;overflow-wrap:anywhere}.setlist-track-info{font-size:12px;line-height:1.5;color:#b9c5aa}.setlist-track-badge{font-size:9px;letter-spacing:.5px;align-self:center;color:#a4ae9c}.setlist-track.selected{background:#253019;border-color:#8baf42;box-shadow:inset 3px 0 0 var(--acid)}.setlist-track.selected .setlist-track-badge{color:var(--acid)}.setlist-track:hover:not(:disabled){border-color:var(--acid)}.setlist-track:disabled{cursor:default;opacity:.6}.setlist-track:focus-visible,.setlist-search:focus-visible{outline:2px solid var(--acid);outline-offset:-2px}
#setlistStatus,.setlist-hint{font-size:12px;line-height:1.5;color:#b9c5aa;margin:9px 0 0}#setlistStatus:empty{display:none}
.highway-speed{display:grid;grid-template-columns:1fr auto;gap:6px;margin:14px 0;font-size:14px;color:#bbc4b0}.highway-speed input{grid-column:1/-1;width:100%;height:30px;accent-color:var(--acid)}
.save-status{font-size:14px;line-height:1.5;color:#c9d5b8;padding:8px 0}.save-status:empty,.mobile-session .save-status{display:none}
.tools-dialog{width:min(580px,calc(100% - 24px))}.tools-dialog p{font-size:16px;line-height:1.5}.tools-dialog .secondary{font-size:14px;color:#a4ae9c}
.tool-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.tool-actions>button{flex:1;min-width:120px;min-height:44px;font-size:14px}.tool-actions .play-button{width:auto}
.song-list{display:grid;gap:12px;margin-top:18px}.saved-song{padding:15px;border:1px solid #38412f;border-radius:6px;background:#171c14}.saved-song strong{display:block;font-size:18px;overflow-wrap:anywhere}.saved-song p{font-size:14px;margin:8px 0}.saved-song .tool-actions{margin-bottom:0}.saved-song .tool-actions button{min-width:70px}
.practice-range{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tools-dialog label{display:block;font-size:14px;color:#dae1d0;line-height:1.5}
.tools-dialog input[type=number],.tools-dialog select{display:block;width:100%;min-height:48px;border:1px solid #586445;border-radius:4px;background:#0b110d;color:#f5f4ed;padding:10px;font:inherit;font-size:16px;margin-top:8px}
.select-label{margin-top:18px}.tools-dialog input[type=range]{width:100%;height:36px;accent-color:var(--acid)}
.tools-dialog input[type=file]{display:block;width:100%;min-width:0;margin:8px 0 18px;color:#dce3d3;font-size:14px}.tools-dialog input[type=file]::file-selector-button{min-height:44px;margin-right:10px;border:1px solid #586445;border-radius:4px;background:#202717;color:#eff8da;padding:8px 12px;font:inherit}.chart-export{border-top:1px solid #38412f;margin-top:24px;padding-top:12px}.chart-export h3{font-size:20px}#chartFileStatus{white-space:pre-line;overflow-wrap:anywhere}#chartFilesDialog button:disabled{opacity:.45;cursor:default}
.calibration-pad{display:block;width:100%;min-height:110px;margin:20px 0;border:2px solid var(--acid);border-radius:12px;color:var(--acid);background:#263019;font-size:20px;font-weight:750;touch-action:none;user-select:none;-webkit-touch-callout:none}.calibration-pad:active:not(:disabled){background:var(--acid);color:#182008}
#timingOffsetValue{float:right;font-family:monospace}#libraryStatus,#offlineStatus,#calibrationStatus,#practiceStatus{color:#d5e6b5}
.practicing .stage-status{border-color:#bb92dd;color:#dbbbff}.practicing .personal-best{visibility:hidden}

/* Touch play uses the visible viewport in both orientations. */
@media(max-width:850px),(pointer:coarse) and (max-width:1180px){
  .app{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .topbar{height:64px}.edition{display:none}.quiet{min-height:44px;min-width:44px}
  .arena{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;height:auto;min-height:0;max-height:none;margin-bottom:0;gap:0}
  .setlist{display:block;padding:20px 0;overflow:visible}.setlist>.eyebrow{margin-bottom:16px}
  .track-number,.divider{display:none}.setlist h1{margin:0 0 12px;font-size:38px}.setlist .artist{margin-bottom:12px}
  .track-tags{margin-bottom:18px}.track-tags span{font-size:12px}.auto-chart{margin:16px 0}
  .setlist fieldset{margin:16px 0}.choice-row label>span,#chartTargetGroup .choice-row span{min-height:48px;font-size:14px}
  .instrument-picker label>span{min-height:44px;display:flex;align-items:center}
  .mode-hint{min-height:0;font-size:14px;margin:8px 0 12px}
  .mobile-tip{display:block;font-size:14px;line-height:1.5;color:#c5cbb9;margin:12px 0 16px}
  .setlist .play-button{min-height:52px;font-size:14px}.track-progress{margin-top:18px}
  .upload-button,.text-button,.back-button{min-height:44px}.chart-preview input{height:32px}
  .stage,.playing .stage{grid-column:1;grid-row:2;height:480px;margin:0}
  .stage-top{top:8px;left:3%;right:3%}.stage-status{font-size:11px}
  .fret-controls{left:3%;right:3%;bottom:30px;height:64px;gap:4px}
  .fret,.is-drums .fret{flex:1;min-width:0;transform:none;font-family:Arial,sans-serif;font-size:12px;-webkit-touch-callout:none}
  .fret>span,.key-hint{display:none}.fret::after{content:attr(data-touch-label);position:relative;z-index:1;pointer-events:none}
  .is-drums .fret-controls,.is-strum .fret-controls{bottom:84px}
  .is-drums .drum-labels{display:none}.hit-line-label{bottom:8px;font-size:10px}
  .is-strum .hit-line-label{display:none}
  .kick-button,.touch-strum{left:10%;right:10%;width:80%;bottom:8px;min-height:52px;padding:12px;font-size:14px;letter-spacing:1px;-webkit-touch-callout:none}
  .kick-button{left:3%;right:3%;width:94%;min-height:64px}
  .is-drums .fret-controls{bottom:88px}
  .scoreboard{grid-column:1;grid-row:3;display:flex;align-items:center;height:72px;gap:12px;padding:8px 0}
  .scoreboard>.score-label,.score-divider,.accuracy-row,.crowd-block,.personal-best,.overdrive-title,.drive-bars,.overdrive-block p{display:none}
  .score-value{font-size:24px;margin:0}.streak-wrap{margin:0;gap:10px}.streak-value{font-size:24px;margin:0}
  .streak-wrap .score-label{font-size:10px;letter-spacing:0}.multiplier-ring{width:36px;height:36px;border-width:2px}
  .multiplier-ring>span{font-size:18px}.multiplier-ring small{font-size:12px}
  .overdrive-block{margin:0 0 0 auto;padding:0;min-width:0;max-width:180px;border:0;flex:1}
  .overdrive-block button{min-height:48px;display:flex;flex-direction:column;justify-content:center;font-size:11px;padding:5px;gap:3px}
  .overdrive-block button::before{content:'OVERDRIVE';font-size:10px;font-weight:700;letter-spacing:.7px}.overdrive-block kbd{display:none}
  .control-guide{display:none}.bottom-bar{justify-content:flex-end}.volume-control input{height:32px;width:100px}
  .game-dialog{max-height:calc(100dvh - 24px);overflow-y:auto}.close-dialog{min-width:44px;min-height:44px}

  body.mobile-session{overflow:hidden;overscroll-behavior:none}
  .mobile-session .app{position:fixed;inset:0;width:100%;max-width:none;height:100svh;height:100dvh;display:grid;grid-template-rows:52px minmax(0,1fr);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);background:var(--bg)}
  .mobile-session .topbar{height:52px;gap:8px}.mobile-session .brand{font-size:20px;letter-spacing:-1px}.mobile-session .brand svg{width:16px;margin-right:5px}.mobile-session .brand-mark{display:none}
  .mobile-session .top-actions{gap:4px}.mobile-session .quiet{padding:7px;font-size:12px}
  .mobile-session .mobile-back{display:block}.mobile-session #helpButton{display:none}
  .mobile-session .top-actions #pauseText{display:inline}
  .mobile-session .arena{height:100%;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:64px minmax(0,1fr);overflow:hidden}
  .mobile-session .setlist,.mobile-session .bottom-bar{display:none}
  .mobile-session .stage{grid-row:2;grid-column:1;height:auto;min-height:0;margin:0;touch-action:none}
  .mobile-session .scoreboard{grid-row:1;grid-column:1;height:64px;gap:10px;border-top:0;border-bottom:1px solid var(--line)}
  .mobile-session #instrumentGroup{display:none}.mobile-session.previewing .mobile-play{display:block;background:#141b10;border-color:#718348}
  .mobile-session .stage-top{flex-wrap:nowrap}.mobile-session .announcement{top:30%}.mobile-session .announcement strong{font-size:30px}
  .mobile-session .judgment{top:49%;font-size:22px}.mobile-session .streak-callout{top:43%}
  .mobile-session .status-message:not(:empty){position:absolute;top:116px;left:12px;right:12px;z-index:7;background:#151a20;border:1px solid #776448;border-radius:4px}
}
@media(min-width:561px) and (max-width:850px) and (max-height:520px),(pointer:coarse) and (min-width:561px) and (max-width:1180px) and (max-height:520px){
  .mobile-session .app{grid-template-rows:48px minmax(0,1fr)}.mobile-session .topbar{height:48px}
  .mobile-session .arena{grid-template-columns:minmax(0,1fr) 126px;grid-template-rows:minmax(0,1fr);gap:12px}
  .mobile-session .stage{grid-column:1;grid-row:1}
  .mobile-session .scoreboard{grid-column:2;grid-row:1;flex-direction:column;justify-content:center;height:auto;padding:8px 0;border:0;gap:16px}
  .mobile-session .scoreboard>.score-label{display:block;max-width:none;font-size:10px}
  .mobile-session .score-value{font-size:24px}.mobile-session .overdrive-block{flex:0;width:100%;margin:0}
  .mobile-session .fret-controls{height:52px}.mobile-session .kick-button,.mobile-session .touch-strum{min-height:48px;padding:9px}
  .mobile-session .stage-top{top:4px}.mobile-session .stage-status{padding:5px 8px}
  .mobile-session .announcement{top:23%}.mobile-session .announcement strong{font-size:24px}.mobile-session .announcement span{margin-bottom:7px}
}

/* Four distinct parts, kept within a narrow phone viewport. */
#chartScope{width:100%;min-height:44px;margin:8px 0 10px;padding:10px;border:1px solid #45494d;border-radius:4px;background:#15191e;color:var(--ink);font:inherit;font-size:13px}
#chartTargetGroup .choice-row,.parts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
#partsGroup{margin:12px 0}#scopeHint{font-size:12px;line-height:1.5}#buildPartsButton{margin:8px 0}
.instrument-picker{max-width:100%;flex-wrap:wrap}.instrument-picker label{flex:1;min-width:0;text-align:center}.instrument-picker label>span{padding:9px 10px}
@media(max-width:560px){.instrument-picker{width:100%}.instrument-picker label>span{justify-content:center;padding:7px 6px;font-size:13px}.mobile-session .stage-top{flex-wrap:wrap}.mobile-session .stage-status{font-size:10px;padding:3px 7px}}

/* Four readable difficulty buttons in the existing sidebar and phone layout. */
.difficulty-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.difficulty-row label>span{min-height:48px;font-size:14px}.difficulty-row small{font-size:12px;letter-spacing:0}

.backup-download{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border:1px solid var(--acid);border-radius:4px;background:#263019;color:var(--acid);font-weight:700;text-decoration:none}#backupDialog a:focus-visible{outline:3px solid var(--acid);outline-offset:3px}#backupFileInfo,#backupStatus{overflow-wrap:anywhere}#backupStatus{color:#d5e6b5}

.backup-save-page{max-width:680px;margin:clamp(24px,8vh,80px) auto;padding:24px;color:var(--ink)}.backup-save-page h1{font-size:clamp(28px,6vw,48px);line-height:1.1}.backup-save-page p{line-height:1.6;overflow-wrap:anywhere}.backup-save-page .secondary{color:#a8b49d}.backup-save-page a:focus-visible{outline:3px solid var(--acid);outline-offset:3px}

/* Authored-chart matching controls, shared by phone and desktop. */
.community-option{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--text,#eee);font-size:14px}.community-option input{width:18px;height:18px;flex:0 0 auto;accent-color:#dfff54}.song-identity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.song-identity label{font-size:13px;color:#b5bbc1}.song-identity input{display:block;box-sizing:border-box;width:100%;min-width:0;padding:12px;margin-top:6px;border:1px solid #363c42;background:#15191d;color:#eee;border-radius:5px;font:inherit}.song-identity input:focus-visible{outline:2px solid #dfff54;outline-offset:2px}@media(max-width:480px){.song-identity{grid-template-columns:1fr}}

#songTimingTools { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #ffffff20; }
#songChartShift { width: 8rem; max-width: 100%; margin: .5rem 0; padding: .65rem; color: inherit; background: #15191d; border: 1px solid #ffffff30; border-radius: 5px; font: inherit; }
#songTimingTools .tool-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
#songTimingTools .tool-actions button { min-height: 44px; }

/* Available song parts sit beside the preview, before the highway. */
.play-parts{padding:14px 0 18px;border-bottom:1px solid var(--line);margin-bottom:18px}.play-parts h3{font-size:16px;margin:0 0 12px}.play-part-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.play-part-grid button{min-height:58px;padding:10px 6px;border:1px solid #454d38;border-radius:5px;background:#141910;color:#d9dfcd;font-weight:700;text-align:center}.play-part-grid small{display:block;margin-top:6px;font-size:11px;font-weight:400;color:#aab49b}.play-part-grid button[aria-pressed=true]{border-color:var(--acid);background:#263214;color:var(--acid)}.play-part-grid button[aria-pressed=true] small{color:#d0dea1}.play-parts p{font-size:13px;line-height:1.5;color:#bdc8ac}
@media(max-width:850px),(pointer:coarse) and (max-width:1180px){.mobile-session.previewing #instrumentGroup{display:flex;width:100%}.mobile-session.previewing .stage-top{flex-wrap:wrap}.mobile-session.previewing .instrument-picker label>span{justify-content:center;min-height:44px;padding:7px 5px}}

/* Four source pads occupy the entire highway; the fifth control is absent. */
.four-lane-drums .fret{width:25%;flex:1}.four-lane-drums .drum-labels span{width:25%;flex:1}.four-lane-drums .fret[hidden],.four-lane-drums .drum-labels span[hidden]{display:none}
#controllerDialog{width:min(760px,calc(100vw - 24px));max-height:90svh;overflow:auto;text-align:left}
#controllerDialog .controller-toggle{display:flex;align-items:center;gap:10px;margin:18px 0;font-size:15px}.controller-toggle input{width:20px;height:20px;accent-color:var(--acid)}
.controller-selects{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:18px 0}.controller-selects label{display:grid;min-width:0;gap:8px;font-size:14px}.controller-selects select{width:100%;min-width:0;min-height:44px;padding:10px;background:#11171c;border:1px solid #56614b;color:#edf5d6;border-radius:4px;font:inherit}
.controller-test{border:1px solid #45513d;border-radius:5px;background:#101710;padding:14px;margin:18px 0}.controller-test p{margin:8px 0 0}#controllerLastInput{font-family:monospace;font-size:14px;overflow-wrap:anywhere;color:var(--acid)}
.controller-map-row{display:grid;grid-template-columns:150px minmax(0,1fr) auto;align-items:center;gap:12px;border-bottom:1px solid #343c32;padding:12px 5px;font-size:14px}.controller-binding{color:#b8c0ae;overflow-wrap:anywhere;font-size:12px}.controller-map-actions{display:flex;gap:5px}.controller-map-actions button{min-height:44px;padding:8px}.controller-map-row strong{font-size:14px}
.controller-map-row.controller-hit{animation:controller-pad-hit .55s ease-out}@keyframes controller-pad-hit{from{background:#dfff5a55;box-shadow:inset 3px 0 #eaff5a}to{background:transparent;box-shadow:inset 3px 0 transparent}}
#controllerStatus,#controllerStorageStatus{overflow-wrap:anywhere}#controllerDialog button:disabled{opacity:.45;cursor:default}#controllerDialog .tool-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}#controllerDialog .tool-actions .upload-button{width:auto}
@media(max-width:560px){.controller-selects{grid-template-columns:1fr}.controller-map-row{grid-template-columns:1fr auto;gap:4px 10px}.controller-map-row strong{grid-column:1}.controller-binding{grid-column:1;grid-row:2}.controller-map-actions{grid-column:2;grid-row:1 / 3}#controllerDialog{padding:24px 16px}#controllerDialog h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.controller-map-row.controller-hit{animation-duration:.15s}}

/* Video and dark backgrounds leave the chart and touch pads in the foreground. */
.background-button{width:100%;margin:6px 0;min-height:44px}
#backgroundVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;background:#090a0d}
.video-background #performance,.dark-background #performance{visibility:hidden}
.dark-background{background:#090a0d!important}
#backgroundDialog label{display:block;margin-top:18px}
#backgroundDialog input[type=file],#backgroundDialog input[type=number]{display:block;width:100%;margin-top:9px;min-height:44px}
#backgroundDialog .highway-speed{display:grid}
#backgroundFilename{overflow-wrap:anywhere}
#backgroundPreview{display:block;width:100%;max-height:220px;object-fit:contain;background:#090a0d;margin:12px 0;border-radius:6px}
@media(max-width:850px){.background-button{grid-column:1/-1}.mobile-session .background-button{display:none}}

/* Hit timing stays below the existing judgment without covering pad controls. */
.hit-timing{position:absolute;z-index:3;left:50%;top:calc(64% + 32px);transform:translateX(-50%);margin:0;padding:4px 9px;border-radius:4px;background:#0b1018e8;color:#d7efb5;font:700 12px monospace;letter-spacing:1px;white-space:nowrap;opacity:0;pointer-events:none}.hit-timing.show{opacity:1}.hit-timing.early{color:#91d7ff}.hit-timing.late{color:#ffcc88}#resultPracticeMiss{margin:8px 0 16px}#retryButton{min-width:42px}.check-option{margin:16px 0}.check-option input{margin-right:8px}
@media(max-width:560px){.hit-timing{top:calc(63% + 26px);font-size:11px}.mobile-session .hit-timing{top:calc(49% + 26px)}.mobile-session .brand{font-size:21px}.mobile-session .top-actions #pauseText{display:none}}

.section-name{display:block;width:100%;min-height:44px;margin:8px 0 12px;padding:10px;border:1px solid #586445;border-radius:4px;background:#0b110d;color:#f5f4ed;font:inherit}#practiceSectionEditor{margin:16px 0}#practiceSection{margin-top:8px}

.results.practice-results .result-grid{grid-template-columns:repeat(2,1fr)}#resultNotes{white-space:pre-line}#practiceResultPercentage{color:var(--acid)}

#resultChooseSection{margin:8px 0 12px}

/* One pause sheet for every instrument, with comfortable keyboard/touch targets. */
.pause-menu{width:min(470px,calc(100% - 32px))}.pause-menu h2{margin-bottom:12px}.pause-menu #pauseSummary{overflow-wrap:anywhere;margin-bottom:22px}.pause-actions{display:grid;gap:10px}.pause-actions>button{width:100%;min-height:48px;margin:0;text-align:center;justify-content:center}.pause-actions #pauseQuit{margin-top:8px}.pause-actions .select-label{display:grid;gap:8px;font-size:14px}.pause-actions select{width:100%;min-height:48px;border:1px solid #586445;border-radius:4px;padding:10px;background:#0b110d;color:#f5f4ed;font:inherit}.pause-actions #pauseDifficultyPanel{padding:14px;border:1px solid #414c36;border-radius:5px}.pause-actions #pauseDifficultyPanel .play-button{width:100%;font-size:12px;justify-content:center}#pauseStatus:empty{display:none}

#backgroundDialog input[type=url]{display:block;width:100%;margin:9px 0 12px;min-height:48px;padding:10px;border:1px solid #586445;border-radius:4px;background:#0b110d;color:#f5f4ed;font:inherit}#backgroundUseLink{min-height:48px}

.youtube-background{position:absolute;inset:0;z-index:0;pointer-events:none;background:#090a0d}.youtube-background iframe{display:block;width:100%;height:100%;min-width:200px;min-height:200px;border:0}.background-link-status{color:#ffd99c;font-size:13px;line-height:1.5;overflow-wrap:anywhere}.background-link-status:empty{display:none}

#controllerDialog .controller-ead{min-width:0;margin:18px 0;padding:14px 16px;border:1px solid var(--line,#444);border-radius:12px}#controllerDialog .controller-ead legend{padding:0 6px;font-weight:700}#controllerDialog .controller-ead .controller-toggle{margin:4px 0 12px}#controllerDialog .controller-ead a{color:var(--acid)}

.ead-driver-setup{margin:4px 0 16px;padding:12px;border:1px solid var(--line);border-radius:6px}.ead-driver-setup summary{cursor:pointer;font-size:15px;font-weight:700;line-height:1.5}.ead-driver-setup .tool-actions a{display:inline-flex;align-items:center;min-height:44px;line-height:1.4;white-space:normal}.ead-driver-setup ol{padding-left:24px}.ead-driver-setup li{margin:8px 0}

.audio-drum-panel meter{display:block;width:100%;height:20px;margin-top:8px}.audio-drum-panel input[type=number]{width:100%;min-height:44px;background:var(--bg);border:1px solid var(--line);color:var(--ink);padding:8px}.audio-drum-sound{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}.audio-drum-sound span{min-width:0}.audio-drum-sound button{flex-shrink:0;min-height:44px}.audio-drum-panel legend{color:var(--acid)}

#controllerDialog .audio-drum-connection-status{margin:10px 0;padding:12px;border:1px solid #586445;border-radius:5px;background:#171d10;color:var(--ink);font-size:14px;line-height:1.5;overflow-wrap:anywhere}.audio-drum-panel a{text-decoration:underline}

.highway-style-settings{margin:14px 0}.highway-style-settings select{display:block;width:100%;max-width:100%;min-height:44px;margin-top:8px;padding:10px 8px;border:1px solid #48505b;border-radius:5px;background:#121820;color:var(--ink);font:inherit;font-size:13px}.highway-style-settings .secondary{font-size:12px;line-height:1.45;margin:8px 0}.highway-style-settings label{font-size:12px;letter-spacing:1px}

.chart-editor-dialog{width:min(1040px,96vw);max-width:1040px;max-height:94dvh;overflow:auto}.editor-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin:14px 0}.editor-controls label{display:grid;gap:5px;flex:1;min-width:140px}.editor-controls input,.editor-controls select{width:100%;padding:10px;background:#10171f;color:#eef2ed;border:1px solid #53616b;border-radius:5px}#editorCanvas{display:block;width:100%;height:auto;border:1px solid #53616b;border-radius:8px;touch-action:none;cursor:crosshair}.editor-note-list{display:flex;flex-wrap:wrap;gap:8px;max-height:220px;overflow:auto;padding:12px 0}.editor-note-list [aria-pressed=true]{outline:2px solid #e8ff65}#editorStatus{min-height:2em;color:#e8ff65}.chart-editor-dialog .tool-actions{flex-wrap:wrap}#editorStart{width:100%}@media(max-width:600px){.chart-editor-dialog{padding:20px 12px}.editor-controls label{min-width:110px}#editorCanvas{min-height:290px}.editor-controls button{min-height:42px}}

.editor-placement-toolbar{position:sticky;top:0;z-index:4;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;background:#121923;border:1px solid #58683f;border-radius:6px;margin:8px 0}.editor-placement-toolbar span{flex:1;min-width:200px;color:#e8ff65;font-size:13px}.editor-placement-toolbar button{min-height:42px}#editorPlace{border-color:#e8ff65;color:#e8ff65}

.editor-instructions{padding:12px;margin:10px 0;background:#131b25;border:1px solid #58683f;border-radius:7px}.editor-instructions summary{cursor:pointer;color:#e8ff65;font-weight:700}.editor-instructions textarea{display:block;width:100%;box-sizing:border-box;margin:8px 0;padding:12px;background:#090e15;color:#f4f6ef;border:1px solid #687986;border-radius:5px;font:inherit}#editorInstructionReview{white-space:pre-wrap;max-height:210px;overflow:auto;font-size:14px;color:#d7e7c5}#editorListen{color:#e8ff65;border-color:#e8ff65}

.audio-drum-live{position:absolute;top:64px;left:14px;right:14px;z-index:6;max-width:390px;padding:7px 10px;border:1px solid #6b7540;border-radius:6px;background:#10170fe8;color:#eaffbd;font-size:11px;line-height:1.4;pointer-events:none}.audio-drum-live meter{display:block;width:100%;height:5px;margin-top:4px}.audio-drum-live[hidden]{display:none}

.audio-drum-record-live{position:absolute;top:116px;left:14px;right:14px;z-index:7;max-width:390px;padding:8px 10px;border:1px solid #e9a77b;border-radius:6px;background:#21120ff0;color:#fff0db;font-size:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.audio-drum-record-live[hidden]{display:none}.audio-drum-record-live button{padding:6px 8px;white-space:nowrap}