.dance-game{--cream:#fff1ca;--amber:#ffc258;--berry:#511d3a;height:100svh;min-height:600px;color:var(--cream);background:radial-gradient(at 52% 44%,#a84e59 0%,#632840 44%,#361a31 100%);font-family:Avenir Next,Segoe UI,sans-serif;position:relative;overflow:hidden}.dance-canvas{position:absolute;inset:0}.dance-canvas canvas{width:100%;height:100%;display:block}.dance-vignette{pointer-events:none;background:linear-gradient(90deg,#37152b85,#0000 40% 76%,#37152b20),linear-gradient(#0000 65%,#35162ec9);position:absolute;inset:0}.dance-header{z-index:5;border-bottom:1px solid #ffe7c71c;justify-content:space-between;align-items:center;height:76px;padding:0 4%;display:flex;position:relative}.dance-back{align-items:center;gap:10px;font-size:15px;font-weight:600;display:flex}.dance-small-brand{text-transform:uppercase;letter-spacing:-.5px;font-family:Impact,Arial Narrow,sans-serif;font-size:28px}.dance-tools{gap:8px;display:flex}.dance-tools button{border:1px solid #ffe9c633;border-radius:50%;place-items:center;min-width:42px;height:42px;display:grid}.dance-tools button[aria-pressed=true]{color:#511d3a;background:#fff1ca}:is(.dance-game button:focus-visible,.dance-game a:focus-visible){outline-offset:4px;outline:3px solid #ffe4a0}.dance-scoreboard{z-index:3;gap:35px;display:flex;position:absolute;top:105px;right:4%}.dance-scoreboard>div{flex-direction:column;gap:4px;min-width:60px;display:flex}.dance-scoreboard span{color:#f4c7c4;font-size:12px}.dance-scoreboard strong{font-variant-numeric:tabular-nums;font-size:29px;font-weight:500}.dance-scoreboard small{margin-left:2px;font-size:16px}.dance-progress{z-index:6;background:#fff0ca15;height:3px;position:absolute;top:76px;left:0;right:0}.dance-progress i{background:var(--amber);height:100%;display:block}.dance-intro{z-index:3;width:290px;position:absolute;top:18%;left:5%}.dance-intro h1{text-transform:uppercase;letter-spacing:-3px;color:var(--amber);text-shadow:4px 6px #773238;margin:0 0 23px;font-family:Impact,Haettenschweiler,Arial Narrow,sans-serif;font-size:clamp(80px,8.6vw,148px);font-weight:400;line-height:.78;transform:rotate(-5deg)}.dance-tagline{margin:25px 0 16px;font-size:24px;font-weight:500;line-height:1.25}.dance-how{color:#f2ccc8;max-width:265px;margin:0 0 22px;font-size:14px;line-height:1.65}.dance-start{background:var(--amber);color:#502238;border:1px solid #ffe5ad;border-radius:7px;justify-content:center;align-items:center;gap:12px;min-height:54px;padding:12px 25px;font-size:16px;font-weight:700;transition:transform .15s,background .15s;display:flex;box-shadow:0 4px #9b4849}.dance-start:hover{background:#ffd287;transform:translateY(-2px)}.dance-start:active{box-shadow:none;transform:translateY(2px)}.dance-start:disabled{opacity:.7;cursor:wait}.dance-session,.dance-best,.dance-loading-model{color:#f3c6c7;margin-top:15px;font-size:12px;line-height:1.5;display:block}.dance-best{color:#ffe5b4;margin-top:8px}.dance-loading-model{margin-top:8px}.dance-error{color:#fff1ca;border-left:3px solid #ffc258;max-width:300px;padding-left:12px;font-size:14px}.dance-model-error{text-align:center;z-index:2;background:#361a31bb;border-radius:7px;max-width:260px;padding:14px;font-size:14px;position:absolute;top:22%;left:50%;transform:translate(-50%)}.dance-pads{z-index:6;grid-template-columns:repeat(4,1fr);gap:14px;width:350px;display:grid;position:absolute;bottom:59px;left:50%;transform:translate(-50%)}.dance-pad{--lane:#ffc258;min-height:72px;color:var(--lane);border:1px solid color-mix(in srgb,var(--lane) 55%,transparent);touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#3c203bd9;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex;box-shadow:0 4px #24172b}.dance-pad span{font-size:12px}.dance-pad:active:not(:disabled){background:var(--lane);color:#352034;box-shadow:none;transform:translateY(3px)}.dance-pad:disabled{opacity:.45;cursor:default}.lane-0{--lane:#ffc258}.lane-1{--lane:#f39cad}.lane-2{--lane:#83ddd0}.lane-3{--lane:#bcafff}.dance-runway{z-index:4;pointer-events:none;grid-template-columns:repeat(4,1fr);gap:14px;width:350px;height:min(240px,30vh);display:grid;position:absolute;bottom:157px;left:50%;overflow:visible;transform:translate(-50%)}.dance-lane{background:linear-gradient(#0000,#321d387a);border-radius:30px 30px 0 0;position:relative}.dance-lane-line{background:linear-gradient(#0000,#ffe8ce40);width:1px;position:absolute;top:20px;bottom:0;left:50%}.dance-target{border:2px solid var(--lane);width:56px;height:56px;color:var(--lane);background:#301d3be6;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:0;left:50%;transform:translate(-50%,50%);box-shadow:0 0 20px #24172580}.dance-note{color:#382338;background:var(--lane);z-index:2;border:2px solid #fff3d5;border-radius:12px;place-items:center;width:47px;height:47px;display:grid;position:absolute;left:50%;transform:translate(-50%,50%);box-shadow:0 3px #612a50}.dance-callout{z-index:4;pointer-events:none;white-space:nowrap;flex-direction:column;align-items:center;display:flex;position:absolute;top:29%;left:50%;transform:translate(-50%)}.dance-callout strong{text-transform:uppercase;letter-spacing:-.7px;color:#fff1ca;text-shadow:0 3px #8c3a54;font-family:Impact,Arial Narrow,sans-serif;font-size:42px;font-weight:400}.dance-callout span{color:#ffdcaf;min-height:20px;font-size:13px}.dance-callout[data-kind=miss] strong{color:#eeb8c8;font-size:27px}.dance-overlay{-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);z-index:10;text-align:center;background:#33162bd9;justify-content:center;align-items:center;padding:30px;display:flex;position:absolute;inset:79px 0 0;overflow:auto}.dance-overlay>div{width:100%;max-width:600px}.dance-overlay-note{color:#ffce90;font-size:14px}.dance-overlay h2{text-transform:uppercase;letter-spacing:-.8px;margin:13px 0 17px;font:400 clamp(40px,5vw,65px)/1 Impact,Arial Narrow,sans-serif}.dance-overlay p{color:#edc4c8;font-size:15px;line-height:1.6}.dance-overlay .dance-start{width:fit-content;margin:24px auto 0}.dance-secondary{color:#ffe2bc;justify-content:center;align-items:center;gap:9px;min-height:40px;margin:18px auto 0;font-size:14px;display:flex}.dance-final-score{color:var(--amber);font-variant-numeric:tabular-nums;font:400 clamp(60px,7vw,90px)/1 Impact,Arial Narrow,sans-serif}.dance-results-stats{justify-content:center;align-items:center;gap:45px;margin:28px 0 20px;display:flex}.dance-results-stats>span{color:#edc4c8;flex-direction:column;gap:6px;font-size:13px;display:flex}.dance-results-stats b{color:#fff0ca;font-size:25px;font-weight:500}.dance-footer{z-index:6;color:#edbdc4;justify-content:space-between;align-items:center;font-size:12px;display:flex;position:absolute;bottom:10px;left:4%;right:4%}.dance-footer>span{align-items:center;gap:7px;display:flex}.dance-footer button{font-size:12px}.dance-credits p{font-size:14px;line-height:1.7}.dance-credits a{text-decoration:underline}.dance-game[data-phase=playing] .dance-small-brand{color:#ffc258}.dance-reduced *{transition:none!important}.dance-reduced .dance-note{border-radius:5px}@media (max-width:1050px){.dance-intro{width:250px;left:4%}.dance-intro h1{font-size:100px}.dance-tagline{font-size:21px}.dance-how{max-width:205px}.dance-scoreboard{gap:20px}.dance-scoreboard strong{font-size:25px}}@media (max-width:720px){.dance-game{height:100svh;min-height:600px}.dance-header{height:64px;padding:0 5%}.dance-small-brand{font-size:24px}.dance-back span{display:none}.dance-tools{gap:6px}.dance-tools button{min-width:36px;height:36px}.dance-progress{top:64px}.dance-scoreboard{justify-content:space-between;gap:15px;top:83px;left:7%;right:7%}.dance-scoreboard strong{font-size:24px}.dance-scoreboard span{font-size:12px}.dance-intro{background:linear-gradient(#0000,#421c35dd);grid-template-columns:1fr 1fr;align-items:end;gap:10px 20px;width:auto;padding:20px 0 10px;display:grid;inset:auto 6% 170px}.dance-intro h1{letter-spacing:-2px;grid-row:1/3;margin:0 0 12px;font-size:78px}.dance-tagline{margin:0;font-size:18px}.dance-how{max-width:210px;margin:0;font-size:13px;line-height:1.4}.dance-start{grid-column:1/-1;justify-self:stretch;min-height:50px}.dance-session{text-align:center;grid-column:1/-1;margin-top:5px;font-size:12px}.dance-best,.dance-loading-model{text-align:center;grid-column:1/-1;margin:0;font-size:12px}.dance-error{grid-column:1/-1;max-width:none;margin:0}.dance-pads{gap:12px;width:calc(100% - 44px);max-width:390px;bottom:59px}.dance-pad{min-height:70px}.dance-runway{gap:12px;width:calc(100% - 44px);max-width:390px;height:230px;bottom:154px}.dance-note{width:45px;height:45px}.dance-target{width:53px;height:53px}.dance-callout{top:25%}.dance-callout strong{font-size:39px}.dance-overlay{padding:25px;inset:67px 0 0}.dance-results-stats{gap:30px}.dance-footer{left:6%;right:6%}.dance-footer>span{font-size:11px}.dance-model-error{max-width:240px;top:30%}.dance-game[data-phase=ready] .dance-canvas,.dance-game[data-phase=loading] .dance-canvas{top:80px;bottom:180px}.dance-game[data-phase=playing] .dance-canvas{top:90px;bottom:140px}}@media (max-width:390px){.dance-intro{gap:10px 14px;bottom:158px}.dance-intro h1{font-size:68px}.dance-tagline{font-size:16px}.dance-how{font-size:12px}.dance-session{font-size:11px}.dance-small-brand{font-size:22px}.dance-results-stats{gap:24px}}@media (min-width:721px) and (max-height:820px){.dance-intro{top:17%}.dance-intro h1{font-size:100px}.dance-tagline{margin:20px 0 12px;font-size:20px}.dance-how{margin-bottom:16px;font-size:13px}.dance-runway{height:190px}}@media (max-width:720px) and (max-height:740px){.dance-intro{gap:7px 14px;padding:14px 0 8px;bottom:145px}.dance-intro h1{font-size:66px}.dance-tagline{font-size:16px}.dance-how{font-size:12px}.dance-start{min-height:45px;padding:9px 20px;font-size:15px}.dance-session{margin-top:3px}.dance-loading-model{display:none}.dance-pads{bottom:46px}.dance-pad{min-height:64px}.dance-runway{height:170px;bottom:134px}.dance-footer{bottom:2px}.dance-callout{top:24%}.dance-callout strong{font-size:31px}.dance-game[data-phase=ready] .dance-canvas,.dance-game[data-phase=loading] .dance-canvas{top:65px;bottom:150px}}progress.dance-progress{-webkit-appearance:none;appearance:none;color:#ffc258;border:0;border-radius:0;width:100%}progress.dance-progress::-webkit-progress-bar{background:#fff0ca15}progress.dance-progress::-webkit-progress-value{background:#ffc258}progress.dance-progress::-moz-progress-bar{background:#ffc258}