/* 山阿留声机 · 音乐播放器(11-04 墨子非接手后整份重写;原样是星澜 11-03 夜那版)
   她:「总觉得星澜播放器的那版UI设计和图案还是没你设计的前端好看」→ 照她给的参考(长满青苔的像素老电视 / Game Boy / 森林苔藓上的小掌机)做成一台长满青苔的像素掌机:
     聊天里的歌 = 一张游戏卡带;输入栏上面的迷你条 = 掌机侧边一条(顶上一团青苔、一株小芽、像素小封面、跳动的音柱);
     点开 = 整台掌机:顶上一起听的两个头像,屏幕里歌名 + 唱片 / 歌词 + 进度 + 一行对话框,十字键左右快退快进,A 播放暂停,B 收起,胶囊键切唱片 / 歌词,
     右下角喇叭孔,四角长青苔、小蘑菇、藤蔓、小芽;背后夜里是森林飘着光点,白天是林间斜着照进来的光。
   零件图都是 chat-px.js 第九轮画的(--pxf-gb / --pxf-cart / --px9-*),心心 / ✕ 借第三、四轮的(--pxi-heart / --pxi-x);字是方舟像素字(HTPX,只用 12px)。
   11-04 下午她:「音乐卡片漏掉夜晚版本啦」→ 夜里换一台靛蓝的掌机 + 背光暗绿屏,卡带换烟紫,迷你条跟着换(见文末「夜里版」)。 */

/* ── 共用 ── */
.record-art { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; image-rendering: pixelated; }
.record-placeholder { display: grid; place-items: center; aspect-ratio: 1; line-height: 1; background: #2f3b25; color: #c5d29a; font-size: 14px; }
.record-button { cursor: pointer; font: inherit; -webkit-tap-highlight-color: transparent; }
.record-button svg { display: block; width: 14px; height: 14px; fill: currentColor; shape-rendering: crispEdges; pointer-events: none; }
.record-copy { min-width: 0; }

/* ── 聊天里的歌:一张游戏卡带 ── */
#flow .leaf.music-leaf.music-record {
  position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr) 36px; align-items: center; gap: 8px;
  width: min(268px, 100%); max-width: 100%; margin: 12px 0 4px; padding: 13px 10px 14px; box-sizing: border-box;
  border: 1px solid transparent; border-radius: 0; background: none; box-shadow: none; color: #3a2f25;
  border-image: var(--pxf-cart) 14 12 24 12 fill / 14px 12px 24px 12px / 0 0 4px 0 stretch;
  font-family: "HTPX", "HTPX-fill", sans-serif; letter-spacing: 0; line-height: 1.3; white-space: normal; cursor: default;
}
#flow .music-record::before {   /* 卡带顶上一排防滑纹 */
  content: ""; position: absolute; left: 16px; right: 16px; top: 5px; height: 2px; pointer-events: none;
  background: repeating-linear-gradient(90deg, #7d8094 0 6px, transparent 6px 10px);
}
#flow .music-record [data-record-cover] { width: 40px; height: 40px; line-height: 0; box-shadow: 0 0 0 2px #2c2e3b; }
#flow .music-record .record-copy {   /* 卡带标签 = 一张奶油色贴纸 */
  display: flex; flex-direction: column; gap: 1px; padding: 3px 7px; background: #f6efd9;
  box-shadow: 0 -2px 0 #2c2e3b, 0 2px 0 #2c2e3b, -2px 0 0 #2c2e3b, 2px 0 0 #2c2e3b;
}
#flow .music-record .record-name,
#flow .music-record .record-sub,
#flow .music-record .d { display: block; margin: 0; font-size: 12px; font-weight: 400; letter-spacing: 0; line-height: 1.35; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#flow .music-record .record-sub { opacity: .7; }
#flow .music-record .d { opacity: .55; }
#flow .music-record.playing .record-copy { background: #e4efc0; }   /* 正在放的那张,标签亮一点 */
#flow .music-record .record-button {   /* 播放键 = 一颗粉色像素按键 */
  width: 36px; height: 36px; min-width: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  display: grid; place-items: center; color: #fff; background: var(--px9-btn) center / 30px 30px no-repeat; image-rendering: pixelated;
}
#flow .music-record .record-button:active { background-image: var(--px9-btn-down); }
#flow .music-record .record-button svg { width: 12px; height: 12px; }

/* ── 输入栏上面的迷你条:掌机侧边一条 ── */
.music-mini {
  position: relative; z-index: 2; pointer-events: auto; box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, 36px); align-items: center; gap: 2px;
  margin: 0 0 4px; padding: 7px 6px 10px 10px; min-height: 48px;
  border: 1px solid transparent; border-radius: 0; background: none; box-shadow: none; color: #4a3f35;
  border-image: var(--pxf-gb) 14 12 24 12 fill / 14px 12px 24px 12px / 0 0 4px 0 stretch;
  font-family: "HTPX", "HTPX-fill", sans-serif; letter-spacing: 0;
}
.music-mini[hidden] { display: none; }
.music-mini::before {   /* 左上角一团青苔 */
  content: ""; position: absolute; left: 6px; top: -9px; width: 36px; height: 14px; pointer-events: none;
  background: var(--px9-moss-l) left bottom / 36px 14px no-repeat; image-rendering: pixelated;
}
.music-mini::after {   /* 青苔旁边冒一株小芽 */
  content: ""; position: absolute; left: 44px; top: -11px; width: 14px; height: 12px; pointer-events: none;
  background: var(--px9-sprout) center / 100% 100% no-repeat; image-rendering: pixelated;
}
.music-mini-info { display: grid; grid-template-columns: 26px auto minmax(0, 1fr); gap: 6px; align-items: center; min-width: 0; text-align: left; }
.music-mini [data-record-cover] { width: 26px; height: 26px; line-height: 0; box-shadow: 0 0 0 2px #4a3f35; }
.music-mini .record-copy { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.music-mini .mini-track-title { display: flex; align-items: baseline; gap: 4px; min-width: 0; font-size: 12px; font-weight: 400; line-height: 1.25; }
.mini-track-name, .mini-track-artist { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mini-track-name { flex: 0 1 auto; }
.mini-track-artist { flex: 0 1 auto; max-width: 47%; opacity: .7; }
.music-mini .record-together { display: flex; align-items: center; gap: 5px; height: 15px; font-size: 12px; line-height: 1.2; color: #5d7c33; }
.record-duo { display: flex; align-items: flex-end; }
.record-duo i { display: block; width: 13px; height: 13px; background: var(--px6-fox) center / contain no-repeat; image-rendering: pixelated; }
.record-duo i + i { margin-left: -2px; transform: translateY(1px); background-image: var(--px6-wolf); }
.record-together [data-record-status] { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* 三根像素音柱:放歌的时候一跳一跳 */
.gb-eq { display: flex; align-items: flex-end; gap: 2px; height: 14px; }
.gb-eq i { display: block; width: 3px; height: 4px; background: #6aa84f; box-shadow: inset 0 1px 0 #9bd36a; }
.music-mini[data-phase="playing"] .gb-eq i { animation: gbEq .9s steps(3, end) infinite; }
.music-mini[data-phase="playing"] .gb-eq i:nth-child(2) { animation-delay: -.3s; }
.music-mini[data-phase="playing"] .gb-eq i:nth-child(3) { animation-delay: -.6s; }
@keyframes gbEq { 0%, 100% { height: 4px; } 33% { height: 12px; } 66% { height: 8px; } }
.music-mini button.record-button {
  position: relative; width: 36px; height: 36px; min-width: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  display: grid; place-items: center; background: transparent; color: #4a3f35;
}
.music-mini button.record-button::before {   /* 像素小方键 */
  content: ""; position: absolute; inset: 8px; background: #f8f2e2;
  box-shadow: 0 -2px 0 #4a3f35, 0 2px 0 #4a3f35, -2px 0 0 #4a3f35, 2px 0 0 #4a3f35, inset 0 -2px 0 #d8ccb2;
}
.music-mini button.record-button:active::before { inset: 9px 8px 7px; }
.music-mini .record-button svg { position: relative; width: 12px; height: 12px; }
.music-mini progress {   /* 进度:最底下一条像素线 */
  grid-column: 1 / -1; width: 100%; height: 4px; margin: 2px 0 0; border: 0; border-radius: 0; background: #d8ccb2;
  -webkit-appearance: none; appearance: none;
}
.music-mini progress::-webkit-progress-bar { background: #d8ccb2; }
.music-mini progress::-webkit-progress-value { background: #6aa84f; }
.music-mini progress::-moz-progress-bar { background: #6aa84f; }
/* 迷你条贴在输入栏正上方(这几条是星澜那版的排位,原样留着)+ 11-04 修的留白 / 让位 */
html.music-listening footer .attach-row:not(.open) { margin-bottom: 0 !important; }
html.music-listening footer .music-mini { width: calc(100% - 8px); max-width: 692px; margin: 0 auto 2px; }
html.music-listening footer #pendingBar:empty { display: none !important; margin: 0 !important; }
html.music-listening footer .music-mini + .line { margin-top: 0 !important; }
html.music-listening footer .clawd-wrap.clawd-perched { translate: 0 var(--record-perch-offset, 0px); }
html.music-listening.in-shell main { padding-bottom: calc(89px + var(--music-mini-h, 48px)) !important; }
html.music-listening footer .line.wish .wish-tag { bottom: calc(100% + 6px + var(--music-mini-h, 48px)); }
html.music-listening footer .wish-pop { bottom: calc(100% + 38px + var(--music-mini-h, 48px)); }

/* ── 点开:整台掌机 ── */
#music-player {
  position: fixed; inset: 0; margin: auto; box-sizing: border-box;
  width: min(330px, calc(100% - 24px)); max-width: calc(100% - 24px); max-height: calc(100dvh - 24px); overflow-y: auto; overscroll-behavior: contain;
  padding: 28px 18px 20px; border: 1px solid transparent; border-radius: 0; background: none; color: #4a3f35;
  translate: 0 calc(-5px - var(--gb-lift, 0px));   /* --gb-lift = 还压着迷你条时 music-player.js 量出来再抬的那一截;11-04 她:「音乐框高度可以稍微收短一点点然后整体上移5像素左右嘛 现在有点挡住下面的播放框」 */
  box-shadow: 0 12px 28px rgba(30, 24, 18, .26), 0 3px 8px rgba(30, 24, 18, .16);
  border-image: var(--pxf-gb) 14 12 24 12 fill / 14px 12px 24px 12px / 0 0 4px 0 stretch;
  text-align: left; font-family: "HTPX", "HTPX-fill", sans-serif; font-size: 12px; letter-spacing: 0; line-height: 1.4;
  scrollbar-width: none;
}
#music-player::-webkit-scrollbar { display: none; }
#music-player [hidden] { display: none !important; }
/* 11-04 她:「我希望这个卡片浮在chat界面上，就不要有单独的背景啦」→ 背后不铺东西,聊天照常看得见(点掌机外面照样收起);
   掌机自己带一层淡投影,像浮在聊天上面 */
#music-player::backdrop { background: transparent; }
/* 长出来的东西 */
#music-player .gb-deco { position: absolute; pointer-events: none; background: center / 100% 100% no-repeat; image-rendering: pixelated; }
#music-player .gb-moss-l { left: 10px; top: 3px; width: 36px; height: 14px; background-image: var(--px9-moss-l); }
#music-player .gb-moss-r { right: 44px; top: 3px; width: 36px; height: 14px; background-image: var(--px9-moss-r); }
#music-player .gb-shroom { right: 14px; top: 2px; width: 28px; height: 16px; background-image: var(--px9-shroom); }
#music-player .gb-vine { left: 3px; top: 14px; width: 12px; height: 48px; background-image: var(--px9-vine); }
#music-player .gb-sprout { left: 16px; bottom: 16px; width: 14px; height: 12px; background-image: var(--px9-sprout); }
#music-player .gb-speaker { right: 20px; bottom: 20px; width: 48px; height: 24px; background-image: var(--px9-speaker); }
/* 顶上:一起听 + 关掉 */
#music-player .gb-top { display: flex; align-items: center; justify-content: space-between; margin: 0 0 6px; padding: 0 0 0 4px; }
#music-player .listen-together { display: flex; align-items: center; gap: 6px; }
#music-player .listen-avatar { width: 26px; height: 26px; background: #c9bea6; box-shadow: 0 0 0 2px #4a3f35; }
#music-player .listen-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
#music-player .listen-heart { width: 14px; height: 12px; background: var(--pxi-heart) center / 100% 100% no-repeat; image-rendering: pixelated; }
#music-player .listen-caption { margin-left: 4px; color: #5d7c33; }
#music-player .player-corner-close {
  width: 32px; height: 32px; min-width: 32px; min-height: 32px; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  background: var(--pxi-x) center / 18px 18px no-repeat; color: transparent; image-rendering: pixelated;
}
#music-player .player-corner-close svg { display: none; }
/* 屏幕:灰紫色的框,左边一粒指示灯,里面一块豆绿色的液晶 */
#music-player .gb-screen {
  position: relative; padding: 10px 12px 12px 22px; background: #555b72;
  box-shadow: 0 -2px 0 #3a3e50, 0 2px 0 #3a3e50, -2px 0 0 #3a3e50, 2px 0 0 #3a3e50, inset 0 2px 0 #6d7391;
}
#music-player .gb-led { position: absolute; left: 8px; top: calc(50% - 3px); width: 6px; height: 6px; background: #6a3346; box-shadow: 0 0 0 1px #2a2b36; }
#music-player[data-phase="playing"] .gb-led { background: #ff5c8a; box-shadow: 0 0 0 1px #2a2b36, 0 0 6px #ff5c8a; }
#music-player .gb-lcd {
  display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 8px 8px 7px; background: #c5d29a; color: #2f3b25;
  box-shadow: inset 2px 2px 0 #9fae74, inset -2px -2px 0 #dbe6b6;
}
#music-player .record-label { display: flex; align-items: baseline; gap: 6px; min-width: 0; margin: 0; }
#music-player .record-label strong { min-width: 0; font-size: 12px; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#music-player .record-label small { flex: 0 1 auto; max-width: 45%; font-size: 12px; opacity: .7; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#music-player .player-stage { position: relative; height: 150px; margin: 0; }
#music-player .record-deck { display: grid; place-items: center; height: 100%; }
#music-player .gb-cover { width: 112px; height: 112px; line-height: 0; background: #2f3b25; box-shadow: 0 0 0 2px #2f3b25, 4px 4px 0 2px rgba(47, 59, 37, .3); }
#music-player .gb-cover .record-placeholder { font-size: 28px; }
#music-player .lyrics-stage { display: grid; grid-template-rows: minmax(0, 1fr) 20px; height: 100%; min-height: 0; }
#music-player .lyric-window {
  position: relative; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: none; padding: 50px 0;
  -webkit-mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
}
#music-player .lyric-window::-webkit-scrollbar { display: none; }
#music-player .lyric-window:focus-visible { outline: 2px dashed #56683f; outline-offset: -2px; }
#music-player .lyric-window p { margin: 0; padding: 5px 6px; font-size: 12px; line-height: 1.5; text-align: center; opacity: .42; }
#music-player .lyric-window p.current { opacity: 1; }
#music-player .lyric-window p.current::before {   /* 唱到的这一句前面一个像素小三角 */
  content: ""; display: inline-block; width: 6px; height: 8px; margin-right: 6px; vertical-align: -1px; background: #2f3b25;
  clip-path: polygon(0 0, 34% 0, 34% 25%, 67% 25%, 67% 38%, 100% 38%, 100% 62%, 67% 62%, 67% 75%, 34% 75%, 34% 100%, 0 100%);
}
#music-player .lyric-hint { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 0; margin: 0; font-size: 12px; opacity: .75; }
#music-player .lyric-hint button { padding: 1px 6px; border: 0; background: none; color: inherit; font: inherit; box-shadow: 0 0 0 2px #56683f; cursor: pointer; }
/* 进度:凹下去的一条 + 一颗像素心当把手 */
#music-player .gb-seekrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
#music-player .gb-seekrow input { display: block; width: 100%; height: 18px; margin: 0; padding: 0; background: none; -webkit-appearance: none; appearance: none; }
#music-player .gb-seekrow input::-webkit-slider-runnable-track { height: 6px; background: #9fae74; box-shadow: inset 0 2px 0 #7f8f59, 0 0 0 2px #2f3b25; }
#music-player .gb-seekrow input::-webkit-slider-thumb {
  -webkit-appearance: none; width: 16px; height: 14px; margin-top: -4px; border: 0; border-radius: 0; box-shadow: none;
  background: var(--pxi-heart) center / 100% 100% no-repeat; image-rendering: pixelated;
}
#music-player .gb-seekrow input::-moz-range-track { height: 6px; background: #9fae74; box-shadow: 0 0 0 2px #2f3b25; }
#music-player .gb-seekrow input::-moz-range-thumb { width: 16px; height: 14px; border: 0; border-radius: 0; background: var(--pxi-heart) center / 100% 100% no-repeat; }
#music-player .gb-seekrow output { font-size: 12px; white-space: nowrap; }
/* 屏幕最底下一行对话框:像「TAKE A REST? ▶YES」那样,前面一个小符号,后面一个一闪一闪的光标 */
#music-player .gb-say { margin: 0; padding: 4px 8px; min-height: 16px; font-size: 12px; line-height: 16px; background: #dbe6b6; box-shadow: 0 0 0 2px #2f3b25; }
#music-player .gb-say::before {
  content: ""; display: inline-block; width: 6px; height: 8px; margin-right: 6px; vertical-align: 0; background: #2f3b25;
  clip-path: polygon(0 0, 34% 0, 34% 25%, 67% 25%, 67% 38%, 100% 38%, 100% 62%, 67% 62%, 67% 75%, 34% 75%, 34% 100%, 0 100%);
}
#music-player:not([data-phase="playing"]) .gb-say::before { clip-path: none; background: linear-gradient(90deg, #2f3b25 0 2px, transparent 2px 4px, #2f3b25 4px 6px); }
#music-player .gb-say::after { content: ""; display: inline-block; width: 6px; height: 2px; margin-left: 4px; background: #2f3b25; animation: gbBlink 1s steps(1, end) infinite; }
@keyframes gbBlink { 50% { opacity: 0; } }
/* 屏幕下面的牌子 */
#music-player .gb-brand { margin: 8px 0 4px 2px; color: #4b3f8a; font-size: 12px; letter-spacing: 1px; }
/* 十字键 + A B 键 */
#music-player .gb-controls { display: flex; align-items: center; justify-content: space-between; padding: 2px 4px 0 2px; }
#music-player .gb-dpad { position: relative; display: flex; width: 52px; height: 52px; background: var(--px9-dpad) center / 52px 52px no-repeat; image-rendering: pixelated; }
#music-player .gb-seek { flex: 1; height: 100%; padding: 0; border: 0; border-radius: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
#music-player .gb-seek:active { background: rgba(0, 0, 0, .14); }
#music-player .gb-ab { display: flex; align-items: flex-start; gap: 14px; }
#music-player .gb-key { display: flex; flex-direction: column; align-items: center; gap: 4px; }
#music-player .gb-key-b { margin-top: 14px; }
#music-player .gb-btn {
  width: 40px; height: 40px; min-width: 40px; min-height: 40px; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  display: grid; place-items: center; color: #fff; background: var(--px9-btn) center / 40px 40px no-repeat; image-rendering: pixelated; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#music-player .gb-btn:active { background-image: var(--px9-btn-down); }
#music-player .gb-btn svg { display: block; width: 14px; height: 14px; fill: #fff; }
#music-player .gb-key b { font-size: 12px; font-weight: 400; color: #4b3f8a; white-space: nowrap; }
#music-player .gb-key-a b:empty::before { content: "A 播放"; }
#music-player[data-phase="playing"] .gb-key-a b:empty::before,
#music-player[data-phase="loading"] .gb-key-a b:empty::before { content: "A 暂停"; }
/* 两颗胶囊键 = 唱片 / 歌词 */
#music-player .gb-pills { display: flex; justify-content: center; gap: 26px; margin: 8px 56px 0 0; }
#music-player .gb-pills button {
  display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0; border: 0; border-radius: 0; background: none;
  color: #4b3f8a; font: inherit; font-size: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
#music-player .gb-pills button::before { content: ""; width: 36px; height: 15px; background: var(--px9-pill) center / 100% 100% no-repeat; image-rendering: pixelated; }
#music-player .gb-pills button[aria-pressed="true"]::before { background-image: var(--px9-pill-on); }

/* ════ 夜里版(11-04 下午 她:「音乐卡片漏掉夜晚版本啦」)════
   掌机换一台靛蓝的(和夜里的气泡、转账票同一家靛蓝),屏幕是开了背光的暗绿液晶、字是发光的浅绿;
   卡带换成烟紫半透明那种,标签还是奶油色贴纸;迷你条跟着掌机换色。青苔、蘑菇、藤蔓、小芽、粉色按键、胶囊键日夜不变。 */
html:not([data-theme="day"]) #flow .leaf.music-leaf.music-record { border-image-source: var(--pxf-cartn); }
html:not([data-theme="day"]) #flow .music-record::before { background: repeating-linear-gradient(90deg, #2f2a66 0 6px, transparent 6px 10px); }
html:not([data-theme="day"]) #flow .music-record [data-record-cover] { box-shadow: 0 0 0 2px #0a0722; }
html:not([data-theme="day"]) #flow .music-record .record-copy { background: #ece3c8; box-shadow: 0 -2px 0 #0a0722, 0 2px 0 #0a0722, -2px 0 0 #0a0722, 2px 0 0 #0a0722; }
html:not([data-theme="day"]) #flow .music-record.playing .record-copy { background: #dfeab8; }

html:not([data-theme="day"]) .music-mini { border-image-source: var(--pxf-gbn); color: #ebe6ff; }
html:not([data-theme="day"]) .music-mini [data-record-cover] { box-shadow: 0 0 0 2px #0a0722; }
html:not([data-theme="day"]) .music-mini .record-together { color: #9bd36a; }
html:not([data-theme="day"]) .music-mini button.record-button { color: #ebe6ff; }
html:not([data-theme="day"]) .music-mini button.record-button::before { background: #3b3579; box-shadow: 0 -2px 0 #0a0722, 0 2px 0 #0a0722, -2px 0 0 #0a0722, 2px 0 0 #0a0722, inset 0 -2px 0 #2a2460; }
html:not([data-theme="day"]) .music-mini progress { background: #1c1748; }
html:not([data-theme="day"]) .music-mini progress::-webkit-progress-bar { background: #1c1748; }

html:not([data-theme="day"]) #music-player { border-image-source: var(--pxf-gbn); color: #ebe6ff; box-shadow: 0 12px 28px rgba(0, 0, 0, .45), 0 3px 8px rgba(0, 0, 0, .3); }
html:not([data-theme="day"]) #music-player .listen-avatar { background: #3a3070; box-shadow: 0 0 0 2px #0a0722; }
html:not([data-theme="day"]) #music-player .listen-caption { color: #9bd36a; }
html:not([data-theme="day"]) #music-player .gb-screen { background: #17133a; box-shadow: 0 -2px 0 #0a0722, 0 2px 0 #0a0722, -2px 0 0 #0a0722, 2px 0 0 #0a0722, inset 0 2px 0 #2c2766; }
html:not([data-theme="day"]) #music-player .gb-lcd { background: #1d3a2c; color: #c6f0a8; box-shadow: inset 2px 2px 0 #142a20, inset -2px -2px 0 #2a4d3b; }
html:not([data-theme="day"]) #music-player .lyric-window p.current { text-shadow: 0 0 6px rgba(198, 240, 168, .45); }
html:not([data-theme="day"]) #music-player .lyric-window p.current::before,
html:not([data-theme="day"]) #music-player .gb-say::before,
html:not([data-theme="day"]) #music-player .gb-say::after { background: #c6f0a8; }
html:not([data-theme="day"]) #music-player:not([data-phase="playing"]) .gb-say::before { background: linear-gradient(90deg, #c6f0a8 0 2px, transparent 2px 4px, #c6f0a8 4px 6px); }
html:not([data-theme="day"]) #music-player .gb-say { background: #234634; box-shadow: 0 0 0 2px #7fbf6a; }
html:not([data-theme="day"]) #music-player .lyric-hint button { box-shadow: 0 0 0 2px #7fbf6a; }
html:not([data-theme="day"]) #music-player .lyric-window:focus-visible { outline-color: #7fbf6a; }
html:not([data-theme="day"]) #music-player .gb-cover { background: #10241a; box-shadow: 0 0 0 2px #7fbf6a, 4px 4px 0 2px rgba(0, 0, 0, .35); }
html:not([data-theme="day"]) #music-player .gb-seekrow input::-webkit-slider-runnable-track { background: #2e5a43; box-shadow: inset 0 2px 0 #234634, 0 0 0 2px #7fbf6a; }
html:not([data-theme="day"]) #music-player .gb-seekrow input::-moz-range-track { background: #2e5a43; box-shadow: 0 0 0 2px #7fbf6a; }
html:not([data-theme="day"]) #music-player .gb-brand,
html:not([data-theme="day"]) #music-player .gb-key b,
html:not([data-theme="day"]) #music-player .gb-pills button { color: #c4bcff; }
html:not([data-theme="day"]) #music-player .gb-dpad { background-image: var(--px9-dpad-n); }
html:not([data-theme="day"]) #music-player .gb-speaker { background-image: var(--px9-speaker-n); }
html:not([data-theme="day"]) #music-player .gb-seek:active { background: rgba(255, 255, 255, .12); }

@media (prefers-reduced-motion: reduce) {
  .music-mini[data-phase="playing"] .gb-eq i,
  #music-player .gb-say::after { animation: none; }
}