/* Forever Stars Medley v7.0 — Premium cockpit design system */
:root {
  color-scheme: dark;
  --bg: #05070d;
  --bg-2: #0a1020;
  --surface: rgba(13, 18, 34, .72);
  --surface-strong: rgba(18, 25, 44, .92);
  --surface-soft: rgba(255,255,255,.055);
  --line: rgba(166, 180, 255, .16);
  --line-strong: rgba(135, 155, 255, .28);
  --text: #f7fbff;
  --text-2: #b9c6dd;
  --muted: #7887a3;
  --brand: #9d7cff;
  --brand-2: #42d7ff;
  --brand-3: #ffb86b;
  --ok: #35e59b;
  --warn: #ffd166;
  --bad: #ff5c7a;
  --shadow: 0 28px 90px rgba(0,0,0,.55);
  --glow: 0 0 46px rgba(157,124,255,.34), 0 0 90px rgba(66,215,255,.12);
  --radius-xs: 10px;
  --radius-sm: 14px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 38px;
  --pill: 999px;
  --space-xs: 6px;
  --space-sm: 10px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 36px;
  --ease: cubic-bezier(.2,.8,.2,1);
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
html[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f7ff;
  --bg-2: #eaf0ff;
  --surface: rgba(255,255,255,.72);
  --surface-strong: rgba(255,255,255,.94);
  --surface-soft: rgba(9, 18, 40, .055);
  --line: rgba(35, 56, 105, .14);
  --line-strong: rgba(78, 91, 155, .24);
  --text: #08111f;
  --text-2: #3f4e67;
  --muted: #758199;
  --shadow: 0 28px 80px rgba(32, 45, 86, .18);
  --glow: 0 0 44px rgba(124, 92, 255, .22), 0 0 80px rgba(0, 180, 216, .12);
}
*,*::before,*::after{box-sizing:border-box} html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth} body{margin:0;min-height:100vh;font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision} body::before{content:"";position:fixed;inset:-30%;z-index:-3;background:radial-gradient(circle at 18% 12%,rgba(157,124,255,.28),transparent 28%),radial-gradient(circle at 84% 18%,rgba(66,215,255,.18),transparent 30%),radial-gradient(circle at 55% 95%,rgba(255,184,107,.13),transparent 32%),linear-gradient(135deg,var(--bg),var(--bg-2));filter:saturate(1.1)} body::after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 50% 20%,#000,transparent 72%)}
a{color:inherit;text-decoration:none} button{font:inherit;color:inherit;border:0;background:none;cursor:pointer} button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--brand-2);outline-offset:3px} img{display:block;max-width:100%} input,textarea{font:inherit}.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}.glass,.card,.stat-card,.song-card,.mini-player,.settings-panel,.modal-content{background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 22px;border-radius:var(--pill);font-weight:800;letter-spacing:.02em;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent,rgba(255,255,255,.26),transparent);transform:translateX(-130%);transition:transform .65s var(--ease)}.btn:hover{transform:translateY(-2px)}.btn:hover::before{transform:translateX(130%)}.btn-primary{color:#fff;background:linear-gradient(135deg,#7c4dff,#00c2ff 55%,#8b5cf6);box-shadow:0 18px 55px rgba(80,113,255,.35),inset 0 1px 0 rgba(255,255,255,.25)}.btn-secondary{background:var(--surface);border:1px solid var(--line);color:var(--text)}.btn-secondary:hover{border-color:var(--line-strong);box-shadow:var(--glow)}
.icon-btn,.back-btn,.refresh-btn,.player-back,.player-menu,.ctrl-btn,.footer-icon,.mini-prev,.mini-next,.mini-play,.fav-btn,.search-clear,.modal-close{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:var(--pill);transition:transform .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease),color .22s var(--ease),box-shadow .22s var(--ease)}.icon-btn,.back-btn,.refresh-btn,.player-back,.player-menu{width:46px;height:46px;background:var(--surface);border:1px solid var(--line);color:var(--text-2)}.icon-btn:hover,.back-btn:hover,.refresh-btn:hover,.player-back:hover,.player-menu:hover{transform:translateY(-1px);border-color:var(--line-strong);color:var(--text);box-shadow:var(--glow)}
.loading-spinner{width:22px;height:22px;border:2px solid rgba(255,255,255,.18);border-top-color:var(--brand-2);border-radius:50%;animation:spin .8s linear infinite}.loading-toast,.toast,.error-toast{position:fixed;left:50%;bottom:92px;z-index:1000;display:flex;align-items:center;gap:10px;transform:translateX(-50%) translateY(14px);padding:13px 18px;border-radius:var(--pill);background:var(--surface-strong);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px);opacity:0;visibility:hidden;transition:.25s var(--ease)}.loading-toast.active,.toast.active,.error-toast.active{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}.error-toast{background:rgba(255,92,122,.92);color:white}.skeleton-item,.skeleton{background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.14),rgba(255,255,255,.05));background-size:220% 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-md)}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:linear-gradient(var(--brand),var(--brand-2));border-radius:999px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.58;transform:scale(.985)}}@keyframes shimmer{to{background-position:-220% 0}}@keyframes fadeIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes slideUp{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}@keyframes float{0%,100%{transform:translate3d(0,0,0)}35%{transform:translate3d(18px,-34px,0)}70%{transform:translate3d(-22px,-18px,0)}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media (min-width:900px){:root{--space-lg:30px;--space-xl:48px}.btn{min-height:60px;padding-inline:28px}}