:root{--gb-bg-dim: #f3eac7;--gb-bg0: #f9f5d7;--gb-bg1: #f5edca;--gb-bg2: #f3eac7;--gb-bg3: #f2e5bc;--gb-bg4: #eee0b7;--gb-bg5: #ebdbb2;--gb-fg0: #654735;--gb-fg1: #4f3829;--gb-red: #c14a4a;--gb-orange: #c35e0a;--gb-yellow: #b47109;--gb-green: #6c782e;--gb-aqua: #4c7a5d;--gb-blue: #45707a;--gb-purple: #945e80;--gb-grey0: #a89984;--gb-grey1: #928374;--gb-grey2: #7c6f64;--gb-visual-yellow: #f9eabf;--gb-visual-red: #f0ddc3;--gb-visual-blue: #d9e1cc;--md-primary: var(--gb-orange);--md-on-primary: var(--gb-bg0);--md-primary-container: #f5d2a6;--md-on-primary-container: #5a2a00;--md-secondary: var(--gb-yellow);--md-secondary-container: #e9c77c;--md-on-secondary-container: #4a2e00;--md-tertiary: var(--gb-purple);--md-tertiary-container: #efd6e4;--md-on-tertiary-container: #4a2a3e;--md-error: var(--gb-red);--md-error-container: var(--gb-visual-red);--md-on-error-container: #6a1e1e;--md-surface: var(--gb-bg0);--md-surface-dim: var(--gb-bg-dim);--md-surface-container-lowest: #fdfae6;--md-surface-container-low: var(--gb-bg1);--md-surface-container: var(--gb-bg1);--md-surface-container-high: var(--gb-bg4);--md-surface-container-highest: var(--gb-bg4);--md-on-surface: var(--gb-fg1);--md-on-surface-variant: var(--gb-grey2);--md-outline: var(--gb-grey1);--md-outline-variant: var(--gb-bg5);--md-elev-1: 0 1px 2px rgba(79, 56, 41, .18), 0 1px 3px 1px rgba(79, 56, 41, .1);--md-elev-2: 0 1px 2px rgba(79, 56, 41, .2), 0 2px 6px 2px rgba(79, 56, 41, .12);color-scheme:light}:root[data-theme=dark]{--gb-bg-dim: #141617;--gb-bg0: #1d2021;--gb-bg1: #282828;--gb-bg2: #282828;--gb-bg3: #3c3836;--gb-bg4: #3c3836;--gb-bg5: #504945;--gb-fg0: #d4be98;--gb-fg1: #ddc7a1;--gb-red: #ea6962;--gb-orange: #e78a4e;--gb-yellow: #d8a657;--gb-green: #a9b665;--gb-aqua: #89b482;--gb-blue: #7daea3;--gb-purple: #d3869b;--gb-grey0: #7c6f64;--gb-grey1: #928374;--gb-grey2: #a89984;--gb-visual-yellow: #473c29;--gb-visual-red: #442e2d;--gb-visual-blue: #2e3b3b;--md-primary: var(--gb-orange);--md-on-primary: #2a1200;--md-primary-container: #5c3a1e;--md-on-primary-container: #f5d2a6;--md-secondary: var(--gb-yellow);--md-secondary-container: var(--gb-visual-yellow);--md-on-secondary-container: #ecd39a;--md-tertiary: var(--gb-purple);--md-tertiary-container: #4a3340;--md-on-tertiary-container: #efc5d7;--md-error: var(--gb-red);--md-error-container: var(--gb-visual-red);--md-on-error-container: #f4b8b3;--md-surface: var(--gb-bg0);--md-surface-dim: var(--gb-bg-dim);--md-surface-container-lowest: #161819;--md-surface-container-low: var(--gb-bg1);--md-surface-container: #32302f;--md-surface-container-high: var(--gb-bg3);--md-surface-container-highest: #45403d;--md-on-surface: var(--gb-fg0);--md-on-surface-variant: var(--gb-grey2);--md-outline: var(--gb-grey1);--md-outline-variant: var(--gb-bg5);--md-elev-1: 0 1px 2px rgba(0, 0, 0, .35), 0 1px 3px 1px rgba(0, 0, 0, .2);--md-elev-2: 0 1px 2px rgba(0, 0, 0, .4), 0 2px 6px 2px rgba(0, 0, 0, .25);color-scheme:dark}:root{--bg: var(--md-surface);--text: var(--md-on-surface);--muted: var(--md-on-surface-variant);--accent: var(--md-primary);--danger: var(--md-error);--shape-xs: 4px;--shape-sm: 8px;--shape-md: 12px;--shape-lg: 16px;--shape-xl: 28px;--shape-full: 999px}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Roboto,Roboto Flex,system-ui,-apple-system,Segoe UI,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5}#app{min-height:100dvh;display:flex;flex-direction:column}main{flex:1;width:100%;max-width:560px;margin:0 auto;padding:16px 16px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}h1,h2,h3{margin:0;font-weight:400}h1{font-size:2.25rem;line-height:2.75rem}h2{font-size:1.375rem;line-height:1.75rem}h3{font-size:.875rem;line-height:1.25rem;font-weight:500;letter-spacing:.1px;color:var(--muted)}p{margin:0}a{color:var(--md-primary);text-decoration:none}strong{font-weight:600}.muted{color:var(--muted)}.small{font-size:.875rem;line-height:1.25rem;letter-spacing:.25px}.center{text-align:center}.row{display:flex;gap:8px;align-items:center}.row.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.stack{display:flex;flex-direction:column;gap:10px}.card{background:var(--md-surface-container-low);border:1px solid transparent;border-radius:var(--shape-md);padding:16px;display:flex;flex-direction:column;gap:12px}.card.accent{background:var(--md-surface-container-lowest);border-color:var(--md-outline-variant);box-shadow:var(--md-elev-1)}.card.gold{background:var(--md-tertiary-container);color:var(--md-on-tertiary-container)}.card.gold .muted{color:color-mix(in srgb,var(--md-on-tertiary-container) 80%,transparent)}.card.revealed{background:var(--md-primary-container);color:var(--md-on-primary-container)}.card.revealed .muted{color:color-mix(in srgb,var(--md-on-primary-container) 80%,transparent)}button,.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:var(--md-secondary-container);color:var(--md-on-secondary-container);font:inherit;font-size:.875rem;font-weight:500;letter-spacing:.1px;padding:0 24px;height:40px;min-height:40px;border-radius:var(--shape-full);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;position:relative;overflow:hidden;transition:box-shadow .15s ease,opacity .15s;-webkit-tap-highlight-color:transparent}button:after,.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:currentColor;opacity:0;transition:opacity .15s;pointer-events:none}button:hover:after,.btn:hover:after{opacity:.08}button:active:after,.btn:active:after{opacity:.12}button:disabled,.btn[aria-disabled=true]{opacity:.38;cursor:not-allowed}button:disabled:after{opacity:0!important}.btn-primary{background:var(--md-primary);color:var(--md-on-primary)}.btn-primary:hover{box-shadow:var(--md-elev-1)}.btn-gold{background:var(--md-tertiary);color:var(--md-surface)}.btn-danger{background:transparent;color:var(--md-error);border:1px solid var(--md-outline)}.btn-ghost{background:transparent;color:var(--md-primary);padding:0 12px}.btn-block{width:100%}.btn-lg{height:56px;min-height:56px;font-size:1rem;border-radius:var(--shape-lg)}.btn-sm{height:32px;min-height:32px;padding:0 14px;font-size:.8125rem}input[type=text],input[type=url]{width:100%;font:inherit;padding:14px 16px;height:56px;border-radius:var(--shape-sm);border:none;background:var(--md-surface-container-highest);color:var(--text);transition:box-shadow .15s}input::placeholder{color:var(--md-on-surface-variant)}input:hover{box-shadow:inset 0 0 0 1px var(--md-outline-variant)}input:focus{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--md-primary) 22%,transparent)}input.code{text-transform:uppercase;letter-spacing:.3em;font-weight:500;font-size:1.5rem;text-align:center}.pill{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:var(--shape-sm);font-size:.8125rem;font-weight:500;letter-spacing:.1px;background:transparent;color:var(--md-on-surface-variant);border:1px solid var(--md-outline-variant);white-space:nowrap}.pill.ok{color:var(--md-on-secondary-container);background:var(--md-secondary-container);border-color:transparent}.pill.warn{color:var(--md-on-error-container);background:var(--md-error-container);border-color:transparent}.pill.host{color:var(--md-on-tertiary-container);background:var(--md-tertiary-container);border-color:transparent}.pill.gold{color:var(--md-on-tertiary-container);background:var(--md-tertiary-container);border-color:transparent;font-variant-numeric:tabular-nums}.topbar{position:sticky;top:0;z-index:5;background:var(--md-surface);padding:0 8px 0 16px;padding-top:env(safe-area-inset-top)}.topbar .inner{max-width:560px;margin:0 auto;height:64px;display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}.topbar .inner>.row{min-width:0;flex:none}.brand{font-size:1.375rem;display:flex;gap:10px;align-items:center;min-width:0}.brand .label{overflow:hidden;text-overflow:ellipsis}.brand svg{width:24px;height:24px;color:var(--md-primary)}.brand{white-space:nowrap}.code-pill{font-weight:500;letter-spacing:.18em;padding-left:14px;color:var(--md-on-surface);background:var(--md-surface-container-high);border-color:transparent}.topbar .btn-ghost{width:40px;padding:0;color:var(--md-on-surface-variant);font-size:1.1rem}.hostbar{position:sticky;bottom:0;z-index:5;margin:auto -16px calc(-24px - env(safe-area-inset-bottom));padding-top:8px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--md-surface-container);border-top:1px solid var(--md-outline-variant);display:flex;flex-direction:column;gap:10px}.player-list{display:flex;flex-direction:column;gap:2px}.player{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 10px;border-radius:var(--shape-md);background:var(--md-surface-container)}.player.me{background:var(--md-surface-container-high)}.player .name{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player .avatar{position:relative;flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--md-primary-container);color:var(--md-on-primary-container);font-weight:600;font-size:.95rem}.player .dot{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:var(--md-outline-variant);border:2px solid var(--md-surface-container)}.player.me .dot{border-color:var(--md-surface-container-high)}.player .dot.on{background:var(--gb-blue)}.track{display:flex;gap:14px;align-items:center}.track img,.track .art{width:72px;height:72px;border-radius:var(--shape-md);object-fit:cover;background:var(--md-surface-container-highest);flex:none}.track.big img,.track.big .art{width:108px;height:108px;border-radius:var(--shape-lg)}.track .title{font-weight:500;font-size:1.125rem;line-height:1.5rem}.track.big .title{font-size:1.375rem;line-height:1.75rem}.track .sub{color:var(--muted)}.vote-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.vote-grid button{height:auto;min-height:60px;padding:10px 12px;border-radius:var(--shape-md);font-size:1.0625rem;line-height:1.25;white-space:normal;overflow-wrap:anywhere}.vote-grid button.selected{background:var(--md-primary);color:var(--md-on-primary);box-shadow:var(--md-elev-1)}.card.hero{flex:1 1 auto;min-height:0;justify-content:center}.card.hero .track.big{flex-direction:column;align-items:stretch;text-align:center;gap:12px;flex:1 1 auto;min-height:0}.card.hero .track.big .artwrap{flex:1 1 auto;min-height:108px;width:auto;height:auto}.card.hero .track.big>.grow{flex:none}.card.hero .track.big .artwrap img,.card.hero .track.big .artwrap .art{top:0;right:0;bottom:0;left:0;margin:auto;width:var(--s, 108px);height:var(--s, 108px);border-radius:var(--shape-lg)}.result{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 12px;border-radius:var(--shape-sm);background:var(--md-surface-container)}.result .mark{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;font-weight:700;flex:none}.result.correct .mark{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.result.wrong .mark{background:var(--md-error-container);color:var(--md-on-error-container)}.scoreboard{display:flex;flex-direction:column;gap:4px}.score-row{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 16px;border-radius:var(--shape-md);background:var(--md-surface-container)}.score-row .rank{width:24px;color:var(--muted);font-variant-numeric:tabular-nums}.score-row.first{background:var(--md-primary-container);color:var(--md-on-primary-container)}.score-row.first .rank{color:inherit}.score-row .pts{font-weight:500;font-size:1.375rem;font-variant-numeric:tabular-nums}.qr{display:block;width:176px;height:176px;border-radius:var(--shape-md);background:#fff;padding:10px;margin:0 auto}.toast-wrap{position:fixed;left:0;right:0;bottom:calc(100px + env(safe-area-inset-bottom));z-index:50;display:flex;justify-content:center;padding:0 16px;pointer-events:none}.toast{pointer-events:auto;max-width:520px;min-height:56px;padding:14px 20px;border-radius:var(--shape-md);background:var(--md-on-surface);color:var(--md-surface);box-shadow:var(--md-elev-2);font-size:1.0625rem;line-height:1.4;font-weight:500;text-align:center;animation:toast-in .28s cubic-bezier(.2,.8,.2,1) both}@keyframes toast-in{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.toast{animation:none}}.toast:not(.info){color:var(--md-error-container)}:root[data-theme=dark] .toast:not(.info){color:var(--gb-red)}.list{display:flex;flex-direction:column;gap:2px;max-height:50vh;overflow:auto}.list button{justify-content:flex-start;text-align:left;font-weight:400;height:auto;min-height:48px;padding:8px 12px;border-radius:var(--shape-sm);background:var(--md-surface-container);color:var(--md-on-surface)}details.card:not([open]){gap:0}details summary{cursor:pointer;font-weight:500;font-size:.875rem;letter-spacing:.1px;color:var(--md-primary);list-style:none;display:flex;align-items:center;gap:8px;min-height:40px}details summary:before{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s;margin:0 6px 0 4px}details[open] summary:before{transform:rotate(45deg)}kbd{font:inherit;font-weight:500;padding:0 6px;border-radius:var(--shape-xs);background:var(--md-surface-container-highest)}.step{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--md-primary-container);color:var(--md-on-primary-container);font-weight:500;font-size:.875rem;flex:none}main.landing{gap:16px}.intro{padding:28px 0 0;display:flex;flex-direction:column;align-items:center;gap:12px}.intro .mark{width:72px;height:72px;border-radius:var(--shape-xl);background:var(--md-primary-container);color:var(--md-on-primary-container);display:grid;place-items:center}.intro .mark svg{width:36px;height:36px}.intro.compact{padding-top:0}main.joinpage{gap:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}main.joinpage form.card{gap:8px}@media(max-height:520px){.intro.compact{display:none}}.fade{animation:fade .2s ease}@keyframes fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.segmented{display:flex;border:1px solid var(--md-outline);border-radius:var(--shape-full);overflow:hidden}.segmented button{flex:1;height:40px;min-height:40px;padding:0 8px;border-radius:0;background:transparent;color:var(--md-on-surface);font-size:.8125rem;border-left:1px solid var(--md-outline)}.segmented button:first-child{border-left:none}.segmented button.selected{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.list .thumb{width:40px;height:40px;border-radius:var(--shape-xs);object-fit:cover;flex:none;background:var(--md-surface-container-highest)}.listen{display:flex;flex-direction:column;gap:10px}.listen .play{width:48px;height:48px;min-height:48px;padding:0;border-radius:50%;font-size:.9rem;flex:none}.listen .ring{position:relative;display:grid;place-items:center;flex:none;padding:5px;border-radius:50%}.listen .ring:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(var(--md-primary) var(--p, 0%),color-mix(in srgb,currentColor 16%,transparent) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));opacity:0;transition:opacity .2s}.listen .ring.active:before{opacity:1}.listen .ring .play{position:relative}.standings{display:flex;flex-direction:column;gap:6px}.standing{display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 14px;border-radius:var(--shape-md);background:var(--md-surface-container);transition:background .4s ease}.standing.me{box-shadow:inset 0 0 0 1px var(--md-outline-variant)}.standing.first{background:var(--md-primary-container);color:var(--md-on-primary-container)}.standing .rank{width:24px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--muted)}.standing.first .rank{color:inherit}.standing .who{display:flex;flex-direction:column;gap:4px;min-width:0}.standing .nm{font-weight:500}.standing .move{font-size:.8rem;font-weight:600}.standing .move.up{color:var(--gb-green)}.standing .move.down{color:var(--gb-red)}.standing .pts{font-weight:500;font-size:1.375rem;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:6px}.standing .gain{font-size:.8rem;font-weight:600;color:var(--md-primary)}.standing.first .gain{color:inherit}.pill.streak{color:var(--gb-orange);background:color-mix(in srgb,var(--gb-orange) 14%,transparent);border-color:transparent}.pill.streak.hot{color:var(--gb-red);background:color-mix(in srgb,var(--gb-red) 14%,transparent)}.pill.streak.blazing{color:var(--md-on-primary);background:var(--gb-red)}.podium-wrap{position:relative;overflow:hidden;padding-bottom:8px}.podium{display:flex;gap:10px;align-items:flex-end;margin-top:20px;min-height:220px}.podium .pstep{flex:1;min-width:0}.podium .pstep.tied{flex:2}.podium.single{justify-content:center}.podium.single .pstep{flex:0 1 70%}.podium .names{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%}.podium .tie{opacity:.8}.podium .pstep{display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateY(40px);opacity:0;animation:rise .7s cubic-bezier(.2,.8,.2,1) forwards}.podium .nm{font-weight:500;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.podium .block{width:100%;border-radius:var(--shape-md) var(--shape-md) 0 0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;padding-top:12px;background:var(--md-surface-container-high)}.podium .p1 .block{height:150px;background:var(--md-primary);color:var(--md-on-primary)}.podium .p2 .block{height:110px;background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.podium .p3 .block{height:80px;background:var(--md-tertiary-container);color:var(--md-on-tertiary-container)}.podium .medal{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:color-mix(in srgb,currentColor 18%,transparent)}.podium .score{font-size:1.5rem;font-weight:500;font-variant-numeric:tabular-nums}.invite .pill.code{letter-spacing:.2em;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.qr-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;overscroll-behavior:contain;touch-action:none;display:grid;place-items:center;padding:24px;background:color-mix(in srgb,var(--md-surface) 96%,transparent);cursor:pointer;animation:fadein .15s ease}.qr-sheet{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;max-width:100%}.qr-sheet .qr{width:min(80vw,60vh,420px);height:min(80vw,60vh,420px);padding:16px;border-radius:var(--shape-lg);background:#fff;box-shadow:0 12px 40px #0000002e}.qr-sheet .qr-code{font-size:2rem;font-weight:600;letter-spacing:.3em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;margin-top:6px}.qr-sheet .qr-url{word-break:break-all;color:var(--muted)}.qr-sheet .qr-hint{color:var(--muted);margin-top:8px}@keyframes fadein{0%{opacity:0}to{opacity:1}}.linkcopy{display:flex;flex-direction:column;align-items:flex-start;gap:2px;height:auto;min-height:44px;padding:6px 10px;border-radius:var(--shape-sm);background:transparent;color:var(--md-on-surface);text-align:left;white-space:normal;line-height:1.3}.linkcopy strong{word-break:break-all}.linkcopy .hint{color:var(--md-primary);font-weight:500}.linkcopy:hover{background:var(--md-surface-container)}.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}.seg button{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;padding:12px 14px;height:auto;min-height:64px;white-space:normal;line-height:1.3;border-radius:var(--shape-md);border:1px solid var(--md-outline-variant);background:var(--md-surface-container);color:var(--md-on-surface);text-align:left}.seg button .t{font-weight:500;font-size:1rem}.seg button .small{color:var(--muted)}.seg button.on{background:var(--md-primary-container);color:var(--md-on-primary-container);border-color:transparent}.seg button.on .small{color:inherit;opacity:.85}.pill.scoreline{font-variant-numeric:tabular-nums}.duet-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:minmax(140px,1fr);gap:10px;flex:1 1 auto;min-height:0}.duet-grid .song{container-type:size;display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:10px;border-radius:var(--shape-lg);background:var(--md-surface-container);border:2px solid transparent;min-width:0}.duet-grid .song.pickable{cursor:pointer}.duet-grid .song.selected{border-color:var(--md-primary);background:var(--md-primary-container);color:var(--md-on-primary-container)}.duet-grid .song.selected .muted{color:inherit;opacity:.8}.duet-grid .song.correct{border-color:var(--md-primary);background:var(--md-primary-container);color:var(--md-on-primary-container)}.duet-grid .song.wrong{border-color:var(--md-error);background:var(--md-error-container);color:var(--md-on-error-container)}.duet-grid .song .head{display:flex;gap:10px;align-items:center;min-width:0;min-height:0;flex:1 1 auto}.duet-grid .song .art{--s: clamp(48px, min( calc(100cqh - 52px) , 38cqw), 96px);position:relative;flex:none;width:var(--s);height:var(--s);border-radius:var(--shape-sm, 8px);background:var(--md-surface-container-highest);overflow:hidden}.duet-grid .song .art img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.duet-grid .song .mark{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-weight:700;font-size:1.1rem;background:color-mix(in srgb,var(--md-primary) 85%,transparent);color:var(--md-on-primary)}.duet-grid .song .mark.bad{background:color-mix(in srgb,var(--md-error) 85%,transparent);color:var(--md-on-error)}@media(min-height:760px){.duet-grid .song .head{flex-direction:column;align-items:stretch;gap:8px}.duet-grid .song .art{--s: clamp(48px, calc(100cqh - 126px) , 100cqw);align-self:center}.duet-grid .song .title{font-size:1rem}}.duet-grid .song .title{font-weight:500;font-size:.9375rem;line-height:1.2;overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.duet-grid .song .sub{overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2}.listen.compact{flex-direction:row;align-items:center;gap:8px}.listen.compact .play{width:36px;height:36px;min-height:36px;font-size:.75rem;box-sizing:border-box;border:1.5px solid var(--md-outline);background:var(--md-surface-container-low);color:var(--md-on-surface)}.listen.compact .ring{padding:4px}.listen.compact .spotify-pill{flex:1 1 auto;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 12px;border-radius:var(--shape-full);background:var(--md-primary);color:var(--md-on-primary);font-weight:500;font-size:.8125rem;white-space:nowrap;text-decoration:none}.listen.compact .spotify-pill svg{width:18px;height:18px;margin:0;color:inherit;flex:none}.listen.compact .spotify-pill .short{display:none}@container (max-width: 176px){.listen.compact .spotify-pill .long{display:none}.listen.compact .spotify-pill .short{display:inline}}.listen.compact .spotify-pill:hover{filter:brightness(1.06)}.duet-grid .song.selected .listen.compact .play,.duet-grid .song.correct .listen.compact .play,.duet-grid .song.wrong .listen.compact .play{border-color:currentColor;color:inherit;background:transparent}.duet-grid .song.selected .listen.compact .ring:before,.duet-grid .song.correct .listen.compact .ring:before{background:conic-gradient(currentColor var(--p, 0%),color-mix(in srgb,currentColor 16%,transparent) 0)}.duet-scores{display:grid;grid-template-columns:1fr 1fr;gap:12px}.duet-scores .tile{display:flex;flex-direction:column;align-items:center;gap:2px;padding:20px 12px;border-radius:var(--shape-lg);background:var(--md-surface-container)}.duet-scores .tile.winner{background:var(--md-primary);color:var(--md-on-primary)}.duet-scores .tile.winner .muted{color:inherit;opacity:.85}.duet-scores .tile .nm{font-weight:500}.duet-scores .tile .big{font-size:3rem;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}.overlap .stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.egg{display:flex;flex-direction:column}.egg-body{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:24px 8px}.egg-body h1{font-size:2.25rem;line-height:1.15}.egg-sub{font-size:1.25rem;line-height:1.45;max-width:26ch}.egg-wave{width:min(100%,320px);height:80px;overflow:hidden;fill:none;stroke-width:4;stroke-linecap:round;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}.egg-wave path{animation:wave 2.4s linear infinite}.egg-wave .w1{stroke:var(--md-primary)}.egg-wave .w2{stroke:var(--md-tertiary);animation-delay:-.8s;opacity:.85}@keyframes wave{0%{transform:translate(0)}to{transform:translate(-120px)}}@media(prefers-reduced-motion:reduce){.egg-wave path{animation:none}.egg-wave .w2{transform:translate(-40px)}}.overlap .stat{display:flex;flex-direction:column;gap:2px;min-width:0}.overlap .pct{font-size:2.25rem;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}a.pill.follow{color:var(--md-on-secondary-container);background:var(--md-secondary-container);border-color:transparent;text-decoration:none}a.pill.follow svg{flex:none}@keyframes rise{to{transform:none;opacity:1}}.confetti{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;opacity:0;animation-name:fall;animation-timing-function:linear;animation-iteration-count:2}.confetti.c0{background:var(--gb-orange)}.confetti.c1{background:var(--gb-yellow)}.confetti.c2{background:var(--gb-purple)}.confetti.c3{background:var(--gb-blue)}.confetti.c4{background:var(--gb-red)}.confetti.c5{background:var(--gb-aqua)}@keyframes fall{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:1}to{transform:translateY(320px) rotate(540deg);opacity:0}}@media(prefers-reduced-motion:reduce){.podium .pstep{animation:none;transform:none;opacity:1}.confetti{display:none}}.vote-grid button:disabled{opacity:.55}.vote-grid button.correct:disabled{opacity:1;background:var(--md-primary);color:var(--md-on-primary);box-shadow:none}.vote-grid button.wrong:disabled{opacity:1;background:var(--md-error-container);color:var(--md-on-error-container);box-shadow:inset 0 0 0 2px var(--md-error)}.verdict{font-size:1.125rem;font-weight:500}.verdict.ok{color:var(--md-primary)}.verdict.bad{color:var(--md-error)}.stepper{display:inline-flex;align-items:center;border:1px solid var(--md-outline);border-radius:var(--shape-full);overflow:hidden}.stepper button{width:44px;height:40px;min-height:40px;padding:0;border-radius:0;background:transparent;color:var(--md-on-surface);font-size:1.2rem}.stepper .val{min-width:32px;text-align:center;font-weight:500;font-variant-numeric:tabular-nums}.slot{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:var(--shape-md);background:var(--md-surface-container)}.slot.choosing{background:var(--md-surface-container-high)}.shimmer{background:linear-gradient(90deg,var(--md-surface-container-highest) 25%,color-mix(in srgb,var(--md-surface-container-highest) 55%,var(--md-surface)) 50%,var(--md-surface-container-highest) 75%);background-size:200% 100%;animation:shimmer 1.1s linear infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.track .artwrap{position:relative;width:72px;height:72px;flex:none}.track.big .artwrap{width:108px;height:108px}.track .artwrap .art,.track .artwrap img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.track img.hidden{opacity:0}.track img{transition:opacity .2s ease}.track .bar{height:14px;border-radius:7px;margin:6px 0}.track .bar.small{height:11px}.track.big .bar{height:18px}@media(prefers-reduced-motion:reduce){.shimmer{animation:none}}.spin{display:inline-block;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .8s linear infinite;flex:none}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spin{animation-duration:2s}}.idle{max-width:540px;margin:12px auto 0;padding:10px 14px;border-radius:var(--shape-md);background:var(--md-error-container);color:var(--md-on-error-container);display:flex;align-items:center;gap:10px;font-size:.875rem}.idle button{background:var(--md-error);color:var(--md-error-container)}.icon-btn{width:40px;height:40px;min-height:40px;padding:0;border-radius:50%;background:transparent;color:var(--md-on-surface-variant)}.icon-btn svg{width:22px;height:22px}.icon-btn.tonal{background:var(--md-surface-container-highest);color:var(--md-on-surface)}.cardhead{display:flex;align-items:center;gap:8px}.cardhead .spacer{width:40px;flex:none}.code-boxes{display:flex;gap:8px;justify-content:center}.code-boxes input{width:52px;height:60px;padding:0;text-align:center;font-size:1.6rem;font-weight:500;text-transform:uppercase;border-radius:var(--shape-sm);letter-spacing:0}.pill.multiline{white-space:normal;height:auto;padding:6px 12px;text-align:center;max-width:100%}.foot{margin-top:auto;display:flex;flex-direction:column;gap:10px;align-items:center;padding-top:8px}.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tile{height:auto;min-height:148px;padding:18px 14px;border-radius:var(--shape-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:var(--md-surface-container-low);color:var(--md-on-surface);border:1px solid var(--md-outline-variant)}.tile svg{width:32px;height:32px;margin-bottom:4px;color:var(--md-primary)}.tile-label{font-size:1.125rem;font-weight:500}.tile.primary{background:var(--md-primary);color:var(--md-on-primary);border-color:transparent}.tile.primary svg{color:inherit}.tile.primary .small{opacity:.85}.card.accent .code-boxes input{width:56px;height:66px;font-size:1.75rem}.typed{display:inline-flex;flex-direction:column;align-items:center}.typed .cap{display:block;white-space:pre;padding:1px 10px 3px;border-radius:8px;margin-top:-2px;background:#fff;color:#111;font-weight:800;letter-spacing:-.01em;animation:cap-pop .18s var(--d, 0ms) cubic-bezier(.3,1.5,.5,1) backwards}.typed .cap>span{opacity:0;animation:cap-char 1ms var(--d, 0ms) forwards}@keyframes cap-pop{0%{opacity:0;transform:scale(.7)}}@keyframes cap-char{to{opacity:1}}@media(prefers-reduced-motion:reduce){.typed .cap{animation:none}.typed .cap>span{animation:none;opacity:1}}.lobby .songs{gap:14px}.btn-xl{height:64px;min-height:64px;font-size:1.125rem;border-radius:var(--shape-lg);gap:10px}.big-cta{height:auto;min-height:148px;flex-direction:column;gap:10px;padding:22px 16px;border-radius:var(--shape-xl);font-size:1.5rem;font-weight:500;letter-spacing:0}.big-cta .ic{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--md-on-primary) 18%,transparent)}.big-cta .ic svg{width:30px;height:30px}.attn{animation:attn 2.6s 1.5s ease-in-out infinite}@keyframes attn{0%,60%,to{box-shadow:0 0 color-mix(in srgb,var(--md-primary) 45%,transparent)}80%{box-shadow:0 0 0 10px color-mix(in srgb,var(--md-primary) 0%,transparent)}}@media(prefers-reduced-motion:reduce){.attn{animation:none}}.btn-outline{background:transparent;color:var(--md-primary);border:1px solid var(--md-outline)}.songcount{display:flex;align-items:baseline;gap:10px}.songcount .n{font-size:3.25rem;line-height:1;font-weight:500;color:var(--md-primary);font-variant-numeric:tabular-nums}.songcount .n.none{color:var(--md-on-surface-variant)}.songcount .l{font-size:1.125rem;font-weight:500}.songcount .icon-btn{align-self:center}.songs .how{flex:none}.songs .demo{align-self:center}.warn-text{color:var(--md-error)}.invite-btn svg{margin-left:-4px}.waitbar{position:static;flex-direction:row;align-items:center;justify-content:center;gap:12px;font-weight:500;color:var(--md-on-surface-variant);min-height:64px}.waitbar .dots{display:inline-flex;gap:4px}.waitbar .dots i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:wait-dot 1.2s ease-in-out infinite}.waitbar .dots i:nth-child(2){animation-delay:.15s}.waitbar .dots i:nth-child(3){animation-delay:.3s}@keyframes wait-dot{0%,60%,to{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}@media(prefers-reduced-motion:reduce){.waitbar .dots i{animation:none;opacity:.6}}.invite-actions{width:min(80vw,420px);margin-top:8px}.invite-actions button{cursor:pointer}.tut{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;flex-direction:column;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 16px calc(14px + env(safe-area-inset-bottom));background:var(--md-surface);animation:fadein .15s ease;overscroll-behavior:contain;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}.tut>*{width:100%;max-width:440px;margin-inline:auto}.tut-bars{display:flex;gap:4px}.tut-bars span{flex:1;height:4px;border-radius:2px;overflow:hidden;background:color-mix(in srgb,var(--md-on-surface) 16%,transparent)}.tut-bars span.done{background:var(--md-primary)}.tut-bars i{display:block;height:100%;background:var(--md-primary);transform-origin:left;transform:scaleX(0);animation:tut-bar linear forwards}@keyframes tut-bar{to{transform:none}}.tut-top{display:flex;align-items:center;gap:8px;position:relative;z-index:2}.tut-top h2{flex:1;font-size:1.25rem;font-weight:500}.tut-count{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.tut-stage{flex:1 1 auto;min-height:0;display:grid;place-items:center}.tut-fit{position:relative}.tut-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 12px;min-height:56px;position:relative;z-index:2}.tut-nav .btn-lg{font-size:1.125rem}.tut-nav .tut-error{width:100%;color:var(--md-error);text-align:center}.sp{position:absolute;left:0;top:0;transform-origin:0 0;box-sizing:border-box;overflow:hidden;border:6px solid #2b2b2b;border-radius:34px;background:#121212;color:#fff;font-size:13px;line-height:1.3;box-shadow:0 12px 32px #00000040;--ink: #ffa24d}.sp-notch{position:absolute;top:8px;left:50%;width:72px;height:18px;margin-left:-36px;border-radius:10px;background:#000;z-index:3}.sp-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-start;padding:44px 14px 20px;animation:fadein .25s ease}.sp .grow{flex:1}.sp-head{display:flex;flex-direction:column;gap:6px}.sp-head .sp-cover{align-self:center;margin-bottom:8px}.sp-title{font-weight:700;font-size:16px}.sp-sub{color:#b3b3b3;font-size:12px}.sp-actions{display:flex;align-items:center;gap:16px;margin-top:8px}.sp-cover{width:44px;height:44px;flex:none;border-radius:4px;display:grid;place-items:center}.sp-cover.big,.sp-head .sp-cover.ours:not(.small){width:150px;height:150px}.sp-cover.small{width:36px;height:36px}.sp-cover.a{background:linear-gradient(135deg,#e8743b,#a2263e)}.sp-cover.b{background:linear-gradient(135deg,#3a7bd5,#00d2ff)}.sp-cover.c{background:linear-gradient(135deg,#56ab2f,#a8e063)}.sp-cover.liked{background:linear-gradient(135deg,#450af5,#c4efd9)}.sp-cover.ours{background:#c35e0a;color:#f9f5d7;align-content:center;gap:4px}.sp-cover.ours b{font-size:22px;letter-spacing:.02em}.sp-cover.ours.small b{display:none}.sp-cover.ours .sp-plus{width:40px;height:40px;border-width:4px}.sp-cover.ours.small .sp-plus{width:18px;height:18px;border-width:2px}.sp-plus{position:relative;width:24px;height:24px;border:2px solid currentColor;border-radius:50%;box-sizing:border-box;flex:none}.sp-plus:before,.sp-plus:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;background:currentColor;border-radius:1px}.sp-plus:before{width:50%;height:2px}.sp-plus:after{width:2px;height:50%}.sp-cover.ours .sp-plus:before{height:4px}.sp-cover.ours .sp-plus:after{width:4px}.sp-cover.ours.small .sp-plus:before{height:2px}.sp-cover.ours.small .sp-plus:after{width:2px}.sp-ghost{width:24px;height:24px;border:2px solid #b3b3b3;border-radius:50%;box-sizing:border-box;opacity:.6}.sp-dots{display:inline-flex;gap:3px;padding:6px 2px}.sp-dots i{width:4px;height:4px;border-radius:50%;background:currentColor}.sp-play{width:44px;height:44px;border-radius:50%;background:#1ed760}.sp-lib,.sp-sheet{display:flex;flex-direction:column;gap:6px}.sp-h{font-weight:700;font-size:18px;margin-bottom:6px}.sp-h.center{text-align:center;font-size:15px}.sp-row{display:flex;align-items:center;gap:10px;padding:6px;border-radius:8px;min-width:0}.sp-row>span:not(.sp-cover){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-row.done{opacity:.55}.sp-row .tick{margin-left:auto;color:#1ed760;font-weight:700}.sp-sheet{background:#282828;border-radius:14px;padding:14px 10px}.sp-sheet-head{display:flex;align-items:center;gap:10px;padding:0 6px 10px;border-bottom:1px solid #3e3e3e;margin-bottom:4px;font-weight:700}.sp-item{padding:10px 6px;border-radius:8px;font-size:14px}.sp-new{align-self:center;padding:6px 16px;border-radius:999px;background:#fff;color:#000;font-weight:700;font-size:12px;margin-bottom:6px}.sp-tgt-dots{display:inline-flex}.sp-save{position:relative;display:inline-grid;place-items:center}.sp-save.saving .sp-plus{animation:tut-gone .15s 2.2s forwards}.sp-saved{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:#1ed760;color:#000;font-size:14px;font-weight:800;display:grid;place-items:center;transform:scale(0)}.sp-save.saving .sp-saved{animation:tut-pop .3s 2.2s cubic-bezier(.3,1.6,.5,1) forwards}@keyframes tut-gone{to{opacity:0}}@keyframes tut-pop{to{transform:none}}.tut-spot{position:absolute;z-index:4;border-radius:18px;pointer-events:none;opacity:0;--dim: 0 0 0 640px rgba(0, 0, 0, .62);box-shadow:0 0 0 3px var(--ink),0 0 0 3px transparent,var(--dim);animation:fadein-keep .3s .05s ease forwards,tut-ring 1.3s .4s ease-in-out infinite}@keyframes fadein-keep{to{opacity:1}}@keyframes tut-ring{50%{box-shadow:0 0 0 3px var(--ink),0 0 0 9px color-mix(in srgb,var(--ink) 35%,transparent),var(--dim)}}.tut-note{position:absolute;left:6px;right:6px;z-index:6;display:flex;justify-content:center;font-size:20px;line-height:1.3;pointer-events:none}.tut-hand{position:absolute;z-index:7;width:48px;height:48px;opacity:0;transform-origin:23px 12px;pointer-events:none;animation:tut-hand 3.8s linear forwards}.tut-hand .taphand{filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}@keyframes tut-hand{0%,36%{opacity:0;transform:translate(34px,60px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}52%{opacity:1;transform:none;animation-timing-function:ease-in-out}56%{transform:scale(.86)}60%{transform:none}76%{opacity:1;transform:none}84%,to{opacity:0;transform:translate(8px,14px)}}.tut-tap{position:absolute;left:1px;top:-10px;width:44px;height:44px;border-radius:50%;border:3px solid #fff;opacity:0;animation:tut-tap 3.8s linear forwards}@keyframes tut-tap{0%,55%{opacity:0;transform:scale(.25)}57%{opacity:.95;transform:scale(.35)}72%,to{opacity:0;transform:scale(1.5)}}@media(prefers-reduced-motion:reduce){.tut-spot,.tut-hand{animation:none;opacity:1}.tut-tap,.sp-save.saving .sp-plus,.sp-save.saving .sp-saved{animation:none}}.htp{position:relative;display:block;width:100%;height:212px;min-height:0;padding:0;overflow:hidden;cursor:pointer;border-radius:var(--shape-md);background:var(--md-surface-container-low);color:var(--md-on-surface);text-align:center;font-weight:400;letter-spacing:0;white-space:normal}.htp:after{display:none}.htp-bars{position:absolute;left:16px;right:16px;top:12px;display:flex;gap:4px}.htp-bars>span{flex:1;height:3px;border-radius:2px;overflow:hidden;background:color-mix(in srgb,var(--md-on-surface) 14%,transparent)}.htp-bars>span.done{background:var(--md-primary)}.htp-bars i{display:block;height:100%;background:var(--md-primary);transform-origin:left;transform:scaleX(0);animation:tut-bar linear forwards}.htp-scene{position:absolute;left:0;right:0;top:24px;bottom:56px;display:grid;place-items:center;animation:fadein .25s ease}.htp-cap{position:absolute;left:8px;right:8px;bottom:14px;display:flex;justify-content:center;font-size:1.25rem;line-height:1.3}.htp .typed .cap{background:var(--md-on-surface);color:var(--md-surface)}.htp-art,.htp-pile i{background:var(--md-primary);border-radius:6px}.htp .c0,.htp .c3{background:linear-gradient(135deg,var(--gb-orange),var(--gb-red))}.htp .c1,.htp .c4{background:linear-gradient(135deg,var(--gb-yellow),var(--gb-orange))}.htp .c2{background:linear-gradient(135deg,var(--gb-aqua),var(--gb-blue))}.htp-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:600;background:var(--md-primary-container);color:var(--md-on-primary-container)}.htp-add{display:flex;gap:28px;align-items:flex-end}.htp-who{display:flex;flex-direction:column;align-items:center;gap:8px}.htp-pile{position:relative;width:44px;height:56px}.htp-pile i{position:absolute;left:4px;width:36px;height:36px;box-shadow:0 2px 6px #0000002e;opacity:0;animation:htp-drop .4s cubic-bezier(.3,1.4,.5,1) forwards}.htp-pile i:nth-child(1){bottom:0;animation-delay:calc(.3s + var(--i) * .25s)}.htp-pile i:nth-child(2){bottom:9px;transform-origin:bottom;rotate:-8deg;animation-delay:calc(.7s + var(--i) * .25s)}.htp-pile i:nth-child(3){bottom:18px;rotate:6deg;animation-delay:calc(1.1s + var(--i) * .25s)}@keyframes htp-drop{0%{opacity:0;translate:0 -30px}to{opacity:1;translate:0 0}}.htp-song{display:flex;align-items:center;gap:18px}.htp-art{position:relative;display:grid;place-items:center;width:96px;height:96px;border-radius:10px;box-shadow:0 6px 18px #0003}.htp-art.tiny{width:52px;height:52px;border-radius:8px}.htp-q{font-size:2.75rem;font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.25);animation:htp-pulse 1s .4s ease-in-out infinite}@keyframes htp-pulse{50%{scale:1.15}}.htp-eq{display:flex;align-items:flex-end;gap:5px;height:56px}.htp-eq i{width:8px;height:25%;border-radius:4px 4px 1.5px 1.5px;background:var(--md-primary);animation:htp-eq .9s ease-in-out infinite}.htp-eq i:nth-child(2){animation-delay:-.3s}.htp-eq i:nth-child(3){animation-delay:-.6s}.htp-eq i:nth-child(4){animation-delay:-.15s}.htp-eq i:nth-child(5){animation-delay:-.45s}@keyframes htp-eq{0%,to{height:25%}50%{height:100%}}.htp-vote{position:relative}.htp-vote.party{translate:0 10px}.htp-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.htp-tile{position:relative;display:grid;place-items:center;width:112px;height:44px;border-radius:var(--shape-md);background:var(--md-surface-container-highest);font-weight:500}.htp-tile b,.htp-grid .pick b{position:absolute;right:8px;font-weight:800;opacity:0;animation:htp-on .01s 1.9s forwards}@keyframes htp-on{to{opacity:1}}.htp-tile.pick,.htp-grid .htp-art.pick{animation:htp-pick .2s 1.45s forwards}@keyframes htp-pick{to{background:var(--md-primary);color:var(--md-on-primary)}}.htp-grid .htp-art.pick{animation:htp-ring .2s 1.45s forwards;color:#fff}.htp-grid .htp-art.pick b{position:static;font-size:1.5rem}@keyframes htp-ring{to{box-shadow:0 0 0 4px var(--md-surface-container-low),0 0 0 7px var(--md-primary)}}.htp-grid.songs.deal .htp-art{animation:htp-drop .4s calc(.2s + var(--i, 0) * .15s) backwards}.htp-grid.songs.scan .htp-art{animation:htp-scan .5s calc(.15s + var(--i, 0) * .25s) ease-in-out both}.htp-grid.songs.scan .htp-art.pick{animation:htp-scan .5s calc(.15s + var(--i, 0) * .25s) ease-in-out both,htp-ring .2s 1.45s forwards}@keyframes htp-scan{50%{scale:1.12}}.htp-scene.cont{animation:none}.htp-hand{position:absolute;left:117px;top:11px;width:44px;height:44px;opacity:0;animation:htp-hand 3.2s linear forwards}.htp-hand.duet{left:23px;top:75px}.taphand{display:block;width:100%;height:100%;fill:#fff;stroke:#1d2021;stroke-width:1.1;paint-order:stroke;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}@keyframes htp-hand{0%,15%{opacity:0;transform:translate(30px,50px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}38%{opacity:1;transform:none;animation-timing-function:ease-in-out}44%{transform:scale(.86)}50%{transform:none}70%{opacity:1}80%,to{opacity:0}}.htp-pts{position:absolute;right:-14px;top:-34px;font-weight:800;font-size:1.25rem;color:var(--md-primary);opacity:0;animation:htp-pts .9s 1.9s ease-out forwards}@keyframes htp-pts{0%{opacity:0;translate:0 6px}30%{opacity:1}to{opacity:1;translate:0 -4px}}@media(prefers-reduced-motion:reduce){.htp *,.htp *:before{animation:none!important;opacity:1!important}.htp-hand{display:none}}.tips{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:var(--shape-md);background:var(--md-surface-container-low)}.tip{display:flex;gap:12px;align-items:flex-start}.tip p{font-size:.9375rem;line-height:1.45}.tip-ic{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--md-primary-container);color:var(--md-on-primary-container)}.tip-ic svg{width:18px;height:18px}