:root{--bg-0: #eceaf2;--bg-1: #f6f5f9;--surface: rgba(255, 255, 255, .72);--surface-solid: #ffffff;--surface-strong: rgba(255, 255, 255, .92);--border-soft: rgba(20, 18, 30, .07);--text: #17151d;--text-secondary: #8a879370;--text-muted: #918da0;--danger: #c8433f;--radius-xl: 34px;--radius-lg: 26px;--radius-md: 18px;--radius-sm: 12px;--shadow-soft: 0 10px 34px rgba(24, 20, 44, .08);--shadow-capsule: 0 8px 24px rgba(24, 20, 44, .12);--shadow-lift: 0 20px 60px rgba(24, 20, 44, .16);--player-outline: rgba(255, 255, 255, .28);--font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);color:var(--text);background:radial-gradient(120% 140% at 15% -10%,#f2f0f8 0%,var(--bg-0) 45%,var(--bg-1) 100%);background-attachment:fixed;-webkit-font-smoothing:antialiased}button{font-family:inherit}img,svg{display:block}.app-shell{min-height:100vh;display:flex;flex-direction:column}.btn{border:none;cursor:pointer;font-family:inherit;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.btn:active{transform:scale(.97)}.btn-pill{background:var(--surface-strong);color:var(--text);border:1px solid var(--border-soft);border-radius:999px;padding:13px 28px;font-size:15px;font-weight:600;box-shadow:var(--shadow-capsule);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.btn-pill:hover{box-shadow:var(--shadow-lift)}.btn-pill.dark{background:#17151d;color:#fff}.btn-ghost{background:transparent;color:var(--text-muted);border:none;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:500}.btn-ghost:hover{color:var(--text)}.icon-btn{width:40px;height:40px;border-radius:50%;background:var(--surface-strong);border:1px solid var(--border-soft);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-capsule);color:var(--text);flex-shrink:0}.icon-btn.small{width:32px;height:32px}.icon-btn.subtle{background:transparent;border:none;box-shadow:none}.icon-btn:disabled{opacity:.35;cursor:default}.icon-btn.active{background:#17151d;color:#fff}.landing{flex:1;display:flex;align-items:center;justify-content:center;padding:32px}.landing-card{width:100%;max-width:420px;min-height:640px;border-radius:var(--radius-xl);background:linear-gradient(180deg,var(--surface-strong),var(--surface));border:1px solid var(--border-soft);box-shadow:var(--shadow-lift);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);display:flex;flex-direction:column;justify-content:space-between;padding:48px 36px 36px;position:relative;overflow:hidden}.landing-visual{height:220px;display:flex;align-items:center;justify-content:center}.landing-copy{text-align:left}.landing-copy .brand{font-size:15px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);margin-bottom:18px}.landing-copy h1{font-size:42px;line-height:1.08;font-weight:700;margin:0 0 8px;letter-spacing:-.02em}.landing-copy h1 .fade{color:#b9b6c4}.landing-actions{margin-top:32px}.landing-actions .btn-pill{width:100%;text-align:center;padding:16px;font-size:16px}.auth-screen{flex:1;display:flex;align-items:center;justify-content:center;padding:24px}.auth-card{width:100%;max-width:380px;background:var(--surface-strong);border:1px solid var(--border-soft);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);padding:36px 30px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.auth-card h2{margin:0 0 6px;font-size:24px;font-weight:700}.auth-card p.sub{margin:0 0 24px;color:var(--text-muted);font-size:14px}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:6px}.field input,.field select{width:100%;padding:12px 14px;border-radius:var(--radius-sm);border:1px solid var(--border-soft);background:#fff;font-size:15px;color:var(--text);font-family:inherit}.field input:focus,.field select:focus{outline:2px solid #17151d22}.form-error{background:#fdeceb;color:var(--danger);border-radius:var(--radius-sm);padding:10px 14px;font-size:13px;margin-bottom:16px}.form-note{font-size:12px;color:var(--text-muted);margin-top:4px}.setup-steps{display:flex;gap:6px;margin-bottom:22px}.setup-steps .dot{flex:1;height:4px;border-radius:2px;background:var(--border-soft)}.setup-steps .dot.active{background:#17151d}.topbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:20px 24px 8px;max-width:760px;width:100%;margin:0 auto}.topbar .brand{font-size:18px;font-weight:700;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}.topbar .brand .dot{width:9px;height:9px;border-radius:50%;background:#17151d}.topbar-actions{display:flex;gap:10px;align-items:center}.search-box{display:flex;align-items:center;gap:8px;background:var(--surface-strong);border:1px solid var(--border-soft);border-radius:999px;padding:9px 16px;box-shadow:var(--shadow-capsule);min-width:0}.search-box input{border:none;background:transparent;outline:none;font-size:14px;width:160px;font-family:inherit;color:var(--text)}.explore-screen{height:100vh;display:flex;flex-direction:column;overflow:hidden}.explore-page{flex:1;min-height:0;display:flex;flex-direction:column}.explore-fixed{flex-shrink:0;width:100%;max-width:760px;margin:0 auto;padding:8px 20px 0}.explore-scroll{flex:1;min-height:0;overflow-y:auto;width:100%;max-width:760px;margin:0 auto;padding:4px 20px 20px}.explore-scroll.has-mini-player{padding-bottom:96px}.explore-header{display:flex;align-items:baseline;justify-content:space-between;margin:18px 4px 4px}.explore-header h1{font-size:26px;font-weight:700;margin:0;letter-spacing:-.01em}.explore-menu-btn{font-size:20px;letter-spacing:2px;color:var(--text-muted);background:none;border:none;cursor:pointer;padding:6px 10px}.breadcrumb-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 4px 18px;font-size:13px;color:var(--text-muted)}.breadcrumb-row button{background:none;border:none;color:var(--text-muted);font-size:13px;cursor:pointer;padding:2px 4px;font-family:inherit}.breadcrumb-row button:hover,.breadcrumb-row button.current{color:var(--text);font-weight:600}.breadcrumb-sep{opacity:.5}.back-row{display:flex;align-items:center;gap:10px;margin:0 4px 10px}.track-count{font-size:12.5px;color:var(--text-muted);margin:-4px 4px 14px}.vote-row{display:flex;gap:6px;margin-top:6px}.folder-votes{margin:-6px 4px 12px}.folder-votes .vote-row{margin-top:0}.vote-btn{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;border:1px solid var(--border-soft);background:var(--surface-strong);box-shadow:var(--shadow-capsule);color:var(--text-muted);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;cursor:pointer}.vote-btn.liked{background:#17151d;border-color:#17151d;color:#fff}.vote-btn.disliked{background:var(--danger);border-color:var(--danger);color:#fff}.sort-row{display:flex;align-items:center;gap:6px;margin:0 4px 12px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.sort-row::-webkit-scrollbar{display:none}.sort-label{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);margin-right:2px;flex-shrink:0}.sort-arrow{margin-left:5px;font-weight:700}.sort-chip{flex-shrink:0;white-space:nowrap;border:1px solid var(--border-soft);background:var(--surface);color:var(--text-muted);border-radius:999px;padding:6px 14px;font-size:12.5px;cursor:pointer;font-weight:500}.sort-chip.active{background:#17151d;color:#fff;border-color:#17151d}.entry-list{display:flex;flex-direction:column;gap:6px}.entry-row{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:var(--radius-lg);cursor:pointer;transition:background .15s ease,box-shadow .15s ease,transform .1s ease;position:relative}.entry-row:hover{background:#ffffff80}.entry-row.selected{background:var(--surface-strong);box-shadow:var(--shadow-capsule);border:1px solid var(--border-soft)}.entry-row.playing{background:var(--surface-strong);box-shadow:var(--shadow-capsule)}.entry-glyph{width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid var(--border-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--text);font-size:17px;box-shadow:0 2px 6px #18142c0d}.entry-glyph.folder,.entry-glyph.playing-anim{background:#17151d;color:#fff;border:none}.entry-main{flex:1;min-width:0}.entry-name{font-size:15.5px;font-weight:600;overflow-wrap:break-word;word-break:break-word;line-height:1.28}.entry-sub{font-size:12.5px;color:var(--text-muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.entry-actions{display:flex;gap:8px;flex-shrink:0;opacity:0;transform:translate(4px);transition:opacity .15s ease,transform .15s ease}.entry-row.selected .entry-actions,.entry-row:hover .entry-actions,.entry-row:focus-within .entry-actions,.entry-actions.menu-open{opacity:1;transform:translate(0)}@media (hover: none){.entry-actions{opacity:1;transform:none}}.entry-more{position:relative}.menu-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;background:transparent}.entry-more-menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface-solid);border:1px solid var(--border-soft);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:6px;min-width:190px;z-index:100}.entry-more-menu button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:var(--radius-sm);border:none;background:none;font-size:14px;cursor:pointer;color:var(--text);font-family:inherit}.entry-more-menu button:hover{background:#0000000d}.empty-state{text-align:center;color:var(--text-muted);padding:60px 20px;font-size:14.5px}.search-results-note{font-size:12.5px;color:var(--text-muted);margin:0 4px 10px}.mini-player{position:fixed;bottom:14px;left:50%;transform:translate(-50%);width:min(94vw,720px);background:var(--surface-strong);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1.5px solid var(--player-outline);border-radius:var(--radius-xl);box-shadow:var(--shadow-lift);padding:10px 12px 10px 10px;display:flex;align-items:center;gap:12px;z-index:60;cursor:pointer}.mini-player-art{width:46px;height:46px;border-radius:50%;background:#17151d;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;animation:spin 8s linear infinite;animation-play-state:paused}.mini-player-art.spinning{animation-play-state:running}.mini-player-info{flex:1;min-width:0}.mini-player-info .title{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player-info .sub{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player-progress{position:absolute;bottom:0;left:18px;right:18px;height:3px;background:var(--border-soft);border-radius:2px;overflow:hidden}.mini-player-progress .fill{height:100%;background:#17151d;border-radius:2px}.mini-player-controls{display:flex;align-items:center;gap:6px}.player-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#14121e47;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:clamp(10px,3vh,24px);animation:fadeIn .18s ease}.player-card{width:100%;max-width:420px;overflow-x:hidden;overflow-y:visible;background:linear-gradient(180deg,#fbfafc,#f1f0f5);border:1.5px solid var(--player-outline);border-radius:var(--radius-xl);box-shadow:var(--shadow-lift);padding:clamp(14px,3vh,20px) 26px clamp(16px,3vh,30px);display:flex;flex-direction:column}.player-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:clamp(0px,1vh,6px)}.player-visual{height:clamp(80px,17vh,220px);margin:clamp(2px,1vh,10px) auto clamp(2px,.8vh,6px);display:flex;align-items:center;justify-content:center;position:relative}.player-disc-plate{width:clamp(74px,15.5vh,200px);height:clamp(74px,15.5vh,200px);border-radius:32px;background:linear-gradient(160deg,#fff,#eceaf1);box-shadow:inset 0 2px 6px #fffc,0 16px 40px #18142c24;display:flex;align-items:center;justify-content:center}.player-disc{width:clamp(50px,10.5vh,140px);height:clamp(50px,10.5vh,140px);border-radius:50%;background:radial-gradient(circle at 40% 35%,#37343f,#1a1820 55%,#0d0c11);box-shadow:0 6px 20px #00000059;display:flex;align-items:center;justify-content:center;animation:spin 6s linear infinite;animation-play-state:paused}.player-disc.spinning{animation-play-state:running}.player-disc:before{content:"";position:absolute;width:clamp(50px,10.5vh,140px);height:clamp(50px,10.5vh,140px);border-radius:50%;background:repeating-radial-gradient(circle,rgba(255,255,255,.05) 0px,rgba(255,255,255,.05) 1px,transparent 2px,transparent 5px)}.player-disc-center{width:46px;height:46px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;color:#1a1820;z-index:1}.player-titles{text-align:center;margin-top:4px}.player-titles h2{font-size:clamp(17px,3vh,21px);font-weight:700;margin:0 0 2px;letter-spacing:-.01em}.player-titles .artist{font-size:14.5px;color:var(--text-muted);margin:0 0 clamp(3px,1vh,8px)}.player-quality{font-size:12px;color:var(--text-muted);background:var(--surface);border:1px solid var(--border-soft);border-radius:999px;padding:5px 12px;display:inline-block;cursor:pointer}.transcode-note{font-size:11px;color:var(--text-muted);margin:6px 0 0}.waveform{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:22px;margin:clamp(6px,2vh,16px) 0 6px}.waveform .bar{width:3px;border-radius:2px;background:#cbc8d4;transition:height .12s ease,background .2s ease}.waveform .bar.active{background:#17151d}.time-row{display:flex;justify-content:center;gap:6px;font-size:12.5px;color:var(--text-muted);font-variant-numeric:tabular-nums;margin-bottom:clamp(4px,1vh,8px)}.seek-bar{width:100%;margin-bottom:clamp(10px,2.5vh,22px)}.transport-row{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:clamp(12px,3vh,26px)}.transport-btn{width:clamp(40px,8vh,56px);height:clamp(40px,8vh,56px);border-radius:50%;background:var(--surface-strong);border:1px solid var(--border-soft);box-shadow:var(--shadow-capsule);display:flex;align-items:center;justify-content:center;cursor:pointer}.transport-btn.main{width:clamp(50px,10vh,72px);height:clamp(50px,10vh,72px);background:#17151d;color:#fff;box-shadow:var(--shadow-lift)}.tone-controls{display:flex;flex-direction:column;gap:clamp(8px,2vh,16px)}.tone-row{display:flex;align-items:center;gap:14px}.tone-row label{width:58px;font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--text-muted);text-transform:uppercase}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:1;min-width:0;width:100%;height:4px;border-radius:2px;background:var(--border-soft);outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#17151d;border:3px solid #fff;box-shadow:0 2px 6px #00000040;cursor:pointer}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#17151d;border:3px solid #fff;box-shadow:0 2px 6px #00000040;cursor:pointer}.tone-reset{align-self:center;margin-top:6px}.queue-toggle-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:clamp(10px,2.5vh,22px)}.symbol-btn{position:relative;width:44px;height:44px;border-radius:50%;background:var(--surface-strong);border:1px solid var(--border-soft);box-shadow:var(--shadow-capsule);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text);opacity:.45;transition:opacity .15s ease,color .15s ease}.symbol-btn.active{opacity:1;color:#17151d}.symbol-badge{position:absolute;top:-2px;right:-2px;min-width:15px;height:15px;padding:0 3px;border-radius:999px;background:#17151d;color:#fff;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#14121e59;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}.modal-card{background:#fff;border-radius:var(--radius-lg);max-width:420px;width:100%;padding:26px;box-shadow:var(--shadow-lift);max-height:86vh;overflow-y:auto}.modal-card h3{margin:0 0 16px;font-size:18px}.info-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--border-soft);font-size:13.5px}.info-row .k{color:var(--text-muted)}.info-row .v{font-weight:600;text-align:right;word-break:break-word}.admin-wrap{flex:1;width:100%;max-width:860px;margin:0 auto;padding:16px 20px 140px}.admin-tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:20px;padding-bottom:2px}.admin-tab{border:1px solid var(--border-soft);background:var(--surface);color:var(--text-muted);border-radius:999px;padding:9px 18px;font-size:13.5px;font-weight:600;cursor:pointer;white-space:nowrap}.admin-tab.active{background:#17151d;color:#fff;border-color:#17151d}.admin-panel{background:var(--surface-strong);border:1px solid var(--border-soft);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);padding:24px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.admin-panel h2{margin:0 0 4px;font-size:19px}.admin-panel p.sub{margin:0 0 20px;color:var(--text-muted);font-size:13.5px}.admin-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 4px;border-bottom:1px solid var(--border-soft)}.admin-row:last-child{border-bottom:none}.admin-row-main{flex:1;min-width:0}.admin-row-title{font-weight:600;font-size:14.5px}.admin-row-sub{font-size:12.5px;color:var(--text-muted);margin-top:2px;overflow-wrap:break-word}.badge{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 9px;border-radius:999px;background:var(--border-soft);color:var(--text-muted)}.badge.on{background:#17151d;color:#fff}.badge.warn{background:#fdeceb;color:var(--danger)}.toggle{width:42px;height:24px;border-radius:999px;background:var(--border-soft);border:none;cursor:pointer;position:relative;flex-shrink:0}.toggle.on{background:#17151d}.toggle .knob{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s ease}.toggle.on .knob{transform:translate(18px)}.admin-actions{display:flex;gap:8px;flex-shrink:0}.admin-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media (max-width: 560px){.admin-form-grid{grid-template-columns:1fr}}.status-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width: 560px){.status-grid{grid-template-columns:1fr}}.status-tile{background:#fff;border:1px solid var(--border-soft);border-radius:var(--radius-md);padding:14px 16px}.status-tile .label{font-size:11.5px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}.status-tile .value{font-size:15px;font-weight:700}.top-nav-link{font-size:13px;font-weight:600;color:var(--text-muted);cursor:pointer;background:none;border:none;font-family:inherit}.top-nav-link:hover{color:var(--text)}.toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#17151d;color:#fff;padding:12px 20px;border-radius:999px;font-size:13.5px;box-shadow:var(--shadow-lift);z-index:300}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 640px){.topbar{padding:16px 16px 4px}.search-box input{width:100px}.sort-chip{padding:6px 10px;font-size:12px}.explore-fixed{padding:4px 12px 0}.explore-scroll{padding:4px 12px 20px}.explore-scroll.has-mini-player{padding-bottom:96px}.explore-header h1{font-size:22px}.landing-card{padding:36px 24px 28px;min-height:560px}.landing-copy h1{font-size:34px}.player-card{max-width:100%;border-radius:28px}.player-visual{height:200px}.player-disc-plate{width:180px;height:180px}.player-disc{width:122px;height:122px}.admin-row{flex-wrap:wrap}.admin-row-main{flex-basis:100%}.admin-actions{flex-wrap:wrap}}:root[data-theme="3d"]{--bg-0: #e7e4ee;--bg-1: #efedf4;--surface: #ebe8f1;--surface-solid: #ebe8f1;--surface-strong: #ebe8f1;--border-soft: rgba(20, 18, 30, .03);--shadow-soft: 9px 9px 18px rgba(160, 154, 180, .45), -9px -9px 18px rgba(255, 255, 255, .85);--shadow-capsule: 6px 6px 13px rgba(160, 154, 180, .45), -6px -6px 13px rgba(255, 255, 255, .85);--shadow-lift: 14px 14px 30px rgba(150, 144, 172, .5), -14px -14px 30px rgba(255, 255, 255, .9)}:root[data-theme="3d"] body{background:var(--bg-0);background-attachment:fixed}:root[data-theme="3d"] .landing-card,:root[data-theme="3d"] .auth-card,:root[data-theme="3d"] .modal-card,:root[data-theme="3d"] .admin-panel{background:var(--surface-strong)}:root[data-theme="3d"] .field input,:root[data-theme="3d"] .status-tile{background:var(--surface-strong);box-shadow:inset 3px 3px 7px #a09ab459,inset -3px -3px 7px #ffffffb3}:root[data-theme="3d"] input[type=range]{box-shadow:inset 2px 2px 5px #a09ab473,inset -2px -2px 5px #fffc}:root[data-theme="3d"] .btn-pill.dark,:root[data-theme="3d"] .icon-btn.active,:root[data-theme="3d"] .vote-btn.liked,:root[data-theme="3d"] .sort-chip.active,:root[data-theme="3d"] .vote-btn.disliked,:root[data-theme="3d"] .transport-btn.main,:root[data-theme="3d"] .entry-glyph.folder,:root[data-theme="3d"] .entry-glyph.playing-anim,:root[data-theme="3d"] .mini-player-art,:root[data-theme="3d"] .admin-tab.active,:root[data-theme="3d"] .toggle.on,:root[data-theme="3d"] .badge.on,:root[data-theme="3d"] .toast{box-shadow:inset 3px 3px 7px #00000059,inset -2px -2px 6px #ffffff1a}:root[data-theme=dark]{--bg-0: #0d0d12;--bg-1: #15151c;--surface: rgba(255, 255, 255, .06);--surface-solid: #1a1a22;--surface-strong: rgba(255, 255, 255, .09);--border-soft: rgba(255, 255, 255, .09);--text: #f2f2f6;--text-muted: #9c9aab;--danger: #ff6b66;--shadow-soft: 0 10px 34px rgba(0, 0, 0, .35);--shadow-capsule: 0 6px 18px rgba(0, 0, 0, .32);--shadow-lift: 0 20px 60px rgba(0, 0, 0, .5);color-scheme:dark}:root[data-theme=dark] body{background:radial-gradient(120% 140% at 15% -10%,#1d1d29 0%,var(--bg-0) 55%,#09090d 100%);background-attachment:fixed}:root[data-theme=dark] .btn-pill.dark,:root[data-theme=dark] .entry-glyph.folder,:root[data-theme=dark] .entry-glyph.playing-anim,:root[data-theme=dark] .sort-chip.active,:root[data-theme=dark] .admin-tab.active,:root[data-theme=dark] .toggle.on,:root[data-theme=dark] .badge.on,:root[data-theme=dark] .icon-btn.active,:root[data-theme=dark] .vote-btn.liked,:root[data-theme=dark] .toast,:root[data-theme=dark] .setup-steps .dot.active,:root[data-theme=dark] .topbar .brand .dot{background:#f2f2f6;color:#0d0d12;border-color:#f2f2f6}:root[data-theme=dark] .landing-copy h1 .fade{color:#5f5e6d}:root[data-theme=dark] .field input,:root[data-theme=dark] .field select,:root[data-theme=dark] .modal-card,:root[data-theme=dark] .status-tile{background:#1a1a22;color:var(--text)}:root[data-theme=dark] .entry-glyph{background:#ffffff14}:root[data-theme=dark] .entry-row:hover{background:#ffffff0f}:root[data-theme=dark] .entry-more-menu button:hover{background:#ffffff14}:root[data-theme=dark] .form-error,:root[data-theme=dark] .badge.warn{background:#ff6b6624}:root[data-theme=dark] input[type=range]::-webkit-slider-thumb{background:#f2f2f6;border-color:#0d0d12}:root[data-theme=dark] input[type=range]::-moz-range-thumb{background:#f2f2f6;border-color:#0d0d12}@property --c1{syntax: "<color>"; inherits: true; initial-value: #2a2a36;}@property --c2{syntax: "<color>"; inherits: true; initial-value: #14141b;}.mini-player,.player-card{--text: #f4f4f7;--text-muted: rgba(244, 244, 247, .62);--surface: rgba(255, 255, 255, .08);--surface-strong: rgba(255, 255, 255, .12);--border-soft: rgba(255, 255, 255, .14);--shadow-capsule: 0 6px 16px rgba(0, 0, 0, .28);--shadow-lift: 0 24px 70px rgba(0, 0, 0, .5);color:var(--text)}.mini-player{background:#17171e;background:linear-gradient(120deg,color-mix(in srgb,var(--c1) 62%,#0c0c11),color-mix(in srgb,var(--c2) 70%,#0c0c11));transition:--c1 .8s ease,--c2 .8s ease}.mini-player-art{border-radius:14px;background:#ffffff1f;overflow:hidden;animation:none;color:#fff}.mini-player-art img{width:100%;height:100%;object-fit:cover}.mini-player-progress{background:#ffffff29}.mini-player-progress .fill{background:#fff}.player-overlay{background:radial-gradient(120% 80% at 12% 0%,var(--c1),transparent 62%),radial-gradient(110% 80% at 92% 100%,var(--c2),transparent 60%),#0a0a0f;-webkit-backdrop-filter:none;backdrop-filter:none;transition:--c1 .9s ease,--c2 .9s ease}.player-overlay .player-card{max-width:440px;background:#ffffff12;-webkit-backdrop-filter:blur(30px) saturate(150%);backdrop-filter:blur(30px) saturate(150%);border:1.5px solid var(--player-outline);box-shadow:0 30px 80px #00000080}.player-overlay .player-visual{height:auto;margin:2px auto 14px}.player-cover{width:min(100%,36vh,380px);aspect-ratio:1;border-radius:28px;overflow:hidden;background:linear-gradient(145deg,var(--c1),var(--c2));box-shadow:0 22px 56px #00000080,0 0 0 1px #ffffff14;transform:scale(.96);transition:transform .8s cubic-bezier(.22,.7,.2,1)}.player-cover.playing{transform:scale(1)}.player-cover img{animation:coverIn .6s ease both}.player-cover img{width:100%;height:100%;object-fit:cover;display:block}.player-cover-fallback{width:100%;height:100%;display:grid;place-items:center;color:#fffc}.player-overlay .player-titles h2{color:#fff}.player-overlay .waveform .bar{background:#ffffff40}.player-overlay .waveform .bar.active{background:#fff}.player-overlay input[type=range]{background:#fff3;box-shadow:none}.player-overlay .seek-bar{flex:none;height:4px}.player-overlay input[type=range]::-webkit-slider-thumb{background:#fff;border-color:#00000059}.player-overlay input[type=range]::-moz-range-thumb{background:#fff;border-color:#00000059}.player-overlay .transport-btn.main{background:#fff;color:#0b0b10;box-shadow:0 10px 30px #0006}.player-overlay .symbol-btn{opacity:.55}.player-overlay .symbol-btn.active{opacity:1;color:#fff;box-shadow:inset 0 0 0 1.5px #ffffffd9}.player-overlay .symbol-badge{background:#fff;color:#0b0b10}.player-overlay .entry-more-menu{background:#22222b}.player-overlay .entry-more-menu button{color:#f4f4f7}.spatial-ctl{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 8px 0 14px;border-radius:999px;border:1px solid var(--border-soft);background:#ffffff14;color:var(--text-muted);font:600 12.5px var(--font);transition:background .2s ease,color .2s ease}.spatial-ctl strong{min-width:38px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;color:var(--text)}.spatial-step{width:28px;height:28px;border-radius:50%;border:none;background:#ffffff24;color:#fff;font:700 16px/1 var(--font);cursor:pointer}.spatial-step:disabled{opacity:.3;cursor:default}.spatial-ctl.active{background:#ffffff29;color:#fff;border-color:#ffffff80}@media (orientation: landscape) and (max-height: 560px){.player-overlay .player-card{max-width:min(900px,100%);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:28px;align-items:start}.player-overlay .player-card>*{grid-column:2}.player-overlay .player-card>.player-visual{grid-column:1;grid-row:1 / span 12;align-self:center;margin:0}.player-cover{width:min(100%,62vh)}}.entry-glyph{position:relative;overflow:hidden}.cover-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s ease}.cover-img.loaded{opacity:1}.entry-glyph.folder{border-radius:12px}.icon-btn,.transport-btn,.symbol-btn,.sort-chip,.vote-btn,.entry-row,.admin-tab,.spatial-step{transition:background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease,opacity .25s ease,transform .2s ease}.player-overlay{animation:overlayIn .4s ease both}.player-overlay .player-card{animation:cardIn .5s cubic-bezier(.22,.7,.2,1) both}.mini-player{animation:miniIn .45s cubic-bezier(.22,.7,.2,1) both}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}@keyframes cardIn{0%{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}@keyframes miniIn{0%{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}@keyframes coverIn{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.player-overlay,.player-overlay .player-card,.mini-player,.player-cover img{animation:none}.player-cover{transition:none}}.glass-screen{--text: #f4f4f7;--text-muted: rgba(244, 244, 247, .62);--surface: rgba(255, 255, 255, .08);--surface-strong: rgba(255, 255, 255, .12);--border-soft: rgba(255, 255, 255, .14);--shadow-capsule: 0 6px 16px rgba(0, 0, 0, .28);--shadow-lift: 0 24px 70px rgba(0, 0, 0, .5);--c1: #5c1a26;--c2: #1d2038;position:relative;isolation:isolate;overflow:hidden;color:var(--text);background:radial-gradient(120% 80% at 12% 0%,var(--c1),transparent 62%),radial-gradient(110% 80% at 92% 100%,var(--c2),transparent 60%),#0a0a0f}.auth-emblem{position:absolute;z-index:-1;left:50%;top:50%;width:min(150vmin,1000px);height:auto;translate:-50% -50%;pointer-events:none;filter:drop-shadow(-2px -2px 3px rgba(255,255,255,.1)) drop-shadow(5px 8px 14px rgba(0,0,0,.55));animation:emblemIn 1.4s ease both}@keyframes emblemIn{0%{opacity:0;scale:.96}to{opacity:1;scale:1}}.glass-screen .landing-card,.glass-screen .auth-card{background:#ffffff12;-webkit-backdrop-filter:blur(9px) saturate(150%);backdrop-filter:blur(9px) saturate(150%);border:1.5px solid var(--player-outline);box-shadow:0 30px 80px #00000080}.glass-screen .landing-card{min-height:560px;animation:cardIn .6s cubic-bezier(.22,.7,.2,1) both}.glass-screen .auth-card{animation:cardIn .6s cubic-bezier(.22,.7,.2,1) both}.glass-screen .landing-copy h1{color:#fff}.glass-screen .landing-copy h1 .fade{color:#ffffff80}.glass-screen .auth-card h2{color:#fff}.glass-screen .field input{background:#ffffff14;border:1px solid rgba(255,255,255,.16);color:#fff}.glass-screen .field input:focus{outline:2px solid rgba(255,255,255,.35)}.glass-screen .btn-pill.dark{background:#fff;color:#0b0b10;border-color:#fff;box-shadow:0 10px 30px #0006}.glass-screen .form-error{background:#ff6b6629;color:#ff9a96}.glass-screen .icon-btn.subtle{color:#fff}@media (prefers-reduced-motion: reduce){.auth-emblem,.glass-screen .landing-card,.glass-screen .auth-card{animation:none}}
