/* ============ 共享组件：随机音乐播放器 + 随机名言 ============ */

/* ---------- 随机音乐播放器 ---------- */
.music-widget{position:fixed;right:20px;bottom:24px;z-index:9999;font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif}
.mw-open{width:48px;height:48px;border-radius:50%;border:1px solid rgba(0,229,255,.65);background:radial-gradient(circle at 32% 28%,rgba(0,229,255,.3),rgba(6,22,38,.96) 72%);color:#00e5ff;font-size:20px;cursor:pointer;display:grid;place-items:center;box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 18px rgba(0,229,255,.35);transition:transform .25s,box-shadow .25s}
.mw-open:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 12px 34px rgba(0,0,0,.55),0 0 28px rgba(0,229,255,.55)}
.mw-open.playing{animation:mwPulse 2.2s ease-in-out infinite}
@keyframes mwPulse{50%{box-shadow:0 0 28px rgba(203,255,64,.5),0 0 10px rgba(0,229,255,.65)}}
.mw-panel{position:absolute;right:0;bottom:60px;width:min(340px,calc(100vw - 24px));background:linear-gradient(160deg,rgba(10,32,51,.97),rgba(5,16,29,.97));border:1px solid rgba(0,229,255,.3);border-radius:18px;padding:14px;box-shadow:0 24px 70px rgba(0,0,0,.62),0 0 40px rgba(0,229,255,.08);opacity:0;transform:translateY(12px) scale(.96);pointer-events:none;transition:opacity .3s cubic-bezier(.2,.8,.2,1),transform .3s cubic-bezier(.2,.8,.2,1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.music-widget.open .mw-panel{opacity:1;transform:none;pointer-events:auto}
.mw-head{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.mw-eq{display:flex;align-items:flex-end;gap:3px;height:16px}
.mw-eq i{width:3px;background:#cbff40;border-radius:2px;height:5px}
.music-widget.playing .mw-eq i{animation:mwEq 1s ease-in-out infinite}
.music-widget.playing .mw-eq i:nth-child(2){animation-delay:.15s}
.music-widget.playing .mw-eq i:nth-child(3){animation-delay:.3s}
.music-widget.playing .mw-eq i:nth-child(4){animation-delay:.45s}
@keyframes mwEq{0%,100%{height:5px}50%{height:16px}}
.mw-label{flex:1;font:500 10px "DM Mono",monospace;letter-spacing:.16em;color:#a9c8d5}
.mw-x{width:24px;height:24px;border-radius:50%;border:0;background:rgba(255,255,255,.06);color:#a9c8d5;cursor:pointer;font-size:13px;line-height:1}
.mw-x:hover{background:rgba(255,95,87,.18);color:#ff5f57}
.mw-plist{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:11px}
.mw-pl{padding:6px 11px;border-radius:999px;border:1px solid rgba(176,222,248,.22);background:rgba(6,17,30,.72);color:#cfe5ee;font-size:11px;font-weight:700;cursor:pointer;transition:.2s}
.mw-pl:hover{border-color:#00e5ff;color:#00e5ff}
.mw-pl.on{border-color:#cbff40;color:#cbff40;background:rgba(203,255,64,.1);box-shadow:0 0 12px rgba(203,255,64,.2)}
.mw-songs-toggle{display:flex;align-items:center;gap:8px;width:100%;padding:8px 10px;margin-bottom:8px;border-radius:10px;border:1px solid rgba(176,222,248,.18);background:rgba(6,17,30,.6);color:#a9c8d5;font-size:12px;font-weight:700;cursor:pointer;transition:.2s}
.mw-songs-toggle:hover{border-color:rgba(0,229,255,.45);color:#eaf8ff}
.mw-songs-toggle .ms-count{color:#00e5ff;font:500 10px "DM Mono",monospace;margin-left:auto}
.mw-songs-toggle .ms-arrow{transition:transform .25s;color:#8fa6b5;font-size:11px}
.mw-songs-toggle.open .ms-arrow{transform:rotate(90deg);color:#cbff40}
.mw-songs{max-height:0;overflow:hidden;margin:0 -4px;padding:0 4px;display:flex;flex-direction:column;gap:2px;transition:max-height .35s ease,padding .35s ease,border-color .35s ease;border-top:1px solid transparent;border-bottom:1px solid transparent}
.mw-songs.open{max-height:230px;overflow-y:auto;margin-bottom:10px;padding:8px 4px;border-top-color:rgba(176,222,248,.12);border-bottom-color:rgba(176,222,248,.12)}
.mw-songs::-webkit-scrollbar{width:6px}
.mw-songs::-webkit-scrollbar-thumb{background:rgba(0,229,255,.3);border-radius:99px}
.mw-song{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:7px 10px;border-radius:9px;background:transparent;border:0;color:#cfe5ee;font-size:12px;cursor:pointer;transition:.15s}
.mw-song:hover{background:rgba(0,229,255,.12);color:#fff}
.mw-song.active{background:rgba(203,255,64,.12);color:#cbff40}
.mw-song .ms-title{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.mw-song .ms-sub{font:500 9px "DM Mono",monospace;color:#58717f;flex:none}
.mw-song.active .ms-sub{color:#8fa6b5}
.mw-body{display:flex;gap:12px;align-items:center}
.mw-cover-wrap{width:66px;height:66px;border-radius:12px;overflow:hidden;position:relative;flex:none;background:linear-gradient(135deg,rgba(0,229,255,.25),rgba(154,117,255,.2)),#081524;display:grid;place-items:center;border:1px solid rgba(0,229,255,.3)}
.mw-cover-wrap:before{content:"♪";color:rgba(0,229,255,.35);font-size:26px}
.mw-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.mw-info{min-width:0;flex:1}
.mw-title{display:block;font-size:14px;font-weight:700;color:#eaf8ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mw-artist{display:block;margin-top:6px;font-size:11px;color:#7391a0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mw-controls{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:13px}
.mw-btn{width:38px;height:38px;border-radius:50%;border:1px solid rgba(176,222,248,.22);background:rgba(6,17,30,.72);color:#cfe5ee;font-size:15px;cursor:pointer;display:grid;place-items:center;transition:.22s}
.mw-btn:hover{border-color:#00e5ff;color:#00e5ff}
.mw-btn.mw-play{width:46px;height:46px;background:#cbff40;color:#07101a;border:0;font-size:16px;box-shadow:0 8px 22px rgba(203,255,64,.22)}
.mw-btn.mw-play:hover{transform:scale(1.07);box-shadow:0 10px 26px rgba(203,255,64,.32)}
.mw-btn:disabled{opacity:.35;cursor:not-allowed}
.mw-time{display:block;text-align:right;margin-top:9px;font:500 10px "DM Mono",monospace;color:#7391a0}
.mw-progress{height:18px;margin-top:5px;display:flex;align-items:center}
.mw-progress input[type=range]{flex:1;appearance:none;-webkit-appearance:none;height:4px;border-radius:99px;background:rgba(176,222,248,.14);outline:none;cursor:pointer;margin:0;padding:0}
.mw-progress input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#eaf8ff;border:2px solid #00e5ff;box-shadow:0 0 8px rgba(0,229,255,.6);cursor:pointer}
.mw-progress input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#eaf8ff;border:2px solid #00e5ff;box-shadow:0 0 8px rgba(0,229,255,.6);cursor:pointer}
.mw-status{margin-top:9px;font-size:11px;color:#8fa6b5;text-align:center;min-height:16px}
.mw-vol{display:flex;align-items:center;gap:9px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(176,222,248,.12)}
.mw-vol .ico{font-size:12px;color:#7391a0;min-width:18px;text-align:center}
.mw-vol input[type=range]{flex:1;appearance:none;-webkit-appearance:none;height:4px;border-radius:99px;background:rgba(176,222,248,.18);outline:none;cursor:pointer}
.mw-vol input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#cbff40;border:0;box-shadow:0 0 8px rgba(203,255,64,.6)}
.mw-vol input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#cbff40;border:0;cursor:pointer}

/* ---------- 随机名言 ---------- */
.quote-widget{position:fixed;left:18px;bottom:18px;z-index:9998;display:flex;align-items:center;gap:12px;max-width:min(420px,42vw);padding:12px 14px 12px 18px;border-radius:16px;background:rgba(5,16,30,.82);backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%);border:1px solid rgba(0,229,255,.35);box-shadow:0 14px 40px rgba(0,0,0,.45),0 0 22px rgba(0,229,255,.12);font-size:13px;color:#d6f5f8;line-height:1.55}
.quote-widget .quote-text{cursor:pointer;flex:1;transition:color .25s,text-shadow .25s}
.quote-widget .quote-text:hover{color:#fff;text-shadow:0 0 12px rgba(0,229,255,.65)}
.quote-widget .quote-btn{flex:0 0 auto;padding:6px 14px;border-radius:999px;border:1px solid rgba(203,255,64,.55);background:rgba(203,255,64,.1);color:#cbff40;font:600 12px "Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;cursor:pointer;transition:background .25s,box-shadow .25s,transform .25s}
.quote-widget .quote-btn:hover{background:rgba(203,255,64,.22);box-shadow:0 0 16px rgba(203,255,64,.35);transform:translateY(-1px)}
.quote-widget .quote-copied{position:absolute;left:18px;bottom:calc(100% + 8px);padding:5px 12px;border-radius:999px;background:#00e5ff;color:#04101a;font:700 11px "Noto Sans SC",sans-serif;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s;pointer-events:none;white-space:nowrap}
.quote-widget .quote-copied.show{opacity:1;transform:none}

@media(max-width:860px){
  .music-widget{right:12px;bottom:16px;z-index:9999}
  .mw-open{width:44px;height:44px;font-size:18px}
  .mw-panel{bottom:54px;width:min(320px,calc(100vw - 24px))}
  .quote-widget{display:none}
}
@media(prefers-reduced-motion:reduce){
  .mw-open.playing,.music-widget.playing .mw-eq i{animation:none}
  .music-widget *,.quote-widget *{transition-duration:.01ms!important}
}
