@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,900&display=swap";:root{color:#dedede;color-scheme:dark;font-synthesis:none;--accent:#12de78;background:#060806;font-family:DM Sans,sans-serif}@property --accent{syntax:"<color>";inherits:true;initial-value:#12de78}@property --wordmark{syntax:"<color>";inherits:true;initial-value:#303030}.theme-root{--ink:color-mix(in srgb, var(--accent) 5%, #dedede);--muted:color-mix(in srgb, var(--accent) 8%, #979797);--page-bg:color-mix(in srgb, var(--accent) 2%, #060606);--line:color-mix(in srgb, var(--accent) 9%, #222);--surface:color-mix(in srgb, var(--accent) 5%, #151515);--surface-raised:color-mix(in srgb, var(--accent) 8%, #1b1b1b);--accent-soft:color-mix(in srgb, var(--accent) 12%, #080808);--accent-light:color-mix(in srgb, var(--accent) 35%, white);--accent-hover:color-mix(in srgb, var(--accent) 80%, white);--on-accent:color-mix(in srgb, var(--accent) 10%, #080808);--wordmark:color-mix(in srgb, var(--accent) 14%, #303030);color:var(--ink);isolation:isolate;min-height:100svh;transition:--accent .45s}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:0 0;border:0;transition:background .2s,color .2s,transform .25s,box-shadow .3s}button:disabled{cursor:not-allowed;opacity:.5}button:active:not(:disabled){transform:translateY(1px)}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.app-shell{grid-template-columns:210px minmax(0,540px) 196px;justify-content:space-between;align-items:start;gap:32px;width:min(1520px,100%);min-height:100svh;margin:auto;padding:clamp(24px,7vh,80px) 24px 24px;display:grid}main{width:100%;min-width:0;animation:.5s ease-out both enter}@media (width>=851px){.options-menu{display:contents}.options-menu>.options-heading,.menu-trigger{display:none}.app-shell>main{grid-area:1/2}.queue-panel{grid-area:1/1}.settings-panel{grid-area:1/3}}h1{text-align:center;margin:0 0 24px;line-height:1.2}.wordmark{letter-spacing:-2px;color:var(--wordmark);font-size:clamp(38px,4vw,58px);font-style:italic;font-weight:900;text-decoration:none;display:inline-block}.round-filters{color:var(--muted);text-align:center;margin-bottom:18px;font-size:12px;font-weight:700}.side-panel{flex-direction:column;align-self:start;margin-top:46px;display:flex}.side-panel .utility-links{margin-top:16px}.panel-heading{color:var(--muted);letter-spacing:1.8px;text-transform:uppercase;margin:0 0 12px;font-size:10px;font-weight:800;line-height:1.5}.queue-panel .panel-heading span{letter-spacing:0;text-transform:none;margin-top:6px;font-weight:500;display:block}.filter-pickers{gap:8px;display:grid}.filter-trigger{border:1px solid var(--line);background:var(--surface);border-radius:12px;align-items:center;gap:8px;min-height:44px;padding:10px 12px;font-size:12px;display:flex}.filter-trigger>span:first-child{text-align:left;flex:1}.filter-trigger.active{color:var(--accent);border-color:var(--accent)}.filter-chevron{width:16px;height:16px;color:var(--muted);flex:none}.filter-trigger:has(+:popover-open) .filter-chevron{transform:rotate(180deg)}.filter-popover:popover-open{flex-direction:column;display:flex}.filter-popover .filter-list{overscroll-behavior:contain;min-height:0;overflow-y:auto}.artist-search{border:1px solid var(--line);background:var(--surface);width:100%;min-height:44px;color:var(--ink);border-radius:10px;flex:none;margin-bottom:12px;padding:10px 12px;font-size:16px}.artist-search::placeholder{color:var(--muted)}.filter-popover,.options-menu{border:1px solid var(--line);width:min(400px,100% - 32px);max-height:calc(100dvh - 48px);color:var(--ink);background:var(--surface-raised);border-radius:18px;padding:16px;box-shadow:0 20px 80px #0009}.filter-popover::backdrop,.options-menu::backdrop{background:#0007}.filter-popover-heading{justify-content:space-between;align-items:center;display:flex}.filter-popover-heading h2{margin:0;font-size:18px}.filter-popover p{color:var(--muted);margin:4px 0 16px;font-size:12px}.filter-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.filter-list button{text-align:left;min-height:44px;color:var(--muted);background:#ffffff04;border-radius:10px;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;font-size:12px;font-weight:700;display:flex}.filter-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.filter-count{background:#ffffff08;border-radius:999px;flex:none;padding:2px 7px;font-size:10px;font-weight:800}.filter-list button:hover{color:var(--ink);background:#ffffff0a}.filter-list button.active{color:var(--accent);background:var(--accent-soft)}.filter-list button.active .filter-count{background:color-mix(in srgb, var(--accent) 22%, transparent)}.filter-list button.excluded{color:#ec6268;background:#ec626814}.filter-list button.excluded .filter-name{text-decoration:line-through}.filter-list button.excluded .filter-count{background:#ec626826}.queue-summary{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin:12px 0 0;padding-top:8px;font-size:11px;font-weight:700;display:flex}.clear-filters{color:var(--accent);border-radius:8px;flex:none;padding:4px 8px;font-size:11px;font-weight:800}.clear-filters:hover:not(:disabled){background:var(--accent-soft)}.reroll-button{border-top:1px solid var(--line);width:100%;color:var(--muted);align-items:center;gap:12px;margin-top:12px;padding:12px;font-size:12px;font-weight:700;display:flex}.reroll-button span{font-size:20px}.reroll-button:hover{color:var(--accent)}.attempt-steps{gap:6px;margin-bottom:22px;display:flex}.attempt-steps>div{text-align:center;color:var(--step-color);background:color-mix(in srgb, var(--step-color) 11%, transparent);border-radius:24px;flex:1;padding:9px 4px;font-size:12px;font-weight:800;transition:background .3s,color .3s,box-shadow .3s}.attempt-steps>div.current{color:var(--on-accent);background:var(--step-color);box-shadow:0 0 24px color-mix(in srgb, var(--step-color) 20%, transparent)}.attempt-steps>div.past{opacity:.55}.timeline{position:relative}.playback-progress{background:var(--line);border-radius:20px;height:25px;position:relative;overflow:hidden}.playback-progress>span{height:100%;position:absolute;inset:0 auto 0 0}.unlocked-progress{background:var(--accent-light);transition:width .35s}.played-progress{background:var(--accent)}.playback-progress i{background:var(--page-bg);width:1px;position:absolute;top:0;bottom:0}.timeline-label{color:var(--accent);font:700 11px ui-monospace,monospace;position:absolute;top:31px;left:0}.timeline-label:before{content:"";border-inline:3px solid #0000;border-bottom:4px solid var(--accent);position:absolute;top:-7px;left:3px}.listen-stage{isolation:isolate;justify-content:center;align-items:center;height:clamp(124px,22vh,198px);display:flex;position:relative}.listen-stage:before{content:"";z-index:-1;background:radial-gradient(ellipse, color-mix(in srgb, var(--accent) 5%, transparent), transparent 65%);opacity:.5;pointer-events:none;transition:opacity .6s;position:absolute;inset:-15px -30px}.play-button{width:120px;height:120px;color:var(--on-accent);background:var(--accent);border-radius:50%;place-items:center;display:grid}.play-button:hover{background:var(--accent-hover);box-shadow:0 0 45px color-mix(in srgb, var(--accent) 10%, transparent);transform:scale(1.04)}.play-button svg{width:46px;height:46px}.is-playing .play-button{box-shadow:0 0 0 10px color-mix(in srgb, var(--accent) 3%, transparent), 0 0 65px color-mix(in srgb, var(--accent) 11%, transparent)}.is-playing.listen-stage:before{opacity:1}.clip-time{color:var(--accent);font-variant-numeric:tabular-nums;font:700 19px ui-monospace,monospace;position:absolute;left:calc(50% + 78px)}.loading-dots{font-size:32px;animation:1s ease-in-out infinite alternate breathe}form{align-items:start;gap:8px;display:flex}.search-wrap{flex:1;min-width:0;position:relative}.search-icon{width:16px;height:16px;color:var(--muted);pointer-events:none;position:absolute;top:14px;left:14px}.search-wrap input{background:color-mix(in srgb, var(--surface) 70%, transparent);border:1px solid var(--line);width:100%;height:44px;color:var(--ink);border-radius:15px;padding:12px 12px 12px 39px;font-size:14px;transition:border-color .25s,box-shadow .25s}.search-wrap input::placeholder{color:var(--muted)}.search-wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 5%, transparent)}.search-results{z-index:5;background:var(--surface-raised);border:1px solid var(--line);border-radius:14px;max-height:min(285px,35dvh);position:absolute;bottom:calc(100% + 6px);left:0;right:0;overflow:auto;box-shadow:0 16px 40px #0008}.search-results p{color:var(--muted);padding:0 14px;font-size:13px}.search-results button{text-align:left;align-items:center;gap:10px;width:100%;min-height:64px;padding:10px 12px;display:flex}.search-results button:hover,.search-results button:focus-visible{background:var(--accent-soft)}.search-result-text{overflow-wrap:anywhere;flex:1;min-width:0}.search-results strong,.search-results small{font-size:13px;font-weight:600;display:block}.search-results small{color:var(--muted);margin-top:4px;font-size:11px}.guess-actions{gap:8px;display:flex}.skip-button{border:1px solid var(--line);background:color-mix(in srgb, var(--surface) 50%, transparent);border-radius:15px;justify-content:center;align-items:center;gap:7px;min-width:100px;height:44px;padding:0 15px;font-size:13px;font-weight:800;display:flex}.skip-button span{color:var(--muted);font-size:10px;font-weight:500}.skip-button:hover{background:#ffffff0a}.primary{background:var(--accent);color:var(--on-accent);border-radius:14px;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:12px 16px;font-size:13px;font-weight:800;display:flex}.primary:hover{background:var(--accent-hover)}.settings-section{border-bottom:1px solid var(--line);margin-bottom:22px;padding-bottom:22px}#game-volume{appearance:none;cursor:pointer;background:0 0;width:100%;height:28px;margin:0;display:block}#game-volume::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) var(--volume), var(--line) var(--volume));border-radius:8px;height:6px}#game-volume::-moz-range-track{background:linear-gradient(to right, var(--accent) var(--volume), var(--line) var(--volume));border-radius:8px;height:6px}#game-volume::-webkit-slider-thumb{appearance:none;background:var(--accent);border-radius:50%;width:12px;height:12px;margin-top:-3px}#game-volume::-moz-range-thumb{background:var(--accent);border:0;border-radius:50%;width:12px;height:12px}.utility-links{flex-direction:column;gap:7px;display:flex}.utility-links button{color:var(--muted);background:#ffffff04;border-radius:12px;justify-content:space-between;align-items:center;padding:13px;font-size:12px;font-weight:700;display:flex}.utility-links button:hover{color:var(--ink);background:#ffffff0a}.guess-list{flex-direction:column;gap:6px;margin:16px 0 0;padding:0;list-style:none;display:flex}.guess-list:empty{display:none}.guess-list li{min-height:40px;color:var(--muted);background:color-mix(in srgb, var(--surface) 70%, transparent);border-radius:10px;align-items:center;gap:12px;padding:10px 14px;font-size:12px;display:flex}.guess-list li>span:last-child{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.guess-icon{flex-shrink:0;font-size:17px}.reveal{--result-color:var(--accent);text-align:center;flex-direction:column;align-items:center;gap:0;padding:0 0 24px;display:flex}.reveal-details{min-width:0;max-width:100%;margin-top:24px}.reveal h2{letter-spacing:-.7px;color:var(--ink);overflow-wrap:anywhere;margin:0 0 8px;font-size:28px;font-weight:900;line-height:1.2}.reveal p{color:var(--muted);margin:0 0 14px;font-size:13px;line-height:1.5}.reveal a{background:var(--accent-soft);color:var(--muted);border-radius:24px;align-items:center;gap:8px;padding:8px 13px;font-size:11px;font-weight:800;text-decoration:none;transition:background .2s,color .2s;display:inline-flex}.reveal a:hover{color:var(--ink);background:#ffffff12}.reveal-eyebrow{color:var(--result-color);text-transform:uppercase;letter-spacing:4px;margin:0 0 10px;font-size:10px;font-weight:800;display:block}.result-status{border:2px solid var(--result-color);color:var(--result-color);background:color-mix(in srgb, var(--result-color) 5%, transparent);box-shadow:0 0 30px color-mix(in srgb, var(--result-color) 12%, transparent);text-transform:uppercase;border-radius:30px;margin-top:20px;padding:7px 15px;font-size:14px;font-weight:900;display:inline-block}.success .result-status{transform:rotate(-6deg)}.result-actions{justify-content:center;gap:10px;width:100%;margin-top:24px;display:flex}.result-actions button{min-height:36px;color:var(--result-color);background:var(--accent-soft);border-radius:24px;justify-content:center;align-items:center;gap:9px;padding:10px 18px;font-size:12px;font-weight:800;display:inline-flex}.result-actions button:hover{background:color-mix(in srgb, var(--result-color) 12%, transparent)}.result-actions .next-button{width:116px}.copy-result svg{width:14px;height:14px}.share-status{color:var(--muted);margin-top:14px;font-size:11px}.audio-error{color:var(--accent-light);font-size:13px;line-height:1.5}.audio-error button{padding:0;text-decoration:underline}dialog{background:var(--surface-raised);border:1px solid var(--line);width:calc(100% - 32px);max-width:420px;color:var(--ink);border-radius:16px;padding:0}dialog::backdrop{background:color-mix(in srgb, var(--page-bg) 75%, transparent);backdrop-filter:blur(6px)}.modal-content{padding:32px;position:relative}.icon-button{border-radius:10px;place-items:center;width:40px;height:40px;display:grid}.icon-button:hover{background:#ffffff0a}.modal-close{font-size:24px;position:absolute;top:12px;right:12px}.modal-content h2{margin:4px 0 25px;font-size:25px;font-weight:600}.modal-content p{color:var(--muted);font-size:15px;line-height:1.6}.modal-content small{color:var(--muted);font-size:12px;line-height:1.6;display:block}.stats-grid{grid-template-columns:1fr 1fr;gap:24px;margin:28px 0;display:grid}.stats-grid>div{flex-direction:column;gap:5px;display:flex}.stats-grid strong{color:var(--accent);font-size:34px;font-weight:500}.stats-grid span{color:var(--muted);font-size:14px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}dialog[open]{animation:.22s ease-out enter}@keyframes enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{to{opacity:.3}}@media (width<=1100px){.app-shell{grid-template-columns:180px minmax(0,500px) 160px;gap:24px}}@media (width<=850px){.listen-stage:before{inset-inline:0}.app-shell{grid-template-columns:minmax(0,1fr);align-content:center;gap:16px;max-width:580px;padding:20px}main{grid-row:1}h1{margin-bottom:16px}.wordmark{font-size:38px}.round-filters{text-overflow:ellipsis;white-space:nowrap;margin-bottom:12px;overflow:hidden}.side-panel{margin-top:0}.options-menu{overscroll-behavior:contain;overflow-y:auto}.options-menu .side-panel+.side-panel{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}.menu-trigger{border:1px solid var(--line);background:var(--surface);min-height:44px;color:var(--muted);border-radius:12px;justify-content:center;align-items:center;gap:8px;margin-top:4px;padding:10px 12px;font-size:12px;font-weight:700;display:flex}.queue-panel .panel-heading{justify-content:space-between;margin-bottom:8px;display:flex}.queue-panel .panel-heading span{margin:0}.filter-pickers{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.filter-trigger{gap:4px;padding-inline:8px}.queue-footer{justify-content:space-between;align-items:center;gap:8px;display:flex}.queue-summary{margin:0;padding:0}.reroll-button{border:0;gap:6px;width:auto;min-height:44px;margin:0;padding:4px 0 4px 8px}.settings-panel{grid-template-columns:1fr 1fr;gap:8px 16px;display:grid}.settings-section{margin:0;padding-bottom:16px}.settings-panel>.utility-links{grid-column:1/-1}.side-panel .utility-links{flex-direction:row;gap:8px;margin:0}.utility-links button{flex:1;min-height:36px;padding:8px 12px}.listen-stage{height:clamp(112px,18vh,160px)}.play-button{width:88px;height:88px}.clip-time{font-size:17px;left:calc(50% + 60px)}.attempt-steps{margin-bottom:14px}.guess-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-top:8px;display:grid}.guess-list li{min-height:28px;padding:5px 10px}.reveal{padding-bottom:0}.reveal>.album-cover{width:96px!important;height:96px!important}.reveal-details{margin-top:12px}.reveal h2{font-size:22px}.result-status,.result-actions{margin-top:12px}}@media (width<=480px){.app-shell{gap:12px;padding:12px 16px}.wordmark{font-size:32px}.search-wrap input{font-size:16px}.skip-button{min-width:60px;padding-inline:10px}.skip-button span{display:none}.guess-actions{gap:4px}.guess-actions .primary{padding-inline:10px}.guess-actions .primary span{display:none}}@media (height<=700px){.app-shell{align-content:start;padding-block:12px}h1{margin-bottom:12px}.listen-stage{height:112px}.play-button{width:80px;height:80px}}@media (width<=850px) and (height<=620px){.app-shell{gap:8px;padding-block:8px}.wordmark{font-size:28px}h1{margin-bottom:8px}.round-filters{display:none}.listen-stage{height:96px}.reveal>.album-cover{width:64px!important;height:64px!important}.reveal-details,.result-status,.result-actions{margin-top:8px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.album-cover.svelte-8kfgx6{background:var(--surface-raised);color:var(--muted);border-radius:8px;flex-shrink:0;place-items:center;display:inline-grid;overflow:hidden}img.svelte-8kfgx6{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .25s;display:block}img.loaded.svelte-8kfgx6{opacity:1}svg.svelte-8kfgx6{width:45%;height:45%}@media (prefers-reduced-motion:reduce){img.svelte-8kfgx6{transition:none}}.switch.svelte-182y78p{border:1px solid var(--line);background:var(--surface);width:100%;color:var(--muted);border-radius:10px;justify-content:space-between;align-items:center;gap:10px;padding:9px 10px;font-size:12px;font-weight:700;display:flex}.switch[aria-checked=true].svelte-182y78p{color:var(--accent)}.switch-track.svelte-182y78p{background:var(--line);border-radius:999px;flex:none;width:32px;padding:3px;transition:background .2s}.switch[aria-checked=true].svelte-182y78p .switch-track:where(.svelte-182y78p){background:var(--accent)}.switch-knob.svelte-182y78p{background:var(--muted);border-radius:50%;width:14px;height:14px;transition:transform .2s,background .2s;display:block}.switch[aria-checked=true].svelte-182y78p .switch-knob:where(.svelte-182y78p){background:var(--on-accent);transform:translate(12px)}@property --beam-width{syntax:"<number>";inherits:true;initial-value:.88}@property --clip-energy{syntax:"<number>";inherits:true;initial-value:0}.spotlight{pointer-events:none;z-index:-1;background:var(--page-bg);--beam-width:.88;--clip-energy:0;transition:--beam-width 1s cubic-bezier(.22, .68, .24, 1), --clip-energy var(--energy-duration,.9s) var(--energy-easing,ease-out);position:fixed;inset:0;overflow:hidden}.spotlight[data-phase=loading]{--clip-energy:.12;--energy-duration:.5s}.spotlight[data-phase=playing]{--clip-energy:max(.18, var(--clip-heard,0));--energy-duration:.2s;--energy-easing:linear}.spotlight[data-phase=success]{--clip-energy:1;--energy-duration:1.2s}.spotlight[data-phase=failure]{--clip-energy:.12;--energy-duration:1.6s;--energy-easing:ease-in-out}.spotlight-source{background:var(--accent-light);filter:blur(6px);opacity:.24;width:130px;height:44px;transition:opacity 1s;position:absolute;top:-24px;left:calc(50% - 65px)}.spotlight[data-phase=loading] .spotlight-source{animation:1.5s ease-in-out infinite spotlight-warmup}.spotlight[data-phase=playing] .spotlight-source{opacity:.38}.spotlight[data-phase=success] .spotlight-source{opacity:.42}.spotlight[data-phase=failure] .spotlight-source{opacity:.16}.spotlight-aim{transform-origin:50% 0;width:min(920px,125vw);height:110vh;margin-left:max(-460px,-62.5vw);animation:1.2s cubic-bezier(.2,.7,.2,1) both spotlight-settle;position:absolute;top:-30px;left:50%}.spotlight-beam{transform-origin:50% 0;filter:blur(3px);animation:18s ease-in-out infinite alternate spotlight-drift;position:absolute;inset:0}.spotlight-spread{transform-origin:50% 0;transform:scaleX(var(--beam-width));opacity:.9;transition:opacity 1.2s;position:absolute;inset:0}.spotlight[data-phase=playing] .spotlight-spread,.spotlight[data-phase=success] .spotlight-spread{opacity:1}.spotlight[data-phase=failure] .spotlight-spread{opacity:.6}.spotlight-beam span{width:100%;height:100%;opacity:calc(.62 + .28 * var(--clip-energy));clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);background:linear-gradient(to bottom, color-mix(in srgb, var(--accent-light) 20%, transparent), color-mix(in srgb, var(--accent) 10%, transparent) 35%, color-mix(in srgb, var(--accent) 7%, transparent) 65%, transparent 94%);display:block}.spotlight[data-phase=success] .spotlight-beam span{animation:1.8s cubic-bezier(.16,.84,.28,1) both spotlight-bloom}.spotlight-pool{width:min(800px,100vw);height:24vh;transform:translateX(-50%) scale(calc(.9 + .12 * var(--clip-energy)));filter:blur(10px);background:radial-gradient(ellipse, color-mix(in srgb, var(--accent) 7%, transparent), transparent 70%);opacity:calc(.46 + .42 * var(--clip-energy));border-radius:50%;position:absolute;top:68%;left:50%}@keyframes spotlight-settle{0%{transform:rotate(-.8deg)scaleX(.97)}to{transform:rotate(0)scaleX(1)}}@keyframes spotlight-drift{0%{transform:rotate(-.45deg)}to{transform:rotate(.45deg)}}@keyframes spotlight-warmup{0%,to{opacity:.22}50%{opacity:.36}}@keyframes spotlight-bloom{0%{filter:brightness()}45%{filter:brightness(1.4)}to{filter:brightness(1.12)}}@media (prefers-reduced-motion:reduce){.spotlight-aim,.spotlight-beam,.spotlight-source,.spotlight-beam span{animation:none}.spotlight-spread{transform:none}}
