@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&family=Noto+Serif+SC:wght@500;600&display=swap";:root{--paper:#fbf7ef;--ink:#181715;--ink-soft:#47443f;--muted:#858078;--line:#ded8cd;--orange:#e85f34;--orange-pale:#f9dfd4;--font-display:"Manrope", "PingFang SC", sans-serif;--font-body:"DM Sans", "PingFang SC", sans-serif;--font-serif:"Noto Serif SC", serif;color:var(--ink);background:var(--paper);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:linear-gradient(#3a312706 1px, transparent 1px), linear-gradient(90deg, #3a312706 1px, transparent 1px), var(--paper);background-size:32px 32px;min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit;text-decoration:none}::selection{color:#fff;background:var(--orange)}:focus-visible{outline:2px solid var(--orange);outline-offset:3px}.app-shell{min-height:100vh;padding-bottom:104px;overflow:hidden}.site-header{z-index:20;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;max-width:1280px;height:74px;margin:0 auto;padding:0 32px;display:grid;position:relative}.brand{width:fit-content;color:var(--ink);font:800 .94rem/1 var(--font-display);letter-spacing:.14em;align-items:center;gap:11px;display:inline-flex}.brand-mark{width:36px;height:36px;color:var(--paper);background:var(--ink);border-radius:50%;place-items:center;display:grid}.site-header nav{gap:32px;font-size:.82rem;font-weight:650;display:flex}.site-header nav a{color:var(--ink-soft);transition:color .16s}.site-header nav a:hover{color:var(--orange)}.header-search{border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff94;border-radius:100px;justify-self:end;align-items:center;gap:9px;width:min(280px,100%);padding:9px 13px;display:flex}.header-search input{min-width:0;color:var(--ink);font:inherit;background:0 0;border:0;outline:0;flex:1;font-size:.78rem}.header-search button,.mobile-menu{color:var(--muted);background:0 0;border:0;place-items:center;padding:0;display:grid}.mobile-menu{display:none}.hero-section{isolation:isolate;grid-template-columns:.92fr 1.08fr;align-items:center;gap:68px;max-width:1280px;min-height:560px;margin:0 auto;padding:64px 76px 84px;display:grid;position:relative}.hero-orb{z-index:-1;filter:blur(1px);pointer-events:none;border-radius:50%;position:absolute}.hero-orb-one{opacity:.95;background:radial-gradient(circle at 35% 40%,#ffb086 0,#ef5c30 38%,#dc3f20 72%);width:480px;height:480px;top:-120px;right:-110px}.hero-orb-two{opacity:.72;background:#d8e8c5;width:260px;height:260px;bottom:-30px;left:-110px}.eyebrow{color:var(--orange);letter-spacing:.17em;align-items:center;gap:8px;margin-bottom:24px;font-size:.72rem;font-weight:800;display:inline-flex}.hero-copy h1{max-width:640px;color:var(--ink);font:750 clamp(3.4rem, 6.3vw, 6.4rem)/.92 var(--font-display);letter-spacing:-.065em;margin:0}.hero-copy h1 em{color:var(--orange);font-family:var(--font-serif);font-weight:500}.hero-copy>p{max-width:490px;color:var(--muted);margin:30px 0;font-size:.98rem;line-height:1.85}.primary-action{color:#fff;background:var(--ink);width:fit-content;min-height:44px;font:700 .8rem/1 var(--font-body);border:0;border-radius:100px;justify-content:center;align-items:center;gap:10px;padding:0 20px;transition:transform .18s,background .18s;display:inline-flex;box-shadow:0 12px 28px #17161324}.primary-action:hover{background:var(--orange);transform:translateY(-2px)}.hero-visual{place-items:center;height:450px;display:grid;position:relative}.hero-visual>img,.hero-placeholder{aspect-ratio:1;object-fit:cover;border-radius:42% 58% 58% 42%/46% 38% 62% 54%;width:min(380px,86%);transform:rotate(3deg);box-shadow:0 36px 80px #30150a42}.hero-placeholder{color:#ffffffbf;background:linear-gradient(145deg,#572117,#ea6a3e);place-items:center;display:grid}.hero-record{color:#fff;background:repeating-radial-gradient(circle,#1d1b1a 0 3px,#2d2927 4px 6px);border:3px solid #ffffff40;border-radius:50%;place-items:center;width:110px;height:110px;animation:14s linear infinite slow-spin;display:grid;position:absolute;top:8%;right:4%;box-shadow:0 20px 40px #140e0b4d}.now-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffbf4d1;border:1px solid #ffffff9e;border-radius:18px;flex-direction:column;width:210px;padding:18px 20px;display:flex;position:absolute;bottom:7%;left:1%;box-shadow:0 18px 45px #32190f29}.now-card span{color:var(--orange);letter-spacing:.15em;text-transform:uppercase;margin-bottom:9px;font-size:.62rem;font-weight:800}.now-card strong,.now-card small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.now-card strong{color:var(--ink);font-family:var(--font-display)}.now-card small{color:var(--muted);margin-top:5px}@keyframes slow-spin{to{transform:rotate(360deg)}}.genre-section,.discover-section,.about-section{max-width:1180px;margin-inline:auto}.genre-section{padding:20px 26px 42px}.section-label{color:var(--muted);font:650 .72rem/1 var(--font-body);letter-spacing:.1em;margin-bottom:18px}.genre-pills{scrollbar-width:none;gap:9px;padding-bottom:4px;display:flex;overflow-x:auto}.genre-pills::-webkit-scrollbar{display:none}.genre-pills button{border:1px solid var(--line);color:var(--ink-soft);font:650 .75rem/1 var(--font-body);background:0 0;border-radius:100px;flex:none;padding:9px 17px;transition:all .16s}.genre-pills button:hover,.genre-pills button.active{color:#fff;border-color:var(--orange);background:var(--orange)}.discover-section{min-height:600px;padding:64px 26px 100px}.section-heading{justify-content:space-between;align-items:end;gap:24px;margin-bottom:34px;display:flex}.section-kicker{color:var(--orange);letter-spacing:.17em;font-size:.66rem;font-weight:850}.section-heading h2,.about-section h2{color:var(--ink);font:720 clamp(2rem, 4vw, 3.4rem)/1 var(--font-display);letter-spacing:-.045em;margin:8px 0 0}.track-count{color:var(--muted);align-items:center;gap:7px;font-size:.78rem;display:flex}.music-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 22px;display:grid}.music-card{min-width:0;transition:transform .18s}.music-card:hover{transform:translateY(-4px)}.cover-wrap{aspect-ratio:1;background:#e6e1d7;border-radius:14px;position:relative;overflow:hidden;box-shadow:0 10px 28px #211b1617}.cover-wrap>img,.cover-fallback{object-fit:cover;width:100%;height:100%;transition:transform .4s}.music-card:hover .cover-wrap>img{transform:scale(1.035)}.cover-fallback{color:#ffffffd9;background:radial-gradient(circle at 75% 20%,#ffb67c 0 8%,#0000 9%),linear-gradient(145deg,#782f21,#e5683d);place-items:center;display:grid}.cover-fallback span{font:500 4rem/1 var(--font-serif)}.cover-play{width:48px;height:48px;color:var(--ink);opacity:0;background:#fffbf4eb;border:0;border-radius:50%;place-items:center;transition:all .18s;display:grid;position:absolute;bottom:14px;right:14px;transform:translateY(8px);box-shadow:0 10px 24px #140f0c33}.music-card:hover .cover-play,.music-card.is-active .cover-play{opacity:1;transform:translateY(0)}.music-card.is-active .cover-wrap{outline:3px solid var(--orange);outline-offset:3px}.duration-badge{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-variant-numeric:tabular-nums;background:#0e0d0ca8;border-radius:6px;padding:4px 7px;font-size:.64rem;position:absolute;top:12px;right:12px}.card-copy{padding:14px 3px 0}.title-row{justify-content:space-between;align-items:start;gap:8px;display:flex}.title-row>div:first-child{min-width:0}.title-row h3{color:var(--ink);font:710 .9rem/1.25 var(--font-display);text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.title-row p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:5px 0 0;font-size:.74rem;overflow:hidden}.card-actions{flex:none;gap:2px;display:flex}.card-actions button{width:26px;height:26px;color:var(--muted);background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.card-actions button:hover{color:var(--orange);background:var(--orange-pale)}.card-meta{min-height:24px;color:var(--muted);align-items:center;gap:9px;margin-top:11px;font-size:.66rem;display:flex}.card-meta>span,.card-meta a{align-items:center;gap:4px;display:inline-flex}.card-meta a{color:var(--muted);margin-left:auto}.card-meta a:hover{color:var(--orange)}.genre-tag{color:#6b5f4d;text-overflow:ellipsis;white-space:nowrap;background:#ebe5d9;border-radius:100px;max-width:90px;padding:3px 8px;overflow:hidden}.load-more{min-width:170px;color:var(--ink);border:1px solid var(--ink);font:700 .76rem/1 var(--font-body);background:0 0;border-radius:100px;margin:50px auto 0;padding:13px 22px;display:block}.load-more:hover{color:#fff;background:var(--ink)}.state-panel{min-height:280px;color:var(--muted);border:1px dashed var(--line);border-radius:18px;flex-direction:column;justify-content:center;align-items:center;display:flex}.state-panel h3{color:var(--ink);margin:14px 0 5px}.state-panel p{margin:0}.error-panel button{color:#fff;background:var(--orange);border:0;border-radius:100px;margin-top:16px;padding:9px 16px}.music-skeleton div{aspect-ratio:1;background:linear-gradient(90deg,#e9e5dd 25%,#f5f2eb 50%,#e9e5dd 75%) 0 0/200% 100%;border-radius:14px;animation:1.4s infinite shimmer}.music-skeleton span{background:#e6e1d8;border-radius:5px;width:76%;height:10px;margin-top:13px;display:block}.music-skeleton span:last-child{width:48%;margin-top:8px}@keyframes shimmer{to{background-position:-200% 0}}.about-section{color:#fff;background:radial-gradient(circle at 85% 20%,#ed66398c,#0000 28%),#191817;border-radius:26px;grid-template-columns:1fr .9fr;align-items:end;gap:80px;margin-bottom:80px;padding:68px 72px;display:grid}.about-section h2{color:#fff}.about-section>p{color:#bcb8b0;margin:0;font-size:.9rem;line-height:1.9}footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;max-width:1180px;margin:0 auto;padding:32px 26px 56px;display:flex}footer p{color:var(--muted);font-size:.7rem}.player-shell{z-index:50;color:#fff;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#181715f5;border:1px solid #ffffff1a;border-radius:19px;grid-template-columns:minmax(200px,1fr) minmax(320px,1.3fr) minmax(160px,1fr);align-items:center;gap:24px;height:84px;padding:0 32px;display:grid;position:fixed;bottom:16px;left:20px;right:20px;box-shadow:0 20px 60px #120e0c47}.player-empty{color:#9d9992;justify-content:center;font-size:.78rem;display:flex}.player-track{align-items:center;gap:12px;min-width:0;display:flex}.player-track img{object-fit:cover;background:#383532;border-radius:10px;flex:none;width:52px;height:52px}.player-track div{flex-direction:column;min-width:0;display:flex}.player-track strong,.player-track span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.player-track strong{font:650 .78rem/1.4 var(--font-display)}.player-track span{color:#9f9b95;font-size:.66rem}.player-center{min-width:0}.player-controls{justify-content:center;gap:10px;display:flex}.player-controls button{color:#d5d1ca;background:0 0;border:0;border-radius:50%;place-items:center;width:31px;height:31px;padding:0;display:grid}.player-controls button:disabled{opacity:.3}.player-controls .play-main{color:#171614;background:#fff;width:36px;height:36px}.timeline{color:#817d77;font-variant-numeric:tabular-nums;grid-template-columns:32px 1fr 32px;align-items:center;gap:7px;margin-top:5px;font-size:.58rem;display:grid}.timeline input,.volume-control input{height:3px;accent-color:var(--orange)}.volume-control{color:#aaa69f;justify-content:end;align-items:center;gap:8px;display:flex}.volume-control input{width:90px}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#13110f94;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.interaction-modal{text-align:center;background:var(--paper);border-radius:24px;width:min(430px,100%);padding:38px;position:relative;box-shadow:0 30px 90px #0f0b084d}.modal-close{width:32px;height:32px;color:var(--muted);background:#ebe6dc;border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:18px;right:18px}.modal-icon{color:#fff;background:var(--orange);border-radius:50%;place-items:center;width:52px;height:52px;margin:0 auto 18px;display:grid}.interaction-modal h2{color:var(--ink);font:720 1.55rem/1.2 var(--font-display);margin:0}.modal-track{color:var(--muted);margin:8px 0 26px;font-size:.76rem}.rating-picker{justify-content:center;gap:5px;display:flex}.rating-picker button{color:#d5cfc3;background:0 0;border:0;padding:4px;transition:transform .13s}.rating-picker button:hover{transform:scale(1.12)}.rating-picker button.selected{color:#f0a52b}.report-form{text-align:left;gap:17px;display:grid}.report-form label{color:var(--ink-soft);gap:7px;font-size:.72rem;font-weight:700;display:grid}.report-form select,.report-form textarea{width:100%;color:var(--ink);border:1px solid var(--line);font:400 .8rem/1.5 var(--font-body);box-sizing:border-box;background:#fffdf8;border-radius:10px;outline:none;padding:11px 12px}.report-form textarea{resize:vertical}.report-form select:focus,.report-form textarea:focus{border-color:var(--orange)}.form-error{color:#bb3126;margin:14px 0 0;font-size:.72rem}.modal-submit{width:100%;margin-top:25px}.modal-submit:disabled{opacity:.55}.toast{z-index:120;color:#fff;background:#1e1d1b;border-radius:100px;padding:12px 18px;font-size:.76rem;animation:.18s ease-out toast-in;position:fixed;top:88px;left:50%;transform:translate(-50%);box-shadow:0 14px 30px #14110f38}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}}@media (width<=1024px){.site-header{grid-template-columns:auto 1fr auto}.site-header nav{border:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffbf4f5;border-radius:15px;flex-direction:column;gap:18px;padding:18px;display:none;position:absolute;top:64px;left:20px;right:20px;box-shadow:0 18px 40px #14100c24}.site-header nav.nav-open{display:flex}.header-search{justify-self:center;width:min(360px,100%)}.mobile-menu{display:grid}.hero-section{gap:30px;min-height:510px;padding-inline:46px}.music-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.player-shell{grid-template-columns:minmax(180px,.85fr) minmax(300px,1.3fr)}.volume-control{display:none}}@media (width<=720px){.app-shell{padding-bottom:92px}.site-header{gap:12px;height:65px;padding-inline:18px}.brand>span:last-child{display:none}.brand-mark{width:34px;height:34px}.header-search{padding-block:8px}.hero-section{grid-template-columns:1fr;min-height:auto;padding:46px 22px 72px}.hero-copy h1{font-size:clamp(3.25rem,16vw,5rem)}.hero-copy>p{margin-block:23px;font-size:.88rem}.hero-visual{height:330px;margin-top:20px}.hero-visual>img,.hero-placeholder{width:min(310px,82%)}.hero-record{width:84px;height:84px;right:0}.now-card{width:175px;bottom:1%;left:0}.genre-section{padding-inline:18px}.discover-section{padding:50px 18px 80px}.section-heading{align-items:start}.music-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 13px}.cover-wrap{border-radius:11px}.cover-play{opacity:1;width:42px;height:42px;transform:none}.card-actions{display:none}.about-section{grid-template-columns:1fr;gap:24px;margin:0 18px 60px;padding:42px 30px}footer{padding-inline:20px}.player-shell{border-radius:15px;grid-template-columns:minmax(0,1fr) auto;gap:10px;height:72px;padding:0 14px;bottom:8px;left:8px;right:8px}.player-track img{width:46px;height:46px}.player-center{display:flex}.timeline,.player-controls button:first-child,.player-controls button:last-child{display:none}.interaction-modal{padding:34px 24px 25px}}@media (width<=410px){.music-grid{gap-inline:10px}.title-row h3{font-size:.82rem}.track-count{display:none}}