*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#eef2f8;--panel:#ffffff;--panel2:#f2f5fa;--border:#e2e8f2;
  --text:#1b2437;--muted:#7c889e;--brand:#2aabee;--brand-weak:#e3f2fe;
  --ok:#1eae7c;--warn:#e8a13c;--err:#e5484d;
  --shadow:0 1px 2px rgba(16,24,40,.05),0 4px 16px rgba(16,24,40,.06);
  --shadow-lg:0 8px 30px rgba(16,24,40,.14);
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#0e1320;--panel:#161d2e;--panel2:#1c2438;--border:#253050;
  --text:#e8edf7;--muted:#8b96ad;--brand:#2aabee;--brand-weak:#13293e;
  --ok:#34c98e;--warn:#e7b03c;--err:#f06a6a;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.25);
  --shadow-lg:0 8px 30px rgba(0,0,0,.45);
  color-scheme:dark;
}
body{background:var(--bg);color:var(--text);font:14px/1.5 "Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;transition:background .2s,color .2s}
button{font-family:inherit}
[hidden]{display:none!important}

/* ---------- 顶栏(毛玻璃) ---------- */
.topbar{display:flex;align-items:center;gap:20px;padding:0 20px;height:56px;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10;background:var(--panel);background:color-mix(in srgb, var(--panel) 72%, transparent);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%)}
.brand{font-weight:700;font-size:16px;color:var(--brand);white-space:nowrap;display:flex;align-items:center;gap:8px}
.brand::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px var(--brand-weak)}
.tabs{display:flex;gap:2px;background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:3px}
.tab{background:none;border:none;color:var(--muted);padding:6px 14px;cursor:pointer;font-size:13px;border-radius:8px;transition:.15s}
.tab:hover{color:var(--text)}
.tab.active{background:var(--panel);color:var(--text);font-weight:600;box-shadow:0 1px 3px rgba(16,24,40,.12)}
:root[data-theme="dark"] .tab.active{background:var(--panel2);box-shadow:0 1px 3px rgba(0,0,0,.4)}
.top-status{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted);white-space:nowrap;margin-left:auto}
.pill{background:var(--panel2);border:1px solid var(--border);border-radius:999px;padding:4px 12px;display:flex;align-items:center;gap:6px}
.pill .dot{margin:0}
.badge-on{color:var(--ok);font-weight:600}
.badge-off{color:var(--muted)}
.theme-btn{background:var(--panel2);border:1px solid var(--border);border-radius:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--muted);transition:.15s}
.theme-btn:hover{color:var(--brand);border-color:var(--brand)}
.theme-btn svg{width:16px;height:16px;fill:currentColor}

/* 黑白主题切换过渡:新主题从切换按钮位置圆形扩散,旧主题被慢慢挤出去 */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}
::view-transition-new(root){z-index:9999;animation:themeReveal .55s ease-in-out}
@keyframes themeReveal{from{clip-path:circle(0px at var(--tx,50%) var(--ty,0px))}to{clip-path:circle(150% at var(--tx,50%) var(--ty,0px))}}
.unread-badge{background:var(--err);color:#fff;border-radius:9px;padding:0 6px;font-size:11px;margin-left:4px}

/* ---------- 布局 ---------- */
main{max-width:1180px;margin:20px auto;padding:0 16px}
.tab-panel{display:none;animation:fadeIn .22s ease}
.tab-panel.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px;margin-bottom:16px;box-shadow:var(--shadow)}
.card.narrow{max-width:720px}
h3{font-size:15px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
h3::before{content:"";width:3px;height:14px;border-radius:2px;background:var(--brand)}
.hint{color:var(--muted);font-size:12px;margin:6px 0;line-height:1.8}

/* ---------- 统计卡片(入场动画) ---------- */
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.stat-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:14px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:2px;animation:riseIn .4s ease backwards}
.stat-card:nth-child(1){animation-delay:.02s}
.stat-card:nth-child(2){animation-delay:.08s}
.stat-card:nth-child(3){animation-delay:.14s}
.stat-card:nth-child(4){animation-delay:.2s}
@keyframes riseIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.stat-num{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}
.stat-num.ok{color:var(--ok)}
.stat-num.brand{color:var(--brand)}
.stat-label{font-size:12px;color:var(--muted)}

/* ---------- 表单 ---------- */
.form-row{margin-bottom:10px}
.form-row label{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}
.form-row input[type=text],.form-row input[type=number],.form-row input[type=password],textarea,select{width:100%;background:var(--panel2);border:1px solid var(--border);border-radius:10px;color:var(--text);padding:9px 12px;font-size:13px;outline:none;transition:border .15s}
.form-row input:focus,textarea:focus,select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
.form-row.inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.form-row.inline label{margin:0;display:flex;align-items:center;gap:6px}
textarea{resize:vertical;font-family:inherit}

/* ---------- 按钮 ---------- */
.btn{background:var(--panel2);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:8px 16px;cursor:pointer;font-size:13px;transition:.15s}
.btn:hover{border-color:var(--brand);color:var(--brand)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.btn.primary:hover{filter:brightness(1.08);color:#fff}
.btn.danger{border-color:var(--err);color:var(--err)}
.btn.danger:hover{background:var(--err);color:#fff}
.btn.big{font-size:16px;padding:12px 32px;border-radius:12px}
.btn.sm{padding:4px 10px;font-size:12px;border-radius:8px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn:active{transform:scale(.96)}
.btn-row{display:flex;gap:8px;margin:10px 0;flex-wrap:wrap}

/* ---------- 表格 ---------- */
.table{width:100%;border-collapse:collapse;font-size:13px}
.table th,.table td{text-align:left;padding:10px;border-bottom:1px solid var(--border)}
.table th{color:var(--muted);font-weight:500;font-size:12px}
.table tbody tr:hover{background:var(--panel2)}
.table .actions{white-space:nowrap}
.table .actions .btn{margin-right:4px;margin-bottom:2px}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.dot.ok{background:var(--ok)}.dot.err{background:var(--err)}.dot.warn{background:var(--warn)}.dot.idle{background:var(--muted)}.dot.brand{background:var(--brand)}
.sub{color:var(--muted);font-size:12px}
.err-text{color:var(--err);font-size:12px;max-width:260px;white-space:normal}

/* ---------- 日志(终端风,双主题保持深色) ---------- */
.log{background:#0d1220;border:1px solid #232c45;border-radius:10px;height:300px;overflow-y:auto;padding:12px;font:12px/1.8 Consolas,monospace}
.log-line{color:#c6d0e2;word-break:break-all}
.log-line.ok{color:#34c98e}.log-line.warn{color:#e7b03c}.log-line.err{color:#f06a6a}
.log-t{color:#5a6685;margin-right:8px}

/* ---------- 群组选择 ---------- */
details{background:var(--panel2);border:1px solid var(--border);border-radius:10px;margin-bottom:8px}
summary{padding:10px 12px;cursor:pointer;font-size:13px;user-select:none}
.group-chips{display:flex;flex-wrap:wrap;gap:6px;padding:10px;max-height:260px;overflow-y:auto}
.chip{display:flex;align-items:center;gap:4px;background:var(--panel);border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:12px;cursor:pointer;transition:.15s}
.chip:hover{border-color:var(--brand);color:var(--brand)}
.run-box{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.switch-row{display:flex;align-items:center;gap:8px;margin:10px 0;font-size:14px;cursor:pointer}
.switch-row input{width:16px;height:16px;accent-color:var(--brand)}
input[type=checkbox],input[type=radio]{accent-color:var(--brand)}

/* ---------- 对话 ---------- */
.chat-wrap{display:flex;height:calc(100vh - 140px);padding:0;overflow:hidden}
.chat-left{width:300px;border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0}
.chat-left select{margin:10px;border-radius:10px}
.conv-list{flex:1;overflow-y:auto;list-style:none}
.conv{padding:10px 14px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s}
.conv:hover{background:var(--panel2)}
.conv.active{background:var(--panel2);box-shadow:inset 3px 0 0 var(--brand)}
.conv-top{display:flex;justify-content:space-between;font-size:13px;gap:8px}
.conv-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conv-time{color:var(--muted);font-size:11px;flex-shrink:0}
.conv-sub{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;margin-top:2px}
.conv-acc{background:var(--panel2);border:1px solid var(--border);border-radius:4px;padding:0 4px;flex-shrink:0;font-size:11px}
.conv-last{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unread{background:var(--err);color:#fff;border-radius:9px;padding:0 6px;font-size:11px;font-weight:700;flex-shrink:0}
.chat-right{flex:1;display:flex;flex-direction:column;min-width:0}
.chat-head{padding:12px 16px;border-bottom:1px solid var(--border);font-weight:600;font-size:14px}
.chat-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--panel2)}
.msg{max-width:70%;padding:9px 13px;border-radius:12px;background:var(--panel);border:1px solid var(--border);align-self:flex-start;white-space:pre-wrap;word-break:break-word;font-size:13px}
.msg.out{align-self:flex-end;background:var(--brand);border-color:var(--brand);color:#fff}
.msg-meta{font-size:10px;opacity:.65;margin-top:4px;text-align:right}
.chat-input{display:flex;gap:8px;padding:10px;border-top:1px solid var(--border);background:var(--panel)}
.chat-input input{flex:1;background:var(--panel2);border:1px solid var(--border);border-radius:10px;color:var(--text);padding:10px 14px;font-size:13px;outline:none}
.chat-input input:focus{border-color:var(--brand)}

/* ---------- 弹窗(单群任务) ---------- */
.modal-mask{position:fixed;inset:0;background:rgba(8,12,22,.55);z-index:90;display:flex;align-items:center;justify-content:center;padding:16px}
.modal-mask[hidden]{display:none}
.modal-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px 20px;width:100%;max-width:430px;box-shadow:var(--shadow-lg);animation:riseIn .25s ease}
.modal-card h3{margin-bottom:12px}

/* ---------- 音乐悬浮球 ---------- */
.music-ball{position:fixed;right:24px;bottom:24px;width:54px;height:54px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-lg);z-index:60;transition:transform .15s}

/* ---------- 运行日志悬浮窗 ---------- */
.log-fab{position:fixed;left:24px;bottom:24px;width:46px;height:46px;border-radius:12px;background:var(--panel);border:1px solid var(--border);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-lg);z-index:60;transition:.15s}
.log-fab:hover{color:var(--brand);border-color:var(--brand)}
.log-fab svg{width:20px;height:20px;fill:currentColor}
.log-drawer{position:fixed;left:24px;bottom:82px;width:min(500px,90vw);background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-lg);z-index:60;padding:12px;animation:riseIn .2s ease}
.ld-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-weight:600;font-size:13px}
.log-drawer .log{height:300px}
.music-ball:hover{transform:scale(1.08)}
.music-ball:active{transform:scale(.94)}
.music-ball svg{width:24px;height:24px;fill:currentColor}
.music-ball .mb-note{transform-origin:30% 70%}
.music-ball.playing .mb-note{animation:bounce 1s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg) translateY(-2px)}}
.music-ball.playing::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--brand);opacity:0;animation:ripple 1.6s ease-out infinite}
@keyframes ripple{0%{transform:scale(.9);opacity:.7}100%{transform:scale(1.35);opacity:0}}
.music-panel{position:fixed;right:24px;bottom:90px;width:300px;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-lg);padding:16px;z-index:60;animation:slideUp .22s ease;background:var(--panel);background:color-mix(in srgb, var(--panel) 82%, transparent);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%)}
@keyframes slideUp{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.mp-row{display:flex;gap:10px;align-items:center}
.mp-cover{width:52px;height:52px;border-radius:10px;object-fit:cover;background:var(--panel2);flex-shrink:0}
.mp-info{flex:1;min-width:0}
.mp-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-artist{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.mp-close{background:none;border:none;color:var(--muted);cursor:pointer;padding:4px;border-radius:6px;flex-shrink:0}
.mp-close:hover{color:var(--text);background:var(--panel2)}
.mp-close svg{width:14px;height:14px;fill:currentColor}
.mp-search{display:flex;gap:6px;margin-top:12px}
.mp-search input{flex:1;background:var(--panel2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:7px 10px;font-size:12px;outline:none;min-width:0}
.mp-search input:focus{border-color:var(--brand)}
.mp-seek{width:100%;margin:14px 0 4px;accent-color:var(--brand);cursor:pointer}
.mp-times{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.mp-controls{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap;row-gap:8px}
.photo-preview{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid rgba(128,128,128,.4)}
.mp-controls.center{justify-content:center;gap:18px;margin-top:10px}
.mp-controls .mp-btn.word{padding:0 8px}
.stack{display:flex;flex-direction:column;gap:16px;min-width:0}
button.chip{font-family:inherit;justify-content:center}
.mp-btn{background:var(--panel2);border:1px solid var(--border);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text);transition:.15s;flex-shrink:0}
.mp-btn:hover{border-color:var(--brand);color:var(--brand)}
.mp-btn:active{transform:scale(.9)}
.mp-btn.main{width:44px;height:44px;background:var(--brand);border-color:var(--brand);color:#fff}
.mp-btn.main:hover{filter:brightness(1.08);color:#fff}
.mp-btn svg{width:16px;height:16px;fill:currentColor}
.mp-btn.word{width:auto;border-radius:8px;padding:0 10px;font-size:12px;font-weight:600}
.mp-btn.word.active{background:var(--brand);border-color:var(--brand);color:#fff}
.mp-vol{flex:1;accent-color:var(--brand);cursor:pointer;min-width:40px}
.mp-results{margin-top:10px;max-height:180px;overflow-y:auto;border-top:1px solid var(--border)}
.mp-r-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 6px;font-size:12px;cursor:pointer;border-bottom:1px solid var(--border);border-radius:6px;transition:.12s;animation:fadeIn .2s ease}
.mp-r-item:hover{background:var(--panel2);color:var(--brand)}
.mp-r-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-r-artist{color:var(--muted);flex-shrink:0;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-r-fav{flex-shrink:0;border:none;background:none;color:var(--muted);font-size:14px;line-height:1;cursor:pointer;padding:0 2px;transition:.12s}
.mp-r-fav.on{color:var(--err)}
.mp-r-fav:hover{transform:scale(1.2)}
#mp-fav-btn.active{background:var(--err);border-color:var(--err);color:#fff}
.mp-r-hint{font-size:12px;color:var(--muted);padding:8px 4px;text-align:center}
.mp-hint{font-size:11px;color:var(--muted);margin-top:10px;text-align:center}

/* ---------- 悬浮歌词(毛玻璃/纯文字双背景,可拖动、可调字号) ---------- */
.lyric-bar{display:flex;align-items:center;gap:8px;position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:70;width:min(56vw,860px);padding:9px 18px;border-radius:999px;border:1px solid var(--border);box-shadow:var(--shadow);cursor:grab;user-select:none;background:var(--panel);background:color-mix(in srgb, var(--panel) 72%, transparent);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);transition:box-shadow .2s,background .2s,border-color .2s}
.lyric-bar:hover{box-shadow:var(--shadow-lg)}
.lyric-bar.dragging{cursor:grabbing;transition:none}
.lyric-text{display:block;flex:1;min-width:0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--lyric-size,16px);font-weight:500;color:var(--text)}
.lyric-text.pop{animation:lyricPop .28s ease}
@keyframes lyricPop{from{opacity:.15;transform:translateY(5px)}to{opacity:1;transform:none}}
.lb-ctrl{position:absolute;left:14px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:4px;opacity:0;transition:opacity .15s}
.lyric-bar:hover .lb-ctrl{opacity:1}
.lb-btn{width:24px;height:24px;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--muted);font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.12s;padding:0}
.lb-btn:hover{color:var(--brand);border-color:var(--brand)}
/* 纯文字模式:无背景,白字+阴影保证任何页面上都可读 */
.lyric-bar.blank{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.lyric-bar.blank .lyric-text{color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.65),0 0 2px rgba(0,0,0,.5)}
.lyric-bar.blank .lb-btn{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.4);background:rgba(0,0,0,.3)}
.lyric-bar.blank .lb-close{background:rgba(0,0,0,.3);color:rgba(255,255,255,.85)}
.lb-close{width:20px;height:20px;border:none;border-radius:50%;background:var(--panel2);color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;padding:0}
.lb-close:hover{color:var(--err);background:var(--panel2)}
.lb-close svg{width:10px;height:10px;fill:currentColor}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(20px);background:var(--panel);border:1px solid var(--brand);color:var(--text);padding:10px 18px;border-radius:10px;opacity:0;transition:.2s;pointer-events:none;z-index:99;font-size:13px;max-width:80vw;box-shadow:var(--shadow-lg)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{border-color:var(--err);color:var(--err)}

/* ---------- 侧边栏抽屉 ---------- */
.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border);background:var(--panel2);border-radius:9px;cursor:pointer;color:var(--muted);transition:.15s;padding:0;flex:none}
.nav-toggle:hover{color:var(--brand);border-color:var(--brand)}
.nav-toggle svg{width:20px;height:20px;fill:currentColor}
.sidebar{position:fixed;top:0;left:0;bottom:0;width:242px;background:var(--panel);border-right:1px solid var(--border);z-index:70;transform:translateX(-103%);transition:transform .25s ease;box-shadow:6px 0 28px rgba(10,16,32,.22);display:flex;flex-direction:column;overflow-y:auto}
.sidebar.open{transform:translateX(0)}
.sb-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px;flex:none}
.sb-title{font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px}
.sb-title::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px var(--brand-weak)}
.sb-close{background:none;border:none;cursor:pointer;color:var(--muted);width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;transition:.15s;padding:0}
.sb-close:hover{color:var(--text);background:var(--panel2)}
.sb-close svg{width:14px;height:14px;fill:currentColor}
.side-nav{display:flex;flex-direction:column;gap:2px;padding:2px 10px 18px}
.side-nav .tab{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 14px;font-size:14px;border-radius:9px}
.side-nav .tab svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side-nav .tab.active{background:var(--brand);color:#fff;font-weight:600;box-shadow:0 2px 8px var(--brand-weak)}
.sidebar-mask{position:fixed;inset:0;background:rgba(8,12,24,.48);z-index:65;opacity:0;pointer-events:none;transition:opacity .22s ease}
.sidebar-mask.show{opacity:1;pointer-events:auto}

@media (max-width:900px){
  .grid-2{grid-template-columns:1fr}
  .chat-left{width:220px}
  .stats-strip{grid-template-columns:repeat(2,1fr)}
}

/* ---------- 登录 / 注册页 ---------- */
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg)}
.auth-wrap{width:min(380px,92vw)}
.auth-card{padding:28px 26px;box-shadow:var(--shadow-lg)}
.auth-brand{font-size:22px;font-weight:700;text-align:center;margin-bottom:18px;color:var(--brand)}
.auth-tabs{display:flex;gap:8px;margin-bottom:14px}
.auth-tabs button{flex:1;padding:8px 0;border:1px solid var(--border);background:var(--panel2);border-radius:8px;cursor:pointer;color:var(--text);font-size:14px;transition:.15s}
.auth-tabs button.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.auth-msg{min-height:18px;margin:8px 0 0;color:var(--err);font-size:13px;word-break:break-all}
.auth-card .btn.big{width:100%;padding:11px 0;font-size:15px}

/* ---------- 侧边栏用户卡(账号名 / 到期时间) ---------- */
.sb-user{margin:0 12px 8px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--panel2);flex:none}
.sbu-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sbu-name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbu-badge{font-size:11px;color:#fff;background:var(--err);border-radius:6px;padding:1px 6px;flex:none}
.sbu-expire{font-size:12px;color:var(--muted);margin:4px 0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbu-expire.exp-warn{color:var(--err)}
.sbu-btns{display:flex;gap:6px}
.sbu-btns .btn{flex:1}
.sbu-chpw{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.sbu-chpw input{width:100%}
.exp-warn{color:var(--err)}

/* ---------- 到期遮罩 ---------- */
.expired-mask{position:fixed;inset:0;background:rgba(10,14,24,.62);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center}
.expired-card{width:min(420px,92vw);padding:24px}
.expired-card .form-row{margin-top:12px}
#redeem-msg{min-height:18px}

/* ---------- 管理后台 ---------- */
.admin-body{display:block}
#dash main{max-width:1200px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:14px}
#dash .card h3{margin:0}
.row-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.table-wrap{overflow-x:auto}
.table .actions{display:flex;gap:6px;flex-wrap:wrap}
.table .actions .btn{text-decoration:none;display:inline-flex;align-items:center}
.sub-row td{background:var(--panel2)}
.exp-editor{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.mono{font-family:ui-monospace,Consolas,monospace;letter-spacing:.5px}
#gen-codes{width:100%;font-family:ui-monospace,Consolas,monospace}