/* Any Listen — Apple Music 风格主题（第一版基础层）
 * 原则：不复制 Apple 资源；只覆盖颜色、字体、圆角、模糊与节奏。
 * 精确选择器在部署后按真实 DOM 迭代（见 docs/TEST_REPORT.md）。
 */

:root {
  --al-accent: #fa233b;
  --al-accent-soft: #fb5c74;
  --al-bg: #101012;
  --al-bg-elevated: #1c1c1e;
  --al-text: #eceeef;
  --al-text-dim: rgba(236, 238, 239, 0.6);
  --al-radius-cover: 8px;
  --al-radius-card: 12px;
  color-scheme: dark;
}

html, body {
  background: var(--al-bg) !important;
  color: var(--al-text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
    "PingFang SC", "Microsoft YaHei", system-ui, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
}

::selection { background: rgba(250, 35, 59, 0.35); }

/* 滚动条：细、暗 */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb {
  background: rgba(236, 238, 239, 0.18);
  border-radius: 3px;
}
::-webkit-scrollbar-track { background: transparent; }

/* 强调色：主操作按钮、链接、进度、选中态 */
a { color: var(--al-accent-soft); }

button[class*="primary"], .btn-primary, button[type="submit"] {
  background: var(--al-accent) !important;
  border-color: var(--al-accent) !important;
  color: #fff !important;
  border-radius: var(--al-radius-card) !important;
}

input[type="range"] { accent-color: var(--al-accent); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--al-accent); }

/* 进度条/滑块 */
[class*="progress"] > [class*="bar"],
[class*="slider"] > [class*="track"] {
  background-color: var(--al-accent-soft) !important;
}

/* 封面卡片：圆角 + 轻投影 */
img[src*="cover"], img[class*="cover"], img[class*="pic"],
[class*="cover"] img, [class*="thumbnail"] img {
  border-radius: var(--al-radius-cover) !important;
}

/* 毛玻璃底栏 / 顶栏（结构定位：fixed/sticky 的 bar 类容器） */
[class*="navbar"], [class*="topbar"], [class*="header"][class*="bar"],
[class*="player-bar"], [class*="bottom-bar"], [class*="tabbar"], [class*="tab-bar"] {
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  background-color: rgba(22, 22, 24, 0.72) !important;
}

/* 大标题节奏 */
h1, h2 { letter-spacing: 0.2px; }

/* iOS 壳/PWA 下利用安全区 */
@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* 桌面端深色滚动区背景统一 */
#app, [id*="app"], [class*="container"] {
  background-color: transparent;
}

/* 浅色残留清剿：把常见的浅色底/白底强制压暗（第一版兜底，精确化后删除） */
body, [class*="container"], [class*="page"], [class*="content"], [class*="list"],
[class*="sidebar"], [class*="aside"], [class*="panel"], [class*="card"],
[class*="dialog"], [class*="modal"], [class*="header"], [class*="footer"],
[class*="main"], [class*="layout"], [class*="view"] {
  background-color: var(--al-bg);
  color: var(--al-text);
}

[class*="card"], [class*="dialog"], [class*="modal"], [class*="panel"] {
  background-color: var(--al-bg-elevated) !important;
  border-radius: var(--al-radius-card) !important;
}

[class*="list"] [class*="item"]:hover,
[class*="row"]:hover {
  background-color: rgba(236, 238, 239, 0.06) !important;
}

[class*="active"], [class*="selected"], [class*="current"] {
  color: var(--al-accent-soft);
}

/* ========== 移动端适配（≤700px）：单栏、无侧栏、底部 Tab ========== */

@media (max-width: 700px) {
  /* 解除桌面固定宽度（应用会给 body 写内联 width:1020px，!important 压过内联样式） */
  html, body, #root,
  .view-container, .view-container * {
    min-width: 0 !important;
    max-width: 100vw !important;
  }
  body {
    margin: 0 !important;
    left: 0 !important;
    width: 100% !important;
    position: static !important;
  }
  body #root > .view-container,
  .view-container > div,
  .view-container .view,
  .view-container .view .view-container {
    width: 100% !important;
  }

  /* 主布局行变单列，隐藏侧栏 */
  .view-container > div:has(> .aside) {
    display: block !important;
    position: relative;
  }
  .aside {
    display: none !important;
  }

  /* 顶栏：只留搜索，隐藏窗口按钮 */
  .toolbar .control,
  .toolbar button.fullscreen,
  .toolbar button.close {
    display: none !important;
  }

  /* 底部给播放条 + Tab 栏留空间 */
  #root, .view-container {
    padding-bottom: calc(150px + env(safe-area-inset-bottom)) !important;
  }

  /* Apple Music 风格悬浮 miniplayer：圆角毛玻璃，贴在 Tab 栏上方 */
  .player {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: calc(54px + env(safe-area-inset-bottom)) !important;
    z-index: 950;
    border-radius: 14px !important;
    background: rgba(28, 28, 30, 0.92) !important;
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
  }
  /* 手机上隐藏次要按钮：收藏/播放列表/音量/循环；上一曲仅视觉隐藏（桥命令仍可点它） */
  .player button[aria-label="收藏歌曲"],
  .player button[aria-label="播放列表"],
  .player button[aria-label*="音量"],
  .player button[aria-label*="循环"],
  .player button[aria-label*="歌词"] {
    display: none !important;
  }
  .player button[aria-label="上一曲"] {
    visibility: hidden !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* 标题与时间单行省略，防挤压换行；控制图标收小 */
  .player * {
    min-width: 0;
  }
  .player img {
    border-radius: 6px !important;
    width: 44px !important;
    height: 44px !important;
  }
  .player [class*="side"] {
    overflow: hidden;
  }
  .player .side.left,
  .player [class*="side"]:first-child {
    flex: 1 1 auto !important;
    min-width: 0;
  }
  .player .side.right,
  .player [class*="side"]:last-child {
    flex: 0 0 auto !important;
  }
  .player [class*="name"],
  .player [class*="title"],
  .player [class*="song"] {
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100%;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
  }
  .player button svg {
    width: 30px !important;
    height: 30px !important;
  }
  .player [class*="progress"] {
    display: none !important;
  }

  /* Apple Music 风格底部 Tab 栏（bridge.js 注入 #al-tabbar） */
  #al-tabbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    display: flex;
    justify-content: space-around;
    padding: 4px 8px calc(6px + env(safe-area-inset-bottom));
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    background: rgba(18, 18, 20, 0.82);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }
  #al-tabbar a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    flex: 1;
    color: var(--al-text-dim);
    font-size: 10px;
    text-decoration: none;
    padding: 4px 0;
    border-radius: 8px;
  }
  #al-tabbar a svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
  }
  #al-tabbar a.active {
    color: var(--al-accent-soft);
  }
}

/* 桌面端不显示 Tab 栏 */
@media (min-width: 701px) {
  #al-tabbar { display: none !important; }
}