:root{color-scheme:dark;--bg:#080b13;--panel:#111827;--line:#26324b;--text:#ecf4ff;--muted:#91a0b9;--blue:#22b8ff;--pink:#f14ed1;--gold:#ffbe3f;--danger:#ff6577}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-height:100vh;background-color:var(--bg);color:var(--text);font:15px/1.5 Inter,Segoe UI,sans-serif}.top{height:70px;padding:0 max(24px,calc((100vw - 1680px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #202b42;background:#080b13dd;position:sticky;top:0;z-index:5}.brand{font-size:21px;font-weight:900;letter-spacing:.08em;background:none;border:0;color:white}.brand span{color:var(--blue)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#162039;color:white;border-radius:10px;padding:9px 14px}button:hover{border-color:var(--blue)}.guest{display:flex;gap:12px;align-items:center;color:var(--muted)}main{max-width:1680px;margin:auto;padding:30px 24px 60px}.hidden{display:none!important}.hero{padding:42px 0 28px}.hero h1{font-size:48px;margin:0}.hero p{color:var(--muted)}.eyebrow{color:var(--blue)!important;text-transform:uppercase;letter-spacing:.15em}.song-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}.song-card{min-height:210px;padding:22px;display:flex;flex-direction:column;justify-content:end;text-align:left;background:linear-gradient(155deg,#1b2d51,#111827 60%);border:1px solid var(--line);border-radius:18px}.song-card h2{margin:4px 0}.song-card p,.meta{color:var(--muted)}.back{margin-bottom:24px}.setup-layout{display:grid;grid-template-columns:1fr 340px;gap:24px}.panel,.step-row{background:var(--panel);border:1px solid var(--line);border-radius:15px}.panel{padding:22px;height:max-content}.panel label{display:block;margin:18px 0}.panel input,.panel select{width:100%}.primary{width:100%;background:linear-gradient(90deg,#1877dc,#a73bd5);font-weight:700;border:0}.section-title{display:flex;justify-content:space-between;align-items:center}.step-list{display:grid;gap:9px}.step-row{padding:15px;display:flex;gap:12px;align-items:center}.step-row input{width:20px;height:20px}.step-row span{margin-left:auto;color:var(--muted)}.training{max-width:none}.training-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.training-bar label{display:flex;gap:8px;align-items:center}.stage-wrap{position:relative;background:#030611;border:1px solid var(--line);border-radius:16px;overflow:hidden}#stage{width:100%;aspect-ratio:16/9;display:block;background:radial-gradient(circle at 50% 55%,#142449,#030611 65%)}#judge{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-size:34px;font-weight:900;text-shadow:0 0 18px currentColor}.paused{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#02040acb;font-size:50px;font-weight:900}.timeline{padding:15px 4px}.timeline input{width:100%}.timeline>div{display:flex;justify-content:space-between;color:var(--muted)}.training-log{background:#0c111d;border:1px solid var(--line);border-radius:15px;padding:16px}.log-head,.log-row{display:grid;grid-template-columns:80px 1fr 130px 150px;gap:10px;padding:8px;border-bottom:1px solid #20283b}.log-head{color:var(--muted)}.Perfect{color:#ff54df}.Great{color:#43d9ff}.Good{color:#ffc249}.Bad{color:#ff7b68}.Miss{color:#8993a4}#historyList{display:grid;gap:10px}.history-row{padding:18px;background:var(--panel);border:1px solid var(--line);border-radius:12px;display:grid;grid-template-columns:1fr auto;gap:8px}.error{color:var(--danger)}@media(max-width:800px){.setup-layout{grid-template-columns:1fr}.hero h1{font-size:36px}.log-head,.log-row{grid-template-columns:55px 1fr 85px}.log-head span:last-child,.log-row span:last-child{display:none}.training-bar{align-items:stretch}.guest span{display:none}}

/* Игровой экран повторяет композицию основного HTML-прототипа. */
.arena{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #386fd0;border-radius:5px;background:radial-gradient(ellipse at 50% 100%,rgba(57,58,210,.38),transparent 38%),radial-gradient(circle at 16% 0,rgba(154,28,255,.35),transparent 28%),radial-gradient(circle at 84% 0,rgba(53,90,255,.3),transparent 28%),linear-gradient(180deg,#08051c 0,#071127 55%,#030816 100%);box-shadow:inset 0 0 75px #0007,0 28px 80px #0008;isolation:isolate}.arena:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.42;background:repeating-linear-gradient(90deg,transparent 0 14%,rgba(117,73,255,.08) 14.2%,transparent 15%),linear-gradient(165deg,transparent 0 40%,rgba(132,46,255,.14) 41%,transparent 48%),linear-gradient(195deg,transparent 0 40%,rgba(31,125,255,.13) 41%,transparent 48%)}.arena:after{content:"";position:absolute;left:20%;right:20%;bottom:5%;height:16%;z-index:0;pointer-events:none;border:2px solid rgba(92,104,255,.45);border-radius:50%;box-shadow:0 0 22px rgba(102,51,255,.55),inset 0 0 26px rgba(43,149,255,.24);transform:perspective(260px) rotateX(62deg)}#stage{position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;aspect-ratio:auto;background:transparent}.game-hud{position:absolute;z-index:4;left:18px;right:18px;top:16px;display:flex;justify-content:space-between;pointer-events:none;text-shadow:0 2px 12px #000}.game-title{display:flex;align-items:center;gap:8px;font-weight:850}.game-title i{width:19px;height:19px;display:grid;place-items:center;border-radius:5px;font-style:normal;font-size:11px;background:linear-gradient(135deg,#ff38a7,#ed006c);box-shadow:0 0 15px #ff198f}.track-name{margin-top:5px;font-weight:750}.song-line{width:220px;height:3px;margin:5px 0;background:#17365c;box-shadow:0 0 8px #2d80ff}.song-line div{height:100%;width:0;background:#66dfff;box-shadow:0 0 9px #63dcff}.song-meta{display:flex;gap:12px;color:#d7e5ff;font-size:.78rem}.score-mini{color:#75dfff}.combo-hud{text-align:right}.combo-hud span{display:block;font-size:.84rem;font-weight:850;letter-spacing:.08em}.combo-hud b{display:block;font-size:clamp(2rem,4vw,3.25rem);line-height:1}.combo-hud em{display:block;margin-top:4px;color:var(--blue);font-size:1.15rem;font-style:normal;font-weight:900;text-shadow:0 0 14px currentColor}#judge{left:auto;right:18px;top:132px;transform:none;font-size:1.2rem;font-style:italic;text-transform:uppercase;letter-spacing:.1em}.miss-box{position:absolute;z-index:5;left:50%;bottom:12px;transform:translateX(-50%);font-weight:900}.miss-box span{color:#fff}.game-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding:12px 15px;border:1px solid var(--line);border-radius:17px;background:rgba(10,16,36,.84);box-shadow:0 16px 45px #0005}.game-controls label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.84rem}.game-controls input[type=range]{accent-color:#7b59ff}.primary.compact{width:auto}.seek{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;width:100%;color:var(--muted)}.seek input{width:100%}.help{width:100%;color:var(--muted);font-size:.8rem}.training-log{margin-top:14px}.Perfect,.perfect{color:#75ffc1}.Great,.great{color:#63dcff}.Good,.good{color:#ffbc55}.Bad,.bad{color:#ff8755}.Miss,.miss{color:#ff315c}@media(max-width:800px){.arena{min-height:390px;aspect-ratio:auto}.song-line{width:165px}.track-name{font-size:.85rem}.combo-hud b{font-size:2rem}.game-controls label{width:100%}}
.arena-fullscreen-button{position:absolute;z-index:9;right:16px;bottom:14px;padding:8px 11px;border-color:#6da9d777;background:#071321cc;box-shadow:0 6px 20px #0008;font-size:12px;font-weight:800;backdrop-filter:blur(6px)}.arena-fullscreen-button:hover{background:#123457}.arena:fullscreen,.arena.is-fullscreen{width:100vw;height:100vh;max-width:none;aspect-ratio:auto;border:0;border-radius:0}.arena:fullscreen .arena-fullscreen-button,.arena.is-fullscreen .arena-fullscreen-button{right:20px;bottom:18px}.arena:fullscreen #stage,.arena.is-fullscreen #stage{object-fit:contain}@media(max-width:600px){.arena-fullscreen-button{right:10px;bottom:10px;padding:7px 9px;font-size:0}.arena-fullscreen-button:first-letter{font-size:18px}}
.training-log>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;list-style:none;font-size:1.08rem;font-weight:800}.training-log>summary::-webkit-details-marker{display:none}.training-log>summary:before{content:'▸';color:var(--blue);transition:transform .18s}.training-log[open]>summary:before{transform:rotate(90deg)}.training-log>summary #sessionStats{margin-left:auto;color:var(--muted);font-size:.9rem;font-weight:600}.training-log[open]>summary{padding-bottom:14px;border-bottom:1px solid var(--line)}.step-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:8px;margin:14px 0}.step-stat{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#111a2b}.step-stat span{color:var(--muted);font-size:.8rem}.step-stat.has-errors{border-color:#ff315c88;background:#ff315c0d}.step-stat.has-errors b{color:#ff879d}
.progress-steps{grid-column:1/-1;display:flex;width:100%;height:46px;gap:3px}.progress-step{min-width:28px;padding:4px 6px;overflow:hidden;border-radius:7px;border:1px solid #33415e;background:#121c31;color:#a9b5ce;text-align:center;transition:.15s}.progress-step b{display:block;font-size:.82rem}.progress-step small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.62rem;color:inherit}.progress-step.current{border-color:#63dcff;background:#173c5a;color:#fff;box-shadow:0 0 14px #34caff88}.progress-step.next{border-color:#d16cff;color:#ebc8ff;box-shadow:inset 0 0 0 1px #d16cff55}.progress-step.hard{border-color:#ff315c;background:#4a1424;color:#ffb2c0}.progress-step.rough:not(.current){border-color:#ffbc55;background:#392b16;color:#ffe0a0}.progress-step.current.hard{box-shadow:0 0 16px #ff315c99}.seek>input{grid-column:1}.seek>#cycle{grid-column:2}.seek>#stepNow{grid-column:3}@media(max-width:800px){.progress-steps{height:38px}.progress-step{padding:3px}.progress-step small{display:none}}
.history-row{display:block}.history-row>summary{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;cursor:pointer;list-style:none}.history-row>summary::-webkit-details-marker{display:none}.overlay-view{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:14px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}.overlay-view canvas{width:100%;border:1px solid #34456a;border-radius:10px}.overlay-events{max-height:420px;overflow:auto;display:grid;gap:6px;align-content:start}.overlay-events button{display:grid;grid-template-columns:70px 85px 1fr;gap:8px;text-align:left}.overlay-events small{color:var(--muted)}.progress-step:disabled,#progress:disabled{cursor:not-allowed;opacity:.48}.record-option{display:grid!important;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:12px;border:1px solid #ef456f66;border-radius:10px;background:#ef456f0b}.record-option input{width:20px!important;height:20px}.record-option span{display:grid}.record-option small{color:var(--muted);margin-top:3px}.record-badge{position:absolute;z-index:8;right:18px;bottom:18px;padding:7px 10px;border-radius:7px;background:#d51e47dd;color:#fff;font-size:.72rem;font-weight:900;letter-spacing:.08em;box-shadow:0 0 18px #ff315c}.faq{margin-top:28px;padding:18px 22px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.faq summary{cursor:pointer;font-size:1.05rem;font-weight:800}.faq div{max-width:850px;color:var(--muted)}@media(max-width:800px){.overlay-view{grid-template-columns:1fr}.overlay-events{max-height:300px}}

.history-toolbar{display:grid;grid-template-columns:auto 140px 1fr 90px;gap:10px;align-items:center;margin-top:16px}.history-toolbar input{width:100%}.wave-guide{margin-top:10px;padding:10px 13px;border:1px solid #2e9fcf66;border-radius:10px;background:#0a7eaa18;color:#bfeeff}.wave-guide b{display:block;color:#fff}.wave-guide span{font-size:.9rem}.overlay-view canvas{background:#030611}@media(max-width:800px){.history-toolbar{grid-template-columns:1fr 1fr}.history-toolbar input{grid-column:1/-1}}
.history-explain{display:flex;gap:10px;align-items:center;margin-top:15px;padding:11px 14px;border:1px solid #38d9ff55;border-radius:10px;background:#0b6f951c}.history-explain b{color:#38d9ff;white-space:nowrap}.history-explain span{color:#c7d8ec}.overlay-events button.selected{border-color:#38d9ff;background:#17304d;box-shadow:0 0 0 1px #38d9ff66,0 0 18px #1ebce633}.history-toolbar select{min-width:220px}@media(max-width:800px){.history-explain{display:grid}.history-toolbar select{min-width:0}}

.history-toolbar{grid-template-columns:auto minmax(180px,220px) minmax(120px,150px) 1fr 90px}.history-switch,.history-zoom{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;color:var(--muted);font-size:12px}.history-switch select,.history-zoom select{min-width:0;width:100%;padding:8px 10px;border:1px solid #3c557a;border-radius:8px;background:#101b30;color:#fff;font-weight:800}.grade-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.grade-legend span{padding:3px 8px;border-radius:999px;font-size:11px;font-weight:800}.grade-legend .bad{border:1px solid #ff7b68;color:#ff9c8e}.grade-legend .good{border:1px solid #ffc249;color:#ffd57d}.grade-legend .great{border:1px solid #43d9ff;color:#86e8ff}.grade-legend .perfect{border:1px solid #ff54df;color:#ff91ea}@media(max-width:800px){.history-toolbar{grid-template-columns:1fr 1fr}.history-toolbar>button{grid-column:1/-1}.history-toolbar input{grid-column:1/-1}.history-toolbar output{grid-column:1/-1}.history-switch,.history-zoom{grid-template-columns:1fr}}

.history-explain .grade-legend{margin:0 0 0 auto;flex-wrap:nowrap}.history-explain{flex-wrap:wrap}@media(max-width:800px){.history-explain .grade-legend{margin:0}}

.overlay-view canvas{cursor:default}.history-explain{border-color:#4ea7c966}.history-explain:after{content:"Сплошная линия — эталон · тонкая штриховая — ваше нажатие · точки — границы оценок";display:block;width:100%;color:#9db1cc;font-size:12px}

#historyView,.training{width:100%}.overlay-view{grid-template-columns:minmax(0,3fr) minmax(300px,1fr)}@media(max-width:1100px){.overlay-view{grid-template-columns:minmax(0,2fr) minmax(260px,1fr)}}@media(max-width:800px){.overlay-view{grid-template-columns:1fr}}

/* Separate workspace sizes: compact trainer, expanded history. */
.training{width:100%;max-width:1280px;margin-inline:auto}.training #stage{aspect-ratio:1180/664}.history-row{width:100%}#historyView{width:min(1800px,calc(100vw - 32px));max-width:none;position:relative;left:50%;transform:translateX(-50%)}#historyView .overlay-view{grid-template-columns:minmax(0,5fr) minmax(290px,1fr)}@media(max-width:1100px){#historyView .overlay-view{grid-template-columns:minmax(0,2fr) minmax(250px,1fr)}}@media(max-width:800px){#historyView{width:100%;left:auto;transform:none}#historyView .overlay-view{grid-template-columns:1fr}}

/* Компактная история без горизонтального смещения всей страницы. */
#historyView{width:min(1460px,100%);max-width:1460px;position:static;left:auto;transform:none;margin-inline:auto}
#historyView .history-row{padding:15px}
#historyView .overlay-view{grid-template-columns:minmax(0,4fr) minmax(270px,1fr);max-width:100%;overflow:hidden}
#historyView .overlay-view canvas{min-width:0;max-width:100%;height:auto}
html,body{overflow-x:hidden}
@media(max-width:1100px){#historyView .overlay-view{grid-template-columns:minmax(0,2fr) minmax(240px,1fr)}}
@media(max-width:800px){#historyView{width:100%}#historyView .overlay-view{grid-template-columns:1fr}}

/* Скорость воспроизведения истории. */
.history-toolbar{grid-template-columns:auto minmax(170px,210px) minmax(110px,140px) minmax(110px,140px) minmax(180px,1fr) 90px}
.history-playback-speed{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;color:var(--muted);font-size:12px}
.history-playback-speed select{min-width:0;width:100%;padding:8px 10px;border:1px solid #3c557a;border-radius:8px;background:#101b30;color:#fff;font-weight:800}
@media(max-width:1000px){.history-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.history-toolbar input{grid-column:1/-1}.history-toolbar output{grid-column:1/-1}}
@media(max-width:700px){.history-toolbar{grid-template-columns:1fr 1fr}.history-toolbar>button{grid-column:1/-1}.history-toolbar input,.history-toolbar output{grid-column:1/-1}.history-playback-speed{grid-template-columns:1fr}}

/* Ползунки и перемещение увеличенной области истории. */
.history-toolbar{grid-template-columns:auto minmax(160px,190px) minmax(210px,250px) auto minmax(210px,250px) minmax(170px,1fr) 88px}
.history-zoom,.history-playback-speed{display:grid;grid-template-columns:auto auto;gap:3px 8px;align-items:center;color:var(--muted);font-size:12px}
.history-zoom output,.history-playback-speed output{justify-self:end;color:#fff;font-weight:850;font-variant-numeric:tabular-nums}
.history-zoom input,.history-playback-speed input{grid-column:1/-1;width:100%;accent-color:#42cfff}
.history-pan-reset{align-self:stretch;padding-inline:11px}
#historyView .overlay-view{align-items:stretch}
#historyView .overlay-events{height:0;max-height:none;min-height:0;overflow-y:auto;overscroll-behavior:contain}
#historyView .overlay-view canvas{cursor:grab;touch-action:none}
#historyView .overlay-view canvas.dragging{cursor:grabbing}
@media(max-width:1200px){.history-toolbar{grid-template-columns:auto repeat(2,minmax(190px,1fr)) auto}.history-toolbar>[data-history-time]{grid-column:1/-2}.history-toolbar>output{grid-column:-2/-1}}
@media(max-width:700px){.history-toolbar{grid-template-columns:1fr 1fr}.history-toolbar>button:first-child{grid-column:1/-1}.history-toolbar>[data-history-time],.history-toolbar>output{grid-column:1/-1}.history-zoom,.history-playback-speed{grid-template-columns:auto auto}}

.catalog-filters{display:grid;gap:18px;margin:0 0 24px;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.song-search{display:grid;gap:8px;font-weight:700}.song-search input{width:100%;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#090f1e;color:#fff;font:inherit}.song-search input:focus{outline:2px solid #63dcff;outline-offset:2px}.catalog-filters fieldset{border:0;margin:0;padding:0;min-width:0}.catalog-filters legend{margin-bottom:10px;font-weight:700}.switches{display:flex;flex-wrap:wrap;gap:8px}.switches button[aria-pressed=true]{background:#25496f;border-color:#63dcff;color:#fff;box-shadow:0 0 0 1px #63dcff}.switches button:disabled{opacity:.45;cursor:not-allowed}#songCount{margin:0;color:var(--muted)}.category-label{font-size:.8rem;color:var(--muted)}@media(max-width:600px){.catalog-filters{padding:14px}.switches button{flex:1 1 auto}}

.song-list-head,.song-list-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 110px;gap:16px;align-items:center}.song-list-head button{text-align:left;background:transparent;border:0;padding:8px 12px;color:var(--muted)}.song-list-head button.active{color:#63dcff}.song-list-head button span{margin-left:6px}.song-list ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}.song-list-row{width:100%;text-align:left;padding:14px 12px;border-radius:10px}.song-list-row span{overflow-wrap:anywhere}.song-title{font-weight:750}.song-bpm{font-variant-numeric:tabular-nums}.song-list-head button:last-child,.song-bpm{text-align:right}.catalog-search{gap:12px}@media(max-width:600px){.song-list-head,.song-list-row{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) 74px;gap:8px}.song-list-head button,.song-list-row{padding:10px 6px;font-size:.85rem}}

.neon-hero{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;min-height:440px;border:1px solid #14303c;border-radius:4px;background:radial-gradient(ellipse at 50% 46%,#063047 0,#031721 35%,#020508 70%);box-shadow:0 20px 70px #0009,inset 0 0 70px #000; margin-bottom:12px;padding:28px 36px}.neon-hero:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 2px,#0004 2px 3px),linear-gradient(115deg,#000a 5%,transparent 35%,#00aaff08 48%,transparent 60%,#000b 95%)}.neon-hero:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 30%,#000a 100%)}.neon-hero-top,.neon-hero-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#a7c3cf;font-size:11px;letter-spacing:.22em;font-weight:700}.neon-hero-top span:first-child{color:#eefaff}.neon-sign{display:block;width:min(100%,1100px);height:auto;margin:auto;overflow:visible;filter:drop-shadow(0 0 26px #00aaff44)}.neon-hero-bottom{justify-content:center;color:#ddf7ff;position:relative}.neon-hero-bottom span:last-child{position:absolute;right:0;font-size:26px;color:#53d7ff;text-shadow:0 0 12px #00bfff}.catalog-intro{padding:30px 0 24px}.catalog-intro h1{font-size:clamp(27px,3vw,40px)}#homeView .catalog-filters{background:linear-gradient(120deg,#0b1620,#0a111a);border-color:#173342}#homeView .switches button[aria-pressed=true]{background:#093044;box-shadow:0 0 15px #00bfff22;border-color:#46d4ff}@media(max-width:700px){.neon-hero{min-height:260px;padding:20px 16px}.neon-hero-top{font-size:9px;letter-spacing:.12em;gap:12px}.neon-hero-top span:last-child{max-width:90px;text-align:right}.neon-hero-bottom{font-size:9px;letter-spacing:.15em}.neon-hero-bottom span:last-child{font-size:20px}.neon-sign{width:100%}.catalog-intro{padding-top:22px}}@media(prefers-reduced-motion:no-preference){.neon-sign{animation:neon-breathe 6s ease-in-out infinite}@keyframes neon-breathe{0%,100%{filter:drop-shadow(0 0 22px #00aaff44)}50%{filter:drop-shadow(0 0 32px #00aaff77)}}}
.neon-hero.neon-wall{display:block;padding:0;min-height:0;background:#020507;border-color:#132730;isolation:auto}.neon-wall:before,.neon-wall:after{display:none}.neon-wall-art{display:block;width:100%;height:clamp(220px,28vw,420px);object-fit:cover;object-position:center}@media(max-width:700px){.neon-wall-art{height:230px}}

.neon-hero.neon-wall{border:0;border-radius:0;box-shadow:none;background:#080b13;position:relative;isolation:isolate}.neon-wall:after{content:'';display:block;position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#080b13 0%,#080b13d9 4%,#080b1366 12%,transparent 25%,transparent 75%,#080b1366 88%,#080b13d9 96%,#080b13 100%),linear-gradient(0deg,#080b13 0%,#080b1380 7%,transparent 23%,transparent 82%,#080b1366 94%,#080b13 100%)}
.coach-option{border-color:#38bfff66;background:#38bfff0b}.coach-status{position:absolute;z-index:8;left:50%;bottom:48px;transform:translateX(-50%);max-width:80%;padding:8px 16px;border:1px solid #63dcff66;border-radius:10px;background:#071321e8;color:#bceeff;text-align:center;font-weight:800;pointer-events:none}.coach-status.is-waiting{border-color:#63dcff;color:#fff;box-shadow:0 0 22px #22b8ff55}@media(max-width:600px){.coach-status{font-size:12px;bottom:54px;padding:6px 10px}}

.neo-status{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;padding:14px 18px;margin:10px 0;border:1px solid #39c9ff66;border-radius:12px;background:linear-gradient(110deg,#0b1d30,#09121f);color:#cbf4ff}.neo-status strong{display:block;font-size:15px}.neo-status small{display:block;color:#91b1cb;margin-top:4px}.neo-status p{grid-column:1/-1;margin:0;padding-top:8px;border-top:1px solid #ffffff12;font-weight:700;font-size:14px}.neo-status[data-change=up] p{color:#75ffc1}.neo-status[data-change=down] p{color:#ffb329}.neo-status[data-change=same] p{color:#86dfff}.neo-accuracy progress{display:block;width:100%;height:7px;margin-top:9px;border:0;border-radius:8px;overflow:hidden;background:#15283a;accent-color:#38cfff}.neo-accuracy progress::-webkit-progress-bar{background:#15283a}.neo-accuracy progress::-webkit-progress-value{background:#38cfff;box-shadow:0 0 9px #38cfff}.neo-accuracy progress::-moz-progress-bar{background:#38cfff}@media(max-width:600px){.neo-status{grid-template-columns:1fr;gap:8px;padding:12px}.neo-status strong,.neo-status p{font-size:12px}}

.neo-status .neo-result{display:flex;align-items:center;gap:14px}.neo-rank{display:inline-grid;place-items:center;flex-shrink:0;width:48px;height:48px;border:1px solid currentColor;border-radius:10px;font-size:30px;font-weight:900;text-shadow:0 0 14px currentColor;background:#06101d}.neo-rank[data-rank=S]{color:#63dcff;box-shadow:0 0 16px #39c9ff44}.neo-rank[data-rank=A]{color:#75ffc1}.neo-rank[data-rank=B]{color:#ffcf5a}.neo-rank[data-rank=C]{color:#ff9f43}.neo-status .neo-rank-legend{grid-column:1/-1;font-size:11px;margin:0;color:#91b1cb}@media(max-width:600px){.neo-rank{width:40px;height:40px;font-size:26px}}

/* Keep Neo feedback inside the arena, including fullscreen. */
.arena .neo-status{position:absolute;z-index:6;top:auto;bottom:14px;left:14px;transform:none;width:min(390px,38%);margin:0;padding:8px 12px;gap:4px 12px;pointer-events:none;background:#071321e8;box-shadow:0 0 20px #16bfff15}.arena .neo-status strong{font-size:12px}.arena .neo-status small{font-size:10px;margin-top:2px}.arena .neo-status p{font-size:11px;padding-top:4px;gap:9px}.arena .neo-rank{width:38px;height:38px;font-size:26px}.arena .neo-status .neo-rank-legend{font-size:9px}.arena .neo-accuracy progress{margin-top:4px;height:4px}
@media(max-width:800px){.arena .neo-status{top:auto;bottom:12px;left:12px;transform:none;width:min(330px,65%);grid-template-columns:1fr 1fr;padding:6px 9px}.arena .neo-status .neo-rank-legend{display:none}.arena .neo-status strong{font-size:10px}.arena .neo-status small{font-size:9px}.arena .neo-status p{font-size:10px}.arena .neo-rank{width:30px;height:30px;font-size:23px}}

.arena .ideal-status{position:absolute;z-index:6;bottom:14px;left:14px;width:min(420px,42%);padding:12px 16px;background:rgba(7,15,30,.88);border:1px solid #22b8ff66;border-radius:12px;display:grid;gap:5px;pointer-events:none}.ideal-status b{color:#a8efff}.ideal-status span,.ideal-status small{font-size:12px;color:#b3c6dd}@media(max-width:800px){.arena .ideal-status{width:min(330px,65%);padding:8px 10px;bottom:12px;left:12px}.ideal-status small{display:none}}

.training-back{display:block;width:max-content;margin:0 0 16px;padding:8px 14px;border:1px solid #31c4ff66;border-radius:9px;background:#0c1b30e8;color:#eaf8ff;font:700 14px system-ui;cursor:pointer}.training-back:hover{background:#173b55;border-color:#31c4ff}.training-back:focus-visible{outline:2px solid #31c4ff;outline-offset:3px}

#homeView .catalog-search{width:100%;max-width:1100px;margin-left:auto;margin-right:auto}

#homeView .switches{gap:12px;padding:3px 0}
#homeView .switches button{position:relative;isolation:isolate;background:linear-gradient(145deg,#111e2a,#080e17);border:1px solid #294758;border-radius:11px;padding:11px 18px;color:#b5cbd8;transition:border-color .2s,box-shadow .2s,color .2s,background .2s}
#homeView .switches button:not(:disabled):hover{color:#e7fbff;border-color:#4ccfff;box-shadow:0 0 12px #00bfff25,inset 0 0 10px #00bfff12}
#homeView .switches button[aria-pressed=true]{color:#effeff;background:radial-gradient(ellipse at center,#0b3547,#07131e 85%);border-color:#b4f5ff;box-shadow:0 0 3px #d6fbff,0 0 9px #37d5ff,0 0 24px #00bfff66,inset 0 0 17px #00c8ff35;text-shadow:0 0 5px #6ae5ff,0 0 13px #00bfff;font-weight:750}
#homeView .switches button[aria-pressed=true]::after{content:'';position:absolute;inset:3px;border:1px solid #27cfff99;border-radius:7px;pointer-events:none;box-shadow:inset 0 0 5px #00c8ff40}
#homeView .switches button:focus-visible{outline:2px solid #d5faff;outline-offset:5px}
#homeView .switches button:disabled{opacity:.4;box-shadow:none;text-shadow:none}
@media(max-width:600px){#homeView .switches{gap:10px}#homeView .switches button{padding:10px 12px}}

#homeView .catalog-filters{background:linear-gradient(155deg,#1b2d51,#111827 60%);border-color:#26324b}
#homeView .song-list-row{background:linear-gradient(155deg,#1b2d51,#111827 60%);border-color:#26324b}
#homeView .song-list-row:hover{background:linear-gradient(155deg,#23395f,#142035 60%);border-color:#31c4ff}

body:has(#setupView:not(.hidden)){background-image:radial-gradient(circle at 50% -20%,#172447,var(--bg) 45%);background-size:100% 100vh;background-repeat:no-repeat;background-attachment:fixed}