@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#f6f6f6;font-synthesis:none;text-rendering:optimizelegibility;font-optical-sizing:auto;--bg:#080808;--panel:#141414;--panel2:#1c1c1c;--muted:#888;--line:#252525;--white:#fafafa;--accent:#c7c7c7;background:#080808;font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400}*{box-sizing:border-box}html,body,#root{background:var(--bg);min-height:100%;margin:0}body{overscroll-behavior-y:none;min-width:320px}button,input{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0}.app-shell{min-height:100dvh;padding-bottom:calc(88px + env(safe-area-inset-bottom));background:radial-gradient(at 70% -20%,#202020 0%,#0000 36%),#080808;max-width:760px;margin:0 auto;position:relative;overflow:hidden}.topbar{z-index:5;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#080808d4;justify-content:space-between;align-items:center;height:65px;padding:0 22px;display:flex;position:sticky;top:0}.brand-lockup{letter-spacing:.16em;align-items:center;gap:10px;font-size:15px;font-weight:800;display:flex}.brand-mark{color:#fff;border:1px solid #555;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}.profile-chip{background:0 0;padding:0}.avatar{background:#292929;border:1px solid #454545;border-radius:50%;place-items:center;width:33px;height:33px;font-size:12px;font-weight:800;display:grid}.page-content{padding:20px 22px 50px}.eyebrow{color:#858585;letter-spacing:.2em;align-items:center;gap:8px;font-size:9px;font-weight:800;display:flex}.live-dot{background:#dedede;border-radius:50%;width:6px;height:6px;box-shadow:0 0 12px #ddd}.hero-heading{letter-spacing:-.075em;margin:15px 0 27px;font-size:clamp(48px,14vw,76px);font-weight:800;line-height:.98}.hero-heading span{color:#787878}.hero-card{background:linear-gradient(125deg,#1e1e1e,#101010 62%,#282828);border:1px solid #292929;border-radius:24px;justify-content:space-between;height:218px;padding:23px;display:flex;position:relative;overflow:hidden}.hero-glow{filter:blur(10px);background:radial-gradient(circle,#5553 0%,#0000 68%);border-radius:50%;width:220px;height:220px;position:absolute;top:-60px;right:-45px}.hero-copy{z-index:1;position:relative}.hero-copy h2{letter-spacing:-.055em;margin:12px 0 17px;font-size:28px;line-height:1.12}.round-arrow{background:#ffffff0c;border:1px solid #555;border-radius:50%;place-items:center;width:39px;height:39px;display:grid}.hero-disc{background:repeating-radial-gradient(circle,#171717 0 2px,#242424 3px 4px,#111 5px 7px);border-radius:50%;place-items:center;width:156px;height:156px;display:grid;position:absolute;top:31px;right:14px;transform:rotate(-18deg);box-shadow:0 14px 35px #0009}.disc-center{color:#151515;background:#dedede;border:7px solid #1b1b1b;border-radius:50%;place-items:center;width:56px;height:56px;display:grid}.section{margin-top:38px}.section-bottom{margin-bottom:15px}.section-heading{justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px;display:flex}.section-heading h2{letter-spacing:-.045em;margin:6px 0 0;font-size:19px;font-weight:800}.text-link{color:#aaa;background:0 0;align-items:center;gap:2px;padding:6px 0;font-size:12px;display:flex}.rotate{transform:rotate(180deg)}.track-list{flex-direction:column;display:flex}.track-row{border-bottom:1px solid #ffffff0a;align-items:center;gap:12px;min-height:66px;padding:8px 0;display:flex}.track-row.is-active .track-title{color:#fff}.cover-button{background:0 0;flex:none;padding:0}.cover{color:#e4e4e4;background:#292929;border:1px solid #ffffff12;place-items:center;display:grid;position:relative;overflow:hidden}.cover.small{border-radius:11px;width:48px;height:48px}.cover.tiny{border-radius:10px;width:42px;height:42px}.cover.large{border-radius:20px;width:min(76vw,340px);height:min(76vw,340px)}.cover-a{background:linear-gradient(145deg,#9a7e5d,#dfbd84 45%,#55493b)}.cover-b{background:linear-gradient(140deg,#242424,#8e8e8e 55%,#1a1a1a)}.cover-c{background:linear-gradient(130deg,#34312d,#8c6c56,#171717)}.cover-d{background:linear-gradient(145deg,#181818,#686868,#252525)}.cover-e{background:linear-gradient(145deg,#594c4c,#a58b7c,#242424)}.cover-grain{opacity:.23;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");position:absolute;inset:0}.cover svg{z-index:1;opacity:.85;position:relative}.track-meta{text-align:left;background:0 0;flex-direction:column;flex:1;align-items:flex-start;gap:4px;min-width:0;display:flex}.track-title{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:13px;font-weight:800;overflow:hidden}.track-artist{color:#8c8c8c;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:11px;overflow:hidden}.icon-btn{color:#dadada;background:0 0;flex:none;place-items:center;width:38px;height:38px;display:grid}.icon-btn.subtle{color:#777;width:30px}.icon-btn.liked,.heart-large.liked{color:#f4f4f4}.playing-mark{color:#eee;flex:none}.quick-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.quick-card{text-align:left;background:#151515;border:1px solid #242424;border-radius:17px;flex-direction:column;align-items:flex-start;gap:7px;min-height:112px;padding:16px;display:flex}.quick-card svg{color:#bbb;margin-bottom:5px}.quick-card b{font-size:13px}.quick-card span{color:#777;font-size:10px}.page-title{margin:20px 0 25px}.page-title h1{letter-spacing:-.07em;margin:6px 0 0;font-size:44px;font-weight:800}.search-box{color:#888;background:#171717;border:1px solid #2d2d2d;border-radius:15px;align-items:center;gap:11px;height:54px;padding:0 15px;display:flex}.search-box input{color:#fff;background:0 0;border:0;outline:none;flex:1;min-width:0;font-size:13px}.search-box input::placeholder{color:#777}.search-box button{color:#777;background:0 0;padding:5px}.search-online-button{justify-content:center;align-items:center;gap:8px;margin-top:10px;display:flex}.search-online-button:disabled{opacity:.6;cursor:wait}.search-result-heading{align-items:center;margin-top:26px}.search-result-heading h2{margin:0}.search-result-heading span,.section-heading>span{color:#777;font-size:11px}.collection-tabs{scrollbar-width:none;gap:7px;margin:0 -22px 27px;padding:0 22px;display:flex;overflow:auto}.collection-tabs::-webkit-scrollbar{display:none}.collection-tabs button{white-space:nowrap;color:#858585;background:#151515;border:1px solid #252525;border-radius:20px;padding:10px 15px;font-size:11px}.collection-tabs button.selected{color:#0a0a0a;background:#ededed;border-color:#ededed;font-weight:800}.create-row{justify-content:space-between;align-items:center;margin-bottom:15px;font-size:13px;font-weight:700;display:flex}.create-button{color:#111;background:#eee;border-radius:20px;align-items:center;gap:5px;padding:9px 13px;font-size:11px;font-weight:800;display:flex}.playlist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.playlist-card{text-align:left;background:#141414;border:1px solid #252525;border-radius:16px;flex-direction:column;gap:7px;padding:12px;display:flex}.playlist-art{color:#a9a9a9;background:linear-gradient(135deg,#272727,#0c0c0c);border-radius:11px;place-items:center;height:110px;margin-bottom:3px;display:grid}.playlist-card b{font-size:12px}.playlist-card span{color:#777;font-size:10px}.empty-state{text-align:center;color:#777;border:1px dashed #333;border-radius:17px;flex-direction:column;justify-content:center;align-items:center;gap:9px;min-height:170px;padding:22px;display:flex}.empty-state b{color:#ccc;font-size:13px}.empty-state span{max-width:230px;font-size:11px;line-height:1.5}.loading{color:#888;justify-content:center;align-items:center;gap:10px;padding:45px 0;font-size:12px;display:flex}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.bottom-nav{z-index:9;width:min(100%,760px);padding:10px 22px calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#090909e6;border-top:1px solid #ffffff0d;grid-template-columns:repeat(3,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.bottom-nav button{color:#666;background:0 0;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:4px;display:flex}.bottom-nav svg{stroke-width:1.8px;width:22px;height:22px}.bottom-nav span{font-size:10px;font-weight:700}.bottom-nav button.active{color:#f4f4f4}.mini-player{z-index:8;bottom:calc(75px + env(safe-area-inset-bottom));text-align:left;background:#232323f7;border:1px solid #454545;border-radius:15px;align-items:center;gap:10px;width:calc(min(100%,760px) - 24px);height:63px;padding:8px 12px;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 10px 40px #0009}.mini-meta{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.mini-meta b{white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.mini-meta small{color:#999;white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.mini-play,.mini-next{background:0 0;place-items:center;width:30px;height:36px;display:grid}.player-screen{z-index:20;padding:calc(16px + env(safe-area-inset-top)) 26px calc(22px + env(safe-area-inset-bottom));background:radial-gradient(at 50% 20%,#292929 0%,#101010 38%,#080808 72%);flex-direction:column;max-width:760px;margin:auto;display:flex;position:fixed;inset:0;overflow:auto}.player-top{color:#777;letter-spacing:.2em;justify-content:space-between;align-items:center;font-size:9px;font-weight:800;display:flex}.player-art-wrap{flex:1;justify-content:center;align-items:center;min-height:240px;padding:25px 0;display:flex}.player-art{box-shadow:0 25px 80px #0009}.player-info{justify-content:space-between;align-items:center;gap:14px;margin-bottom:23px;display:flex}.player-title{letter-spacing:-.05em;font-size:23px;font-weight:800;line-height:1.15}.player-artist{color:#8e8e8e;margin-top:7px;font-size:13px}.heart-large{width:48px;height:48px}.seek-block input{accent-color:#f4f4f4;width:100%;height:3px;display:block}.seek-times{color:#777;justify-content:space-between;margin-top:8px;font-size:10px;display:flex}.player-controls{justify-content:space-evenly;align-items:center;margin:26px 0;display:flex}.play-big{color:#090909;background:#f4f4f4;border-radius:50%;place-items:center;width:76px;height:76px;display:grid}.player-extras{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:auto;display:grid}.pill-control{color:#aaa;background:#1b1b1b;border:1px solid #292929;border-radius:13px;justify-content:center;align-items:center;gap:7px;min-height:54px;font-size:10px;display:flex}.sheet-backdrop{z-index:30;background:#0009;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.bottom-sheet,.dialog{width:min(100%,760px);padding:12px 20px calc(24px + env(safe-area-inset-bottom));background:#171717;border:1px solid #333;border-bottom:0;border-radius:24px 24px 0 0;max-height:80dvh;overflow:auto}.sheet-handle{background:#555;border-radius:4px;width:38px;height:4px;margin:0 auto 15px}.sheet-heading{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.sheet-heading b{font-size:16px}.short-sheet{max-height:55dvh}.sheet-option{text-align:left;background:0 0;border-bottom:1px solid #2b2b2b;align-items:center;gap:12px;width:100%;height:53px;display:flex}.sheet-option span{flex:1;font-size:13px}.dialog{border-bottom:1px solid #333;border-radius:22px;width:calc(100% - 34px);max-width:430px;max-height:none;margin:auto;padding:18px}.dialog-input{color:#fff;background:#0c0c0c;border:1px solid #383838;border-radius:12px;outline:none;width:100%;height:48px;margin:8px 0 14px;padding:0 13px}.primary-button{color:#090909;background:#eee;border-radius:13px;width:100%;height:47px;font-size:13px;font-weight:800}.muted{color:#888;font-size:12px}.toast{z-index:50;bottom:calc(95px + env(safe-area-inset-bottom));color:#111;white-space:nowrap;background:#eee;border-radius:30px;align-items:center;gap:8px;padding:11px 16px;font-size:11px;font-weight:800;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #0008}.error-box,.global-error{color:#f2bcbc;background:#321f1f;border:1px solid #613d3d;border-radius:12px;margin:15px 0;padding:12px;font-size:11px}.global-error{margin:0 22px 15px}.app-shell:has(.player-screen){padding:0}.player-screen .cover{flex:none}@media (width>=600px){.page-content,.topbar{padding-left:34px;padding-right:34px}.hero-card{height:250px}.hero-disc{width:185px;height:185px;top:32px;right:35px}.track-row{min-height:72px}.cover.small{width:52px;height:52px}.player-screen{padding-left:50px;padding-right:50px}.player-art-wrap{min-height:300px}}.pill-control.active{color:#111;background:#eee;border-color:#eee}
