@font-face{font-family:"TradeWindsCustom";src:url("/assets/trade-winds.ttf") format("truetype");font-display:swap}
:root{
  --bg:#07060d;
  --panel:rgba(18,14,23,.9);
  --panel2:rgba(42,22,34,.7);
  --line:rgba(244,207,134,.2);
  --line2:rgba(244,207,134,.36);
  --text:#f8f2ea;
  --muted:#cdbed6;
  --gold:#f4cf86;
  --wine:#6f203f;
  --green:#1ed760;
  --shadow:0 20px 60px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
body{margin:0;min-height:100dvh;font-family:Inter,system-ui,sans-serif;color:var(--text);background:radial-gradient(900px 480px at 90% -10%, rgba(154,55,99,.22), transparent 58%),radial-gradient(700px 420px at 10% 0%, rgba(244,207,134,.10), transparent 56%),radial-gradient(800px 500px at 50% 110%, rgba(111,32,63,.18), transparent 60%),var(--bg)}
a{color:inherit}
.music-shell{max-width:1160px;margin:0 auto;padding:28px 16px 40px}
.music-page{background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.site-badge,.section-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;color:#f8ead8;border:1px solid rgba(244,207,134,.24);background:linear-gradient(90deg,rgba(42,22,34,.78),rgba(75,31,56,.42));box-shadow:0 8px 20px rgba(0,0,0,.22),0 0 0 1px rgba(244,207,134,.08) inset;font-size:12px;font-weight:500;line-height:1}
.pill-link{display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border-radius:999px;border:1px solid var(--line2);text-decoration:none;background:linear-gradient(90deg,rgba(42,22,34,.86),rgba(75,31,56,.66),rgba(42,22,34,.86));color:#fff1d6}
.spotlight{padding:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg, rgba(34,18,28,.76), rgba(16,12,20,.9))}
.eyebrow{margin:0 0 10px;font-size:12px;letter-spacing:.09em;color:#f1d6a3;text-transform:uppercase}
h1,h2,h3,p{overflow-wrap:anywhere}
h1{margin:0 0 14px;font-family:"TradeWindsCustom","Palatino Linotype","Book Antiqua",Palatino,serif;font-size:clamp(38px,7vw,72px);line-height:1;color:#fff3df;text-shadow:0 10px 28px rgba(0,0,0,.48)}
h2{margin:0;color:#fff1db;font-size:clamp(24px,3vw,34px);line-height:1.1}
h3{margin:12px 0 6px;color:#fff1db;font-size:20px}
p{margin:0;color:var(--muted);line-height:1.6}
.action-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 16px;border-radius:14px;text-decoration:none;font:inherit;font-weight:800;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(90deg,#12391f,#1f7b3c,#12391f);color:#f5fff8;border:1px solid rgba(30,215,96,.55);box-shadow:0 10px 26px rgba(0,0,0,.36),0 0 0 1px rgba(30,215,96,.16) inset}
.btn-ghost{background:linear-gradient(90deg,rgba(42,22,34,.76),rgba(75,31,56,.52),rgba(42,22,34,.76));color:#f4e8ff;border:1px solid rgba(244,207,134,.28)}
.section-head{display:grid;gap:6px;margin-bottom:16px}
.spotify-player{display:block;width:100%;border:0;border-radius:14px;background:#120d14}
.spotlight-player{margin-top:14px}
.lyrics-dialog{width:min(520px,calc(100vw - 28px));padding:0;border:1px solid var(--line2);border-radius:18px;background:linear-gradient(180deg,rgba(34,18,28,.98),rgba(12,9,16,.98));color:var(--text);box-shadow:0 28px 80px rgba(0,0,0,.66)}
.lyrics-dialog::backdrop{background:rgba(5,3,8,.68);backdrop-filter:blur(5px)}
.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 18px 12px;border-bottom:1px solid rgba(244,207,134,.14)}
.icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:1px solid rgba(244,207,134,.24);border-radius:999px;background:rgba(15,11,18,.58);color:#fff1db;font-family:Arial,Helvetica,sans-serif;font-size:24px;font-weight:400;line-height:1;cursor:pointer}
.lyrics-link-list{display:grid;gap:9px;max-height:min(68dvh,560px);overflow:auto;padding:16px;scrollbar-width:thin;scrollbar-color:rgba(244,207,134,.42) rgba(111,32,63,.18)}
.lyrics-status{padding:14px;border:1px solid rgba(244,207,134,.14);border-radius:14px;background:rgba(15,11,18,.48)}
.lyrics-song-link{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 14px;border:1px solid rgba(244,207,134,.16);border-radius:14px;background:rgba(15,11,18,.54);color:#fff1db;text-decoration:none;font-weight:800}
.lyrics-song-link::after{content:"›";display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:#f4cf86;font-size:22px;line-height:18px;transform:translateY(-1px)}
.lyrics-song-link:hover{border-color:rgba(244,207,134,.36);background:rgba(55,28,44,.66)}
.song-page{display:grid;gap:18px}
.song-hero{display:grid;grid-template-columns:minmax(220px,360px) minmax(0,1fr);gap:24px;align-items:end;padding:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg, rgba(34,18,28,.76), rgba(16,12,20,.9))}
.song-cover{width:100%;height:auto;max-height:min(56dvh,520px);border-radius:16px;object-fit:contain;border:1px solid rgba(244,207,134,.18);box-shadow:0 18px 46px rgba(0,0,0,.38)}
.song-copy{display:grid;gap:12px}
.song-context{margin:-6px 0 2px;color:#d8c8e5;font-size:15px}
.song-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.lyrics-sheet{padding:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg, rgba(34,18,28,.64), rgba(16,12,20,.88));box-shadow:0 12px 30px rgba(0,0,0,.20)}
.lyrics-text{margin:0;white-space:pre-wrap;color:#eadffc;line-height:1.78;font-family:Georgia,"Times New Roman",serif;font-size:17px}
footer{margin-top:20px;color:#a999b8;font-size:12px;line-height:1.6}
.page-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;margin-bottom:4px;padding-top:16px;border-top:1px solid rgba(244,207,134,.28)}
.footer-links{white-space:nowrap;display:block;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.footer-links::-webkit-scrollbar{display:none}
footer a{color:#d5c8ff}
@media (max-width:760px){
  .music-shell{padding:18px 10px 28px}
  .music-page{padding:16px;border-radius:20px}
  .song-hero{grid-template-columns:1fr}
  .btn{width:100%}
}
