/* Shared game menu, play area and thumb controls. */
.game-entry .entry-instruction{flex-shrink:0;margin:0;color:#dac5e9;text-align:center;font-size:16px;line-height:1.7}
@media(max-height:640px){.game-entry .entry-instruction{font-size:14px;line-height:1.55}}
.ui-result .shape-result-meta#result-details{margin:0;padding:0;border:0;border-radius:0;background:transparent;min-height:28px}
.ui-result .ui-shape-visual{position:relative;display:flex;align-items:center;height:auto;min-height:152px;padding:16px 20px}.ui-shape-visual .ui-trace-grid{width:100%}.ui-shape-visual .ui-trace-plot{height:120px;margin:0}.result-shell .ui-metrics{min-height:64px}.shape-result-meta{display:flex;align-items:center;justify-content:center;gap:18px;min-height:32px;color:#bda9cf;font-size:14px;font-variant-numeric:tabular-nums}.shape-result-meta>span{display:inline-flex;align-items:center;gap:6px}.shape-result-meta svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}.ui-empty-record{position:absolute;left:0;right:0;bottom:8px;text-align:center;color:#bda9cf;font-size:14px}
@media(max-height:640px){.ui-result .ui-shape-visual{min-height:112px;padding:12px 16px}.ui-shape-visual .ui-trace-plot{height:88px}.result-shell .ui-metrics{min-height:56px}}
.board-card{position:relative}.lap-reset{position:absolute;inset:0 0 auto;z-index:3;border-radius:16px;background:#ffffff14;pointer-events:none;color:var(--lap-color);animation:lap-reset-fade .52s ease-out both}.lap-reset svg{width:100%;height:100%;overflow:visible}.lap-reset polyline{fill:none;stroke:var(--lap-color);stroke-width:.027;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 .008px currentColor)}.lap-reset>span{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:42px;height:42px;transform:translate(-50%,-50%);border:2px solid currentColor;border-radius:50%;background:#21172de8;font-size:28px;font-weight:800;box-shadow:0 0 18px #c49bff44}@keyframes lap-reset-fade{0%,18%{opacity:1}100%{opacity:0}}.ui-result .game-result-details #result-details{margin-top:0;padding:0;border:0;background:none}.ui-result #result-details .result-metrics{padding:12px 4px;border:1px solid #75558f33;background:#20172e66;box-shadow:none}.ui-result #result-details .result-metrics strong{font-size:21px}
@media(prefers-reduced-motion:reduce){.lap-reset{animation:lap-reset-fade .3s linear both}}
.shell.home-shell{padding-bottom:calc(48px + env(safe-area-inset-bottom,0px))}.home-intro{margin:6px 0 24px}.home-intro h1{margin:0;color:#edddff;font-size:clamp(23px,6vw,27px);line-height:1.5;font-weight:750;letter-spacing:-.6px}
.brand{gap:0;line-height:1;letter-spacing:0}.brand-logo,.game-header .brand-logo{display:block;width:132px;height:35px;object-fit:contain}
.game-header>.tiny-label,.rhythm-play .game-header>.tiny-label{display:none}.rhythm-play .game-header .brand{display:inline-flex}
.mobile-shell.game-entry{display:flex;flex-direction:column;gap:14px;width:min(100%,440px);height:100dvh;min-height:0;margin:0 auto;padding:12px 16px max(12px,env(safe-area-inset-bottom));border:0;background:transparent;box-shadow:none}
.mobile-shell.game-entry .game-header{min-height:40px;margin:0}.game-entry .game-header>.tiny-label{display:none}
.game-entry .entry-title{display:flex;align-items:center;min-height:47px;margin:18px 0 0}
.game-entry .entry-title h1{margin:0;font-size:36px;font-weight:850;line-height:1.3;letter-spacing:-1px;color:#edddff;text-shadow:none}
.game-entry .entry-stage{position:relative;flex:1;min-width:0;min-height:180px;max-height:320px;width:100%;max-width:none;margin:12px 0;padding:14px;overflow:hidden;border:1px solid #715381;border-radius:20px;background:radial-gradient(ellipse at 50% 40%,#302142,#121024 85%);box-shadow:none}
.game-entry .entry-stage:before{content:'';position:absolute;inset:0;background:linear-gradient(#8f69ad0b 1px,transparent 1px) 50% 50%/28px 28px,linear-gradient(90deg,#8f69ad0b 1px,transparent 1px) 50% 50%/28px 28px;pointer-events:none}
.game-entry .entry-stage>.intro-shape,.game-entry .entry-stage>.intro-preview-flow,.game-entry .entry-stage>.intro-guide-pads,.game-entry .entry-stage>button{position:relative}
.game-entry .entry-controls{position:static;left:auto;bottom:auto;transform:none;z-index:2;display:grid;grid-template-columns:1fr;gap:12px;width:100%;margin:auto 0 0;padding:0;border:0;background:transparent;backdrop-filter:none}
.game-entry .entry-controls>.primary,.game-entry .entry-controls>.secondary{min-height:50px;margin:0;padding:12px 10px;font-size:16px;border-radius:14px}

/* Shared component contract: all controllers use game-ui.mjs and these tokens. */
.game-ready-host{position:relative}.game-ready-overlay,.game-ready-overlay.rhythm-count-in{position:absolute;inset:0;z-index:80;display:grid;place-items:center;min-width:0;min-height:0;width:auto;height:auto;margin:0;padding:24px;border:0;border-radius:0;background:rgb(16 12 36 / var(--ready-cover,.82));backdrop-filter:none;box-shadow:none;transform:none;pointer-events:auto;touch-action:none;overflow:hidden}.game-ready-overlay>strong,.game-ready-overlay.rhythm-count-in>strong{font-size:clamp(60px,20vw,88px);font-weight:850;line-height:1.2;color:#f1e3ff;text-shadow:0 4px 0 #6c419b;opacity:var(--ready-text-opacity,1)}.game-ready-overlay[hidden]{display:none}
.ui-title h1:focus{outline:none}
.ui-verdicts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:6px 0 10px}.ui-verdict{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:6px 4px;border:1px solid #ae88ce24;border-radius:14px;background:#b997d906;color:var(--ui-cyan)}.ui-verdict.good{color:#c49bff}.ui-verdict.miss{color:var(--ui-pink)}.ui-verdict svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ui-verdict strong{color:var(--ui-text);font-size:26px;line-height:30px;font-weight:800;font-variant-numeric:tabular-nums}.ui-verdict>span{font-size:14px;line-height:18px}.ui-verdict-meter{display:flex;height:5px;overflow:hidden;border-radius:5px;background:#a88abd20}.ui-verdict-meter i{height:100%;flex-shrink:0;background:var(--ui-cyan)}.ui-verdict-meter i.good{background:#c49bff}.ui-verdict-meter i.miss{background:var(--ui-pink)}
.round-row-top i{font-style:normal}
:root{--ui-surface:#231b38;--ui-surface-deep:#171225;--ui-border:#75558f;--ui-text:#f4eaff;--ui-muted:#bda9cf;--ui-radius:20px;--ui-gap:12px;--ui-purple:#a779f5;--ui-cyan:#51d9ef;--ui-pink:#ff87bd;--ui-depth:6px}
.ui-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;min-width:0}.ui-title h1{margin:0;color:var(--ui-text);font-size:30px;line-height:1.25;letter-spacing:-1px;font-weight:800}.ui-badge{flex-shrink:0;display:inline-flex;align-items:center;min-height:30px;padding:5px 11px;border:1px solid #9873bd66;border-radius:10px;color:#dac3f4;background:#8f60bf1a;font-size:14px;line-height:20px}
.ui-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:50px;margin:0;padding:12px 10px;border:1px solid #bc9bd8;border-radius:14px;color:var(--ui-text);background:linear-gradient(#614b79,#4a355f);box-shadow:0 var(--ui-depth) 0 #30203f,inset 0 1px 0 #fff2;font-size:16px;font-weight:750;line-height:22px;transition:transform .12s,box-shadow .12s}.ui-button.primary{border-color:#c1a0ff;background:linear-gradient(#9360ec,#7135c1);box-shadow:0 var(--ui-depth) 0 #492583,inset 0 1px 0 #fff3}.ui-button.end-button{border-color:#c58eae;background:linear-gradient(#603855,#46273f);box-shadow:0 var(--ui-depth) 0 #2c1828,inset 0 1px 0 #fff2}.ui-button:active{transform:translateY(5px);box-shadow:0 1px 0 #30203f,inset 0 1px 0 #fff2}.ui-button.primary:active{box-shadow:0 1px 0 #492583,inset 0 1px 0 #fff3}.ui-button:disabled{opacity:.45;transform:none}.ui-button .icon{flex:0 0 20px;width:20px;height:20px;margin:0}.ui-button.text-button{min-height:44px;padding:8px 10px;border:0;background:transparent;color:var(--ui-muted);box-shadow:none;font-size:14px;font-weight:600;text-decoration:none}.ui-button.text-button:active{transform:none;color:var(--ui-text)}
.ui-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ui-actions>.ui-button:only-child{grid-column:1/-1}
.ui-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%}.game-entry .ui-levels{grid-column:1/-1;margin:0;gap:8px}.game-entry .ui-levels .ui-level{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:60px;margin:0;padding:8px 4px;border:1px solid #74578e;border-radius:12px;color:var(--ui-muted);background:#2a203a;font-size:14px;line-height:18px}.game-entry .ui-level strong,.game-entry .ui-level span{font-size:14px;line-height:18px}.game-entry .ui-levels .ui-level[aria-pressed="true"]{color:#f5eaff;border-color:#cbadf5;background:linear-gradient(#68478f,#4c3068);box-shadow:inset 0 1px 0 #fff2,0 3px 0 #2d1a40}.game-entry .ui-level span{color:inherit;opacity:.85}.game-entry .entry-title.ui-title h1{font-size:36px;line-height:1.3;letter-spacing:-1px;color:#edddff}.game-entry .ui-actions>.ui-button{font-size:16px;line-height:22px;min-height:50px;margin:0;padding:12px 10px}
.mobile-shell.game-result.ui-result{display:flex;flex-direction:column;gap:16px;width:min(100%,440px);height:auto;min-height:100dvh;margin:0 auto;padding:12px 16px calc(102px + env(safe-area-inset-bottom));border:0;border-radius:0;background:transparent;box-shadow:none}.ui-result .game-header{flex-shrink:0;min-height:40px;margin:0}.ui-result .ui-title{min-height:38px}.ui-result .ui-title h1{font-size:28px}.ui-result .game-result-title{margin:4px 0 0}.ui-result .ui-badge{padding:5px 11px;border-radius:10px;background:#8f60bf1a;color:#dac3f4;font-size:14px}
.ui-result-card{overflow:hidden;isolation:isolate;border:1px solid var(--ui-border);border-radius:var(--ui-radius);background:linear-gradient(145deg,#2d2143,#191428);box-shadow:0 5px 0 #0b0818,inset 0 1px 0 #ebd6ff0c}.ui-score-hero{position:relative;display:grid;place-items:center;height:132px;overflow:hidden;background:radial-gradient(ellipse at 50% 80%,#8451ca55,transparent 65%)}.ui-result .result-total{position:relative;z-index:1;display:flex;align-items:baseline;justify-content:center;gap:6px;color:#f8f0ff;font-size:88px;font-weight:850;line-height:1;letter-spacing:-4px;text-align:center;text-shadow:0 3px 0 #4b2e6a}.ui-result .result-total small{display:inline;margin:0;color:#d6b6ec;font-size:18px;letter-spacing:0;font-weight:650;text-shadow:none}
.ui-result-visual{display:block;margin:0;padding:14px 16px;height:184px;border-top:1px solid #a986c52b;background:#12112388}.ui-result-visual figcaption{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px;color:var(--ui-muted);font-size:14px;font-weight:600;line-height:20px}.ui-trace-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.ui-trace{min-width:0;color:var(--ui-cyan)}.ui-trace.right{color:var(--ui-pink)}.ui-chart-label{display:flex;align-items:baseline;justify-content:center;font-size:14px;line-height:20px}.ui-chart-label strong{font-size:16px;font-variant-numeric:tabular-nums}.ui-chart-label small{font-size:14px;font-weight:500}.ui-trace-plot{display:block;overflow:visible;width:100%;height:104px;margin:0 auto 6px;fill:none;stroke-linecap:round;stroke-linejoin:round}.ui-trace-guide{stroke:currentColor;stroke-opacity:.13;stroke-width:1}.ui-trace-ink{stroke:currentColor;stroke-width:2.5;opacity:.95}.ui-mini-meter{height:4px;overflow:hidden;border-radius:4px;background:#a88abd20}.ui-mini-meter i{display:block;height:100%;border-radius:4px;background:currentColor}.ui-chart-grid{fill:none;stroke:#ac8ec02b;stroke-width:1}
.ui-aim-chart{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:22px;height:130px}.ui-aim-scatter{width:100%;height:130px;overflow:visible}.ui-target-ring{fill:#b48dde08;stroke:#ac8ec04d;stroke-width:1}.ui-target-ring:nth-of-type(3){stroke:#51d9ef55;fill:#51d9ef0a}.ui-target-ring:nth-of-type(4){stroke:#ff87bd88;fill:#ff87bd14}.ui-hit-dot{fill:var(--ui-cyan);stroke:#e5fbff;stroke-width:.7}.ui-hit-dot.perfect{fill:var(--ui-pink);stroke:#ffe6f1}.ui-zone-bars{display:grid;gap:10px}.ui-zone-row{display:grid;grid-template-columns:27px 1fr 24px;align-items:center;gap:8px;font-size:14px;line-height:18px;color:var(--ui-muted)}.ui-zone-row small{font-size:14px}.ui-zone-row strong{text-align:right;color:#e9d9fb;font-size:14px}.ui-zone-row .ui-mini-meter{height:5px;color:var(--ui-cyan)}.ui-zone-row:first-child .ui-mini-meter{color:var(--ui-pink)}
.ui-result .ui-metrics{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;min-height:72px;margin:0;padding:12px 0;border-top:1px solid #a986c52b;font-size:14px;line-height:20px}.ui-metric{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:0 8px;color:var(--ui-muted)}.ui-metric+.ui-metric{border-left:1px solid #a986c52b}.ui-metric strong{color:#f6ecff;font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;line-height:28px;white-space:nowrap}.ui-metric strong small{margin-left:3px;color:var(--ui-muted);font-size:14px;font-weight:500}.ui-metric>span{font-size:14px;line-height:20px}.ui-metric.left>span{color:var(--ui-cyan)}.ui-metric.right>span{color:var(--ui-pink)}
.ui-result-auxiliary,.ui-result-tools{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px}.ui-result-tools>*{flex:1}.ui-result .game-result-details{border:0;background:transparent}.ui-result-tools .accordion-trigger{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 10px;color:var(--ui-muted);font-size:14px;line-height:20px}.ui-result-tools .accordion-trigger .icon{width:18px;height:18px;margin:0}.ui-result #result-details{margin-top:12px;padding:14px;border:1px solid #75558f66;border-radius:16px;background:#20172e}.ui-result #result-details .result-metrics strong{font-size:23px}.ui-result .round-row{font-size:14px}.ui-result .round-row p{display:none}
.ui-result .ui-result-actions.game-actions{position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:10;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:min(100%,440px);margin:0;padding:12px 16px max(18px,env(safe-area-inset-bottom));border:0;background:linear-gradient(#111029e8,#111029 85%);backdrop-filter:blur(12px)}.ui-result .ui-result-actions>.ui-button{grid-column:auto;min-height:50px;margin:0;padding:12px 10px;font-size:16px;line-height:22px}.ui-result .ui-result-actions>.ui-button:only-child{grid-column:1/-1}
.game-card{border-color:var(--ui-border);border-radius:var(--ui-radius);background:var(--ui-surface)}.audio-dialog,.odds-dialog,.share-dialog{border-color:var(--ui-border);border-radius:var(--ui-radius);background:linear-gradient(145deg,#302141,#1c152c)}
@media(max-height:640px){
 .game-entry .entry-title.ui-title h1{font-size:31px}.game-entry .ui-levels .ui-level{min-height:54px}
 .mobile-shell.game-result.ui-result{gap:8px;padding:8px 12px calc(88px + env(safe-area-inset-bottom))}.ui-result .game-header{min-height:38px}.ui-result .ui-title{min-height:30px}.ui-result .ui-title h1{font-size:24px}.ui-result .game-result-title{margin:0}.ui-result .ui-badge{min-height:28px;padding:3px 9px}
 .ui-score-hero{height:68px}.ui-result .result-total{font-size:58px;letter-spacing:-2px}.ui-result .result-total small{font-size:16px}.ui-result-visual{height:128px;padding:8px 12px}.ui-result-visual figcaption{margin-bottom:4px;line-height:18px}.ui-trace-grid{gap:16px}.ui-chart-label{line-height:18px}.ui-chart-label strong{font-size:14px}.ui-trace-plot{height:66px;margin-bottom:4px}.ui-mini-meter{height:3px}.ui-aim-chart,.ui-aim-scatter{height:92px}.ui-aim-chart{gap:14px}.ui-zone-bars{gap:5px}.ui-zone-row{gap:5px;line-height:17px}
 .ui-result .ui-metrics{min-height:54px;padding:5px 0}.ui-metric{gap:0}.ui-metric strong{font-size:20px;line-height:24px}.ui-metric>span{line-height:18px}.ui-result .ui-result-actions.game-actions{padding:10px 12px max(14px,env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:no-preference){.ui-result-card{animation:ui-result-in .32s ease-out both}.ui-trace-ink{animation:ui-ink-in .6s ease-out both}@keyframes ui-result-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}@keyframes ui-ink-in{from{opacity:0}to{opacity:1}}}

@media(max-height:640px){.mobile-shell.game-entry{gap:10px;padding:8px 12px max(8px,env(safe-area-inset-bottom))}.game-entry .entry-title{min-height:40px;margin-top:10px}.game-entry .entry-title h1{font-size:31px}.game-entry .entry-stage{min-height:170px;max-height:250px;margin:0;padding:12px}.game-entry .entry-controls{gap:10px}}

.ui-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.game-entry .ui-actions.ui-actions-pair{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-dialog{display:flex;flex-direction:column;gap:14px;padding:18px}.ui-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0}.ui-dialog-header h2{margin:0;color:var(--ui-text);font-size:18px}.ui-dialog .ui-button{font-size:16px}.ui-dialog .ui-button:only-child{grid-column:1/-1}.round-breakdown .left{color:var(--left)}.round-breakdown .right{color:var(--right)}


@media(max-height:640px){.ui-verdicts{gap:8px;margin:4px 0 6px}.ui-verdict{gap:2px;padding:3px 4px;border-radius:11px}.ui-verdict svg{width:22px;height:22px}.ui-verdict strong{font-size:21px;line-height:24px}.ui-verdict>span{line-height:17px}.ui-verdict-meter{height:4px}}

.device-message{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding-bottom:48px;text-align:center}.device-message h1{font-size:28px;color:#edddff;line-height:1.4;letter-spacing:-1px}.device-message p{color:#c4afd7;font-size:16px;line-height:1.7}
.card-body{padding:20px}.card-body p{max-width:none}.card-art:after{content:none}
.games-grid{margin-top:18px}
.game-result-details .round-details{margin:18px 0 0;padding:0;border:0;background:none}.game-result-details .round-details h3{margin:0 0 10px;color:#cbb5df;font-size:14px;font-weight:650}
@media(max-width:600px){.shell{padding:0 16px}.site-header{height:64px}}
@media(max-width:600px) and (max-height:640px){.shell{padding:0 12px}.site-header{height:56px}}