:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f6f7fa;background:#080a12;line-height:1.45;--accent:#c9ff68;--glass-opacity:.72;--glass-blur:18px;--surface:rgba(18,21,35,var(--glass-opacity));--border:rgba(255,255,255,.14);--muted:#a9aec0}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 8% 0,#48567b55,transparent 26rem),radial-gradient(circle at 90% 15%,#657a3440,transparent 28rem),#080a12}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.6;cursor:wait}.app{min-height:100vh;padding:18px 18px 126px 274px}.glass,aside,.tracks,.hero{background:var(--surface);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--border);box-shadow:0 18px 50px #0003}aside{position:fixed;z-index:3;inset:18px auto 18px 18px;width:236px;border-radius:25px;padding:19px;display:flex;flex-direction:column}.brand{font-weight:900;letter-spacing:.12em;display:flex;gap:9px;align-items:center}.brand svg,.hero span,.lit{color:var(--accent)!important}nav{display:grid;gap:4px;margin-top:35px}nav button,.side-footer button{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;text-align:left;color:var(--muted)}nav button:hover,nav button.active,.playlist-list button.active{background:#ffffff18;color:#fff}.side-footer{margin-top:auto}.side-footer small{display:block;padding:14px 12px 0;color:var(--muted);font-size:11px}main{max-width:1240px;margin:auto}header{display:flex;justify-content:space-between;align-items:end;margin:18px 0 30px}.eyebrow,.hero span{font-size:11px;font-weight:800;letter-spacing:.15em;margin:0}h1{font-size:42px;line-height:1;margin:5px 0}h2{margin:0}.outline,.primary{border:1px solid var(--border);background:#ffffff12;padding:10px 14px;border-radius:12px;font-weight:700;display:inline-flex;gap:8px;align-items:center;justify-content:center}.primary{background:var(--accent);color:#11170a;border-color:transparent}.outline:hover,.primary:hover,.music-card:hover{transform:translateY(-1px)}.notice{margin:-15px 0 20px;padding:12px 14px;background:#583329bb;border:1px solid #f6aa8980;border-radius:13px;display:flex;justify-content:space-between;gap:10px}.notice svg{width:17px}.hero{border-radius:25px;min-height:240px;padding:38px;display:flex;justify-content:space-between;align-items:center;overflow:hidden}.hero h2{font-size:32px;max-width:570px;margin:9px 0}.hero p{max-width:600px;color:var(--muted);margin:0 0 20px}.hero-disc{width:160px;height:160px;color:var(--accent);opacity:.75}.shelf{margin-top:32px}.shelf h2{font-size:20px;margin-bottom:13px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px}.music-card{position:relative;min-height:190px;padding:12px;border:1px solid var(--border);border-radius:18px;background:#ffffff0c;transition:transform .18s ease}.card-play{width:100%;height:105px;border-radius:12px;background:linear-gradient(135deg,#8b9e51,#253650);color:#fff;display:grid;place-items:center}.card-play svg:first-child{width:55px;height:55px;opacity:.65}.card-play svg:last-child{position:absolute;width:23px;opacity:0}.card-play:hover svg:last-child{opacity:1}.music-card b,.music-card small{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.music-card b{margin-top:10px}.music-card small,.muted{color:var(--muted);font-size:12px}.music-card .heart{position:absolute;right:7px;bottom:4px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:28px 0 12px;color:var(--muted);font-size:13px}.toolbar label{display:flex;align-items:center;gap:10px;max-width:600px;width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:13px;background:#ffffff0c}.toolbar input{width:100%;border:0;outline:0;background:transparent;color:inherit}.tracks{border-radius:18px;overflow:hidden}.track{min-height:65px;padding:9px 13px;display:grid;grid-template-columns:36px minmax(0,1fr) 60px auto 36px 36px;align-items:center;gap:8px;border-bottom:1px solid #ffffff12}.track:last-child{border:0}.track:hover,.track.current{background:#ffffff10}.number{color:var(--muted);text-align:center;font-size:13px}.track-info{text-align:left;min-width:0}.track b,.track small,.now b,.now small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track small,.now small{font-size:12px;color:var(--muted);margin-top:3px}.format{font-size:11px;color:var(--muted)}.track select{max-width:120px;background:#ffffff12;color:inherit;border:1px solid var(--border);border-radius:8px;padding:5px}.track select option{color:#111}.heart,.play-track,.icon-button{padding:7px;color:var(--muted)}.heart svg,.play-track svg,.icon-button svg{width:18px}.load{display:block;margin:15px auto}.empty{min-height:320px;display:grid;place-content:center;text-align:center;justify-items:center}.empty svg{width:52px;height:52px;color:var(--accent)}.empty h2{margin:15px 0 5px}.empty p{color:var(--muted);max-width:400px}.empty-list{padding:35px;text-align:center;color:var(--muted)}.player{position:fixed;z-index:5;bottom:16px;left:292px;right:18px;min-height:82px;border-radius:18px;padding:10px 16px;display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:center}.now{display:flex;align-items:center;gap:10px;min-width:0}.cover{width:49px;height:49px;display:grid;place-items:center;flex:none;border-radius:10px;background:linear-gradient(135deg,#748d44,#273c58);color:#fff}.now span{min-width:0}.controls{text-align:center}.controls>div{display:flex;justify-content:center;align-items:center;gap:15px}.round{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#11170a}.seek{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);margin-top:5px}.seek input{width:100%}input[type=range]{accent-color:var(--accent)}.player-actions{justify-self:end;display:flex;align-items:center;gap:10px}.player-actions>label{display:flex;align-items:center;gap:7px}.player-actions input{width:95px}.playlist-layout{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(0,1.45fr);gap:16px}.panel{border-radius:20px;padding:20px}.panel h2{font-size:20px;margin-bottom:14px}.panel form{display:grid;gap:8px}.panel input,.panel select{background:#ffffff10;color:inherit;border:1px solid var(--border);border-radius:10px;padding:10px}.playlist-list{display:grid;gap:5px;margin-top:16px}.playlist-list button{display:flex;text-align:left;align-items:center;gap:10px;padding:10px;border-radius:11px}.playlist-list span{display:grid;min-width:0}.playlist-list small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.section-title{display:flex;justify-content:space-between;gap:10px}.danger{color:#ffaaa4}.playlist-tracks>div{display:grid;grid-template-columns:25px 1fr 30px;gap:7px;align-items:center;padding:9px 0;border-bottom:1px solid #ffffff12}.playlist-tracks>div>button:not(.icon-button){text-align:left}.playlist-tracks small{display:block;color:var(--muted)}.settings{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:16px}.settings .panel{display:grid;align-content:start;gap:14px}.settings label:not(.range):not(.toggle){display:grid;gap:5px}.range{display:grid;gap:5px}.range span,.toggle{display:flex;justify-content:space-between;gap:8px}.toggle input{width:18px;height:18px;accent-color:var(--accent)}.modal{position:fixed;z-index:10;inset:0;background:#0009;display:grid;place-items:center;padding:15px}.modal section{position:relative;width:min(420px,100%);padding:26px;border-radius:22px;display:grid;gap:12px}.modal label{display:grid;gap:5px}.modal input{padding:11px;background:#ffffff10;color:inherit;border:1px solid var(--border);border-radius:10px}.close{position:absolute;right:13px;top:13px}.text-button{color:var(--muted);text-decoration:underline}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}:root[data-theme=light]{color:#1a2030;background:#e7edf7;--surface:rgba(255,255,255,var(--glass-opacity));--border:rgba(27,38,60,.15);--muted:#5e687a}html[data-theme=light] body{background:radial-gradient(circle at 5% 0,#b3c9ef,transparent 28rem),#e7edf7}html[data-compact=true] .track{min-height:50px}html[data-motion=false] *,@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media(max-width:780px){.app{padding:12px 12px 160px}aside{inset:auto 0 0;width:100%;height:64px;border-radius:0;padding:5px;flex-direction:row;overflow:auto}.brand,.side-footer{display:none}nav{margin:0;display:flex;gap:2px}nav button{font-size:0;width:57px;justify-content:center;padding:10px}nav button svg{width:21px}.player{left:10px;right:10px;bottom:77px;grid-template-columns:1fr auto;padding:9px 12px}.controls{order:2}.controls>div{gap:7px}.controls>div>button:first-child,.controls>div>button:last-child,.seek,.player-actions>label{display:none}.hero{padding:25px;min-height:195px}.hero h2{font-size:25px}.hero-disc{width:90px}.toolbar{flex-wrap:wrap}.track{grid-template-columns:28px minmax(0,1fr) auto 32px 32px}.track .format,.track select{display:none}.playlist-layout{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}header{margin:12px 0 24px}h1{font-size:33px}}.now-playing{position:fixed;z-index:20;inset:0;padding:clamp(24px,7vw,90px);display:grid;grid-template-columns:minmax(260px,540px) minmax(280px,1fr);gap:clamp(28px,7vw,100px);align-items:center;background:radial-gradient(circle at 25% 25%,#718a5160,transparent 35%),linear-gradient(135deg,#101b2ad9,#07100ddd);backdrop-filter:blur(20px)}.now-art{aspect-ratio:1;border:1px solid var(--border);border-radius:32px;background:linear-gradient(135deg,#92a96c,#25445b);box-shadow:0 30px 90px #0008;display:grid;place-items:center}.now-art svg{width:45%;height:45%;opacity:.75}.now-details{max-width:600px}.now-details h1{font-size:clamp(34px,6vw,68px);margin:8px 0}.ratio-reason{color:var(--accent);font-size:13px}.fullscreen-seek{display:grid;grid-template-columns:38px 1fr 38px;gap:8px;align-items:center;margin:30px 0 18px;font-size:11px;color:var(--muted)}.fullscreen-controls{display:flex;align-items:center;justify-content:space-between;max-width:430px}.round.large{width:58px;height:58px}.fullscreen-actions{display:flex;gap:22px;align-items:center;margin-top:25px}.fullscreen-actions button,.fullscreen-actions label{display:flex;align-items:center;gap:8px}.fullscreen-actions input{accent-color:var(--accent)}@media(max-width:780px){.now-playing{overflow:auto;grid-template-columns:1fr;gap:28px;padding:64px 26px 36px}.now-art{max-width:480px;width:100%;margin:auto}.now-details h1{font-size:36px}.fullscreen-actions{justify-content:space-between}}