/* Supplied v2 UI kit, composed as independent layers. Motion is audio-clock driven in app.js. */
:root{background:#23165c}body{background:#23165c}.cosmic-menu{height:100dvh;min-height:100svh;display:grid;place-items:center;overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.menu-stage{position:relative;isolation:isolate;width:min(100%,calc(100dvh * 16 / 9));aspect-ratio:16/9;container-type:inline-size;overflow:hidden;color:#fff}.cosmic-layers{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}.cosmic-layers>img:not(.cosmic-star){position:absolute;inset:-2%;width:104%;height:104%;object-fit:cover}.cosmic-layers .cosmic-base{inset:0!important;width:100%!important;height:100%!important}.cosmic-layers .cosmic-star{position:absolute;width:7%;filter:drop-shadow(0 0 1.5cqw #fff4)}.star-one{left:82%;top:22%}.star-two{left:7%;top:71%}.star-three{left:43%;top:79%;width:5%!important}.menu-screen{position:absolute;inset:0;z-index:1}.home-logo{position:absolute;left:5%;top:12%;width:54%;margin:0;transform:rotate(-3deg)}.home-logo img,.select-logo{width:100%;height:auto;filter:drop-shadow(0 1cqw 1.1cqw #1c075844)}.home-copy{position:absolute;left:12%;top:58%;transform:rotate(-3deg);text-shadow:0 .18cqw .3cqw #281062}.home-kicker{font-size:1.1cqw;letter-spacing:.2em;font-weight:800;color:#b9fcff}.home-copy p{font-size:2.3cqw;letter-spacing:.05em;font-weight:950;margin:1cqw 0}.home-copy small{display:block;font-size:1cqw;line-height:1.9;color:#eee1ff}.home-actions{position:absolute;right:4.5%;top:41%;width:32.5%;display:flex;flex-direction:column;gap:1.7cqw}.art-button{display:block;background:transparent;border:0;padding:0;line-height:0;border-radius:5cqw;transition:transform .12s,filter .12s;min-height:44px}.art-button img{width:100%;height:auto;pointer-events:none;display:block}.art-button:hover,.stage-card:hover{filter:brightness(1.08);transform:translateY(-.3cqw)}.art-button:active,.stage-card:active{transform:translateY(.35cqw) scale(.97);filter:brightness(1.12)}.art-button:focus-visible,.stage-card:focus-visible{outline:.35cqw solid #fff98c;outline-offset:.35cqw}.menu-edition{position:absolute;left:3%;bottom:3%;font-size:.8cqw;letter-spacing:.16em;color:#f0dfff}.select-logo{position:absolute;left:6%;top:1.5%;width:34%;transform:rotate(-2deg)}.select-heading{position:absolute;right:9%;top:11%;text-align:right}.select-heading h2{font-size:2.6cqw;margin:0 0 .7cqw;text-shadow:0 .25cqw #39247c}.select-heading p{font-size:1.1cqw;margin:0;color:#cdfbff}.stage-cards{position:absolute;left:6.5%;right:6.5%;top:31%;display:flex;gap:4.5%}.stage-card{width:47.75%;background:none;border:0;padding:0;border-radius:3cqw;line-height:0;transition:transform .12s,filter .12s}.stage-card img{display:block;width:100%;pointer-events:none}#selectHome{position:absolute;left:36%;bottom:6%;width:28%}.menu-settings{position:absolute;inset:0;z-index:8;display:grid;place-items:center;background:#1b0d588c}.settings-card{color:white;width:43%;border:.35cqw solid #a4fdff;border-radius:3cqw;background:linear-gradient(150deg,#7336ca,#282079);padding:2.2cqw 3.5cqw;box-shadow:0 1cqw 0 #1a0f6d7a}.settings-star{color:#fff593;font-size:3cqw;line-height:1}.settings-card h2{font-size:2.6cqw;margin:.5cqw 0}.settings-card p{font-size:1.1cqw;line-height:1.8;color:#e0d4ff;margin:.7cqw 0 1.3cqw}.settings-card label{display:flex;align-items:center;justify-content:space-between;font-size:1.3cqw;font-weight:800}.settings-card output{color:#aaffef}.settings-card input[type=range]{display:block;width:100%;min-height:44px;accent-color:#ff8ed6}.settings-voice{justify-content:flex-start!important;gap:.8cqw;min-height:44px;margin-top:.5cqw}.settings-voice input{width:1.6cqw;height:1.6cqw;min-width:20px;min-height:20px;accent-color:#ff93cf}.settings-card .settings-note{font-size:.9cqw}.settings-done{background:#9bffed;border:.2cqw solid #fff;border-radius:4cqw;min-height:44px;width:100%;font-size:1.4cqw;font-weight:900;color:#392074;padding:.9cqw}
/* Empty character space: hints live above the hands at the outer sides. */
.cue,.cue.anticipate,.cue.opening{top:12.5%;left:34%;right:34%;text-align:center;font-size:2cqw;padding:.35cqw .5cqw;border-radius:2cqw;transform:none;z-index:6!important;box-shadow:0 .2cqw 0 #30204c}.cue.anticipate{font-size:1.7cqw}.cue.opening{font-size:2.5cqw}.hint-arrow{display:none}.next-panel{min-width:21%;width:24%;padding:.8cqw 1cqw;background:#3b2172e8;border-color:#b9f9ff;color:#fff;box-shadow:0 .25cqw 0 #22144f}.next-panel small{color:#d3bdff}.next-panel strong{font-size:1.1cqw;line-height:1.5}.next-panel>span{background:#ffa3dc;color:#492278;border-color:white}.progress-panel{background:#332575ed;color:white;border-color:#bbfaff;box-shadow:0 .25cqw 0 #22144f}.progress-panel #timeLabel{color:#dbceff}.progress-track{background:#25175d;border-color:#c0aaff}.progress-track>span{background:linear-gradient(90deg,#90fff2,#ffd2fa)}
/* Results are revealed only after the full completion voice. */
.completion{background:#34218b;backdrop-filter:none}.result-content{position:absolute;top:1%;left:15%;width:70%;height:77%;z-index:2}.result-panel{width:100%;height:100%;object-fit:fill}.result-copy{position:absolute;top:42%;left:10%;right:10%;text-align:center;color:white}.result-copy p{font-size:2cqw;font-weight:900;margin:0 0 1.1cqw}.result-copy h3{font-size:2.1cqw;color:#bcffff;margin:0}.result-star{display:block;width:9%;margin:1.3cqw auto .8cqw}.result-copy small{font-size:1.1cqw;color:#e8d4ff}.result-actions{position:absolute;z-index:3;left:8%;right:8%;bottom:6%;display:flex;gap:3%}.result-actions .art-button{width:31.33%}.completion #confetti{z-index:1}.completion .cosmic-star{width:6%}.result-copy .sr-only{margin:0}
@media(max-width:900px){.home-copy small{font-size:1.25cqw}.home-kicker,.select-heading p{font-size:1.3cqw}.menu-edition{font-size:1cqw}.settings-card{width:51%;padding:2cqw 3.5cqw}.settings-card h2{font-size:2.8cqw}.settings-card p{font-size:1.4cqw;margin:.5cqw 0}.settings-card label{font-size:1.6cqw}.settings-card .settings-note{font-size:1.2cqw}.settings-done{font-size:1.7cqw}.hint-side{font-size:1.2cqw}.hint-foot{font-size:1.4cqw}.next-panel strong{font-size:1.4cqw}.next-panel small{font-size:1.1cqw}.result-copy small{font-size:1.4cqw}.game-tools .icon-button{width:44px;height:44px}.game-tools{gap:.8cqw}.game-top{inset:2% 2% auto}}
@media(orientation:portrait){.cosmic-menu{min-height:100dvh}.menu-stage{width:100%;min-height:650px;aspect-ratio:auto;height:100dvh;container-type:inline-size}.home-logo{width:88%;left:6%;top:8%}.home-copy{left:15%;top:37%}.home-copy p{font-size:5cqw}.home-copy small,.home-kicker{font-size:3cqw}.home-actions{top:59%;left:14%;right:auto;width:72%;gap:3cqw}.menu-edition{font-size:2cqw}.select-logo{width:72%;left:14%;top:3%}.select-heading{top:25%;left:0;right:0;text-align:center}.select-heading h2{font-size:5cqw}.select-heading p{font-size:3cqw}.stage-cards{top:36%;left:9%;right:9%;flex-direction:column;gap:3cqw}.stage-card{width:100%}#selectHome{bottom:3%;left:22%;width:56%}.settings-card{width:85%;padding:7cqw}.settings-card h2{font-size:6cqw}.settings-card p{font-size:3.5cqw}.settings-card label{font-size:4cqw}.settings-card .settings-note{font-size:3cqw}.settings-done{font-size:4cqw}.settings-star{font-size:7cqw}}

.result-copy{inset:0}.result-copy h3{position:absolute;top:57%;left:10%;right:10%;font-size:2.2cqw}.result-copy small{position:absolute;top:80.5%;left:10%;right:10%}

/* v4.1: one eight-beat guide, with the original short speech bubble. */
.beat-box{width:29cqw}.beat-label{font-size:1cqw;font-weight:900;letter-spacing:.1em;margin-bottom:.4cqw;color:#fff!important;text-shadow:0 .1cqw .2cqw #33205c}
.beat-lights{justify-content:center;gap:.35cqw;padding:.55cqw .8cqw;border-color:#c9f8ff;background:#352451f5;box-shadow:0 .2cqw 0 #231544}
.beat-lights i{width:2.5cqw;height:2.5cqw;font-size:1.35cqw;color:#ddd2eb;background:#6a5c7c;border-color:#2b2040;flex:none}
.beat-lights i:nth-child(5){margin-left:.55cqw}.beat-lights i.active{background:#fff293;color:#392751;box-shadow:0 0 .6cqw #fff19a99;transform:scale(1.08)}
.beat-lights i.target{outline:.2cqw solid #ffb6e7;outline-offset:.12cqw;color:#fff}.beat-lights i.active.target{color:#392751}
.beat-box[data-state=prepare] .beat-lights{border-color:#ffb6e7}.beat-box[data-state=turn] .beat-lights{border-color:#fff798;box-shadow:0 0 .7cqw #fff39199}
.cue,.cue.anticipate,.cue.opening,.cue.turn{top:14%;left:44%;right:44%;font-size:2.6cqw;line-height:1.1;padding:.4cqw .5cqw;border:.2cqw solid #342544;border-radius:1.1cqw;background:#fff9ef;color:#342544;box-shadow:.15cqw .25cqw 0 #342544;transform:rotate(-3deg);white-space:nowrap}
.cue::after{content:"";position:absolute;left:28%;bottom:-.6cqw;width:1cqw;height:1cqw;background:inherit;border-right:.2cqw solid #342544;border-bottom:.2cqw solid #342544;transform:skewY(-15deg) rotate(35deg)}
.cue.turn{background:#fff193;transform:rotate(3deg)}
@media(max-width:900px){.beat-lights i{width:2.5cqw;height:2.5cqw;font-size:1.5cqw}.beat-label{font-size:1.2cqw}}