html,body{margin:0;padding:0;background:#e9ebee}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}:root{color-scheme:light;--bg: #e9ebee;--surface: #ffffff;--surface-2: #f1f2f5;--border: #e2e4e9;--text: #17191d;--muted: #6d7280;--danger: #e5484d;--pitch: #14161b;--on-pitch: #f5f6f8;--on-pitch-muted: #a7adb8;--amber: #c2700e;--amber-hot: #e8930c;--ink: #1a1408;--font: -apple-system, BlinkMacSystemFont, "Inter", "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--r-sm: 10px;--r-md: 16px;--r-lg: 24px;--r-full: 999px;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);--shadow-md: 0 1px 2px rgba(16, 24, 40, .06), 0 8px 24px rgba(16, 24, 40, .08);--shadow-lg: 0 2px 4px rgba(16, 24, 40, .06), 0 16px 40px rgba(16, 24, 40, .14)}html[data-theme=dark]{color-scheme:dark;--bg: #0f1114;--surface: #181b21;--surface-2: #23272f;--border: #2c313b;--text: #f1f3f6;--muted: #9aa1ad;--danger: #ff8a80;--pitch: #f5f6f8;--on-pitch: #14161b;--on-pitch-muted: #5b626e;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .45);--shadow-md: 0 1px 2px rgba(0, 0, 0, .45), 0 8px 24px rgba(0, 0, 0, .5);--shadow-lg: 0 2px 4px rgba(0, 0, 0, .45), 0 16px 40px rgba(0, 0, 0, .55)}html[data-theme=dark] ::-webkit-scrollbar-thumb{background:#3a3f48;border-color:var(--bg)}html[data-theme=dark] .search-row button:hover:not(:disabled),html[data-theme=dark] .np-play:hover:not(:disabled){background:#fff}html[data-theme=dark] .chip:hover,html[data-theme=dark] .backbtn:hover,html[data-theme=dark] .iconbtn:hover,html[data-theme=dark] .np .play-btn.np-side:hover:not(:disabled){border-color:#434a56}html[data-theme=dark] .np-grip span{background:#3a3f48}html[data-theme=dark] .error{color:#ffa9a3}::selection{background:var(--amber);color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#c9ccd3;border:3px solid var(--bg);border-radius:var(--r-full)}::-webkit-scrollbar-thumb:hover{background:var(--amber)}*{box-sizing:border-box}.brand,.search-row button,.chip,.track,.card,.qtile,.minibtn,.backbtn,.iconbtn,.play-btn,.bottomnav button,.rail-nav button,.rail-row,.player{transition-property:background-color,border-color,color,box-shadow;transition-duration:.25s;transition-timing-function:ease}@media(prefers-reduced-motion:reduce){.brand,.search-row button,.chip,.track,.card,.qtile,.minibtn,.backbtn,.iconbtn,.play-btn,.bottomnav button,.rail-nav button,.rail-row,.player,.np{transition-duration:.01ms}}.app{min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;touch-action:manipulation;box-shadow:var(--shadow-sm)}.iconbtn:hover{border-color:#d3d6dd;box-shadow:var(--shadow-md)}.iconbtn svg{width:20px;height:20px}.iconbtn:disabled{opacity:.35;cursor:default;box-shadow:none}.iconbtn.dark{background:var(--pitch);border-color:var(--pitch);color:var(--on-pitch)}.iconbtn.loved{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 45%,var(--border))}.iconbtn.loved svg .fill{fill:currentColor}.topbar{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding:12px clamp(14px,4vw,28px);display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center}.brand{margin:0;font-size:24px;font-weight:800;letter-spacing:-.5px;color:var(--text)}.brand .comma{color:var(--amber)}.search{flex:1;min-width:min(100%,300px);margin:0}.panel{border:1px solid var(--border);border-radius:var(--r-md);padding:20px 16px 16px;background:var(--surface);margin:14px 0 0;min-width:0;box-shadow:var(--shadow-sm);position:relative}.panel>legend{position:absolute;top:-13px;left:12px;padding:2px 10px;margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-full);color:var(--text);font-size:12.5px;font-weight:700;letter-spacing:0;white-space:nowrap;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis}.search-row{display:flex;gap:8px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-full);padding:6px 6px 6px 16px;box-shadow:var(--shadow-sm)}.search-row:focus-within{border-color:color-mix(in srgb,var(--amber) 55%,var(--border));box-shadow:0 0 0 3px color-mix(in srgb,var(--amber) 18%,transparent)}.search-row input{flex:1;min-width:0;background:transparent;border:none;color:var(--text);font:inherit;font-size:16px;padding:8px 2px;outline:none;caret-color:var(--amber)}.search-row input::placeholder{color:var(--muted)}.search-row button{font:inherit;font-size:14px;font-weight:600;background:var(--pitch);color:var(--on-pitch);border:none;border-radius:var(--r-full);padding:10px 20px;cursor:pointer;white-space:nowrap;touch-action:manipulation}.search-row button:hover:not(:disabled){background:#23262d}.search-row button:disabled{opacity:.4;cursor:default}.statusline{padding:10px clamp(14px,4vw,28px) 0;color:var(--muted);font-size:13px;max-width:1280px;width:100%;margin:0 auto}.error{margin:10px auto 0;max-width:1280px;width:calc(100% - clamp(28px,8vw,56px));padding:12px 16px;background:color-mix(in srgb,var(--danger) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--danger) 35%,var(--border));border-radius:var(--r-md);color:#b3261e;font-size:13px}.content{flex:1;width:100%;max-width:860px;margin:0 auto;padding:10px clamp(14px,4vw,28px) 190px;display:grid;gap:16px;align-content:start}.empty{text-align:center;border:1px dashed var(--border);border-radius:var(--r-md);background:var(--surface);padding:48px 24px;color:var(--muted)}.empty-title{font-size:18px;font-weight:700;color:var(--text);margin:0 0 8px;letter-spacing:-.2px}.empty-sub{margin:0;font-size:14px}.queue{box-shadow:var(--shadow-sm)}.cards{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 10px}.card{flex:0 0 128px;width:128px;background:transparent;border:none;padding:0;cursor:pointer;touch-action:manipulation;display:grid;gap:8px;align-content:start;text-align:left;font:inherit;color:inherit}.card .art{box-shadow:var(--shadow-md)}.card:hover .art{box-shadow:var(--shadow-lg)}.card strong{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-art{width:100%;height:auto;aspect-ratio:1 / 1}.topcard-body{display:flex;gap:14px;align-items:center;cursor:pointer;background:var(--surface-2);border-radius:var(--r-md);padding:12px}.topcard-art{width:88px;height:88px;flex-shrink:0}.kind{display:inline-block;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase}.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{font:inherit;font-size:13px;font-weight:600;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--r-full);padding:8px 16px;cursor:pointer;touch-action:manipulation;white-space:nowrap}.chip:hover{border-color:#cfd3da;box-shadow:var(--shadow-sm)}.chip.on{background:var(--pitch);color:var(--on-pitch);border-color:var(--pitch)}.backbtn{font:inherit;font-size:14px;font-weight:600;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--r-full);padding:9px 18px;cursor:pointer;touch-action:manipulation;box-shadow:var(--shadow-sm);display:inline-flex;align-items:center;gap:6px}.backbtn:hover{border-color:#cfd3da;box-shadow:var(--shadow-md)}.backbtn svg{width:16px;height:16px}.pagehead{display:flex;gap:16px;align-items:center;box-shadow:var(--shadow-sm)}.pagehead-art{width:104px;height:104px;flex-shrink:0}.pagehead .title{font-size:22px;font-weight:800;letter-spacing:-.4px}.tracks{list-style:none;margin:0;padding:0;display:grid;gap:2px}.track{display:flex;align-items:center;gap:12px;padding:9px 12px;background:transparent;border:none;border-radius:var(--r-sm);cursor:pointer;transition:background .15s ease;touch-action:manipulation}.track:hover{background:var(--surface-2)}.track.active{background:color-mix(in srgb,var(--amber) 14%,var(--surface));color:var(--text)}.track.active .sub,.track.active .dur,.track.active .idx{color:var(--muted)}.track.loading{opacity:.55;pointer-events:none}.idx{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;flex-shrink:0;min-width:28px}.art{position:relative;width:48px;height:48px;flex-shrink:0;border-radius:var(--r-sm);background:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--muted);overflow:hidden}.track.active .art{box-shadow:0 0 0 2px color-mix(in srgb,var(--amber) 55%,transparent)}.art img{width:100%;height:100%;object-fit:cover;display:block}.art-fallback{-webkit-user-select:none;user-select:none;display:inline-flex}.art-fallback svg{width:22px;height:22px}.art-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0a0c1073;color:#fff;opacity:0}.art-overlay svg{width:20px;height:20px}.eq{display:none;align-items:flex-end;gap:2.5px;height:16px}.track:hover .art-overlay{opacity:1}.track.playing .art-overlay{opacity:1;background:#0a0c1059}.track.playing .art-overlay .glyph{display:none}.track.playing .art-overlay .eq{display:inline-flex}.eq i{width:3px;border-radius:2px;background:#fff;animation:eqb .9s ease-in-out infinite}.eq i:nth-child(1){height:60%;animation-delay:0s}.eq i:nth-child(2){height:100%;animation-delay:-.3s}.eq i:nth-child(3){height:45%;animation-delay:-.6s}@keyframes eqb{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}@media(prefers-reduced-motion:reduce){.eq i{animation:none}}.meta{flex:1;min-width:0;display:grid;gap:3px}.meta{flex:1;min-width:0;display:grid;gap:2px}.title{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sub{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dur{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;flex-shrink:0}.player{position:fixed;left:50%;transform:translate(-50%);width:min(860px,calc(100% - 24px));bottom:calc(68px + env(safe-area-inset-bottom));z-index:10;background:#14161b;color:#f5f6f8;border:none;border-radius:20px;box-shadow:var(--shadow-lg);padding:12px 16px;display:grid;gap:10px;cursor:pointer}.player-body{display:flex;gap:12px;align-items:center;min-width:0}.player-art{width:52px;height:52px;object-fit:cover;flex-shrink:0;border-radius:50%;background:#ffffff14}.player-art.placeholder{display:flex;align-items:center;justify-content:center;color:var(--on-pitch-muted)}.player-art.placeholder svg{width:24px;height:24px}.player-main{flex:1;min-width:0;display:grid;gap:8px}.player-meta,.player-row,.player .progress{min-width:0}.player-meta{display:grid;gap:1px;min-width:0}.player-meta strong,.player-meta small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-meta strong{font-size:14px;font-weight:600;color:#f5f6f8}.player-meta small{color:#a7adb8;font-size:12px}.progress{position:relative;height:6px;background:#ffffff2e;border:none;border-radius:var(--r-full);cursor:pointer;outline:none;overflow:hidden;touch-action:manipulation}.progress:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--amber) 45%,transparent)}.progress-buf,.progress-fill{position:absolute;top:0;bottom:0;left:0;display:block;border-radius:var(--r-full)}.progress-buf{background:#ffffff47}.progress-fill{background:#f5f6f8;transition:width .2s linear}.player-row{display:flex;align-items:center;gap:8px}.play-btn{font:inherit;font-weight:600;font-size:13px;line-height:1;background:#ffffff1f;color:var(--on-pitch);border:none;border-radius:var(--r-full);padding:0;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;flex-shrink:0;touch-action:manipulation;white-space:nowrap}.play-btn:hover:not(:disabled){background:#fff3}.play-btn:disabled{opacity:.35;cursor:default}.play-btn svg{width:20px;height:20px}.play-btn.main{background:#f5f6f8;color:#14161b;width:52px;height:52px}.play-btn.main:hover:not(:disabled){background:#fff}.play-btn.main svg{width:24px;height:24px}.play-btn.step,.play-btn.like{width:44px;height:44px}.play-btn.like.loved{color:var(--amber-hot)}.play-btn.like.loved svg .fill{fill:currentColor}.time{color:#a7adb8;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;margin-left:auto}.player audio{display:none}body.locked{overflow:hidden}.np{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:var(--bg);border:none;border-radius:0;display:flex;flex-direction:column;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) clamp(18px,6vw,32px) calc(18px + env(safe-area-inset-bottom));transform:translateY(103%);transition:transform .38s cubic-bezier(.32,.72,.28,1);touch-action:none;overflow-y:auto}.np.open{transform:translateY(0)}.np.dragging{transition:none}.np-grip{width:100%;display:flex;justify-content:center;padding:4px 0 2px;cursor:grab;touch-action:none}.np-grip span{width:48px;height:5px;border-radius:var(--r-full);background:#d4d7dd}.np-head{width:100%;max-width:460px;display:flex;justify-content:space-between;align-items:center;color:var(--text);font-size:15px;font-weight:700}.np-close{font:inherit;background:transparent;color:var(--text);border:none;padding:8px;cursor:pointer;touch-action:manipulation;display:inline-flex;border-radius:var(--r-full)}.np-close:hover{background:var(--surface-2)}.np-close svg{width:22px;height:22px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.np-meta{text-align:center;display:grid;gap:4px;max-width:460px}.np-meta small{color:var(--muted);font-size:15px;font-weight:600;letter-spacing:.4px;text-transform:uppercase}.np-times{width:100%;max-width:460px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.np-row{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:4px}.np-play{width:68px;height:68px;font-size:15px;border-radius:var(--r-full);background:var(--pitch);color:var(--on-pitch);box-shadow:var(--shadow-md)}.np-play:hover:not(:disabled){background:#23262d}.np .play-btn.np-side{background:var(--surface);border:1px solid var(--border);color:var(--text);box-shadow:var(--shadow-sm)}.np .play-btn.np-side:hover:not(:disabled){border-color:#cfd3da;box-shadow:var(--shadow-md)}.np .play-btn:disabled{opacity:.3}.np-play svg{width:28px;height:28px}.np-side{width:52px;height:52px}.np-side svg{width:24px;height:24px}.np-hint{margin:auto 0 0;color:var(--muted);font-size:12px}.vdisc{position:relative;width:100%;height:100%;border-radius:50%;background:repeating-radial-gradient(circle at 50% 50%,#0b0c0e 0,#0b0c0e 1px,#1b1d22 1px,#1b1d22 2px,#0b0c0e 2px,#0b0c0e 3px),radial-gradient(circle at 50% 50%,#26282e,#060708 72%);box-shadow:0 24px 60px #0a0a0f73,0 4px 12px #0a0a0f66,inset 0 0 0 1px #ffffff0f;transform:rotate(var(--disc-angle, 0deg)) rotateY(var(--tilt-y, 0deg));transition:transform .3s linear}.vdisc-sheen{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(from 200deg,transparent 0deg,rgba(255,255,255,.1) 20deg,transparent 42deg,transparent 180deg,rgba(255,255,255,.07) 202deg,transparent 224deg);pointer-events:none}.vdisc-label{position:absolute;top:50%;left:50%;width:34%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;overflow:hidden;background:var(--amber);box-shadow:0 0 0 4px #0006,inset 0 0 0 1px #ffffff40;display:flex;align-items:center;justify-content:center;color:#ffffffe6}.vdisc-label img{width:100%;height:100%;object-fit:cover;display:block}.vdisc-label svg{width:40%;height:40%}.vdisc-label .spindle{position:absolute;top:50%;left:50%;width:13%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:var(--bg);box-shadow:inset 0 1px 3px #0009,0 0 0 2px #ffffff2e}.vinyl-wrap{position:relative;width:min(72vw,330px);aspect-ratio:1;touch-action:none;cursor:grab;border-radius:50%;perspective:800px;user-select:none;-webkit-user-select:none}.vinyl-wrap:active{cursor:grabbing}.vinyl-wrap img,.casewrap img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;pointer-events:none}.seek-bubble{position:absolute;bottom:calc(100% + 14px);left:50%;transform:translate(-50%);background:#14161b;color:#fff;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;padding:8px 14px;border-radius:var(--r-full);box-shadow:var(--shadow-md);pointer-events:none;white-space:nowrap;z-index:5}.np-bigtitle{position:relative;width:fit-content;max-width:100%;margin:0 auto;font-size:clamp(30px,9vw,46px);font-weight:800;letter-spacing:-.02em;line-height:1.12;cursor:pointer;touch-action:manipulation;outline:none;overflow:hidden;user-select:none;-webkit-user-select:none}.np-bigtitle-base,.np-bigtitle-fill>span{display:block;white-space:nowrap;text-align:center}.np-bigtitle-fill>span{width:max-content;max-width:none}.np-bigtitle-base{color:#c9ccd4}html[data-theme=dark] .np-bigtitle-base{color:#3a3f48}.np-bigtitle-fill{position:absolute;inset:0 auto 0 0;overflow:hidden;color:var(--text)}.np-bigtitle-fill>span{color:var(--text)}.np-caret{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--text);border-radius:2px;pointer-events:none}.np-bigtitle:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--amber) 45%,transparent);border-radius:8px}.casewrap{position:relative;width:156px;height:132px;flex-shrink:0}.casewrap .disc-slide{position:absolute;top:11px;right:0;width:110px;height:110px;animation:disc-out .9s cubic-bezier(.2,.7,.25,1) both}.casewrap .vdisc{width:100%;height:100%}.casewrap .case{position:absolute;left:0;top:4px;width:120px;height:124px;border-radius:10px;overflow:hidden;background:var(--surface-2);box-shadow:var(--shadow-md);z-index:2;display:flex;align-items:center;justify-content:center;color:var(--muted)}.casewrap .case img{width:100%;height:100%;object-fit:cover;display:block}.casewrap .case svg{width:40px;height:40px}@keyframes disc-out{0%{transform:translate(-48px)}to{transform:translate(0)}}.player-art{border-radius:50%}.player-art.spinning{animation:disc-spin 9s linear infinite}@keyframes disc-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.vdisc{transition:none}.casewrap .disc-slide,.player-art.spinning{animation:none}}.shell{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:10px clamp(14px,4vw,28px) 0;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start;align-content:start}.shell>.content{max-width:none;margin:0;padding:0 0 240px}.shell>*,.content>*{min-width:0}.panel{min-width:0}.rail,.nowpanel{display:none}.spotlight{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 12px;margin:0 -2px}.spot-card{flex:0 0 min(64vw,230px);scroll-snap-align:center;background:transparent;border:none;padding:0;cursor:pointer;touch-action:manipulation;display:grid;gap:10px;align-content:start;text-align:left;font:inherit;color:inherit}.spot-card .art{width:100%;height:auto;aspect-ratio:1 / 1;border-radius:20px;box-shadow:var(--shadow-md);transition:transform .25s ease,box-shadow .25s ease}.spot-card:hover .art{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.spot-card strong{font-size:15px;font-weight:700;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spot-card small{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quickgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.qtile{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-sm);cursor:pointer;touch-action:manipulation;overflow:hidden;min-width:0;padding:6px}.qtile:hover{box-shadow:var(--shadow-md)}.qtile-art{width:52px;height:52px;flex-shrink:0;border-radius:12px}.qtile strong{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:8px;min-width:0;flex:1}.minibtn{font:inherit;background:transparent;color:var(--muted);border:none;padding:8px;cursor:pointer;touch-action:manipulation;white-space:nowrap;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-full)}.minibtn:hover{color:var(--text);background:var(--surface-2)}.minibtn svg{width:20px;height:20px}.minibtn.loved{color:var(--amber)}.minibtn.loved svg .fill{fill:currentColor}.track.active .minibtn{color:var(--muted)}.bottomnav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -8px 24px #10182814;padding-bottom:env(safe-area-inset-bottom)}.bottomnav button{flex:1;font:inherit;background:transparent;color:var(--muted);border:none;min-height:60px;cursor:pointer;touch-action:manipulation;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600}.bottomnav button svg{width:23px;height:23px}.bottomnav button.on{color:var(--text)}.bottomnav button.on .dot{width:4px;height:4px;border-radius:var(--r-full);background:var(--amber)}@media(min-width:900px){.bottomnav{display:none}.shell{grid-template-columns:232px minmax(0,1fr)}.shell>.content{padding-bottom:170px}.rail{display:grid;gap:16px;align-content:start;position:sticky;top:88px;padding-bottom:170px}.rail .panel{padding:12px}.rail-nav{display:grid;gap:4px}.rail-nav button{font:inherit;font-size:14px;font-weight:600;background:transparent;color:var(--muted);border:none;border-radius:12px;padding:10px 12px;cursor:pointer;touch-action:manipulation;text-align:left;display:flex;align-items:center;gap:12px}.rail-nav button svg{width:21px;height:21px}.rail-nav button:hover,.rail-nav button.on{background:var(--surface-2);color:var(--text)}.rail-saved{display:grid;gap:4px}.rail-row{display:flex;align-items:center;gap:10px;background:transparent;border:none;border-radius:12px;padding:6px;cursor:pointer;touch-action:manipulation;font:inherit;color:var(--text);text-align:left;min-width:0}.rail-row:hover{background:var(--surface-2)}.rail-art{width:40px;height:40px}.rail-art svg{width:20px;height:20px}.rail-nav button svg{width:21px;height:21px;flex-shrink:0}.rail-row-meta{flex:1;min-width:0;display:grid;gap:2px}.rail-row-meta strong{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rail-row-meta small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.6px}.rail-hint{margin:0;color:var(--muted);font-size:12px}.quickgrid{grid-template-columns:repeat(4,minmax(0,1fr))}.player{width:min(1280px,calc(100% - 24px));bottom:calc(12px + env(safe-area-inset-bottom))}}@media(min-width:1200px){.shell{grid-template-columns:232px minmax(0,1fr) 300px}.nowpanel{display:grid;gap:16px;align-content:start;position:sticky;top:88px;min-width:0;padding-bottom:170px}.nowpanel .panel{padding:16px}.nowpanel-now{display:grid;gap:10px}.nowpanel-art{width:100%;height:auto;aspect-ratio:1 / 1}.nowpanel-idle{margin:0;color:var(--muted);font-size:13px}}@media(max-width:560px){.brand{font-size:22px}.player-row{gap:4px}.player .progress{height:10px}.player-row .time{font-size:11px}.dur{display:none}.topbar{padding:10px 14px}.search{order:3;flex-basis:100%}.content{padding:8px 14px 190px}.track{padding:10px 8px}.search-row button,.play-btn{min-height:44px}.progress{min-height:22px}.player{touch-action:none}}