:root{--bg-color: #323437;--main-color: #e2b714;--sub-color: #646669;--sub-alt-color: #2c2e31;--text-color: #d1d0c5;--error-color: #ca4754;--font: "Lexend Deca", system-ui, -apple-system, sans-serif;--radius: 10px;--maxw: 960px}*{box-sizing:border-box}html,body,#root{height:100%}html{background:var(--bg-color)}.safari-chrome-tint{position:fixed;left:0;width:100%;min-height:3px;pointer-events:none;z-index:-1}.safari-chrome-tint--top{top:0;height:max(3px,env(safe-area-inset-top,0px))}.safari-chrome-tint--bottom{bottom:0;height:max(3px,env(safe-area-inset-bottom,0px))}body{margin:0;font-family:var(--font);font-weight:400;color:var(--text-color);background:var(--bg-color);-webkit-font-smoothing:antialiased;transition:color .2s ease;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background-image:radial-gradient(color-mix(in srgb,var(--text-color) 10%,transparent) 1px,transparent 1px);background-size:10px 10px;background-position:0 0;opacity:.35}button{font-family:var(--font)}.app{min-height:100%;display:flex;flex-direction:column;position:relative}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 26px;gap:12px;flex-wrap:nowrap;min-width:0}.topbar-right{display:flex;align-items:center;gap:10px;flex:1 1 auto;justify-content:flex-end;min-width:0}.volume-control{position:relative;display:flex;align-items:center;flex:none;z-index:50}.volume-btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:33px;height:33px;padding:0;color:var(--sub-color);background:var(--sub-alt-color);border:none;border-radius:var(--radius);cursor:pointer;transition:color .15s ease;position:relative;z-index:1}.volume-btn:hover,.volume-control.is-open .volume-btn{color:var(--text-color)}.theme-mode-ico{display:block;flex:none}.volume-ico{display:block}.volume-tray{position:absolute;left:50%;top:calc(100% + 6px);bottom:auto;transform:translate(-50%);display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1);pointer-events:none}.volume-control.is-open .volume-tray{grid-template-rows:1fr;pointer-events:auto}.volume-panel{min-height:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:33px;padding:0;background:var(--sub-alt-color);border-radius:var(--radius);opacity:0;transform:translateY(-8px);transition:opacity .2s ease,transform .32s cubic-bezier(.22,1,.36,1),padding .32s cubic-bezier(.22,1,.36,1)}.volume-control.is-open .volume-panel{opacity:1;transform:translateY(0);padding:12px 0}.volume-slider{width:4px;height:88px;margin:0;accent-color:var(--main-color);cursor:pointer;writing-mode:vertical-lr;direction:rtl;-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}@media (prefers-reduced-motion: reduce){.volume-tray,.volume-panel,.profile-pick-tray,.profile-peep-menu{transition:none}}.logo{display:inline-flex;align-items:center;gap:10px;background:none;border:none;cursor:pointer;padding:4px;color:var(--text-color);flex:none}.logo-word{font-size:22px;font-weight:700;letter-spacing:-.5px}.logo-accent{color:var(--main-color)}.logo-disc{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle,var(--main-color) 0 3px,transparent 4px),repeating-radial-gradient(circle,#111 0,#111 1.5px,#262626 1.5px,#262626 3px);border:2px solid var(--sub-color);transition:transform .4s ease}.logo:hover .logo-disc{transform:rotate(180deg)}.logo:hover .logo-word{color:var(--main-color)}.user-menu{position:relative;flex:none}.user-menu-btn{overflow:hidden}.user-menu-btn:focus-visible{outline:2px solid var(--main-color);outline-offset:2px}.user-avatar{width:33px;height:33px;border:none;border-radius:0;object-fit:cover;display:block}.user-avatar--fallback{display:grid;place-items:center;background:var(--sub-alt-color);color:var(--main-color);font-size:13px;font-weight:700;box-sizing:border-box}.user-menu-drop{position:absolute;top:calc(100% + 8px);right:0;z-index:30;min-width:160px;padding:6px;border-radius:var(--radius);background:var(--sub-alt-color);box-shadow:0 10px 28px color-mix(in srgb,#000 35%,transparent)}.user-menu-name{padding:8px 10px 6px;font-size:12px;color:var(--sub-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid color-mix(in srgb,var(--text-color) 10%,transparent);margin-bottom:4px}.user-menu-item{display:block;width:100%;text-align:left;border:none;background:none;color:var(--text-color);font-family:var(--font);font-size:13px;padding:9px 10px;border-radius:7px;cursor:pointer}.user-menu-item:hover{background:var(--bg-color);color:var(--main-color)}.stage{flex:1;display:flex;align-items:center;justify-content:center;padding:24px 20px 28px}.footer{text-align:left;padding:4px 26px 12px;font-size:12px;color:var(--sub-color)}@media (min-width: 821px){.footer{padding:0 26px 8px;margin-top:-6px}}.footer-heart{color:var(--main-color);margin:0 2px}.footer-credit{color:inherit;text-decoration:underline;text-underline-offset:2px}.footer-credit:hover{color:var(--main-color)}button.footer-privacy{display:inline;padding:0;border:none;background:none;font:inherit;color:inherit;cursor:pointer}button.footer-privacy:hover{color:var(--main-color)}.loader{color:var(--sub-color);font-size:15px}.cue-loader{margin:48px auto 24px;text-align:center}.btn{font-size:14px;font-weight:500;color:var(--text-color);background:var(--sub-alt-color);border:none;border-radius:var(--radius);padding:11px 18px;cursor:pointer;transition:color .15s ease,background .15s ease,transform .1s ease}.btn:hover{background:var(--main-color);color:var(--bg-color)}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:disabled:hover{background:var(--sub-alt-color);color:var(--text-color)}.btn-big{font-size:16px;padding:14px 26px;display:inline-flex;align-items:center;gap:12px}.btn-mini{font-size:12px;padding:6px 10px}.debug-fab{position:fixed;bottom:16px;left:16px;z-index:90;font-size:12px;padding:8px 12px;opacity:.92}.debug-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:color-mix(in srgb,#000 45%,transparent);display:flex;align-items:flex-end;justify-content:flex-start;padding:16px}.debug-modal{width:min(320px,100%);max-height:min(70vh,480px);overflow:auto;background:var(--sub-alt-color);color:var(--text-color);border-radius:12px;padding:14px;box-shadow:0 12px 32px color-mix(in srgb,#000 35%,transparent)}.debug-modal-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}.debug-modal-title{margin:0;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.debug-modal-screen{flex:1;min-width:0;font-size:11px;color:var(--sub-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.debug-modal-empty{margin:0;font-size:13px;color:var(--sub-color)}.debug-modal-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.debug-action{width:100%;text-align:left;justify-content:flex-start}.btn-play{background:var(--main-color);color:var(--bg-color);font-weight:600}.btn-play:hover{filter:brightness(1.08);background:var(--main-color);color:var(--bg-color)}.btn-spotify{background:color-mix(in srgb,var(--main-color) 16%,var(--bg-color));color:var(--main-color);font-weight:600}.btn-spotify:hover{background:color-mix(in srgb,var(--main-color) 24%,var(--bg-color));color:var(--main-color)}.spotify-logo{flex:none;display:block}.btn-ghost{background:var(--sub-alt-color)}.btn-play-icon{width:0;height:0;flex:none;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent currentColor;margin-left:2px;transform:translate(1px)}.btn-pause-icon{width:11px;height:14px;flex:none;position:relative;display:inline-block}.btn-pause-icon:before,.btn-pause-icon:after{content:"";position:absolute;top:0;width:3.5px;height:100%;border-radius:1px;background:currentColor}.btn-pause-icon:before{left:0}.btn-pause-icon:after{right:0}.btn-disc{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle,currentColor 0 2.5px,transparent 3px),repeating-radial-gradient(circle,#0000008c 0,#0000008c 1.2px,#00000040 1.2px,#00000040 2.4px);border:2px solid currentColor;animation:spin 2s linear infinite;opacity:.85}.theme-switcher{position:relative;min-width:0;flex:0 1 auto;max-width:100%}.look-switcher{position:relative;display:flex;align-items:center;flex:none}.look-switcher.is-open{z-index:91}.look-switcher .spotlight-scrim{z-index:0}.look-btn{overflow:hidden}.look-btn .mp-avatar{position:absolute;top:0;right:0;bottom:0;left:0;width:auto!important;height:auto!important;border:0!important;border-radius:0!important;background:var(--main-color)!important}.look-btn .mp-avatar img{transform:translate(-1px) translateY(-4px) scale(1.7);transform-origin:50% 18%}.look-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:40;width:min(320px,calc(100vw - 24px));padding:10px;border-radius:var(--radius);background:var(--sub-alt-color);box-shadow:0 10px 24px color-mix(in srgb,#000 28%,transparent)}.look-menu>.profile-dd-label{margin-bottom:8px}.look-menu-theme{display:none;margin-top:6px}.theme-switcher--inline{display:block;width:100%}.theme-switcher--inline .theme-btn{width:100%;max-width:none;background:color-mix(in srgb,var(--text-color) 12%,var(--sub-alt-color))}.theme-switcher--inline .theme-menu{position:static;width:100%;max-height:210px;margin-top:6px;padding:0;background:transparent;box-shadow:none}.theme-btn{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;height:33px;font-size:13px;color:var(--sub-color);background:var(--sub-alt-color);border:none;border-radius:var(--radius);padding:0 12px;cursor:pointer;transition:color .15s ease;max-width:min(160px,36vw);min-width:0}.theme-btn:hover{color:var(--text-color)}.theme-dot{width:11px;height:11px;border-radius:50%;flex:none}.theme-btn-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.theme-switcher--flash .theme-btn{animation:theme-switch-flash .65s ease}.theme-switcher--flash .theme-dot{animation:theme-dot-pulse .65s ease}@keyframes theme-switch-flash{0%{box-shadow:0 0 color-mix(in srgb,var(--main-color) 0%,transparent)}35%{color:var(--main-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--main-color) 35%,transparent)}to{box-shadow:0 0 color-mix(in srgb,var(--main-color) 0%,transparent)}}@keyframes theme-dot-pulse{0%,to{transform:scale(1)}40%{transform:scale(1.45)}}.theme-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:20;width:200px;max-height:340px;overflow-y:auto;background:var(--sub-alt-color);border-radius:var(--radius);padding:6px;box-shadow:0 10px 30px #00000059}.theme-menu,.guess-suggest,.profile-peep-grid{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 28%,transparent) transparent}.theme-menu::-webkit-scrollbar,.guess-suggest::-webkit-scrollbar,.profile-peep-grid::-webkit-scrollbar{width:6px}.theme-menu::-webkit-scrollbar-thumb,.guess-suggest::-webkit-scrollbar-thumb,.profile-peep-grid::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-color) 25%,transparent);border-radius:99px}.theme-menu::-webkit-scrollbar-track,.guess-suggest::-webkit-scrollbar-track,.profile-peep-grid::-webkit-scrollbar-track{background:transparent}.theme-option{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font-size:13px;color:var(--sub-color);background:none;border:none;border-radius:7px;padding:9px 10px;cursor:pointer}.theme-option:hover{background:var(--bg-color);color:var(--text-color)}.theme-option.active{color:var(--main-color)}.theme-mode-row{margin-bottom:4px;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--text-color) 12%,transparent);border-radius:7px 7px 0 0}.theme-mode-row.is-on{color:var(--main-color)}.swatches{display:inline-flex;border-radius:5px;overflow:hidden;border:1px solid var(--sub-color)}.swatches span{width:12px;height:18px;display:block}.theme-nudge{position:absolute;top:calc(100% + 4px);right:calc(100% + 18px);z-index:5;pointer-events:none;color:var(--main-color);transform:rotate(-8deg);transform-origin:top right;opacity:0;transition:opacity .35s ease}.theme-nudge--on{opacity:1;animation:theme-nudge-bob 2.8s ease-in-out infinite}.theme-nudge-svg{display:block;overflow:visible}.theme-nudge-stroke{stroke:var(--main-color);fill:none}@keyframes theme-nudge-bob{0%,to{transform:rotate(-8deg) translate(0)}50%{transform:rotate(-8deg) translate(-2px,2px)}}@media (max-width: 520px){.theme-nudge{display:none}}.vinyl{width:100%;height:100%;border-radius:50%;border:4px solid var(--sub-color);background:repeating-radial-gradient(circle,#0d0d0d 0,#0d0d0d 2px,#1e1e1e 2px,#1e1e1e 5px);box-shadow:inset 0 0 40px #000000a6;position:relative;display:flex;align-items:center;justify-content:center}.vinyl--interactive{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.vinyl--interactive:hover{filter:brightness(1.06)}.vinyl--scrubbing{animation:none!important;cursor:grabbing;filter:brightness(1.08);transform:rotate(var(--vinyl-rot, 0deg))}.vinyl--parked{animation:none!important;transform:rotate(var(--vinyl-rot, 0deg))}.vinyl:before{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border-radius:50%;background:linear-gradient(120deg,transparent 42%,rgba(255,255,255,.12) 50%,transparent 58%)}.vinyl-label{width:36%;height:36%;border-radius:50%;background:var(--main-color);color:var(--bg-color);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;font-weight:700;line-height:1.5;position:relative;z-index:2}.vinyl-label:after{content:"";position:absolute;top:50%;left:50%;width:7px;height:7px;border-radius:50%;transform:translate(-50%,-50%);background:var(--bg-color);border:1px solid var(--sub-color)}.spin-fast{animation:vinyl-spin 1.4s linear infinite;will-change:transform}.spin-slow{animation:vinyl-spin 5s linear infinite;will-change:transform}@keyframes vinyl-spin{0%{transform:rotate(var(--vinyl-rot, 0deg))}to{transform:rotate(calc(var(--vinyl-rot, 0deg) + 360deg))}}@keyframes spin{to{transform:rotate(360deg)}}.tonearm{position:absolute;top:-6px;right:2px;width:11px;height:58%;background:var(--sub-color);border-radius:6px;transform-origin:top center;transform:rotate(-20deg);transition:transform .55s cubic-bezier(.34,1.35,.64,1);z-index:3}.tonearm:before{content:"";position:absolute;top:-4px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--sub-color);border:2px solid color-mix(in srgb,var(--text-color) 25%,transparent);box-sizing:border-box}.tonearm:after{content:"";position:absolute;bottom:-6px;left:-4px;width:16px;height:13px;background:var(--main-color);border-radius:3px}.tonearm--on{transform:rotate(12deg)}@media (prefers-reduced-motion: reduce){.tonearm{transition:none}}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;width:min(var(--maxw),100%)}.hero-left{display:flex;flex-direction:column;align-items:flex-start}.sticker{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--main-color);background:var(--sub-alt-color);border-radius:20px;padding:6px 14px;margin-bottom:20px}.hero-title{font-size:clamp(56px,9vw,100px);font-weight:700;line-height:1;margin:0;letter-spacing:-3px}.hero-title-accent{color:var(--main-color)}.hero-tagline{font-size:17px;line-height:1.6;max-width:42ch;margin:18px 0 26px;color:var(--sub-color);text-align:left}.hero-tagline em{color:var(--text-color);font-family:Caveat,Segoe Print,cursive;font-style:normal;font-weight:600;font-size:1.35em;letter-spacing:.01em}.hero-tagline-lead,.hero-tagline-hook{display:block}.hero-turntable{position:relative;width:132px;height:132px;margin:0;flex:none}.hero-vinyl-row{display:flex;align-items:center;gap:20px;margin:0 0 26px;width:100%}.hero-vinyl-row .steps{margin:0;flex:1;min-width:0}.hero-turntable .vinyl-label{padding:0;overflow:hidden;background:var(--sub-alt-color)}.hero-turntable .vinyl-label-art{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;pointer-events:none;animation:vinyl-label-art-in .55s ease}@keyframes vinyl-label-art-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.hero-turntable .vinyl-label-art{animation:none}}.hero-turntable .vinyl-label:after{z-index:1}.hero-turntable--theme-pulse .vinyl-label{animation:hero-theme-label-pulse .65s ease}.hero-turntable--theme-pulse .vinyl{animation:hero-theme-hub-pulse .65s ease}@keyframes hero-theme-label-pulse{0%,to{box-shadow:none;outline:0 solid color-mix(in srgb,var(--main-color) 0%,transparent)}40%{outline:3px solid color-mix(in srgb,var(--main-color) 70%,transparent);outline-offset:1px}}@keyframes hero-theme-hub-pulse{0%,to{filter:none}40%{filter:drop-shadow(0 0 10px color-mix(in srgb,var(--main-color) 55%,transparent))}}@media (prefers-reduced-motion: reduce){.theme-switcher--flash .theme-btn,.theme-switcher--flash .theme-dot,.hero-turntable--theme-pulse .vinyl-label,.hero-turntable--theme-pulse .vinyl{animation:none}}.drag-nudge{position:absolute;left:calc(100% + 52px);top:-65px;z-index:4;pointer-events:none;display:flex;flex-direction:column;align-items:flex-start;gap:2px;color:var(--main-color);transform:rotate(28deg);transform-origin:left top;opacity:0;animation:drag-nudge-bob 2.6s ease-in-out infinite,drag-nudge-presence 12s ease-in-out infinite}.drag-nudge-svg{display:block;overflow:visible;margin-left:-6px}.drag-nudge-stroke{stroke:var(--main-color);fill:none}.drag-nudge-label{font-size:13px;font-weight:700;letter-spacing:.04em;white-space:nowrap;margin-left:18px;transform:rotate(-6deg);text-shadow:0 1px 0 color-mix(in srgb,var(--bg-color) 75%,transparent)}@keyframes drag-nudge-bob{0%,to{transform:rotate(28deg) translate(0)}50%{transform:rotate(28deg) translate(2px,-3px)}}@keyframes drag-nudge-presence{0%,58.33%{opacity:0}60%,98.33%{opacity:1}to{opacity:0}}.spin-nudge{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5;overflow:visible;opacity:0;animation:drag-nudge-presence 12s ease-in-out infinite}.spin-nudge-text{fill:var(--main-color);font-family:inherit;font-size:5.4px;font-weight:700;letter-spacing:.14em;text-shadow:0 1px 0 color-mix(in srgb,var(--bg-color) 75%,transparent)}.steps{list-style:none;padding:0;margin:0 0 26px;display:flex;flex-direction:column;gap:10px;font-size:15px}.steps li{display:flex;align-items:center;gap:12px;color:var(--sub-color)}.steps b{width:24px;height:24px;flex:none;display:grid;place-items:center;background:var(--sub-alt-color);color:var(--main-color);border-radius:50%;font-size:12px;font-weight:700}.fineprint{font-size:13px;color:var(--sub-color);margin-top:16px}.hero-right{display:flex;justify-content:center}.demo{position:relative;width:100%;max-width:360px;overflow:visible}.demo-peek-tab,.demo-backdrop{display:none}.demo-tag{position:absolute;top:-14px;left:14px;z-index:3;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bg-color);background:var(--main-color);border-radius:2px;padding:6px 11px;display:flex;align-items:center;gap:7px;transform:rotate(-2.5deg);box-shadow:2px 3px color-mix(in srgb,#000 35%,transparent)}.rec-dot{width:8px;height:8px;border-radius:50%;background:var(--bg-color);animation:blink 1.1s steps(1) infinite}@keyframes blink{50%{opacity:.25}}.demo-screen{background:var(--sub-alt-color);border-radius:16px;padding:24px 20px 20px;overflow:visible;position:relative;border:1px solid color-mix(in srgb,var(--text-color) 6%,transparent)}.demo-grain{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");z-index:2}.demo-scanlines{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;z-index:3;overflow:hidden;opacity:0;animation:demo-scan-presence 20s ease-in-out infinite}.demo-scanlines:before{content:"";position:absolute;left:0;right:0;top:-8px;height:calc(100% + 16px);background:repeating-linear-gradient(to bottom,transparent 0 2px,rgba(255,255,255,.05) 2px 3px,transparent 3px 4px,rgba(0,0,0,.2) 4px 5px);animation:demo-scan-drift 1.2s linear infinite}.demo-scanlines:after{content:"";position:absolute;left:0;right:0;height:18%;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.06),transparent);animation:demo-scan-sweep 3.8s ease-in-out infinite;pointer-events:none}@keyframes demo-scan-presence{0%,78%{opacity:0}84%,92%{opacity:1}97%,to{opacity:0}}@keyframes demo-scan-drift{0%{transform:translateY(0)}to{transform:translateY(5px)}}@keyframes demo-scan-sweep{0%{top:-20%;opacity:0}15%{opacity:1}85%{opacity:1}to{top:100%;opacity:0}}.demo-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--sub-color);margin-bottom:14px;position:relative;z-index:1}.demo-playlist{color:var(--text-color)}.demo-score{color:var(--sub-color)}.demo-score b{color:var(--main-color)}.demo-stage{position:relative;width:118px;height:118px;margin:4px auto 16px}.demo-stage--cassette{width:100%;max-width:100%;height:auto;min-height:0;margin:8px 0 18px;display:block;position:relative;z-index:1}.cassette{width:100%}.cassette-shell{background:linear-gradient(145deg,color-mix(in srgb,var(--text-color) 14%,var(--bg-color)) 0%,var(--bg-color) 55%,color-mix(in srgb,#000 22%,var(--bg-color)) 100%);border:2px solid color-mix(in srgb,var(--text-color) 35%,transparent);border-radius:12px;padding:16px 18px;width:100%;box-sizing:border-box;box-shadow:inset 0 1px color-mix(in srgb,var(--text-color) 18%,transparent),0 8px 18px color-mix(in srgb,#000 28%,transparent);position:relative;overflow:visible}.cassette-shell--interactive{cursor:pointer}.cassette-shell--interactive:hover{filter:brightness(1.04)}.cassette-screw{position:absolute;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--text-color) 55%,#fff),color-mix(in srgb,#000 50%,var(--sub-color)));box-shadow:inset 0 0 0 1px color-mix(in srgb,#000 40%,transparent)}.cassette-screw:after{content:"";position:absolute;top:3px;right:1.5px;bottom:3px;left:1.5px;background:color-mix(in srgb,#000 55%,transparent);border-radius:1px}.cassette-screw--tl{top:8px;left:8px}.cassette-screw--tr{top:8px;right:8px}.cassette-screw--bl{bottom:8px;left:8px}.cassette-screw--br{bottom:8px;right:8px}.cassette-side-mark{position:absolute;right:14px;top:50%;transform:translateY(-120%) rotate(90deg);transform-origin:center;font-family:Fraunces,Georgia,serif;font-size:13px;font-weight:700;letter-spacing:.18em;color:color-mix(in srgb,var(--main-color) 70%,var(--text-color));opacity:.55;pointer-events:none}.cassette-label{font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-align:center;color:var(--bg-color);background:var(--main-color);border-radius:5px;padding:8px 10px;margin-bottom:12px;font-weight:700;box-shadow:0 2px color-mix(in srgb,#000 22%,transparent)}.cassette-window{display:flex;align-items:center;justify-content:center;gap:36px;background:linear-gradient(180deg,color-mix(in srgb,#000 35%,var(--sub-alt-color)),color-mix(in srgb,var(--text-color) 6%,#1a1a1a));border:1px solid color-mix(in srgb,var(--text-color) 28%,transparent);border-radius:8px;padding:14px 16px;margin-bottom:12px;min-height:72px;box-shadow:inset 0 2px 8px color-mix(in srgb,#000 45%,transparent)}.cassette-reel{position:relative;width:44px;height:44px;border-radius:50%;flex:none;background:conic-gradient(from 0deg,color-mix(in srgb,var(--main-color) 8%,#1a1a1a),color-mix(in srgb,var(--main-color) 16%,#222) 55deg,color-mix(in srgb,#fff 6%,#1a1a1a) 90deg,color-mix(in srgb,var(--main-color) 10%,#1a1a1a) 140deg,#151515 220deg,color-mix(in srgb,var(--main-color) 8%,#1a1a1a) 360deg);border:1.5px solid color-mix(in srgb,var(--text-color) 18%,#000);box-shadow:inset 0 0 0 10px color-mix(in srgb,#0c0c0c 78%,transparent),0 1px 2px color-mix(in srgb,#000 35%,transparent)}.cassette-reel.spin-fast{animation:cassette-reel-cw 1.6s linear infinite}.cassette-reel.spin-slow{animation:cassette-reel-cw 3.4s linear infinite}.cassette-reel--right.spin-fast{animation-name:cassette-reel-ccw;animation-duration:1.6s}.cassette-reel--right.spin-slow{animation-name:cassette-reel-ccw;animation-duration:3.4s}@keyframes cassette-reel-cw{to{transform:rotate(360deg)}}@keyframes cassette-reel-ccw{to{transform:rotate(-360deg)}}.cassette-sprockets{display:flex;justify-content:space-between;gap:8px;padding:0 2px}.cassette-tooth{flex:1;height:22px;border-radius:3px;padding:0;cursor:pointer;display:grid;place-items:center;background:color-mix(in srgb,var(--text-color) 22%,transparent);border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent);color:var(--text-color);transition:transform .12s ease,background .12s ease,box-shadow .12s ease,color .12s ease;box-shadow:0 2px color-mix(in srgb,var(--text-color) 18%,transparent)}.cassette-tooth--static{cursor:default;pointer-events:none}.cassette-tooth-icon{display:block;width:13px;height:13px;flex:none;line-height:0;opacity:.95}.cassette-tooth:hover{background:color-mix(in srgb,var(--main-color) 35%,var(--bg-color));color:var(--main-color)}.cassette-tooth--static:hover{background:color-mix(in srgb,var(--text-color) 22%,transparent);color:var(--text-color)}.cassette-tooth:active,.cassette-tooth.is-pressed{transform:translateY(2px);box-shadow:none;background:var(--main-color);color:var(--bg-color)}.cassette-label--solved{display:flex;align-items:center;gap:8px;padding:6px 8px;overflow:hidden;text-align:left;min-height:0}.cassette-cover{width:18px;height:18px;border-radius:3px;object-fit:cover;flex:none;box-shadow:0 1px color-mix(in srgb,#000 25%,transparent)}.cassette-marquee{overflow:hidden;flex:1;min-width:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}.cassette-marquee-track{display:inline-flex;gap:2.5rem;white-space:nowrap;width:max-content;animation:cassette-marquee 9s linear infinite;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--bg-color)}.cassette-marquee-track span{flex:none}@keyframes cassette-marquee{0%{transform:translate(0)}to{transform:translate(calc(-50% - 1.25rem))}}.demo-progress{margin-bottom:14px}.demo-track{height:10px}.demo-time{display:block;font-size:11px;color:var(--sub-color);margin-top:6px;text-align:right}.demo-result{height:164px;min-height:164px;max-height:164px;box-sizing:border-box;overflow:hidden}.demo-rows{display:flex;flex-direction:column;gap:6px;height:100%;min-height:0}.demo-rows .demo-guess-row{flex:1 1 0;min-height:0;font-size:12px;padding:5px 11px;gap:6px}.demo-rows .demo-guess-row .gr-field{max-width:46%}.demo-win{display:flex;align-items:center;gap:14px;height:100%;min-height:0;padding:0;box-sizing:border-box}.demo-win-cover{width:164px;height:164px;flex:none;border-radius:10px;object-fit:cover;display:block;border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent)}.demo-win-meta{min-width:0;flex:1;text-align:left}.demo-win-title{display:block;font-weight:700;font-size:17px;line-height:1.25;color:var(--text-color)}.demo-win-artist{display:block;margin-top:6px;font-size:13px;color:var(--sub-color)}.fab-dock{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;align-items:flex-end;gap:10px;pointer-events:none}.fab-item{position:relative;pointer-events:none}.fab-item>*{pointer-events:auto}.help-fab{position:relative;z-index:82;width:46px;height:46px;border-radius:50%;border:2px solid color-mix(in srgb,var(--text-color) 22%,transparent);background:var(--sub-alt-color);color:var(--main-color);font-family:var(--font);font-size:22px;font-weight:700;line-height:1;cursor:pointer;box-shadow:0 8px 22px color-mix(in srgb,#000 35%,transparent);transition:background .15s ease,color .15s ease,transform .12s ease,border-color .15s ease}.feedback-fab{font-size:18px}.help-fab:hover,.help-fab.is-open{background:var(--main-color);color:var(--bg-color);border-color:var(--main-color)}.help-fab:active{transform:scale(.96)}.help-fab:focus-visible{outline:2px solid var(--main-color);outline-offset:3px}.help-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in srgb,#000 45%,transparent);z-index:79}.help-panel{position:absolute;right:0;bottom:58px;width:min(360px,calc(100vw - 36px));max-height:min(70vh,520px);overflow:auto;background:var(--sub-alt-color);color:var(--text-color);border:1px solid color-mix(in srgb,var(--text-color) 16%,transparent);border-radius:14px;box-shadow:0 16px 40px color-mix(in srgb,#000 40%,transparent);padding:16px 16px 18px;transform-origin:bottom right;opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:81}.feedback-panel,.fab-item .help-panel{right:0;left:auto;transform-origin:bottom right}.help-panel.is-open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.help-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.feedback-head-actions{display:flex;align-items:center;gap:6px}.feedback-about-btn{height:32px;padding:0 10px;border:none;border-radius:8px;background:color-mix(in srgb,var(--text-color) 10%,transparent);color:var(--main-color);font-family:var(--font);font-size:13px;font-weight:700;line-height:1;letter-spacing:.01em;cursor:pointer;white-space:nowrap}.feedback-about-btn:hover,.feedback-about-btn.is-open{background:var(--main-color);color:var(--bg-color)}.feedback-about{font-size:13px;line-height:1.55}.feedback-about p{margin:0 0 12px}.feedback-about-img{display:block;width:100%;border-radius:10px;border:1px solid color-mix(in srgb,var(--text-color) 14%,transparent)}.feedback-about-note{margin:10px 0 0!important;font-size:12px;color:var(--sub-color)}.help-title{margin:0;font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--main-color);text-transform:lowercase;font-family:var(--font)}.help-body h3.help-section-title{margin:4px 0 10px;font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--main-color);text-transform:lowercase;font-family:var(--font)}.help-body h3.help-section-title+p{margin-top:0}.help-body h3.help-section-title:not(:first-child){margin-top:18px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--text-color) 12%,transparent)}.help-close{width:32px;height:32px;border:none;border-radius:8px;background:color-mix(in srgb,var(--text-color) 10%,transparent);color:var(--text-color);font-size:20px;line-height:1;cursor:pointer}.help-close:hover{background:var(--main-color);color:var(--bg-color)}.help-body{font-size:13px;line-height:1.55;color:var(--text-color)}.help-lead{margin:0 0 12px;color:var(--sub-color);font-size:13px}.help-body .play-howto-steps{margin-bottom:0}.help-body p{margin:0 0 12px}.help-panel-foot{margin:0;padding:8px 2px 0;text-align:center;font-size:12px;color:var(--sub-color)}.feedback-form{display:flex;flex-direction:column;gap:10px}.feedback-form.is-dragover{outline:2px dashed color-mix(in srgb,var(--main-color) 55%,transparent);outline-offset:4px;border-radius:12px}.feedback-label{font-size:13px;color:var(--sub-color)}.feedback-input{width:100%;resize:vertical;min-height:110px;max-height:240px;padding:12px;border-radius:10px;border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent);background:var(--bg-color);color:var(--text-color);font-family:var(--font);font-size:14px;line-height:1.45}.feedback-input::placeholder{color:color-mix(in srgb,var(--sub-color) 55%,transparent);opacity:1}.feedback-input:focus{outline:2px solid var(--main-color);outline-offset:1px}.feedback-input:disabled{opacity:.7}.feedback-attach-row{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}.feedback-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.feedback-attach{flex:none;background:color-mix(in srgb,var(--text-color) 8%,transparent);color:var(--sub-color);font-weight:500}.feedback-attach:hover:not(:disabled){background:color-mix(in srgb,var(--text-color) 14%,transparent);color:var(--text-color)}.feedback-attach-hint{flex:1 1 auto;min-width:0;font-size:11px;color:color-mix(in srgb,var(--sub-color) 75%,transparent)}.feedback-send{flex:none;margin-left:auto;font-weight:600}.feedback-shots{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}.feedback-shot{position:relative;width:72px;height:72px;border-radius:8px;overflow:hidden;border:1px solid color-mix(in srgb,var(--text-color) 14%,transparent);background:var(--bg-color)}.feedback-shot img{display:block;width:100%;height:100%;object-fit:cover}.feedback-shot-remove{position:absolute;top:2px;right:2px;width:20px;height:20px;padding:0;border:none;border-radius:6px;background:color-mix(in srgb,var(--bg-color) 85%,transparent);color:var(--text-color);font-size:14px;line-height:1;cursor:pointer}.feedback-shot-remove:hover{background:var(--error-color);color:#fff}.feedback-error{margin:0;font-size:12px;color:var(--error-color)}.feedback-thanks{margin:8px 0 4px;font-size:15px;font-weight:600;color:var(--main-color)}@media (max-width: 520px){.fab-dock{right:14px;bottom:14px}}.panel{background:var(--sub-alt-color);border-radius:16px;padding:32px;max-width:520px;text-align:center}.title{font-size:30px;font-weight:700;line-height:1.15;margin:12px 0 10px}.subtitle{font-size:15px;line-height:1.6;margin:0 auto 22px;max-width:46ch;color:var(--sub-color)}.picker{width:min(var(--maxw),100%);position:relative}.picker-tour-section{position:relative;border-radius:14px;--shelf-case: 132px;--shelf-gap: 10px;--shelf-tray-w: calc((3 * var(--shelf-case)) + (2 * var(--shelf-gap)) + 48px);--tour-card-w: min(var(--shelf-tray-w), 100%)}.picker-tour-section.picker-tour-describe,.picker-tour-section.picker-tour-stack{--tour-card-w: min(400px, 100%)}.picker.is-touring .picker-tour-dim,.picker.is-touring .picker-tour-focus{pointer-events:none;-webkit-user-select:none;user-select:none;transition:filter .35s ease,opacity .35s ease}.picker.is-touring .picker-tour-dim{filter:blur(7px);opacity:.4}.picker.is-touring .picker-tour-focus{filter:none;opacity:1;z-index:4}.picker.is-touring .picker-tour-stack.picker-tour-focus .cd-stack-row{filter:blur(7px);opacity:.4}@media (prefers-reduced-motion: reduce){.picker.is-touring .picker-tour-dim,.picker.is-touring .picker-tour-focus{filter:none;transition:none}.picker.is-touring .picker-tour-dim{opacity:.35}.picker.is-touring .picker-tour-stack.picker-tour-focus .cd-stack-row{filter:none;opacity:.35}}.picker-tour-card{position:absolute;left:50%;transform:translate(-50%);z-index:6;width:var(--tour-card-w, 100%);max-width:100%;box-sizing:border-box;margin:10px 0 0;pointer-events:auto;background:color-mix(in srgb,var(--sub-alt-color) 94%,transparent);border:1px solid color-mix(in srgb,var(--text-color) 12%,transparent);border-radius:16px;box-shadow:0 16px 40px color-mix(in srgb,#000 40%,transparent);padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;text-align:center}.chart-search .picker-tour-card{top:calc(100% + 10px);left:0;transform:none;width:100%;margin:0}.picker.is-touring .picker-tour-card{pointer-events:auto}.picker-tour-card .spotlight-head{justify-content:space-between;flex-wrap:nowrap;gap:8px}.picker-tour-card .spotlight-title{flex:1;min-width:0;text-align:center}.picker-tour-mark{flex:none;width:26px;height:26px;border-radius:50%;border:2px solid color-mix(in srgb,var(--text-color) 22%,transparent);display:grid;place-items:center;font-size:14px;font-weight:700;line-height:1;color:var(--main-color)}.picker-tour-step{flex:none;min-width:26px;font-size:12px;font-weight:600;color:var(--sub-color);font-variant-numeric:tabular-nums}.picker-tour-card .spotlight-actions{justify-content:stretch}.picker-tour-card .spotlight-actions .btn{width:100%;justify-content:center}.picker-heading{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0}.section-title{font-size:26px;font-weight:700;text-align:center;margin:0}.section-sub{text-align:center;color:var(--sub-color);margin-bottom:26px;font-size:14px}.picker-more{display:block;margin:18px auto 0}.view-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;min-width:0;height:auto;padding:3px 7px;border:1px solid color-mix(in srgb,var(--text-color) 22%,transparent);border-radius:6px;background:transparent;color:color-mix(in srgb,var(--sub-color) 80%,transparent);cursor:pointer;flex:none;font:inherit;font-size:10px;font-weight:500;letter-spacing:.06em;line-height:1.2;text-transform:uppercase;transition:color .15s ease,border-color .15s ease}.view-toggle:hover,.view-toggle[aria-pressed=true]{background:transparent;color:var(--sub-color);border-color:color-mix(in srgb,var(--text-color) 38%,transparent)}.picker-section-title{font-size:26px;font-weight:700;margin:0;line-height:1.15;white-space:nowrap}.picker-section-sub{text-align:center;color:var(--sub-color);font-size:13px;margin:0 0 18px}.chart-search-block{display:flex;flex-direction:column;align-items:center;margin:36px 0 22px}.chart-search-sub{margin-top:4px;margin-bottom:18px}.chart-search{position:relative;width:min(100%,400px);margin:0;max-width:400px}.chart-search .join-code-row{width:100%}.chart-search-field{position:relative;flex:1;min-width:0;display:block}.chart-search-label{position:relative;display:block}.chart-search-field .guess-suggest{top:calc(100% + 6px);bottom:auto;z-index:30;box-shadow:0 10px 24px color-mix(in srgb,#000 28%,transparent)}.chart-search-ph{position:absolute;left:15px;right:12px;top:50%;transform:translateY(-50%);z-index:1;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;font-weight:500;letter-spacing:.02em;line-height:1;display:flex;align-items:center;gap:1px}.chart-search-ph-main{color:var(--sub-color);min-width:0;overflow:hidden;text-overflow:ellipsis}.chart-search-ph-caret{flex:none;display:inline-block;width:1.5px;height:1em;background:var(--sub-color);opacity:.7;animation:chart-ph-blink 1s step-end infinite}@keyframes chart-ph-blink{50%{opacity:0}}@media (prefers-reduced-motion: reduce){.chart-search-ph-caret{animation:none;opacity:.55}}.chart-search-input{position:relative;z-index:0;width:100%;letter-spacing:.02em;font-weight:500;text-transform:none}.chart-search .join-code-input{text-transform:none;letter-spacing:.02em;font-weight:500}.chart-search-input.chart-search-input--error{color:var(--error-color);border-color:color-mix(in srgb,var(--error-color) 55%,transparent);transition:color .35s ease,opacity .35s ease,border-color .35s ease}.chart-search-input.chart-search-input--fading{opacity:0}@media (prefers-reduced-motion: reduce){.chart-search-input.chart-search-input--error{transition:none}}.chart-search-input::placeholder{color:transparent}.own-playlists-link{display:block;width:fit-content;margin:-20px auto 22px;padding:0;border:none;background:none;font-family:var(--font);font-size:13px;color:var(--sub-color);text-decoration:underline;text-underline-offset:2px;cursor:pointer}.own-playlists-link:hover{color:var(--text-color)}.shelf-row{--shelf-case: 132px;--shelf-gap: 10px;--shelf-tray-w: calc((3 * var(--shelf-case)) + (2 * var(--shelf-gap)) + 48px);display:flex;align-items:flex-start;justify-content:center;gap:0;width:min(920px,100%);margin:6px auto 4px}.shelf-tray{position:relative;z-index:2;flex:0 0 min(var(--shelf-tray-w),100%);flex-shrink:0;box-sizing:border-box;max-width:var(--shelf-tray-w);width:min(var(--shelf-tray-w),100%);margin:0;padding:14px 12px 16px;border-radius:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--text-color) 14%,var(--sub-alt-color)) 0%,var(--sub-alt-color) 40%,color-mix(in srgb,#000 28%,var(--sub-alt-color)) 100%);border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent);box-shadow:0 22px 48px color-mix(in srgb,#000 45%,transparent),inset 0 1px color-mix(in srgb,#fff 12%,transparent),inset 0 -3px 10px color-mix(in srgb,#000 35%,transparent)}.shelf-row.is-picking .shelf-tray{flex:0 0 min(var(--shelf-tray-w),100%);flex-shrink:0;max-width:var(--shelf-tray-w);width:min(var(--shelf-tray-w),100%)}.shelf-tray-inner{height:calc(var(--shelf-case) + 16px + 18px);padding:8px 8px 0;border-radius:6px;overflow:hidden;background:repeating-linear-gradient(90deg,transparent 0 22px,color-mix(in srgb,#fff 1.5%,transparent) 22px 23px),linear-gradient(180deg,color-mix(in srgb,#000 55%,var(--bg-color)),color-mix(in srgb,#000 35%,var(--bg-color)),color-mix(in srgb,#000 45%,var(--bg-color)));box-shadow:inset 0 0 0 1px color-mix(in srgb,#000 55%,transparent),inset 0 10px 22px color-mix(in srgb,#000 45%,transparent)}.shelf-cases{list-style:none;margin:0;padding:0 4px 14px;height:calc(var(--shelf-case) + 8px);display:flex;align-items:stretch;gap:var(--shelf-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 28%,transparent) transparent;cursor:grab;box-sizing:content-box;-webkit-overflow-scrolling:touch;touch-action:pan-x;-webkit-user-select:none;user-select:none;overscroll-behavior-x:contain;scroll-behavior:auto}.shelf-cases:active{cursor:grabbing}@media (hover: hover) and (pointer: fine){.shelf-cases,.cd-spines{scroll-snap-type:none}}.shelf-cases::-webkit-scrollbar{height:6px}.shelf-cases::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-color) 25%,transparent);border-radius:99px}.shelf-slot{flex:0 0 auto;width:var(--shelf-case);scroll-snap-align:start;transition:opacity .28s ease,transform .28s ease}.shelf-slot.is-out{opacity:.28;transform:translateY(6px) scale(.96)}.shelf-case{--cd-base: #cfcfc8;--cd-hi: #f2f2ec;--cd-lo: #9a9a94;--cd-ink: #1a1a1a;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;padding:0;width:100%;height:100%;cursor:grab;display:grid;grid-template-rows:auto 1fr;border-radius:3px;overflow:hidden;color:var(--cd-ink);background:linear-gradient(180deg,var(--cd-hi),var(--cd-base) 45%,var(--cd-lo));box-shadow:0 10px 22px color-mix(in srgb,#000 40%,transparent),inset 0 1px color-mix(in srgb,#fff 35%,transparent);transition:transform .18s ease;-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.shelf-case:hover:not(:disabled){transform:translateY(-3px)}.shelf-case:disabled{cursor:wait;opacity:.72}.shelf-spine{height:22px;display:flex;align-items:center;justify-content:center;padding:0 8px;font-family:var(--font);font-style:normal;font-weight:500;font-size:11px;letter-spacing:.02em;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid color-mix(in srgb,var(--cd-ink) 22%,transparent)}.shelf-face{position:relative;min-height:0;background:#111}.shelf-face img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;pointer-events:none}.shelf-face-fallback{width:100%;height:100%;min-height:100px;display:grid;place-items:center;font-size:28px;background:linear-gradient(145deg,#444,#222);color:var(--main-color)}.shelf-face-fallback.liked{background:var(--main-color);color:var(--bg-color)}.shelf-hinge{position:absolute;left:0;top:0;bottom:0;width:7px;background:linear-gradient(90deg,color-mix(in srgb,#000 45%,transparent),transparent);pointer-events:none}.shelf-tray-footer{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:14px;padding:0 8px}.shelf-tray-caption{margin:0;text-align:left;font-size:13px;color:var(--sub-color);letter-spacing:.06em}.shelf-tray-hint{margin:0;text-align:right;font-size:12px;color:color-mix(in srgb,var(--sub-color) 80%,transparent)}.shelf-panel{flex:0 0 0;width:0;max-width:0;min-width:0;opacity:0;overflow:hidden;transform:translate(-12px);pointer-events:none;align-self:flex-start;margin-top:var(--shelf-panel-top, 8px);display:flex;flex-direction:column;z-index:1;transition:flex-basis .34s cubic-bezier(.22,1,.36,1),width .34s cubic-bezier(.22,1,.36,1),max-width .34s cubic-bezier(.22,1,.36,1),opacity .28s ease,transform .34s cubic-bezier(.22,1,.36,1)}.shelf-panel.is-open{flex:0 0 min(240px,38vw);flex-shrink:0;width:min(240px,38vw);max-width:260px;min-width:min(240px,38vw);height:var(--shelf-panel-h, 180px);opacity:1;overflow:hidden;transform:translate(0);pointer-events:auto}.shelf-insert .cd-insert-title{font-family:var(--font);font-style:normal;font-weight:600;font-size:18px;text-transform:none;letter-spacing:.01em;text-decoration:none}.shelf-insert-body{flex:1 1 auto;min-height:0}.cd-row{--cd-spine-w: 20px;--cd-case-h: 220px;--cd-spine-len: calc(var(--cd-case-h) - 16px);--cd-gap: 2px;--cd-dur: .34s;--cd-ease: cubic-bezier(.22, 1, .36, 1);--cd-pull: 12px;display:flex;align-items:flex-start;justify-content:center;gap:0;width:min(920px,100%);margin:6px auto 4px;transition:gap .34s cubic-bezier(.22,1,.36,1)}.cd-row.is-picking{gap:0}.cd-tray{position:relative;z-index:2;flex:0 0 min(280px,42vw);max-width:300px;margin:0;padding:14px 12px 16px;border-radius:10px;transition:transform .34s cubic-bezier(.22,1,.36,1);background:linear-gradient(180deg,color-mix(in srgb,var(--text-color) 14%,var(--sub-alt-color)) 0%,var(--sub-alt-color) 40%,color-mix(in srgb,#000 28%,var(--sub-alt-color)) 100%);border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent);box-shadow:0 22px 48px color-mix(in srgb,#000 45%,transparent),inset 0 1px color-mix(in srgb,#fff 12%,transparent),inset 0 -3px 10px color-mix(in srgb,#000 35%,transparent)}.cd-tray:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:8px;pointer-events:none;background:radial-gradient(ellipse at 8% 12%,color-mix(in srgb,#fff 4%,transparent),transparent 40%),radial-gradient(ellipse at 92% 88%,color-mix(in srgb,#000 25%,transparent),transparent 45%)}.cd-tray-inner{position:relative;box-sizing:border-box;height:calc(var(--cd-case-h) + 14px);padding:8px 8px 0;border-radius:6px;display:flex;align-items:stretch;background:repeating-linear-gradient(90deg,transparent 0 22px,color-mix(in srgb,#fff 1.5%,transparent) 22px 23px),linear-gradient(180deg,color-mix(in srgb,#000 55%,var(--bg-color)),color-mix(in srgb,#000 35%,var(--bg-color)),color-mix(in srgb,#000 45%,var(--bg-color)));box-shadow:inset 0 0 0 1px color-mix(in srgb,#000 55%,transparent),inset 0 10px 22px color-mix(in srgb,#000 45%,transparent);overflow:hidden}.cd-tray-caption{margin:14px 0 0;text-align:center;font-size:13px;line-height:1.35;color:var(--sub-color);letter-spacing:.06em}.cd-tray-hint{margin:6px 0 2px;text-align:center;font-size:12px;line-height:1.4;color:color-mix(in srgb,var(--sub-color) 80%,transparent)}.cd-stack-block{display:flex;flex-direction:column;align-items:center;margin:36px auto 8px;width:min(920px,100%)}.cd-stack-add{margin-bottom:10px}.cd-stack-tray-inner{flex-direction:column;justify-content:flex-end;align-items:stretch;background:repeating-linear-gradient(180deg,transparent 0 22px,color-mix(in srgb,#fff 1.5%,transparent) 22px 23px),linear-gradient(180deg,color-mix(in srgb,#000 55%,var(--bg-color)),color-mix(in srgb,#000 35%,var(--bg-color)),color-mix(in srgb,#000 45%,var(--bg-color)))}.cd-stack-empty{flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:var(--cd-case-h);margin:0;padding:0 8px;text-align:center;font-size:12px;line-height:1.45;color:color-mix(in srgb,var(--sub-color) 75%,transparent);letter-spacing:.04em}.cd-stack-discs{list-style:none;margin:0;padding:0 14px 14px 2px;display:flex;flex-direction:column-reverse;flex-wrap:nowrap;align-items:stretch;gap:var(--cd-gap);width:100%;height:var(--cd-case-h);box-sizing:content-box;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y proximity;scroll-behavior:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;-webkit-user-select:none;user-select:none;overscroll-behavior-y:contain;cursor:grab;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 30%,transparent) transparent}.cd-stack-discs:active{cursor:grabbing}.cd-stack-discs::-webkit-scrollbar{width:6px}.cd-stack-discs::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-color) 28%,transparent);border-radius:99px}.cd-stack-disc-slot{position:relative;flex:0 0 var(--cd-spine-w);width:100%;min-height:var(--cd-spine-w);scroll-snap-align:end;z-index:calc(var(--stack-i, 0) + 1)}.cd-stack-disc{--cd-base: #cfcfc8;--cd-hi: #f2f2ec;--cd-lo: #9a9a94;--cd-ink: #1a1a1a;position:relative;width:100%;height:100%;margin:0;padding:0 10px;border:none;border-radius:2px;overflow:hidden;display:flex;align-items:center;box-sizing:border-box;background:linear-gradient(180deg,color-mix(in srgb,#fff 45%,transparent) 0 1px,transparent 1px 2px,transparent calc(100% - 2px),color-mix(in srgb,#000 25%,transparent) calc(100% - 1px)),linear-gradient(180deg,var(--cd-hi) 0%,var(--cd-base) 38%,color-mix(in srgb,var(--cd-base) 70%,#000) 52%,var(--cd-base) 62%,var(--cd-lo) 100%);box-shadow:inset 0 1px color-mix(in srgb,#fff 35%,transparent),inset 0 -1px color-mix(in srgb,#000 28%,transparent),inset 0 0 0 1px color-mix(in srgb,#000 18%,transparent),1px 1px 2px color-mix(in srgb,#000 30%,transparent);transition:filter var(--cd-dur) ease}.cd-stack-disc-title{position:relative;z-index:3;width:100%;margin:0;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:var(--cd-ink);pointer-events:none}.cd-stack-disc--font-hand .cd-stack-disc-title,.cd-spine--font-hand.cd-stack-disc .cd-stack-disc-title{font-family:Caveat,Segoe Print,cursive;font-size:14px;font-weight:700;letter-spacing:.02em;text-transform:none}.cd-stack-play-row{display:none}.cd-spines{list-style:none;margin:0;padding:0 2px 14px;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:var(--cd-gap);width:100%;height:var(--cd-case-h);box-sizing:content-box;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-behavior:auto;-webkit-overflow-scrolling:touch;touch-action:pan-x;-webkit-user-select:none;user-select:none;overscroll-behavior-x:contain;cursor:grab;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 30%,transparent) transparent;position:relative;z-index:1}.cd-spines:active{cursor:grabbing}.cd-spines::-webkit-scrollbar{height:6px}.cd-spines::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-color) 28%,transparent);border-radius:99px}.cd-spine-slot{position:relative;flex:0 0 var(--cd-spine-w);width:var(--cd-spine-w);min-width:var(--cd-spine-w);height:100%;scroll-snap-align:start;z-index:0}.cd-spine-slot:hover,.cd-spine-slot:focus-within,.cd-spine-slot.is-out{z-index:5}.cd-spine{--w-scale: 1;--tilt: 0deg;--depth: 0px;--cd-base: #cfcfc8;--cd-hi: #f2f2ec;--cd-lo: #9a9a94;--cd-ink: #1a1a1a;--cd-tint: transparent;--cd-cloud: 0;position:absolute;left:50%;bottom:var(--depth);width:calc(100% * var(--w-scale));height:100%;transform:translate(-50%) rotate(var(--tilt));padding:0;margin:0;border:none;border-radius:2px;cursor:grab;overflow:hidden;color:var(--cd-ink);background:linear-gradient(90deg,color-mix(in srgb,#fff 45%,transparent) 0 1px,transparent 1px 2px,transparent calc(100% - 2px),color-mix(in srgb,#000 25%,transparent) calc(100% - 1px)),linear-gradient(90deg,var(--cd-hi) 0%,var(--cd-base) 38%,color-mix(in srgb,var(--cd-base) 70%,#000) 52%,var(--cd-base) 62%,var(--cd-lo) 100%);box-shadow:inset 1px 0 color-mix(in srgb,#fff 35%,transparent),inset -1px 0 color-mix(in srgb,#000 28%,transparent),inset 0 0 0 1px color-mix(in srgb,#000 18%,transparent),1px 1px 2px color-mix(in srgb,#000 30%,transparent);transition:transform var(--cd-dur) var(--cd-ease),bottom var(--cd-dur) var(--cd-ease),box-shadow var(--cd-dur) var(--cd-ease),filter var(--cd-dur) ease}.cd-spine:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 46%,color-mix(in srgb,#000 12%,transparent) 50%,transparent 54%),var(--cd-tint);mix-blend-mode:multiply;opacity:.5;pointer-events:none}.cd-spine:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E"),repeating-linear-gradient(7deg,transparent 0 9px,color-mix(in srgb,#000 5%,transparent) 9px 10px);background-size:90px 90px,auto;opacity:calc(.38 + var(--cd-cloud) * .45);mix-blend-mode:soft-light;pointer-events:none;z-index:1}.cd-spine--clear{--cd-base: #d8d8d2;--cd-hi: #f6f6f2;--cd-lo: #b0b0aa;--cd-ink: #111}.cd-spine--white{--cd-base: #efefe9;--cd-hi: #fafaf6;--cd-lo: #d0d0ca;--cd-ink: #222}.cd-spine--black{--cd-base: #2a2a2a;--cd-hi: #3a3a3a;--cd-lo: #141414;--cd-ink: #e8e8e2}.cd-spine--grey{--cd-base: #9e9e98;--cd-hi: #b8b8b2;--cd-lo: #7a7a74;--cd-ink: #1c1c1c}.cd-spine--smoke{--cd-base: #6e726f;--cd-hi: #8a8e8b;--cd-lo: #4f5350;--cd-ink: #f0f0ea}.cd-spine--amber{--cd-base: #c4a574;--cd-hi: #dec49a;--cd-lo: #9e7f52;--cd-ink: #1f160c}.cd-spine--slate{--cd-base: #5c6b7a;--cd-hi: #7a8a99;--cd-lo: #3f4c58;--cd-ink: #f2f4f6}.cd-spine--frost{--cd-base: #d5d0c0;--cd-hi: #ebe6d6;--cd-lo: #a8a392;--cd-ink: #1a1a1a}.cd-spine--blue{--cd-base: #7a9bb8;--cd-hi: #9bb6ce;--cd-lo: #5a7a94;--cd-ink: #0e1820}.cd-spine--purple{--cd-base: #8a7a9e;--cd-hi: #a898b8;--cd-lo: #6a5a7e;--cd-ink: #140e1a}.cd-spine--yellowed{--cd-base: #d4c48a;--cd-hi: #e8d9a8;--cd-lo: #b8a66a;--cd-ink: #2a220e;--cd-cloud: .35}.cd-spine--faded{filter:saturate(.65) brightness(1.05)}.cd-spine--faded .cd-spine-title{opacity:.55}.cd-spine--new{filter:brightness(1.06) contrast(1.05)}.cd-spine--new:before{opacity:.22}.cd-spine--used{--cd-cloud: .45}.cd-crack{position:absolute;top:0;right:0;width:10px;height:14px;background:linear-gradient(135deg,transparent 45%,color-mix(in srgb,#fff 55%,transparent) 48%,transparent 52%),linear-gradient(160deg,transparent 40%,color-mix(in srgb,#000 25%,transparent) 50%,transparent 55%);z-index:4;pointer-events:none}.cd-spine-title{position:absolute;left:50%;top:50%;z-index:3;width:calc(var(--cd-spine-len) - 20px);margin:0;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;color:var(--cd-ink);transform:translate(-50%,-50%) rotate(-90deg);pointer-events:none}.cd-spine--font-hand .cd-spine-title{font-family:Caveat,Segoe Print,cursive;font-size:15px;font-weight:700;letter-spacing:.02em;text-transform:none}.cd-spine--font-serif .cd-spine-title{font-family:Libre Baskerville,Georgia,serif;font-size:9px;font-weight:400;letter-spacing:.02em;text-transform:none;font-style:italic}.cd-spine--font-mono .cd-spine-title{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:8px;font-weight:600;letter-spacing:.12em}.cd-spine--font-thin .cd-spine-title{font-weight:300;letter-spacing:.14em;font-size:9px}.cd-spine--font-condensed .cd-spine-title{font-weight:700;letter-spacing:-.02em;font-size:10px;transform:translate(-50%,-50%) rotate(-90deg) scaleX(.88)}.cd-sticker{position:absolute;z-index:5;font-family:var(--font);font-size:5.5px;font-weight:700;line-height:1;letter-spacing:.02em;padding:2px 3px;pointer-events:none;white-space:nowrap;box-shadow:0 1px 1px color-mix(in srgb,#000 25%,transparent)}.cd-sticker--square{border-radius:1px;background:#f2e6a0;color:#222}.cd-sticker--round{border-radius:50%;width:11px;height:11px;padding:0;display:grid;place-items:center;background:#e85d5d;color:#fff;font-size:6px}.cd-sticker--round.star{background:var(--main-color);color:#222}.cd-sticker--round.heart{background:#d94f7a}.cd-sticker--price{background:#fff;color:#c0392b;border:1px solid #c0392b;border-radius:1px;font-size:5px}.cd-sticker--lib{background:#2c5aa0;color:#fff;border-radius:0;font-size:5px;letter-spacing:.08em}.cd-sticker--peel{clip-path:polygon(0 0,100% 0,100% 70%,85% 100%,0 100%);opacity:.85}.cd-spine:hover:not(:disabled),.cd-spine:focus-visible,.cd-spine-slot.is-out .cd-spine,.cd-spine.is-selected{bottom:calc(var(--depth) + var(--cd-pull));transform:translate(-50%) rotate(calc(var(--tilt) + .6deg)) scaleX(1.03);box-shadow:inset 1px 0 color-mix(in srgb,#fff 40%,transparent),inset -1px 0 color-mix(in srgb,#000 28%,transparent),0 8px 18px color-mix(in srgb,#000 45%,transparent),0 0 0 1px color-mix(in srgb,var(--main-color) 50%,transparent);filter:brightness(1.04);outline:none}.cd-spine:disabled{cursor:wait;opacity:.72}.cd-panel{flex:0 0 0;width:0;max-width:0;min-width:0;opacity:0;overflow:hidden;transform:translate(-12px);pointer-events:none;align-self:flex-start;display:flex;flex-direction:column;margin:0;z-index:1;transition:flex-basis .34s cubic-bezier(.22,1,.36,1),width .34s cubic-bezier(.22,1,.36,1),max-width .34s cubic-bezier(.22,1,.36,1),margin-left .34s cubic-bezier(.22,1,.36,1),opacity .28s ease,transform .34s cubic-bezier(.22,1,.36,1)}.cd-panel.is-open{flex:0 0 min(228px,34vw);width:min(228px,34vw);max-width:240px;height:var(--cd-panel-h, var(--cd-case-h));margin-top:var(--cd-panel-top, 8px);margin-left:0;opacity:1;overflow:hidden;transform:translate(0);pointer-events:auto}.cd-insert{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;box-sizing:border-box;flex:1 1 auto;height:100%;min-height:0;max-height:100%;padding:14px 14px 0 18px;overflow:hidden;background:linear-gradient(105deg,color-mix(in srgb,#fff 22%,transparent) 0%,transparent 42%),linear-gradient(180deg,var(--cd-hi, #f2f2ec) 0%,var(--cd-base, #cfcfc8) 48%,var(--cd-lo, #9a9a94) 100%);color:var(--cd-ink, #1a1a1a);border:1px solid color-mix(in srgb,var(--cd-ink, #1a1a1a) 28%,transparent);border-radius:2px;box-shadow:0 14px 32px color-mix(in srgb,#000 32%,transparent),inset 1px 0 color-mix(in srgb,#fff 35%,transparent),inset -1px 0 color-mix(in srgb,#000 18%,transparent),inset 0 1px color-mix(in srgb,#fff 40%,transparent)}.cd-insert:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.45 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:90px 90px;opacity:.28;mix-blend-mode:soft-light}.cd-insert.is-faded{filter:saturate(.7) brightness(1.04)}.cd-insert-head,.cd-insert-body,.cd-insert-actions{position:relative;z-index:1;min-width:0}.cd-insert-head{padding-bottom:10px;margin-bottom:2px;border-bottom:1px solid color-mix(in srgb,var(--cd-ink) 18%,transparent)}.cd-insert-title{margin:0 0 6px;font-size:20px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;line-height:1.1;color:var(--cd-ink)}.cd-insert-title.hand{font-family:Caveat,cursive;font-size:26px;text-transform:none;letter-spacing:.01em;text-decoration:underline;text-underline-offset:4px}.cd-insert-title.serif{font-family:Libre Baskerville,Georgia,serif;font-style:italic;text-transform:none;font-weight:400;letter-spacing:0}.cd-insert-meta{margin:0;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:10px;letter-spacing:.02em;color:color-mix(in srgb,var(--cd-ink) 62%,transparent);line-height:1.45}.cd-insert-rule{display:none}.cd-insert-body{min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:8px;padding:8px 0 6px}.cd-insert-notes{margin:0;flex:none;font-size:11px;line-height:1.4;color:var(--cd-ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}.cd-insert-feat-block{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:6px;overflow:hidden}.cd-insert-feat{margin:0;flex:none;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--cd-ink) 55%,transparent)}.cd-insert-tracks{list-style:none;margin:0;padding:0 2px 0 0;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:12px;line-height:1.3;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--cd-ink) 35%,transparent) transparent}.cd-insert-tracks::-webkit-scrollbar{width:4px}.cd-insert-tracks::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--cd-ink) 30%,transparent);border-radius:99px}.cd-insert-tracks li{display:grid;grid-template-columns:2ch 1fr;gap:10px;align-items:baseline;min-width:0;flex:0 0 auto}.cd-insert-tracks li span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cd-insert-tracks .n{color:color-mix(in srgb,var(--cd-ink) 48%,transparent);text-align:right}.cd-insert-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:14px;flex:none;margin:0 -14px 0 -18px;padding:10px 14px 12px 18px;border-top:1px solid color-mix(in srgb,var(--cd-ink) 18%,transparent);background:color-mix(in srgb,var(--cd-lo) 78%,#000 8%)}.cd-insert-play,.cd-insert-back{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:none;padding:0;font:inherit;cursor:pointer;color:var(--cd-ink)}.cd-insert-play{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:3px;border:1px solid color-mix(in srgb,var(--cd-ink) 82%,transparent);background:var(--cd-ink);color:var(--cd-hi);font-family:IBM Plex Mono,ui-monospace,monospace;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;box-shadow:inset 0 1px color-mix(in srgb,#fff 18%,transparent)}.cd-insert-play:hover:not(:disabled){background:color-mix(in srgb,var(--cd-ink) 82%,#fff);color:var(--cd-hi)}.cd-insert-play:active:not(:disabled){transform:translateY(1px)}.cd-insert-back{font-size:13px;color:color-mix(in srgb,var(--cd-ink) 58%,transparent);text-decoration:underline;text-underline-offset:3px}.cd-insert-back:hover:not(:disabled){color:var(--cd-ink)}.cd-insert-play:disabled,.cd-insert-back:disabled{opacity:.55;cursor:wait}@media (max-width: 720px){.shelf-row{flex-direction:column;width:100%;align-items:center;justify-content:center}.shelf-tray,.shelf-row.is-picking .shelf-tray{flex:none;width:100%;max-width:var(--shelf-tray-w);align-self:center;margin-inline:auto;padding:12px 10px}.shelf-tray-footer{margin-top:10px}.shelf-panel.is-open{flex:none;width:min(100%,var(--shelf-panel-w, calc(100% - 16px) ));max-width:none;margin-left:auto;margin-right:auto;margin-top:0;height:auto;align-self:center}.cd-row{flex-direction:column;width:100%;align-items:center}.cd-row.is-picking{gap:0}.cd-tray{flex:none;width:100%;max-width:none;--cd-case-h: 192px;--cd-pull: 10px}.cd-panel.is-open{flex:none;width:var(--cd-panel-w, calc(100% - 16px) );max-width:none;margin-left:var(--cd-panel-side, 8px);margin-right:var(--cd-panel-side, 8px);margin-top:0;height:auto;align-self:center}.cd-insert{height:auto;min-height:0;max-height:min(70vh,420px);padding:12px 12px 0;grid-template-rows:auto minmax(0,1fr) auto}.shelf-panel.is-open .cd-insert{max-height:min(70vh,420px)}.cd-insert-feat-block{flex:0 1 auto}.cd-insert-tracks{flex:0 1 auto;max-height:102px}.cd-insert-actions{margin-left:-12px;margin-right:-12px;padding:10px 12px 12px}.cd-spine-title{font-size:9px}.cd-spine--font-hand .cd-spine-title{font-size:13px}.cd-insert-title{font-size:20px}.cd-insert-title.hand{font-size:24px}}.playlists{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}.record-card{position:relative;display:flex;align-items:center;gap:14px;text-align:left;background:var(--sub-alt-color);border:none;border-radius:12px;padding:12px;cursor:pointer;color:var(--text-color);transition:background .15s ease,transform .1s ease}.record-card:hover:not(:disabled){background:var(--main-color);color:var(--bg-color)}.record-card:hover:not(:disabled) .record-count{color:var(--bg-color)}.record-card:active:not(:disabled){transform:scale(.98)}.record-card:disabled:not(.locked){opacity:.55;cursor:wait}.record-art{width:54px;height:54px;flex:none}.record-cover{width:54px;height:54px;object-fit:cover;border-radius:8px;display:block}.record-cover--empty{display:flex;align-items:center;justify-content:center;background:var(--bg-color);color:var(--main-color);font-size:22px}.record-cover--liked{display:flex;align-items:center;justify-content:center;background:var(--main-color);color:var(--bg-color);font-size:24px}.record-card.locked,.record-card.locked:disabled{opacity:.5;cursor:not-allowed}.record-card.locked:hover{background:var(--sub-alt-color);color:var(--text-color)}.record-meta{display:flex;flex-direction:column;gap:3px;overflow:hidden}.record-name{font-weight:500;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.record-count{font-size:12px;color:var(--sub-color)}.record-loading{position:absolute;bottom:6px;right:12px;font-size:11px}.game{--game-pad: 26px;width:min(560px,100%);background:var(--sub-alt-color);border-radius:18px;padding:var(--game-pad);overflow:visible}.game.is-shaking,.btn-skip-wrap.is-shaking,.guess-title-field.is-shaking,.chart-search-field.is-shaking{animation:game-shake .4s ease}@keyframes game-shake{0%,to{transform:translate(0)}15%{transform:translate(-7px)}30%{transform:translate(7px)}45%{transform:translate(-5px)}60%{transform:translate(5px)}75%{transform:translate(-2px)}}.fx-confetti-stage{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:9999}.fx-shell{position:absolute;top:0;left:0;will-change:transform}.fx-piece{will-change:transform}.fx-face{will-change:transform;animation-name:fx-spin;animation-iteration-count:infinite;animation-timing-function:linear}.fx-burst{animation:fx-drift-x var(--dur) cubic-bezier(.12,.62,.3,1) forwards,fx-fade var(--dur) linear forwards}.fx-burst .fx-piece{animation:fx-arc-y var(--dur) forwards}.fx-fall{animation:fx-sway var(--sway) ease-in-out infinite alternate}.fx-fall .fx-piece{animation:fx-drop var(--dur) linear forwards}@keyframes fx-drift-x{to{transform:translate(var(--dx))}}@keyframes fx-arc-y{0%{transform:translateY(0);animation-timing-function:cubic-bezier(.2,.6,.4,1)}38%{transform:translateY(var(--peak));animation-timing-function:cubic-bezier(.55,0,.85,.55)}to{transform:translateY(var(--drop))}}@keyframes fx-fade{0%,72%{opacity:1}to{opacity:0}}@keyframes fx-drop{to{transform:translateY(var(--drop))}}@keyframes fx-sway{0%{transform:translate(calc(var(--sx) * -1))}to{transform:translate(var(--sx))}}@keyframes fx-spin{to{transform:rotate3d(var(--rx),var(--ry),.3,360deg)}}@media (prefers-reduced-motion: reduce){.fx-shell,.fx-piece,.fx-face{animation:none!important}}.mp-board{width:min(920px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,240px);gap:20px;align-items:start}.mp-board--solo{grid-template-columns:1fr;width:min(560px,100%)}.mp-board-main{min-width:0}.mp-guess-popups{display:flex;flex-direction:column;gap:10px;position:sticky;top:16px;max-height:calc(100vh - 40px);overflow-y:auto;padding-right:2px}.mp-guess-popup{display:flex;align-items:center;gap:12px;background:var(--bg-color);border-radius:12px;padding:10px 12px;box-shadow:0 8px 20px color-mix(in srgb,#000 18%,transparent);animation:mp-guess-in .28s ease-out both}.mp-guess-popup--empty{color:var(--sub-color);font-size:12px;box-shadow:none;animation:none}.mp-guess-popup.win{background:color-mix(in srgb,var(--main-color) 22%,var(--bg-color))}.mp-guess-popup-avatar{flex:none}.mp-guess-popup-main{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}.mp-guess-popup-who{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--sub-color)}.mp-guess-popup-body{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:13px;font-weight:600}.mp-guess-popup-body .by{color:var(--sub-color);font-weight:500;font-size:11px}.mp-guess-popup-body .ok{color:#3ecf8e}.mp-guess-popup-body .no{color:var(--error-color);opacity:.9}@keyframes mp-guess-in{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}.game-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.scoreboard{position:relative;display:flex;align-items:baseline;gap:8px;color:var(--sub-color);font-size:13px}.scoreboard-label{text-transform:uppercase;letter-spacing:1px;font-size:11px}.scoreboard-value{font-size:20px;font-weight:700;color:var(--main-color)}.points-float{position:absolute;right:0;top:-4px;color:var(--main-color);font-weight:700;font-size:18px;pointer-events:none;animation:points-float 1.1s ease-out forwards}@keyframes points-float{0%{opacity:0;transform:translateY(8px) scale(.8)}20%{opacity:1;transform:translateY(-6px) scale(1.15)}to{opacity:0;transform:translateY(-36px) scale(1)}}.now-playing{display:flex;justify-content:space-between;font-size:13px;margin-bottom:14px;color:var(--sub-color)}.np-playlist{color:var(--text-color);font-weight:500}.turntable{position:relative;width:200px;height:200px;margin:0 auto}.turntable--game{margin:18px auto 28px;overflow:visible}.vinyl-cue{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:0;padding:0;border:none;border-radius:50%;cursor:pointer;color:var(--main-color);background:var(--bg-color);box-shadow:0 2px 12px color-mix(in srgb,#000 40%,transparent);transition:transform .2s ease;-webkit-tap-highlight-color:transparent}.vinyl-cue:hover{filter:brightness(1.08)}.vinyl-cue--loading{cursor:wait;pointer-events:none}.vinyl-cue--loading:hover{filter:none}.vinyl-cue-spin{width:20px;height:20px;border:2.5px solid color-mix(in srgb,var(--main-color) 28%,transparent);border-top-color:var(--main-color);border-radius:50%;animation:vinyl-cue-spin .65s linear infinite}.vinyl-cue-ico{width:24px;height:24px;display:block}@media (prefers-reduced-motion: reduce){.vinyl-cue{transition:none}.vinyl-cue-spin{animation:none;border-top-color:var(--main-color);opacity:.7}}@keyframes vinyl-cue-spin{to{transform:rotate(360deg)}}.media-stage-vote{display:flex;justify-content:center;margin:0}.media-stage-btn .vote-tally{font:inherit;font-weight:700;letter-spacing:.02em;color:inherit;opacity:.85}.media-stage-btn.is-voted,.media-stage-btn:disabled.is-voted,.media-stage-btn.is-voted:hover,.media-stage-btn:disabled.is-voted:hover,.media-stage-btn.is-voted:active,.media-stage-btn:disabled.is-voted:active{opacity:1;filter:none;transform:none;cursor:default;background:color-mix(in srgb,var(--main-color) 22%,var(--bg-color));color:var(--main-color);box-shadow:inset 0 0 0 2px var(--main-color)}.media-stage-btn.is-voted .vote-tally,.media-stage-btn:disabled.is-voted .vote-tally{color:inherit;opacity:1}.turntable--md{width:240px;height:240px;margin-top:22px;margin-bottom:32px;display:grid;place-items:center}.turntable--md .platter{position:absolute;inset:var(--platter-inset, 8px);border-radius:50%;background:radial-gradient(circle at 50% 50%,transparent 42%,color-mix(in srgb,var(--text-color) 10%,transparent) 43% 46%,transparent 47%),color-mix(in srgb,var(--text-color) 8%,var(--bg-color));border:1px solid color-mix(in srgb,var(--text-color) 18%,transparent);box-shadow:inset 0 0 0 10px color-mix(in srgb,var(--bg-color) 80%,transparent),0 14px 18px -10px color-mix(in srgb,#000 40%,transparent);z-index:0;pointer-events:none}.turntable--md .vinyl,.turntable--md .vinyl--md{width:86%;height:86%;z-index:1;border-width:3px;background:repeating-radial-gradient(circle at center,#0a0a0a 0,#0a0a0a 1.5px,#141414 1.5px,#141414 3px,#0f0f0f 3px,#0f0f0f 4.5px);box-shadow:inset 0 0 28px #000000bf,0 0 0 1px #ffffff0f}.turntable--md .vinyl-label{width:34%;height:34%;font-size:12px}.turntable--md .tonearm{top:4px;right:10px;height:52%;z-index:4}.vinyl-deck{--disc: 240px;--box: 192px;--tuck: calc(var(--disc) * -.5);--gutter: 16px;--platter-inset: 8px;--disc-inset: var(--platter-inset);display:flex;align-items:center;justify-content:center;width:100%;height:var(--disc);margin:18px 0 28px;overflow:visible;transition:width .55s cubic-bezier(.22,1,.36,1),margin .55s cubic-bezier(.22,1,.36,1)}.vinyl-deck-well{position:relative;width:var(--disc);height:var(--disc);flex:none;display:grid;place-items:center;z-index:2}.vinyl-deck-well .turntable,.vinyl-deck-well .turntable--game,.vinyl-deck-well .turntable--md{width:var(--disc);height:var(--disc);margin:0}.vinyl-deck-panel{position:relative;z-index:1;width:0;max-width:0;opacity:0;overflow:hidden;pointer-events:none;flex:none;height:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;gap:8px;padding:14px 0;margin-left:0;border-radius:16px;background:transparent;transform:translate(-8px);transition:width .55s cubic-bezier(.22,1,.36,1),max-width .55s cubic-bezier(.22,1,.36,1),opacity .35s ease .1s,transform .55s cubic-bezier(.22,1,.36,1),margin .55s cubic-bezier(.22,1,.36,1),padding .55s cubic-bezier(.22,1,.36,1),background .35s ease}.vinyl-deck.is-open{filter:drop-shadow(0 18px 10px color-mix(in srgb,#000 40%,transparent));margin-left:calc(var(--disc-inset) * -1);width:calc(100% + var(--disc-inset))}.vinyl-deck.is-open .vinyl-deck-panel{width:calc(100% - var(--disc) * .5);max-width:calc(100% - var(--disc) * .5);opacity:1;pointer-events:auto;height:var(--box);margin-left:var(--tuck);padding:16px var(--gutter) 16px calc(var(--disc) * .5 - var(--platter-inset) + var(--gutter));background:var(--bg-color);transform:translate(0)}.vinyl-deck-panel .reveal-clock{width:100%;margin:0;align-items:flex-start;gap:0}.vinyl-deck-panel .reveal-clock-time{font-size:28px}.vinyl-deck-panel .reveal-clock-miss{font-size:18px}.vinyl-deck-title,.vinyl-deck-artist{display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vinyl-deck-title{font-size:15px;font-weight:600;line-height:1.2}.vinyl-deck-artist{font-size:13px;color:var(--sub-color)}.vinyl-deck-next{align-self:flex-start;margin-top:4px;padding:8px 14px;font-size:13px;min-height:36px;display:inline-flex;align-items:center;gap:8px}.vinyl-deck-panel .media-stage-vote{justify-content:flex-start;margin-top:2px}@media (max-width: 560px){.vinyl-deck{--disc: 160px;--box: 148px;--gutter: 12px;margin:12px auto 20px;height:auto;min-height:var(--disc)}.vinyl-deck.is-open .vinyl-deck-panel{height:auto;min-height:var(--box)}.vinyl-deck-title,.vinyl-deck-artist{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal}.vinyl-deck-panel .reveal-clock-time{font-size:22px}.vinyl-deck-panel .reveal-clock-miss{font-size:clamp(11px,2.9vw,16px)}.vinyl-deck-next{padding:8px 12px;font-size:13px}.btn-next-arrow{display:none}}@media (prefers-reduced-motion: reduce){.vinyl-deck-panel,.guess-fields-tray{transition:none}}.progress{margin:6px 0 20px}.progress-track{position:relative;height:12px;background:var(--bg-color);border-radius:8px;overflow:hidden}.progress-fill{height:100%;background:var(--main-color);transition:width .35s ease}.progress-tick{position:absolute;top:0;bottom:0;width:2px;background:var(--sub-alt-color);opacity:.6}.progress-labels{display:flex;justify-content:space-between;font-size:12px;margin-top:8px;color:var(--sub-color)}.controls{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center;margin-bottom:20px}.controls--toggle-only{margin-top:-4px}.controls .error-banner{flex:1 1 100%;margin:0}.guess-media{position:relative;margin:18px auto 28px}.guess-media--cassette{width:min(320px,100%);margin-top:22px;margin-bottom:32px}.guess-media--celebrate{z-index:1}.guess-media--cassette .win-ring{top:8%;right:8%;bottom:8%;left:8%;border-radius:14px}.guess-rows{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.guess-row{min-height:36px;display:flex;align-items:center;gap:8px;padding:7px 13px;border-radius:8px;background:var(--bg-color);font-size:14px;color:var(--sub-color)}.guess-row.active{outline:2px dashed var(--sub-color);outline-offset:-2px;color:var(--sub-color)}.guess-row.correct{background:var(--main-color);color:var(--bg-color);font-weight:600}.guess-row.correct .gr-field,.guess-row.correct .gr-sep{color:var(--bg-color)}.guess-row.correct--pulse{animation:correct-pulse .7s ease-out}@keyframes correct-pulse{0%{transform:scale(.96);box-shadow:0 0 color-mix(in srgb,var(--main-color) 55%,transparent)}40%{transform:scale(1.03);box-shadow:0 0 0 10px transparent}to{transform:scale(1)}}.guess-row.wrong{background:var(--bg-color)}.gr-field{max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gr-field.ok{color:#3ecf8e}.gr-field.ok:before{content:"";display:inline-block;width:.35em;height:.65em;margin-right:.35em;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(40deg) translateY(-.05em);vertical-align:.05em}.gr-field.no{color:var(--error-color);text-decoration:line-through}.gr-sep{color:var(--sub-color);font-size:12px}.gr-skip{color:var(--sub-color)}.guess-input-wrap{position:relative}.guess-fields-tray{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s cubic-bezier(.22,1,.36,1)}.guess-fields-tray>.guess-fields{min-height:0}.guess-input-wrap.is-answered .guess-fields-tray{grid-template-rows:0fr}.guess-input-wrap.is-answered .guess-fields-tray>.guess-fields{overflow:hidden}.guess-input-wrap.is-answered .guess-fields{visibility:hidden}.guess-input-wrap.is-answered .guess-actions{margin-top:0}.guess-fields{display:flex;gap:8px;align-items:stretch}.guess-fields .guess-input{flex:1;min-width:0}.guess-title-row,.guess-artist-row{display:flex;gap:8px;flex:1;min-width:0;align-items:stretch}.guess-title-row .guess-title-field{position:relative;flex:1;min-width:0;display:flex;align-items:center}.guess-title-row .guess-input,.guess-artist-row .guess-input{flex:1;min-width:0}.guess-artist-field{position:relative;flex:1;min-width:0;display:flex;align-items:center}.guess-title-row .guess-input{width:100%;padding-right:3.5rem}.guess-almost{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;padding:0 15px;border-radius:var(--radius);background:var(--bg-color);color:var(--sub-color);font-size:16px;font-weight:600;font-style:italic;pointer-events:none;animation:guess-almost-fade 1.4s ease-out forwards}.guess-title-field .guess-almost{padding-right:3.5rem}.guess-suggest{position:absolute;left:0;right:0;bottom:calc(100% + 6px);z-index:5;margin:0;padding:4px;list-style:none;max-height:144px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border-radius:var(--radius);background:var(--bg-color);border:1px solid color-mix(in srgb,var(--sub-color) 35%,transparent);box-shadow:0 -4px 20px color-mix(in srgb,#000 25%,transparent)}.guess-suggest-item{display:flex;flex-direction:row;align-items:center;gap:8px;width:100%;margin:0;padding:5px 8px;min-height:42px;box-sizing:border-box;border:none;border-radius:calc(var(--radius) - 2px);background:transparent;color:var(--main-color);font:inherit;font-size:14px;text-align:left;cursor:pointer}.guess-suggest-cover{width:28px;height:28px;flex-shrink:0;border-radius:3px;object-fit:cover;background:color-mix(in srgb,var(--sub-color) 25%,transparent)}.guess-suggest-cover--empty{display:block}.guess-suggest-text{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;flex:1}.guess-suggest-item:hover,.guess-suggest-item.is-active{background:color-mix(in srgb,var(--main-color) 12%,transparent)}.guess-suggest-name{font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.guess-suggest-by{font-size:13px;color:var(--sub-color);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}@keyframes guess-almost-fade{0%,55%{opacity:1}to{opacity:0}}.guess-hint-link{position:absolute;right:14px;top:50%;transform:translateY(-50%);z-index:1;margin:0;padding:0;border:none;background:none;font:inherit;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:lowercase;text-decoration:underline;text-underline-offset:3px;color:var(--sub-color);cursor:pointer;-webkit-tap-highlight-color:transparent}.guess-hint-link:hover{color:var(--main-color)}.guess-hint-slot{position:absolute;right:14px;top:50%;transform:translateY(-50%);z-index:1;display:grid;place-items:center;min-width:2.5rem;pointer-events:none}.guess-hint-slot .guess-hint-link{position:static;right:auto;top:auto;transform:none;pointer-events:auto}.penalty-pop{position:absolute;font-size:14px;font-weight:800;color:var(--error-color);white-space:nowrap;pointer-events:none;animation:penalty-pop 1s ease-out forwards}.btn-skip-wrap{position:relative;flex:1;display:flex}.btn-skip-wrap .btn-skip{flex:1;width:100%}.btn-skip-wrap .penalty-pop{left:50%;top:-6px;transform:translate(-50%,-100%)}.penalty-pop--hint{position:static;transform:none;font-size:13px;letter-spacing:.04em;animation-name:penalty-pop-hint}@keyframes penalty-pop{0%{opacity:0;transform:translate(-50%,-70%) scale(.85)}15%{opacity:1;transform:translate(-50%,-100%) scale(1.12)}to{opacity:0;transform:translate(-50%,-140%) scale(1)}}@keyframes penalty-pop-hint{0%{opacity:0;transform:scale(.85)}15%{opacity:1;transform:scale(1.12)}to{opacity:0;transform:translateY(-8px) scale(1)}}.guess-transport-switch{position:relative;flex:none;width:96px;min-width:96px;height:48px;padding:4px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border:1.5px solid color-mix(in srgb,var(--text-color) 22%,transparent);border-radius:var(--radius);background:color-mix(in srgb,var(--text-color) 14%,var(--bg-color));box-shadow:inset 0 1px 3px color-mix(in srgb,#000 16%,transparent);color:var(--sub-color);cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation;transition:opacity .15s ease,border-color .15s ease;-webkit-tap-highlight-color:transparent}.guess-transport-switch:disabled{opacity:.5;cursor:not-allowed}.guess-transport-switch:disabled:hover{background:color-mix(in srgb,var(--text-color) 14%,var(--bg-color));color:var(--sub-color)}.guess-transport-thumb{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);border-radius:calc(var(--radius) - 2px);background:var(--main-color);box-shadow:0 1px 4px color-mix(in srgb,#000 22%,transparent);transition:transform .22s ease;pointer-events:none;z-index:0}.guess-transport-switch.is-playing .guess-transport-thumb{transform:translate(100%)}.guess-transport-slot{position:relative;z-index:1;display:grid;place-items:center;transition:color .18s ease}.guess-transport-glyph{display:block;flex:none;overflow:visible}.guess-transport-switch.is-paused .guess-transport-slot--play,.guess-transport-switch.is-playing .guess-transport-slot--pause{color:var(--bg-color)}.guess-transport-switch.is-paused .guess-transport-slot--pause,.guess-transport-switch.is-playing .guess-transport-slot--play{color:color-mix(in srgb,var(--text-color) 55%,transparent)}@keyframes round-nudge-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.28)}}.guess-transport-switch.is-nudging,.btn-skip-wrap.is-nudging .btn-skip{animation:round-nudge-pulse 1.15s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.guess-transport-switch.is-nudging,.btn-skip-wrap.is-nudging .btn-skip{animation:none;filter:brightness(1.28)}}.guess-input{width:100%;font-family:var(--font);font-size:16px;padding:13px 15px;border:2px solid transparent;border-radius:var(--radius);background:var(--bg-color);color:var(--text-color)}.guess-input::placeholder{color:var(--sub-color)}.guess-input--hint::placeholder{color:#3ecf8e;-webkit-text-fill-color:#3ecf8e;opacity:1;letter-spacing:.06em;font-variant-numeric:tabular-nums;animation:hint-placeholder-in .45s ease}@keyframes hint-placeholder-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.guess-input--hint::placeholder{animation:none}}.guess-input:focus{outline:none;border-color:var(--main-color)}.guess-input.guess-input--locked,.guess-input.guess-input--locked:disabled{color:#3ecf8e;-webkit-text-fill-color:#3ecf8e;opacity:1;cursor:default}.suggestions{position:absolute;top:54px;left:0;right:0;z-index:5;background:var(--bg-color);border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 30px #00000059}.suggestion{display:block;width:100%;text-align:left;padding:11px 15px;border:none;background:none;color:var(--text-color);cursor:pointer;font-size:14px}.suggestion:hover{background:var(--main-color);color:var(--bg-color)}.guess-actions{display:flex;justify-content:space-between;gap:12px;margin-top:16px}.guess-actions--guess-only{justify-content:stretch}.guess-actions--guess-only .btn-guess{width:100%}.guess-actions .btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:14px 18px 12px;border-radius:10px;border:none;transition:transform .08s ease,box-shadow .08s ease,filter .15s ease,background .15s ease,color .15s ease}.guess-actions .btn .btn-label{line-height:1.1}.guess-actions .btn .btn-hint{font-size:10px;font-weight:600;letter-spacing:.14em;opacity:.7;text-transform:uppercase}.btn-skip,.btn-share{background:var(--bg-color);color:var(--text-color);box-shadow:0 4px 0 var(--sub-color)}.btn-skip:hover,.btn-share:hover{background:var(--bg-color);color:var(--text-color);filter:brightness(1.12);transform:translateY(-2px);box-shadow:0 6px 0 var(--sub-color)}.btn-skip:active,.btn-share:active{transform:translateY(3px);box-shadow:0 1px 0 var(--sub-color)}.guess-actions .btn-play{box-shadow:0 4px color-mix(in srgb,var(--main-color) 55%,#000)}.guess-actions .btn-play:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 6px color-mix(in srgb,var(--main-color) 55%,#000)}.guess-actions .btn-play:active{transform:translateY(3px);box-shadow:0 1px color-mix(in srgb,var(--main-color) 55%,#000)}.btn-guess{background:var(--main-color);color:var(--bg-color);box-shadow:0 4px color-mix(in srgb,var(--main-color) 55%,#000)}.btn-guess:hover{background:var(--main-color);color:var(--bg-color);filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 6px color-mix(in srgb,var(--main-color) 55%,#000)}.btn-guess:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px color-mix(in srgb,var(--main-color) 55%,#000)}.btn-guess:disabled{opacity:.45;filter:grayscale(.25);transform:none;box-shadow:0 4px color-mix(in srgb,var(--main-color) 55%,#000)}.btn-guess:disabled:hover{background:var(--main-color);color:var(--bg-color);filter:grayscale(.25);transform:none;box-shadow:0 4px color-mix(in srgb,var(--main-color) 55%,#000)}.inline-badge{display:block;width:fit-content;margin:-6px auto 16px;font-size:14px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:0;border-radius:0;background:none;animation:badge-pop .55s cubic-bezier(.2,1.4,.4,1) both}.inline-badge--win{background:none;color:var(--main-color)}.inline-badge--lose{background:none;color:var(--error-color)}@keyframes badge-pop{0%{opacity:0;transform:scale(.4) translateY(12px)}70%{transform:scale(1.08) translateY(0)}to{opacity:1;transform:scale(1)}}.reveal-clock{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;margin:-6px auto 16px;animation:badge-pop .55s cubic-bezier(.2,1.4,.4,1) both}.reveal-clock-time{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:clamp(28px,9vw,42px);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.04em;line-height:1}.reveal-clock--win .reveal-clock-time{color:#3ecf8e}.reveal-clock-miss{font-size:clamp(18px,4.5vw,22px);font-weight:700;color:var(--error-color);letter-spacing:0;text-transform:none}@media (prefers-reduced-motion: reduce){.inline-badge,.reveal-clock{animation:none}}.turntable--celebrate{z-index:1}.win-ring{position:absolute;top:18%;right:18%;bottom:18%;left:18%;border-radius:50%;border:2px solid var(--main-color);pointer-events:none;animation:win-ring .9s ease-out forwards}.win-ring--2{animation-delay:.12s}.win-ring--3{animation-delay:.24s}@keyframes win-ring{0%{opacity:.8;transform:scale(.7)}to{opacity:0;transform:scale(1.85)}}.vinyl--revealed .vinyl-cover,.vinyl--revealed .vinyl-label{animation:vinyl-reveal .55s cubic-bezier(.2,1.3,.4,1) both}.vinyl--revealed.spin-fast{animation:vinyl-spin 1.4s linear infinite}.vinyl-cover{width:72%;height:72%;object-fit:cover;border-radius:50%;position:relative;z-index:2;box-shadow:0 0 0 3px var(--bg-color)}@keyframes vinyl-reveal{0%{transform:scale(.82) rotate(-18deg)}to{transform:scale(1) rotate(0)}}.game:has(.gameover){position:relative;overflow:hidden;background:linear-gradient(180deg,var(--sub-alt-color) 0%,var(--bg-color) 48%,var(--sub-alt-color) 100%)}.game:has(.gameover):before,.game:has(.gameover):after{content:"";position:absolute;pointer-events:none;z-index:0}.game:has(.gameover):before{width:280px;height:280px;right:-90px;top:-110px;border-radius:50%;background:color-mix(in srgb,var(--main-color) 9%,transparent)}.game:has(.gameover):after{width:260px;height:260px;right:-180px;bottom:-185px;border-radius:50%;background:repeating-radial-gradient(circle at center,color-mix(in srgb,var(--main-color) 8%,transparent) 0 2px,transparent 2px 13px)}.game:has(.gameover)>*{position:relative;z-index:1}.gameover{text-align:left}.gameover-hero{display:flex;align-items:center;gap:18px;margin-bottom:18px}.gameover-hero .turntable{margin:0;flex:none}.gameover-hero-copy{min-width:0;flex:1;overflow:hidden}.gameover-kicker{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.04em}.gameover-eyebrow{margin:0 0 2px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--main-color)}.gameover-score{margin:0;font-size:clamp(32px,11vw,56px);font-weight:800;line-height:.95;letter-spacing:-.03em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.gameover-score-sub{margin:6px 0 0;font-size:15px;color:var(--sub-color)}.gameover .mp-rail{margin:0 0 14px}.gameover-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:16px}.gameover-actions .btn-online{width:auto;background:color-mix(in srgb,var(--sub-alt-color) 82%,#000);border:2px solid transparent;color:var(--text-color)}.gameover-actions .btn-online:hover{filter:none;background:color-mix(in srgb,var(--sub-alt-color) 68%,#000);color:var(--text-color);border-color:transparent}.gos{margin:0;text-align:left}.gos-fast{display:flex;align-items:center;gap:14px;padding:12px 0;border-top:1px solid color-mix(in srgb,var(--sub-color) 28%,transparent);border-bottom:1px solid color-mix(in srgb,var(--sub-color) 28%,transparent)}.gos-fast-art{width:88px;height:88px;border-radius:10px;flex:none;object-fit:cover;background:color-mix(in srgb,var(--bg-color) 70%,transparent)}.gos-fast-copy{min-width:0;flex:1}.gos-fast-k,.gos-fast-title,.gos-fast-artist{margin:0}.gos-fast-k{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--main-color);margin-bottom:4px}.gos-fast-title{font-size:20px;font-weight:700;line-height:1.15}.gos-fast-artist{font-size:14px;color:var(--sub-color);margin-top:3px}.gos-fast-time{margin-left:auto;flex:none;font-size:22px;font-weight:800;color:var(--main-color);font-variant-numeric:tabular-nums}.gos-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 0}.gos-chip{background:color-mix(in srgb,var(--bg-color) 70%,transparent);border-radius:8px;padding:6px 12px}.gos-chip-k,.gos-chip-v{margin:0}.gos-chip-k{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--sub-color)}.gos-chip-v{font-size:18px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums}.gos-bests{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 16px;margin-top:12px;font-size:13px;color:var(--sub-color)}.gos-bests-name{font-weight:700;color:var(--main-color);margin-right:auto}.gos-bests-pair b{color:var(--text-color);font-variant-numeric:tabular-nums}.gos-block{margin-top:16px}.gos-heading{margin:0 0 8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--sub-color);font-weight:600}.gos-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.gos-tl-row{display:grid;grid-template-columns:3.5rem 1fr 2.5rem;align-items:center;gap:8px;font-size:13px;font-variant-numeric:tabular-nums}.gos-tl-label{color:var(--sub-color)}.gos-tl-track{position:relative;height:10px;background:color-mix(in srgb,var(--sub-color) 18%,transparent);border-radius:2px;overflow:hidden}.gos-tl-bar{display:block;height:100%;background:var(--main-color);border-radius:2px;min-width:0}.gos-tl-time{text-align:right;color:var(--text-color);font-size:12px}.gos-tl-miss{display:block;padding-left:4px;color:color-mix(in srgb,var(--sub-color) 70%,transparent);line-height:10px;font-size:12px}.mp-over .gos{margin-top:18px}.error-banner{background:var(--bg-color);color:var(--error-color);border-radius:var(--radius);padding:12px 16px;font-size:13px;margin:4px 0 16px}.home-actions{display:flex;flex-direction:column;gap:12px;margin-top:4px;width:min(100%,340px)}.home-actions-primary{display:flex;gap:12px;width:100%}.home-actions-primary .btn{flex:1;justify-content:center}.home-actions .btn-play{border:2px solid var(--main-color)}.btn-play-text-short{display:none}.btn-multi{background:var(--bg-color);color:var(--text-color);font-weight:600;border:2px solid var(--main-color)}.btn-multi:hover{background:var(--main-color);color:var(--bg-color)}.btn-online{width:100%;justify-content:center;gap:8px;background:var(--sub-alt-color);color:var(--text-color);font-weight:600;border:2px solid transparent}.btn-online:hover{filter:brightness(1.08);background:var(--sub-alt-color);color:var(--text-color)}.btn-online-dot{width:7px;height:7px;border-radius:50%;background:var(--main-color);opacity:.9;animation:online-pulse 1.6s ease-in-out infinite}.btn-online-count{color:var(--sub-color);font-weight:500;font-size:.92em}@keyframes online-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}.online-race-title{font-family:var(--font-display, inherit);margin:28px 0 8px;text-align:center}.online-race-status{text-align:center;color:var(--sub-color);margin:0 0 18px;min-height:1.4em}.online-race--match .mp-rail{max-width:420px;margin:0 auto}.online-race--match .fineprint{text-align:center;margin-top:20px}.mp-lobby{width:min(var(--maxw),100%);position:relative}.mp-back{position:absolute;top:0;left:0}.mp-lobby-grid{display:grid;grid-template-columns:minmax(260px,320px) 1fr;gap:28px;align-items:start;margin-top:10px}.mp-qr-card{background:var(--sub-alt-color);border-radius:16px;padding:18px;text-align:left;display:flex;flex-direction:column;gap:16px}.mp-qr-join{display:flex;flex-direction:column;gap:0}.mp-qr-row{display:flex;flex-direction:row;align-items:center;gap:16px}.mp-qr{width:112px;max-width:112px;height:112px;border-radius:10px;display:block;margin:0;flex:none;object-fit:contain;background:var(--sub-alt-color)}.mp-qr-meta{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px}.mp-qr-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sub-color);line-height:1}.mp-code{margin:0 -.2em 0 0;padding:0;font-size:26px;font-weight:700;letter-spacing:.2em;color:var(--main-color);line-height:1;font-variant-numeric:tabular-nums}.mp-copy-link{margin-top:0;align-self:flex-start;margin-left:-10px}.mp-side-title{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--sub-color);margin:0}.mp-side-accent{color:var(--main-color)}.mp-qr-look{padding-top:14px;border-top:1px solid color-mix(in srgb,var(--text-color) 12%,transparent)}.mp-qr-look>.profile-label{margin:0 0 10px;display:block}.mp-join-url{font-size:11px;color:var(--sub-color);word-break:break-all;margin-top:8px}.join-code-form{margin-top:18px;width:min(100%,340px)}.join-code-label{font-size:13px;color:var(--sub-color);margin:0 0 8px}.join-code-row{display:flex;gap:8px}.join-code-input{flex:1;min-width:0;letter-spacing:.14em;font-weight:600;text-transform:uppercase;background:var(--sub-alt-color);border:2px solid color-mix(in srgb,var(--text-color) 28%,transparent);color:var(--text-color);box-shadow:inset 0 1px color-mix(in srgb,var(--text-color) 8%,transparent)}.join-code-input::placeholder{color:var(--sub-color);letter-spacing:.04em;font-weight:500;text-transform:none}.join-code-input:focus{outline:none;border-color:var(--main-color);background:color-mix(in srgb,var(--sub-alt-color) 70%,var(--bg-color))}.mp-lobby-side{display:flex;flex-direction:column;gap:12px;align-items:stretch;text-align:left}.mp-rail{display:flex;flex-direction:column;gap:8px;margin:0 0 8px;width:100%}.mp-empty{color:var(--sub-color);font-size:13px;margin:0;text-align:left}.mp-player{position:relative;display:flex;align-items:center;gap:10px;background:var(--bg-color);border-radius:12px;padding:8px 12px 8px 8px;width:100%;min-width:0;box-sizing:border-box;overflow:hidden;transition:transform .15s ease,box-shadow .15s ease}.mp-player>:not(.mp-player-unlock){position:relative;z-index:1}.mp-player.offline{opacity:.45}.mp-player.left{opacity:.4}.mp-player.left .mp-player-name-text{text-decoration:line-through;text-decoration-thickness:1.5px}.mp-player.pulse{animation:mp-pulse .45s ease}@keyframes mp-pulse{0%{transform:scale(1)}40%{transform:scale(1.06)}to{transform:scale(1)}}.mp-player-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;justify-content:center}.mp-player-name{min-width:0;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;display:inline-flex;align-items:center;gap:6px}.mp-player-name-text{min-width:0;overflow:hidden;text-overflow:ellipsis}.mp-player-unlock{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:color-mix(in srgb,var(--text-color) 5%,transparent)}.mp-player-unlock-fill{position:absolute;inset:0 auto 0 0;height:100%;background:color-mix(in srgb,var(--mp-unlock-accent, var(--main-color)) 22%,transparent);transition:width .4s cubic-bezier(.22,1,.36,1)}.mp-player-unlock-tick{position:absolute;top:3px;bottom:3px;width:1px;transform:translate(-50%);background:color-mix(in srgb,var(--text-color) 8%,transparent)}.mp-crown{flex:none;display:inline-flex;color:var(--main-color);line-height:0}.mp-place{flex:none;width:16px;height:16px;border-radius:50%;display:inline-grid;place-items:center;font-size:10px;font-weight:800;line-height:1;color:#1a1a1a}.mp-place--1{background:#f0c14a;box-shadow:0 0 0 1px color-mix(in srgb,#c9a227 70%,transparent)}.mp-place--2{background:#c0c6ce;box-shadow:0 0 0 1px color-mix(in srgb,#8e959e 70%,transparent)}.mp-place--3{background:#c47a4a;box-shadow:0 0 0 1px color-mix(in srgb,#8f5530 70%,transparent);color:#1f1410}.mp-player-score-wrap{position:relative;flex:none;display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:3.5ch}.mp-player-score-wrap--timed{min-width:7ch}.mp-player-time{font-size:13px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.01em;white-space:nowrap;padding:3px 8px;border-radius:6px;color:#1a1a1a;background:color-mix(in srgb,var(--text-color) 18%,var(--bg-color))}.mp-player-time--1{background:#f0c14a;box-shadow:0 0 0 1px color-mix(in srgb,#c9a227 70%,transparent);color:#1a1a1a}.mp-player-time--2{background:#c0c6ce;box-shadow:0 0 0 1px color-mix(in srgb,#8e959e 70%,transparent);color:#1a1a1a}.mp-player-time--3{background:#c47a4a;box-shadow:0 0 0 1px color-mix(in srgb,#8f5530 70%,transparent);color:#1f1410}.mp-player-time--artist{background:color-mix(in srgb,var(--main-color) 22%,var(--bg-color));color:var(--main-color)}.mp-player-score{font-size:14px;font-weight:700;color:var(--main-color);font-variant-numeric:tabular-nums;letter-spacing:.02em;transition:transform .2s ease,color .2s ease}.mp-player--gain .mp-player-score{animation:mp-score-pop .55s ease}.mp-player--loss .mp-player-score{animation:mp-score-dip .55s ease}.mp-points-flash{position:absolute;right:0;bottom:100%;margin-bottom:2px;font-size:13px;font-weight:800;color:var(--main-color);white-space:nowrap;pointer-events:none;animation:mp-points-flash 1.15s ease-out forwards}.mp-points-flash--loss{color:var(--error-color);animation-name:mp-points-flash-loss}@keyframes mp-points-flash{0%{opacity:0;transform:translateY(6px) scale(.85)}18%{opacity:1;transform:translateY(0) scale(1.12)}to{opacity:0;transform:translateY(-14px) scale(1)}}@keyframes mp-points-flash-loss{0%{opacity:0;transform:translateY(-6px) scale(.85)}18%{opacity:1;transform:translateY(0) scale(1.12)}to{opacity:0;transform:translateY(12px) scale(1)}}@keyframes mp-score-pop{0%{transform:scale(1)}35%{transform:scale(1.28)}to{transform:scale(1)}}@keyframes mp-score-dip{0%{transform:scale(1)}35%{transform:scale(.86);color:var(--error-color)}to{transform:scale(1)}}.mp-mini-vinyl{width:36px;height:36px;border-radius:50%;flex:none;background:radial-gradient(circle,var(--mp-color, var(--main-color)) 0 5px,transparent 6px),repeating-radial-gradient(circle,#111 0,#111 1.5px,#262626 1.5px,#262626 3px);border:2px solid color-mix(in srgb,var(--mp-color, var(--main-color)) 50%,#444)}.mp-avatar{display:inline-grid;place-items:center;flex:none;border-radius:50%;overflow:hidden;border:2px solid color-mix(in srgb,var(--text-color) 20%,transparent)}.mp-avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%;transform:translateY(-2px);pointer-events:none;-webkit-user-select:none;user-select:none}.mp-guess-avatar{margin-right:4px;vertical-align:middle}.mp-guess-who{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--sub-color);margin-right:6px;flex:none;display:inline-flex;align-items:center;gap:4px}.mp-guess-feed .guess-row{gap:6px}.mp-others{margin-bottom:12px}.mp-others-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sub-color);margin:0 0 6px}.mp-lobby-edit{background:var(--sub-alt-color);border-radius:12px;padding:12px;margin:0;width:100%;box-sizing:border-box;text-align:left}.mp-lobby-edit>.profile-label{margin:0 0 10px;display:block}.profile-editor{display:flex;align-items:center;gap:12px;width:100%}.profile-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;align-items:stretch}.profile-name{width:100%;margin:0!important;padding:10px 12px;font-size:16px;box-sizing:border-box}.profile-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.profile-icon-accent{display:flex;align-items:center;gap:8px;flex:none}.profile-accent,.profile-peep{position:relative}.profile-icon-btn,.profile-accent-btn{display:inline-flex;align-items:center;gap:6px}.profile-icon-btn.open,.profile-accent-btn.open{border-color:var(--main-color);color:var(--main-color)}.profile-icon-dot{flex:none;--smiley-cut: var(--sub-alt-color)}.profile-icon-btn:hover .profile-icon-dot{--smiley-cut: var(--main-color)}.profile-icon-cut{fill:var(--smiley-cut)}.profile-icon-cut-stroke{stroke:var(--smiley-cut)}.profile-dd-chevron{flex:none;margin-left:1px;opacity:.55;transition:transform .15s ease,opacity .15s ease}.profile-icon-btn.open .profile-dd-chevron,.profile-accent-btn.open .profile-dd-chevron{opacity:1;transform:rotate(180deg)}.spotlight-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:color-mix(in srgb,var(--bg-color) 35%,transparent);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);animation:spotlight-in .18s ease-out}.spotlight-card{width:min(420px,100%);background:color-mix(in srgb,var(--sub-alt-color) 92%,transparent);border:1px solid color-mix(in srgb,var(--text-color) 12%,transparent);border-radius:16px;box-shadow:0 24px 60px color-mix(in srgb,#000 45%,transparent),0 0 0 1px color-mix(in srgb,var(--main-color) 12%,transparent);padding:18px 18px 16px;display:flex;flex-direction:column;gap:12px;animation:spotlight-card-in .22s cubic-bezier(.22,1,.36,1)}.spotlight-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.spotlight-title{margin:0;font-size:15px;font-weight:600;color:var(--text-color);letter-spacing:.01em}.spotlight-hint{margin:0;font-size:12px;color:var(--sub-color)}.spotlight-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:4px}.spotlight-actions .btn-play{padding:10px 16px;font-size:14px}.share-preview .spotlight-actions{justify-content:space-between}.share-preview .spotlight-actions .btn{padding:10px 16px;font-size:14px}.share-preview{width:min(420px,100%)}.share-preview-img{display:block;margin:0 auto;max-width:100%;max-height:min(56vh,560px);border-radius:12px;background:var(--bg-color)}.share-preview-text{margin:0;padding:14px 16px;border-radius:12px;background:var(--bg-color);color:var(--text-color);font-size:14px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}.chart-preview-card{width:min(380px,100%);max-height:min(86vh,640px);padding:16px;gap:14px}.chart-preview-insert{height:auto;max-height:min(62vh,480px);min-height:220px;border-radius:4px}.chart-preview-body{overflow-y:auto;-webkit-overflow-scrolling:touch;padding-right:4px}.chart-preview-track{display:flex;flex-direction:column;gap:1px;min-width:0;white-space:normal}.chart-preview-track-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chart-preview-track-artist{font-size:11px;opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes spotlight-in{0%{opacity:0}to{opacity:1}}@keyframes spotlight-card-in{0%{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){.spotlight-scrim,.spotlight-card{animation:none}}.privacy-dialog{position:relative;width:min(520px,100%);max-height:min(86vh,720px);gap:14px}.privacy-body{min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:14px;padding-right:4px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 28%,transparent) transparent}.privacy-body section h3{margin:0 0 4px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--main-color)}.privacy-body section p,.privacy-body .privacy-updated{margin:0;font-size:13px;line-height:1.45;color:var(--text-color)}.privacy-body a{color:var(--main-color);text-decoration:underline;text-underline-offset:2px}.privacy-updated{color:var(--sub-color)!important;font-size:11px!important}.privacy-dialog .spotlight-actions{justify-content:flex-end}.version-dialog{position:relative;width:min(560px,100%);max-height:min(86vh,740px);gap:14px}.version-dialog .spotlight-actions{justify-content:flex-end}.version-timeline{min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;padding:4px 6px 4px 2px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text-color) 28%,transparent) transparent}.timeline-entry{display:flex;gap:14px;position:relative}.timeline-marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:12px;padding-top:4px}.timeline-dot{width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--text-color) 35%,transparent);flex-shrink:0}.timeline-dot.is-latest{background:var(--main-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--main-color) 25%,transparent)}.timeline-line{width:2px;flex:1;background:color-mix(in srgb,var(--text-color) 14%,transparent);margin:4px 0}.timeline-content{flex:1;padding-bottom:20px}.timeline-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:6px}.timeline-badge{font-size:11px;font-weight:700;padding:2px 7px;border-radius:6px;background:color-mix(in srgb,var(--main-color) 18%,transparent);color:var(--main-color);letter-spacing:.02em}.timeline-title{font-size:13.5px;font-weight:600;color:var(--text-color)}.timeline-date{font-size:11px;color:var(--sub-color);margin-left:auto}.timeline-list{margin:0;padding-left:18px;font-size:12.5px;line-height:1.5;color:color-mix(in srgb,var(--text-color) 88%,transparent);display:flex;flex-direction:column;gap:4px}.timeline-list li::marker{color:var(--main-color)}.help-foot-dot{color:var(--sub-color);opacity:.6;-webkit-user-select:none;user-select:none}.race-mode-card{width:min(420px,100%);gap:16px}.race-mode-choices{display:flex;flex-direction:column;gap:10px}.race-mode-choice{width:100%;flex-direction:row;align-items:center;gap:14px;text-align:left;height:auto;min-height:64px;padding:14px 18px}.race-mode-choice-copy{display:flex;flex-direction:row;align-items:center;gap:12px;min-width:0;flex:1}.race-mode-choice-title{flex:none;min-width:4.75em;font-weight:700;font-size:16px}.race-mode-choice-blurb{font-weight:500;font-size:12px;opacity:.85;line-height:1.35}.race-mode-icon{flex:none;color:var(--main-color)}.btn-multi:hover .race-mode-icon{color:var(--bg-color)}.race-mode-card .spotlight-actions{justify-content:flex-start}.lobby-race-mode{display:flex;flex-direction:column;gap:8px;margin:0 0 4px}.lobby-race-mode-btn{display:flex;flex-direction:row;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:var(--radius);border:2px solid transparent;background:var(--sub-alt-color);color:var(--text-color);cursor:pointer;text-align:left;font:inherit;transition:border-color .15s ease,background .15s ease,color .15s ease,transform .1s ease}.lobby-race-mode-btn:hover{background:color-mix(in srgb,var(--main-color) 16%,var(--bg-color))}.lobby-race-mode-btn:active{transform:scale(.98)}.lobby-race-mode-btn.is-active{border-color:var(--main-color);background:color-mix(in srgb,var(--main-color) 22%,var(--bg-color))}.lobby-race-mode-btn:disabled{cursor:default;opacity:1}.lobby-race-mode-btn:disabled:hover{background:var(--sub-alt-color)}.lobby-race-mode-btn:disabled.is-active:hover{background:color-mix(in srgb,var(--main-color) 22%,var(--bg-color))}.lobby-race-mode-btn .race-mode-icon,.lobby-race-mode-btn.is-active .lobby-race-mode-title{color:var(--main-color)}.lobby-race-mode-copy{display:flex;flex-direction:row;align-items:center;gap:12px;min-width:0;flex:1}.lobby-race-mode-title{flex:none;min-width:4.75em;font-weight:700;font-size:14px}.lobby-race-mode-blurb{font-size:12px;color:var(--sub-color);line-height:1.3}.lobby-mode-host-hint{margin:-4px 0 8px}.lobby-mode-label{margin:0 0 12px}.timed-hud{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:8px 0 4px;font-size:13px;color:var(--sub-color)}.timed-hud-clock{font-weight:700;font-size:22px;font-variant-numeric:tabular-nums;color:var(--main-color);letter-spacing:.02em}.timed-hud-locked{color:var(--main-color);font-weight:600}.timed-places{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}.timed-places li{display:grid;grid-template-columns:2.5ch 1fr auto;gap:10px;align-items:baseline;font-size:13px}.timed-places-rank{color:var(--main-color);font-weight:700}.timed-places-name{color:var(--text-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.timed-places-meta{color:var(--sub-color);font-variant-numeric:tabular-nums}.login-modal-card{position:relative;align-items:center;text-align:center;padding:30px 26px 22px;gap:12px}.login-modal-close{position:absolute;top:10px;right:10px;width:28px;height:28px;border:none;border-radius:50%;background:color-mix(in srgb,var(--text-color) 8%,transparent);color:var(--sub-color);font-size:17px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:color .15s ease,background .15s ease}.login-modal-close:hover{background:color-mix(in srgb,var(--text-color) 16%,transparent);color:var(--text-color)}.login-modal-badge{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--main-color) 16%,transparent);color:var(--main-color)}.login-modal-title{font-size:17px}.login-modal-hint{max-width:42ch;font-size:13px;line-height:1.55}.login-modal-primary{width:100%;justify-content:center;box-sizing:border-box}.login-modal-cancel{margin:0;padding:2px;border:none;background:none;font-family:var(--font);font-size:12px;color:var(--sub-color);text-decoration:underline;text-underline-offset:2px;cursor:pointer}.login-modal-cancel:hover{color:var(--text-color)}.profile-accent-dot{width:10px;height:10px;border-radius:50%;flex:none;box-shadow:0 0 0 1px color-mix(in srgb,var(--text-color) 25%,transparent)}.profile-dd-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap}.profile-dd-head .profile-dd-label{margin:0;line-height:1}.profile-dd-label{margin:0;padding:0 1px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--sub-color)}.profile-pick-tray{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1)}.profile-pick-tray.is-open{grid-template-rows:1fr}.profile-pick-tray-inner{min-height:0;overflow:hidden}.profile-peep-menu{display:flex;flex-direction:column;gap:8px;width:100%;box-sizing:border-box;padding:10px 0 2px;border:none;border-radius:0;background:transparent;box-shadow:none;opacity:0;transform:translateY(-8px);transition:opacity .2s ease,transform .32s cubic-bezier(.22,1,.36,1)}.profile-pick-tray.is-open .profile-peep-menu{opacity:1;transform:none}.profile-peep-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:4px 10px 4px 4px;max-height:240px;min-width:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.profile-peep-grid--fit{max-height:none;overflow:visible;scrollbar-gutter:auto;padding:4px}.profile-peep-swatch{width:100%;min-width:0;aspect-ratio:1;height:auto;border-radius:50%;border:2px solid transparent;background:color-mix(in srgb,var(--text-color) 12%,var(--bg-color));cursor:pointer;padding:0;overflow:hidden;display:grid;place-items:center;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease,transform .15s ease}.profile-peep-swatch img{width:100%;height:100%;min-width:0;max-width:100%;object-fit:cover;transform:translateY(-2px);pointer-events:none}.profile-peep-swatch:hover{transform:translateY(-1px);box-shadow:0 0 0 2px color-mix(in srgb,var(--text-color) 22%,transparent)}.profile-peep-swatch.active{background:var(--main-color);border-color:var(--main-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--main-color) 45%,transparent)}.profile-peep-swatch.active:hover{box-shadow:0 0 0 2px color-mix(in srgb,var(--main-color) 60%,transparent)}.profile-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sub-color)}.profile-swatch{width:100%;min-width:0;aspect-ratio:1;height:auto;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;flex:none;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.profile-swatch:hover{transform:translateY(-1px);box-shadow:0 0 0 2px color-mix(in srgb,var(--text-color) 22%,transparent)}.profile-swatch.active{border-color:var(--text-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--text-color) 35%,transparent);transform:none}.profile-swatch.active:hover{box-shadow:0 0 0 2px color-mix(in srgb,var(--text-color) 50%,transparent)}.mp-host-hint{text-align:center;margin-top:12px}.mp-guest{width:min(480px,100%);margin:0 auto}.mp-guest .profile-name{margin-top:0}.mp-guest-game{width:min(920px,100%)}.mp-join-sub{font-size:12px;line-height:1.5;margin-bottom:18px}.mp-host.mp-board{width:min(920px,100%)}.mp-over{width:min(560px,100%);margin:0 auto;text-align:center}@media (max-width: 820px){.topbar--landing .logo{display:none}.hero{grid-template-columns:1fr;gap:30px}.hero-turntable{display:block;width:112px;height:112px;margin:0}.hero-vinyl-row{gap:12px;margin-bottom:20px}.hero-vinyl-row .steps,.hero-tagline-lead-long{display:none}.topbar-right>.theme-switcher{display:none}.look-menu-theme{display:block}.hero-title{font-size:clamp(48px,16vw,80px)}.hero-left{width:100%;padding-right:120px;box-sizing:border-box}.hero-tagline,.steps,.fineprint,.error-banner,.home-actions,.join-code-form,.btn-spotify{max-width:100%}.home-actions{width:100%}.home-actions .btn-big{height:48px;padding-top:0;padding-bottom:0}.home-actions-primary{align-items:stretch}.home-actions-primary .btn-play{flex:0 0 auto;width:auto;height:48px;padding:0 12px;gap:8px;justify-content:center}.btn-play-text-long{display:none}.btn-play-text-short{display:inline;font-size:16px}.home-actions-primary .btn-multi{flex:1 1 auto;min-width:0}.fab-dock{right:14px;bottom:14px}.help-panel,.feedback-panel,.fab-item .help-panel{position:fixed;right:14px;bottom:70px;left:auto;width:min(340px,calc(100vw - 28px));max-height:min(70vh,480px);overflow-y:auto;transform-origin:bottom right}.hero-right{position:fixed;top:0;bottom:0;right:-3px;z-index:70;width:min(340px,86vw);margin:0;order:0;align-items:center;justify-content:flex-end;pointer-events:none}.hero-right .demo{pointer-events:auto;width:100%;max-width:none;transform:translate(calc(100% - 48px));transition:transform .4s cubic-bezier(.22,1,.36,1),filter .35s ease,max-height .35s ease;cursor:pointer;touch-action:none;max-height:min(78dvh,560px)}.hero-right .demo--dragging{will-change:transform}.hero-right .demo--peek{filter:saturate(.85) brightness(.92)}.hero-right .demo--dragging{cursor:grabbing;max-height:min(88dvh,680px)}.hero-right .demo-screen{border-radius:16px 0 0 16px;border-right:0 none transparent;border-right-width:0;outline:none;box-shadow:none;max-height:inherit;overflow-y:auto;-webkit-overflow-scrolling:touch}.hero-right .demo--expanded{transform:translate(0);cursor:grab;filter:none;max-height:min(88dvh,680px)}.hero-right .demo--expanded:active{cursor:grabbing}.demo--expanded .demo-screen{border-color:var(--main-color);border-right-color:transparent;border-right-width:0;box-shadow:-1px 0 0 0 var(--main-color),0 -1px 0 0 var(--main-color),0 1px 0 0 var(--main-color),-6px 10px 22px color-mix(in srgb,#000 55%,transparent)}.demo-peek-tab{display:flex;align-items:center;position:absolute;top:28%;left:0;z-index:4;font:inherit;height:calc(17px * 1.6);padding:0 12px 0 18px;border:1px solid color-mix(in srgb,var(--text-color) 14%,transparent);border-right:none;border-radius:0;background:color-mix(in srgb,var(--text-color) 6%,var(--bg-color));box-shadow:-2px 3px color-mix(in srgb,#000 22%,transparent),inset 0 1px color-mix(in srgb,#fff 10%,transparent);cursor:pointer;pointer-events:auto;transform:translate(calc(-100% + 1px),-50%)}.demo-peek-tab-fold{position:absolute;left:0;top:0;width:16px;height:100%;pointer-events:none;background:linear-gradient(135deg,color-mix(in srgb,#000 28%,var(--sub-alt-color)) 0%,color-mix(in srgb,#000 14%,var(--sub-alt-color)) 48%,transparent 49%);clip-path:polygon(0 0,100% 0,0 100%);box-shadow:1px 0 color-mix(in srgb,#000 18%,transparent)}.demo-peek-tab-fold:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(135deg,transparent 46%,color-mix(in srgb,#000 25%,transparent) 50%,transparent 54%)}.demo-peek-tab-label{position:relative;z-index:1;font-family:Caveat,Segoe Print,Comic Sans MS,cursive;font-size:17px;font-weight:600;letter-spacing:.02em;line-height:1.6;text-transform:lowercase;color:color-mix(in srgb,var(--text-color) 72%,#6b5e4e)}.demo-peek-tab:focus-visible{outline:2px solid var(--text-color);outline-offset:2px}.demo--expanded .demo-peek-tab{opacity:0;pointer-events:none}.demo--peek .cassette-tooth{pointer-events:none}.demo-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;border:none;padding:0;margin:0;background:#000;cursor:pointer;pointer-events:auto;transition:opacity .2s ease}.mp-lobby-grid{grid-template-columns:1fr}.mp-qr-card{padding:14px 16px;gap:14px}.mp-qr-row{gap:14px}.mp-qr{width:88px;max-width:88px}.mp-qr-row .loader{width:88px;flex:none}.mp-code{font-size:22px;letter-spacing:.16em}.mp-board{grid-template-columns:1fr;width:min(560px,100%)}.mp-guess-popups{position:static;max-height:none;order:2;flex-direction:column-reverse}}@media (max-width: 520px){.topbar{padding:14px 16px;flex-wrap:nowrap}.theme-btn{max-width:min(120px,28vw);padding:0 10px}.game{--game-pad: 18px}.gameover-hero .turntable{width:120px;height:120px}.gameover-score{font-size:36px}.gos-fast-art{width:72px;height:72px}.gos-fast-title{font-size:17px}.gos-fast-time{font-size:18px}.game:has(.gameover):before{width:200px;height:200px;right:-70px;top:-80px}.game:has(.gameover):after{width:190px;height:190px;right:-125px;bottom:-130px}.guess-fields{flex-direction:column}.hero-left{padding-right:80px}.hero-right{width:min(320px,92vw)}.hero-right .demo{transform:translate(calc(100% - 44px))}.hero-right .demo--expanded{transform:translate(0)}.hero-right .demo{max-height:min(80dvh,560px)}.hero-right .demo--expanded,.hero-right .demo--dragging{max-height:min(90dvh,680px)}.join-code-form{width:100%}.guess-media--cassette{width:100%;margin-top:14px;margin-bottom:22px}.cassette-window{gap:24px;min-height:64px;padding:12px}.cassette-reel{width:38px;height:38px}.controls{gap:10px}.guess-transport-switch{width:88px;min-width:88px;height:44px}}.play-howto-steps{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.45;text-align:left}.play-howto-steps li{padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--text-color) 6%,var(--sub-alt-color))}.play-howto-steps li:has(.howto-ctrl){display:flex;align-items:center;gap:10px}.play-howto-steps b{color:var(--main-color);font-weight:600}.howto-ctrl{flex:none;pointer-events:none}.play-howto-steps .guess-transport-switch{width:52px;min-width:52px;height:26px;padding:2px}.play-howto-steps .guess-transport-thumb{top:2px;left:2px;height:calc(100% - 4px);width:calc(50% - 2px)}.howto-ctrl--skip{display:inline-flex;flex-direction:column;align-items:center;gap:1px;padding:4px 8px 3px;border-radius:calc(var(--radius) - 2px);border:1.5px solid color-mix(in srgb,var(--text-color) 22%,transparent);background:transparent;color:var(--text-color);box-shadow:none;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.1}.howto-ctrl--skip .btn-hint{font-size:7px;font-weight:600;letter-spacing:.12em;opacity:.7}.play-howto .spotlight-actions{justify-content:stretch}.play-howto .spotlight-actions .btn{width:100%;justify-content:center}.play-howto-foot{margin:0;text-align:center;font-size:12px;color:var(--sub-color)}