/* =====================================================================
 * td.css  问鼎天峰全站样式
 * 分层：主题变量 → 基础布局 → 奖池卡片 → 弹窗/里程碑/自选 → 播放器 → 悬浮入口 → 移动端与触屏适配
 * 主题：所有可配色项走 :root 变量；暗黑为默认，<html data-theme="pink"> 切粉色少女风（右上角按钮切换并本地记忆）
 *       稀有度文字色 item-S..D 也走变量，保证浅粉底下仍可读；品质描边/淡底、红橙绿蓝状态色两主题通用，保持字面值
 * 兼容：未使用 inset 简写、播放器半透明只在 (hover:hover) 生效，老内核/触屏降级见各段注释
 * ===================================================================== */
*{box-sizing:border-box;margin:0;padding:0;font-family:var(--font-body);}
/* ===== 主题变量：暗黑（默认） ===== */
:root{
    --font-body:"Microsoft Yahei",SimHei,sans-serif;
    --bg:#12141a;
    --bg-glow:#272b36;
    --text:#e8e2d6;
    --text-2:#ccc;
    --panel:#171a22;
    --panel-2:#1a1d26;
    --surface:#1e212b;
    --surface-2:#252833;
    --surface-hover:#333846;
    --track:#2c303b;
    --border:#444854;
    --border-2:#33384a;
    --line:#8c7448;
    --accent:#f0d890;
    --accent-2:#ffdf88;
    --accent-deep:#d4af37;
    --muted:#b8a888;
    --glow:rgba(240,216,144,0.6);
    --range-track:#3a3f4d;
    --mp-bar:rgba(26,29,38,0.6);
    --qun-tip:rgba(26,29,38,0.92);
    --qun-float-bg:rgba(18,20,26,0.88);
    /* 稀有度文字：深底用亮色 */
    --item-S:#ff9ec0;
    --item-A:#ffdf88;
    --item-B:#c8a8ee;
    --item-C:#82b8ff;
    --item-D:#88e2a8;
    /* 圆角尺度：暗黑偏克制、粉色更圆润软萌 */
    --r-btn:10px;
    --r-card:12px;
    --r-panel:16px;
    --r-modal:20px;
    --r-pill:999px;
}
/* ===== 主题变量：粉色 · 少女风（柔樱花粉氛围 + 奶油米白底，深棕灰文字保可读） ===== */
[data-theme="pink"]{
    --bg:#fff7f9;          /* 奶油米白，非纯白，护眼 */
    --bg-glow:#ffe3ec;
    --text:#44333a;        /* 正文深棕灰，WCAG 达标 */
    --text-2:#886e78;
    --panel:#ffffff;       /* 卡片纯白，保证文字可读 */
    --panel-2:#fffafb;
    --surface:#ffc8d8;     /* 主色柔樱花粉：按钮/页签底 */
    --surface-2:#ffdcea;
    --surface-hover:#ffa8c2; /* 交互加深 */
    --track:#f3d6e0;
    --border:#e8d4f2;      /* 香芋浅紫：边框/分割线 */
    --border-2:#ead9f0;
    --line:#ffa8c2;
    --accent:#b85878;      /* 标题低饱和玫瑰红 */
    --accent-2:#c9647f;
    --accent-deep:#e6a9c4;
    --muted:#886e78;
    --glow:rgba(255,168,194,0.5);
    --range-track:#f3d6e0;
    --mp-bar:rgba(255,220,234,0.9);
    --qun-tip:rgba(255,247,249,0.97);
    --qun-float-bg:rgba(255,236,243,0.95);
    /* 点缀色：香芋浅紫 / 奶油薄荷 / 装饰金（仅小面积） */
    --lilac:#e8d4f2;
    --mint:#d4f2e8;
    --gold:#e6c8a8;
    /* 稀有度文字：白底取深色系，S 用玫瑰红呼应主色 */
    --item-S:#c2477e;
    --item-A:#a8791c;
    --item-B:#7a52b0;
    --item-C:#3a6ea5;
    --item-D:#2f8f5b;
    /* 少女风圆角：按钮/标签药丸，卡片 18，容器 22，弹窗 14 */
    --r-btn:999px;
    --r-card:18px;
    --r-panel:22px;
    --r-modal:14px;
    --font-body:"ZCOOL KuaiLe","Yuanti SC","YouYuan","幼圆","HanziPen SC","华康POP2体","娃娃体","Wawati SC","WenQuanYi Free Zenhei","PingFang SC","Microsoft YaHei",sans-serif;
}
/* ===== 主题变量：护眼薄荷（低饱和绿，长时间观看不累） ===== */
[data-theme="mint"]{
    --bg:#f2f9f6;
    --bg-glow:#dcefe7;
    --text:#2f4a42;
    --text-2:#5c7a70;
    --panel:#ffffff;
    --panel-2:#f6fbf9;
    --surface:#d4f2e8;
    --surface-2:#e2f6ef;
    --surface-hover:#b8e8d8;
    --track:#cfe8df;
    --border:#bfe3d6;
    --border-2:#cfe9df;
    --line:#8fd3bd;
    --accent:#2f8f74;
    --accent-2:#268a6f;
    --accent-deep:#5fbfa2;
    --muted:#5c7a70;
    --glow:rgba(47,143,116,0.4);
    --range-track:#cfe8df;
    --mp-bar:rgba(210,240,231,0.9);
    --qun-tip:rgba(242,249,246,0.97);
    --qun-float-bg:rgba(226,246,239,0.95);
    --lilac:#cfe9df;
    --mint:#d4f2e8;
    --gold:#e6c8a8;
    --item-S:#c2477e;
    --item-A:#a8791c;
    --item-B:#7a52b0;
    --item-C:#3a6ea5;
    --item-D:#2f8f5b;
    --r-btn:999px;
    --r-card:18px;
    --r-panel:22px;
    --r-modal:14px;
    --font-body:"ZCOOL KuaiLe","Yuanti SC","YouYuan","幼圆","HanziPen SC","华康POP2体","娃娃体","Wawati SC","WenQuanYi Free Zenhei","PingFang SC","Microsoft YaHei",sans-serif;
}
/* 触屏：去掉点击时的灰白高亮块，观感更接近原生 */
button,a,.item-card,.sel-chip,.qun-btn,.btn-tab{-webkit-tap-highlight-color:transparent;}
body{
    background:var(--bg);
    color:var(--text);
    /* 阻止安卓 webview（QQ/贴吧有字体大小设置）自动放大导致布局错乱 */
    -webkit-text-size-adjust:100%;
    background-image:radial-gradient(circle at 50% 0,var(--bg-glow) 0,var(--bg) 70%);
    min-height:100vh;
    padding:16px;
}
.container{
    max-width:1240px;
    margin:0 auto;
    position:relative;
}
.header{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
    position:relative;
    min-height:40px;
}
.header h1{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    font-size:28px;
    color:var(--accent);
    letter-spacing:4px;
    margin:0;
    white-space:nowrap;
    pointer-events:none;
    text-align:center;
}
/* 主题切换按钮：固定在页头右上角，胶囊造型，配色跟随当前主题变量 */
.theme-toggle{
    position:absolute;top:0;right:0;z-index:6;
    padding:6px 13px;font-size:13px;line-height:1.4;cursor:pointer;
    color:var(--accent);background:var(--surface);
    border:1px solid var(--line);border-radius:999px;white-space:nowrap;
}
.theme-toggle:hover{background:var(--surface-hover);}
.top-bar{
    /* 撑满容器宽度（与下方面板同宽）并作为定位参照；内部 .round-tabs 限宽 820 居中，
       重置按钮绝对定位 right:0 即贴容器/面板右边缘，与下方对齐 */
    position:relative;
    margin:0 auto 16px;
}
.round-tabs{
    /* 轮次 tab：沿用 grid auto-fit 三等分限宽 820 居中 */
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    gap:10px;
    max-width:820px;
    margin:0 auto;
}
.btn-tab{
    min-width:0;
    padding:10px clamp(8px,2vw,22px);
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--accent);
    border-radius:var(--r-btn);
    cursor:pointer;
    /* 字号随视口缩放，窄屏也能容下完整轮次名 */
    font-size:clamp(13px,1.5vw,16px);
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.btn-tab.active{
    background:var(--line);
    color:#000;
}
.btn-tab:disabled{
    opacity:0.35;
    cursor:not-allowed;
}
/* 未解锁轮次 tab：置灰去色 + 小锁标；不禁用点击，留给 switchRound 弹提示说清解锁条件 */
.btn-tab.tab-locked{
    opacity:0.45;
    filter:grayscale(0.7);
    cursor:not-allowed;
}
.btn-tab.tab-locked::after{content:" 🔒";}
/* 重置按钮：绝对定位在轮次行最右、贴容器右缘与下方面板对齐（top 50%+translateY 垂直居中），保持紧凑 */
#btn-reset{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    background:#5a1f1f;
    border-color:#a34747;
    color:#ffb3a7;
    font-size:13px;
    padding:6px 14px;
    white-space:nowrap;
}
#btn-reset:hover{background:#7c2a2a;color:#ffd6cc;}
.btn{
    padding:9px 14px;
    border:1px solid var(--line);
    background:var(--surface-2);
    color:var(--accent);
    border-radius:var(--r-btn);
    cursor:pointer;
    font-size:14px;
}
.btn:hover{background:var(--surface-hover);}
/* 开始抽奖：比左侧普通按钮突出，但弱于右侧里程碑高亮 */
#btn-draw{background:#4a3f28;border-color:#a58a54;color:#ffe58a;}
#btn-draw:hover{background:#5a4d31;}
/* 里程碑按钮：特殊高亮样式 */
.btn-milestone{
    position:relative;
    border:1px solid #eac54f;
    background:linear-gradient(135deg,#8c7448,#d4af37 55%,#ffe58a);
    color:#241a00;
    font-weight:bold;
    letter-spacing:1px;
    text-shadow:0 1px 0 rgba(255,255,255,0.35);
    box-shadow:0 0 10px rgba(212,175,55,0.5);
    animation:msGlow 1.8s ease-in-out infinite;
}
.btn-milestone:hover{background:linear-gradient(135deg,#a1864f,#eac54f 55%,#fff0b8);}
@keyframes msGlow{0%,100%{box-shadow:0 0 6px rgba(212,175,55,0.45);}50%{box-shadow:0 0 18px rgba(212,175,55,0.9);}}
.info-panel{
    border:1px solid var(--border);
    padding:16px 20px;
    border-radius:var(--r-panel);
    background:var(--panel-2);
    margin-bottom:16px;
}
.info-row{
    display:flex;
    gap:10px 24px;
    flex-wrap:wrap;
    font-size:15px;
    line-height:1.8;
    margin:5px 0;
}
.label{color:var(--muted);}
.pool-wrap{
    border:1px solid var(--border);
    padding:16px;
    border-radius:var(--r-panel);
    background:var(--panel);
    margin-bottom:16px;
}
.pool-title{
    font-size:18px;
    color:var(--accent);
    margin-bottom:14px;
}
.grade-block{
    margin:16px 0;
    padding:12px;
    border-radius:var(--r-card);
    border-left:4px solid;
}
.block-title{
    font-size:16px;
    font-weight:bold;
    margin-bottom:10px;
}
.block-S{border-left-color:#e86ea0;background:rgba(232,110,160,0.06);}
.block-A{border-left-color:#d4af37;background:rgba(212,175,55,0.06);}
.block-B{border-left-color:#9966cc;background:rgba(153,102,204,0.06);}
.block-C{border-left-color:#4288dd;background:rgba(66,136,221,0.06);}
.block-D{border-left-color:#37b865;background:rgba(55,184,101,0.06);}
.grid-block{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
    gap:10px;
}
.item-card{
    padding:10px 12px;
    border-radius:var(--r-card);
    border:1px solid;
    font-size:14px;
    line-height:1.4;
}
.item-S{border-color:#e86ea0;background:rgba(232,110,160,0.12);color:var(--item-S);}
.item-A{border-color:#d4af37;background:rgba(212,175,55,0.12);color:var(--item-A);}
.item-B{border-color:#9966cc;background:rgba(153,102,204,0.12);color:var(--item-B);}
.item-C{border-color:#4288dd;background:rgba(66,136,221,0.12);color:var(--item-C);}
.item-D{border-color:#37b865;background:rgba(55,184,101,0.12);color:var(--item-D);}
/* 已抽中奖励：柔和淡底 + 同色描边环 + 右上角自绘小徽标（底色随主题，勾更清晰） */
.item-card.drawn{outline:2px solid currentColor;box-shadow:0 0 10px rgba(255,255,255,0.2);position:relative;}
/* 触屏没有 hover，抽中次数直接写进徽标里，attr 取 data-hit */
.item-card.drawn::after{content:"✔"attr(data-hit);position:absolute;top:5px;right:6px;font-weight:bold;font-size:12px;line-height:1;color:inherit;background:var(--panel);border:1.5px solid currentColor;border-radius:999px;padding:3px 6px;}
.item-S.drawn{background:rgba(232,110,160,0.22);}
.item-A.drawn{background:rgba(212,175,55,0.22);}
.item-B.drawn{background:rgba(153,102,204,0.22);}
.item-C.drawn{background:rgba(66,136,221,0.22);}
.item-D.drawn{background:rgba(55,184,101,0.22);}
/* S区：整行长条，单行限高 */
.grid-full{grid-template-columns:1fr;}
.card-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:46px;}
.operate-bar{
    display:flex;
    gap:10px;
    margin:16px 0;
    flex-wrap:wrap;
    align-items:center;
}
.right-group{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:12px;
}
/* 本轮节省标签：贴在导出按钮左侧；有免费抵扣时点亮金色，无节省时退为中性灰不抢戏 */
.save-stat{
    display:inline-flex;align-items:center;
    padding:7px 14px;font-size:13px;
    border:1px solid var(--border);border-radius:var(--r-btn);
    background:var(--surface-2);color:var(--muted);cursor:default;
    transition:color .2s,border-color .2s,box-shadow .2s;
}
.save-stat.save-hot{
    border-color:var(--accent-deep);color:var(--accent-2);font-weight:bold;
    background:linear-gradient(135deg,rgba(212,175,55,0.16),var(--surface-2));
    box-shadow:0 0 10px rgba(212,175,55,0.35);
}
.log-wrap{
    border:1px solid var(--border);
    padding:12px;
    border-radius:var(--r-panel);
    background:var(--panel);
    max-height:220px;
    overflow-y:auto;
}
.log-item{
    font-size:13px;
    color:var(--text-2);
    line-height:1.7;
    padding:5px 2px;
    border-bottom:var(--track) 1px solid;
}
.modal-mask{
    position:fixed;
    /* 不用 inset 简写：老 X5/WKWebView（Chromium<87 / iOS<14.1）不支持会导致遮罩错位 */
    top:0;right:0;bottom:0;left:0;
    background:rgba(0,0,0,0.75);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:999;
    padding:10px;
}
.modal-box{
    width:100%;
    max-width:760px;
    max-height:85vh;
    overflow-y:auto;
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:var(--r-modal);
    padding:20px;
    position:relative;
}
.modal-close{
    /* sticky 代替 absolute：弹窗内容滚动时关闭按钮始终钉在可视区右上，不会滚丢（兼容基线 iOS14.1+ 原生支持） */
    position:sticky;
    top:4px;
    z-index:6;
    display:block;
    /* 负 margin：不占行高让标题同行共享，右负边补偿到原 absolute 的贴边位置 */
    margin:0 -8px -30px auto;
    width:30px;height:30px;
    /* 不用 × 字形：各内核/字体基线不一观感偏斜（同暂停竖条前例），改 CSS 自绘居中十字 */
    font-size:0;
    color:var(--muted);
    background:var(--panel);
    border:1px solid var(--border);
    border-radius:50%;
    cursor:pointer;
}
.modal-close::before,.modal-close::after{
    content:"";position:absolute;left:50%;top:50%;
    width:12px;height:2px;border-radius:1px;background:currentColor;
    transform:translate(-50%,-50%) rotate(45deg);
}
.modal-close::after{transform:translate(-50%,-50%) rotate(-45deg);}
.modal-close:hover{color:var(--accent);border-color:var(--line);background:var(--surface-2);}
.modal-title{
    font-size:20px;
    color:var(--accent);
    margin-bottom:14px;
    padding-right:36px;
}
/* ===== 里程碑弹窗：梦幻成长线（前面轻描淡写暖场物 → 后面金光压轴，视觉分量随价值递增） ===== */
.ms-summary{
    border:1px solid var(--line);
    border-radius:var(--r-panel);
    padding:16px 18px;
    margin-bottom:20px;
    background:linear-gradient(135deg,rgba(212,175,55,0.12),var(--panel) 62%);
}
/* 大数字总览：当前令牌量做视觉锤 */
.ms-sum-hero{display:flex;align-items:baseline;gap:10px;}
.ms-sum-hero b{font-size:34px;line-height:1;color:var(--accent-2);}
.ms-sum-hero span{font-size:13px;color:var(--muted);}
.ms-sum-go{font-size:14px;color:var(--text-2);margin:10px 0 8px;}
.ms-sum-go b{color:var(--accent);}
.ms-remain{color:#ff9460;}
.ms-bar{height:10px;background:var(--track);border-radius:5px;overflow:hidden;}
.ms-bar>span{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--line),var(--accent));box-shadow:0 0 8px var(--glow);transition:width .4s;}
.ms-list{position:relative;}
/* 成长轨道：起点樱花粉渐变到终点鎏金，呼应“越往后越珍贵”；卡片背景盖住轨道、只在卡片间隙露出，像串联的路径 */
.ms-list::before{
    content:"";position:absolute;left:36px;top:16px;bottom:16px;width:3px;border-radius:2px;z-index:0;
    background:linear-gradient(to top,#f0a8c8,#c9a0e8 38%,#e8c86a 75%,#ffd75e);
}
.ms-node{
    position:relative;display:flex;align-items:center;gap:14px;
    padding:12px 16px;margin:10px 0;border-radius:var(--r-panel);
    border:1px solid var(--border-2);background:var(--panel);
    transition:transform .15s,box-shadow .2s,border-color .2s;
}
.ms-node:hover{transform:translateX(3px);}
/* 悬停时按节点状态跟着变色 */
.ms-done:hover{border-color:var(--accent-2);background:linear-gradient(135deg,rgba(212,175,55,0.28),rgba(212,175,55,0) 70%),var(--panel);box-shadow:0 0 20px rgba(212,175,55,0.65);}
.ms-done:hover .ms-reward{color:var(--accent-2);}
.ms-active:hover{border-color:#82b8ff;background:linear-gradient(135deg,rgba(66,136,221,0.26),rgba(66,136,221,0) 70%),var(--panel);box-shadow:0 0 18px rgba(66,136,221,0.6);}
.ms-active:hover .ms-badge{background:none;}   /* 悬停不恢复蓝圆底，⭐表情裸显 */
.ms-active:hover .ms-reward{color:var(--item-C);}
.ms-locked:hover{border-color:#8888aa;background:var(--surface-hover);box-shadow:0 0 10px rgba(150,150,170,0.35);}
.ms-locked:hover .ms-body{opacity:1;}
.ms-locked:hover .ms-reward{color:var(--text-2);}
.ms-locked:hover .ms-badge{background:var(--track);color:#bbb;}
.ms-badge{
    flex:none;width:42px;height:42px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:16px;font-weight:bold;
}
.ms-body{flex:1;min-width:0;}
.ms-cost{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ms-reward{font-size:16px;color:var(--text);line-height:1.7;margin:6px 0 3px;}
.ms-tag-done,.ms-tag-active,.ms-tag-lock{font-size:12px;padding:2px 8px;border-radius:10px;}
.ms-tag-done{background:rgba(55,184,101,0.18);color:var(--item-D);}
.ms-tag-active{background:rgba(66,136,221,0.18);color:var(--item-C);}
.ms-tag-lock{background:rgba(150,150,150,0.15);color:#999;}
/* —— 档位递进：暖场轻巧紧凑 → 重量紫气 → 压轴金光+皇冠；横向 padding 三档一致保证徽章对准轨道 —— */
.ms-tier-name{font-size:11px;padding:2px 8px;border-radius:10px;letter-spacing:1px;}
/* 暖场档降重量：小徽章、小字、达成态不给金底光晕—— 3 令牌的小礼别装压轴 */
.ms-tier1{padding:7px 16px;}
.ms-tier1 .ms-badge{width:34px;height:34px;font-size:13px;margin-left:4px;}
.ms-tier1 .ms-cost{font-size:12px;}
.ms-tier1 .ms-reward{font-size:14px;color:var(--text-2);margin:3px 0 2px;}
.ms-tier1.ms-done{background:var(--panel);border-color:var(--border);box-shadow:none;}
.ms-tier1.ms-done .ms-badge{background:var(--surface-2);color:var(--item-D);box-shadow:none;}
.ms-tier1 .ms-tier-name{background:rgba(66,136,221,0.12);color:var(--item-C);}
.ms-tier2{border-color:rgba(153,102,204,0.45);}
.ms-tier2 .ms-tier-name{background:rgba(153,102,204,0.15);color:var(--item-B);}
/* 压轴档拉满分量：粗金边 + 大徽章 + 强光晕，与 5/6 拉开一眼可辨的差距 */
.ms-tier3{
    border:2px solid #d4af37;
    /* 叠一层不透明 var(--panel) 打底：金色渐变只做点缀，卡片整体不透，轨道线就不会从卡背透出穿过皇冠 */
    background:linear-gradient(135deg,rgba(212,175,55,0.22),rgba(212,175,55,0) 70%),var(--panel);
    box-shadow:0 0 26px rgba(212,175,55,0.55);
    padding:16px;
}
.ms-tier3 .ms-tier-name{background:rgba(212,175,55,0.2);color:var(--accent-2);}
.ms-tier3 .ms-reward{font-size:18px;font-weight:bold;color:var(--accent-2);}
/* 压轴徽标：大皇冠👑立于暗金圆盘上（实心底才能盖住成长轨道线，否则半透明卡背会让线从皇冠空隙透出、看着像穿过皇冠）；金色皇冠在古铜底上更跳 */
.ms-tier3 .ms-badge{width:46px;height:46px;font-size:26px;margin-left:-4px;background:radial-gradient(circle at 50% 38%,#7a5a2a,#43300f);border:2px solid rgba(255,215,94,0.6);}
@keyframes msRoyale{0%,100%{box-shadow:0 0 8px rgba(212,175,55,0.45);}50%{box-shadow:0 0 20px rgba(255,225,120,0.95);}}
.ms-done{border-color:var(--accent-deep);background:linear-gradient(135deg,rgba(212,175,55,0.14),rgba(212,175,55,0) 70%),var(--panel);box-shadow:0 0 16px rgba(212,175,55,0.3);}
.ms-done .ms-badge{background:radial-gradient(circle,#ffdf88,#d4af37);color:#3a2a00;box-shadow:0 0 12px rgba(212,175,55,0.7);}
.ms-active{border-color:#4288dd;background:linear-gradient(135deg,rgba(66,136,221,0.12),rgba(66,136,221,0) 70%),var(--panel);}
/* 进行中徽标：去蓝底圆直接大字号⭐表情（圆套圆显脏），暖金呼吸光跟随星色；暖场/压轴小尺寸单独跟进 */
.ms-active .ms-badge{background:none;font-size:26px;animation:msPulse 1.5s infinite;}
.ms-tier1.ms-active .ms-badge{font-size:20px;}
.ms-tier3.ms-active .ms-badge{font-size:30px;background:radial-gradient(circle at 50% 38%,#7a5a2a,#43300f);}
/* 锁定态不再整卡半透明（那会让轨道线从卡背透出、穿过每个圆盘），改为只压暗文字，卡片与圆盘保持不透 */
.ms-locked .ms-body{opacity:0.6;}
.ms-locked .ms-badge{background:var(--track);color:#888;}
/* 压轴未达成时金光仍在：暗金圆盘下保留呼吸光，勾人往上爬（背景保持实心圆盘以盖住轨道线）；锁定态靠降饱和而非整卡透明，避免线透出来 */
.ms-tier3.ms-locked .ms-badge{background:radial-gradient(circle at 50% 38%,#7a5a2a,#43300f);animation:msRoyale 2.2s infinite;filter:saturate(0.6) brightness(0.72);}
.ms-tier3:not(.ms-locked) .ms-badge{animation:msRoyale 2.2s infinite;}
/* 压轴卡始终不透：锁定不再用整卡 opacity（那会让轨道线透出来），改为只压暗文字；达成态也补上不透明打底 */
.ms-tier3.ms-locked{opacity:1;}
.ms-tier3.ms-locked .ms-body{opacity:0.55;}
.ms-tier3.ms-done{background:linear-gradient(135deg,rgba(212,175,55,0.16),rgba(212,175,55,0) 70%),var(--panel);}
/* 皇冠歪戴一点，像红太狼那顶有个角翘着的俏皮感（只转皇冠不转圆盘） */
.ms-crown-tilt{display:inline-block;transform:rotate(-13deg);}
@keyframes msPulse{0%,100%{filter:drop-shadow(0 0 3px rgba(255,200,60,0.45));}50%{filter:drop-shadow(0 0 10px rgba(255,200,60,0.95));}}
.draw-result{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:60px;
    text-align:center;
    font-size:18px;
    color:var(--accent-2);
    margin:12px 0 32px;
}
/* ===== 自选奖池弹窗：分区面板 + 流式芯片（紧凑密度、各区进度一眼可见） ===== */
.sel-zone{
    margin:12px 0;
    padding:10px 12px 12px;
    border:1px solid var(--border);
    border-radius:var(--r-card);
    background:var(--panel-2);
    transition:border-color .2s,box-shadow .2s;
}
.sel-zone-S{border-color:rgba(232,110,160,0.5);background:rgba(232,110,160,0.06);}
.sel-zone-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;}
/* 档位徽章：复用 item-X 淡底与描边色，圆圈收字母 */
.sel-zone-badge{flex:none;width:22px;height:22px;border:1px solid;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:bold;}
.sel-zone-name{font-size:15px;color:var(--text);}
.sel-zone-tag{font-size:12px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:1px 9px;background:var(--panel);}
/* 每区进度 pill：选满转绿、缺/多选转红，并联动分区红描边光晕 */
.sel-zone-count{margin-left:auto;font-size:13px;font-weight:bold;padding:2px 11px;border-radius:999px;border:1px solid var(--border);color:var(--muted);background:var(--panel);}
.sel-zone-ok{border-color:rgba(55,184,101,0.5);}
.sel-zone-ok .sel-zone-count{color:var(--item-D);border-color:var(--item-D);background:rgba(55,184,101,0.12);}
.sel-zone-err .sel-zone-count{color:#e23b3b;border-color:#e23b3b;background:rgba(226,59,59,0.1);}
.sel-zone-err{border-color:rgba(226,59,59,0.5);box-shadow:0 0 10px rgba(226,59,59,0.18);}
/* 选满上限的区：未选芯片置灰禁选（已选的仍可取消），hover 不抬 */
.sel-zone-full .sel-chip:not(.checked){opacity:.45;cursor:not-allowed;}
.sel-zone-full .sel-chip:not(.checked):hover{transform:none;}
.sel-chips{display:flex;flex-wrap:wrap;gap:8px;}
/* 芯片：只定 border 宽/式，颜色交给 item-X，避免覆盖档描边色 */
.sel-chip{
    display:inline-flex;align-items:center;gap:6px;max-width:100%;
    padding:7px 14px;border-width:1px;border-style:solid;border-radius:var(--r-btn);
    font-size:14px;line-height:1.45;cursor:pointer;text-align:left;
    user-select:none;-webkit-user-select:none;
    transition:transform .18s cubic-bezier(0.34,1.56,0.64,1),box-shadow .2s ease,background .2s ease;
}
.sel-chip:hover{transform:translateY(-2px);}
.sel-chip.locked{cursor:default;}
/* S 大奖长条芯片去胶囊圆角：999px 在长条上两头过圆显臃肿，改卡片圆角更方正 */
.sel-zone-S .sel-chip{border-radius:var(--r-card);}
/* 选中：同色描边环 + 前置圆勾（白底同色勾，避免 currentColor 自撞导致白圈），淡底加深拉开与未选对比 */
.sel-chip.checked{outline:2px solid currentColor;box-shadow:0 0 10px rgba(255,255,255,0.18);}
.sel-chip.checked::before{content:"✓";flex:none;width:16px;height:16px;border-radius:50%;border:1.5px solid currentColor;color:currentColor;background:var(--panel);font-size:10px;font-weight:bold;display:inline-flex;align-items:center;justify-content:center;}
.item-S.sel-chip.checked{background:rgba(232,110,160,0.3);}
.item-A.sel-chip.checked{background:rgba(212,175,55,0.3);}
.item-B.sel-chip.checked{background:rgba(153,102,204,0.3);}
.item-C.sel-chip.checked{background:rgba(66,136,221,0.3);}
.item-D.sel-chip.checked{background:rgba(55,184,101,0.3);}
.sel-confirm-bar{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;padding:16px 0 4px;background:linear-gradient(to bottom,transparent 0,var(--panel) 14px);}
/* 左侧信息组：汇总+错误提示同行，窄屏整组换行不挤按钮；列间距拉大让红字与已选数不粘在一起 */
.sel-bar-info{display:flex;align-items:center;flex-wrap:wrap;gap:4px 18px;min-width:0;flex:1;}
/* 底部汇总：实时已选/应选总数，选满转绿 */
.sel-sum{font-size:13px;color:var(--muted);}
.sel-sum-ok{color:var(--item-D);font-weight:bold;}
/* 确认按钮：主 CTA，比普通按钮更重更亮 */
#btn-confirm-select{padding:9px 26px;font-size:15px;font-weight:bold;letter-spacing:2px;background:#4a3f28;border-color:#a58a54;color:#ffe58a;}
#btn-confirm-select:hover{background:#5a4d31;}
/* 错误提示：确认栏同行红字，flex:1 占满中间余位并居中，与左侧已选数、右侧确认按钮三段平衡 */
#select-err{flex:1;text-align:center;font-size:13px;color:#e23b3b;font-weight:bold;line-height:1.5;}
#select-err:empty{display:none;}
/* ===== 奖池概率设置弹窗：S/A/B/C 四行（彩色档位徽章 + 数字输入 + %），底部实时合计/剩余校验 ===== */
.rate-tip{font-size:13px;color:var(--muted);line-height:1.7;margin-bottom:12px;}
.rate-row{display:flex;align-items:center;gap:10px;margin:9px 0;}
.rate-badge{flex:none;width:30px;height:30px;border:1px solid;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:bold;}
.rate-input{flex:1;min-width:0;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:16px;}
.rate-input:focus{outline:none;border-color:var(--line);box-shadow:0 0 0 2px var(--glow);}
.rate-unit{flex:none;color:var(--muted);font-size:15px;}
.rate-sumbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;font-size:14px;color:var(--text-2);}
#rate-sum{font-weight:bold;}
#rate-remain{color:var(--muted);}
#rate-err{min-height:20px;margin-top:8px;font-size:13px;color:#e23b3b;font-weight:bold;text-align:center;}
#rate-err:empty{display:none;}
.rate-btn-bar{display:flex;justify-content:center;gap:14px;margin-top:14px;}
#btn-rate-save:disabled{opacity:.5;cursor:not-allowed;}
/* ===== 报喜弹窗（showDialog hero 模式）：内容居中，鲜花大跳、恭喜语放大 ===== */
.dlg-hero #dlg-text{text-align:center;}
.dlg-hero-flower{font-size:56px;line-height:1.2;animation:heroPop .6s cubic-bezier(0.34,1.56,0.64,1);}
.dlg-hero-big{font-size:22px;font-weight:bold;color:var(--accent);margin:8px 0 6px;line-height:1.6;}
.dlg-hero-sub{font-size:14px;color:var(--muted);line-height:1.9;}
@keyframes heroPop{0%{transform:scale(0.2) rotate(-20deg);opacity:0;}60%{transform:scale(1.25) rotate(8deg);}100%{transform:scale(1) rotate(0);}}
.tip-text{color:#ff9460;font-size:14px;line-height:1.6;margin:10px 0 2px;}
/* ===== 热歌播放器（30px 自有控制条，直连音频，无网易云界面） ===== */
/* 宽度随内容收缩（fit-content）：不再写死像素，避免歌名 flex 吃不满时把剩余空间堆到 ☰ 右侧形成空白 */
.mini-player{width:-webkit-fit-content;width:fit-content;flex:none;transition:opacity .25s;}
/* 半透明收起只在“有鼠标悬停”的设备上生效，触屏常亮否则看不见 */
@media (hover:hover){ .mini-player{opacity:0.28;} .mini-player:hover{opacity:1;} }
.mp-bar{height:30px;display:flex;align-items:center;gap:4px;padding:0 8px;border:none;border-radius:var(--r-pill);background:var(--mp-bar);}
.mp-eq{display:flex;align-items:flex-end;gap:2px;height:14px;flex:none;}
.mp-eq i{width:2px;height:3px;background:var(--accent);border-radius:1px;display:block;}
.mini-player.playing .mp-eq i{animation:mpEq .9s ease-in-out infinite;}
.mini-player.playing .mp-eq i:nth-child(2){animation-delay:.2s;}
.mini-player.playing .mp-eq i:nth-child(3){animation-delay:.4s;}
.mini-player.playing .mp-eq i:nth-child(4){animation-delay:.15s;}
@keyframes mpEq{0%,100%{height:3px;}50%{height:14px;}}
.mp-name{color:var(--accent);font-size:12px;flex:1;min-width:24px;max-width:64px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* 歌名兼任“切歌”按钮（不加按钮以免播放器变长） */
.mp-name{cursor:pointer;user-select:none;-webkit-user-select:none;}
.mp-ctl{background:none;border:none;color:var(--muted);font-size:15px;cursor:pointer;line-height:1;padding:2px 3px;}
.mp-ctl:hover{color:var(--accent);}
/* 播放模式切换按钮：↻顺序 / ↻¹单曲 / ⇄随机，用单色箭头与 ▶ 同色系（靠 .mp-ctl 的 color 上色，悬停变金） */
#mp-mode{font-size:16px;}
/* 暂停图标：不用 ‖ / ⏸ 字形（各内核高矮不一、还可能缺字），直接用两条 CSS 竖条，高度可控 */
.mini-player.playing #mp-play{font-size:0;display:inline-flex;align-items:center;justify-content:center;gap:3px;}
.mini-player.playing #mp-play::before,
.mini-player.playing #mp-play::after{
    content:"";display:block;
    width:3px;height:13px;border-radius:1px;background:var(--muted);
}
.mini-player.playing #mp-play:hover::before,
.mini-player.playing #mp-play:hover::after{background:var(--accent);}
.mp-vol{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:12px;flex:none;}
.mp-vol-ico{color:var(--muted);flex:none;}
.mp-vol:hover .mp-vol-ico{color:var(--accent);}
/* 音量滑块：自定义细轨道 + 小圆点滑块，去掉系统默认那个过大的拖动钮 */
.mp-vol input[type=range]{-webkit-appearance:none;appearance:none;width:44px;height:3px;border-radius:2px;background:var(--range-track);cursor:pointer;}
.mp-vol input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:6px;height:6px;border:none;border-radius:50%;background:var(--accent);box-shadow:0 0 4px var(--glow);cursor:pointer;}
.mp-vol input[type=range]::-moz-range-thumb{width:6px;height:6px;border:none;border-radius:50%;background:var(--accent);cursor:pointer;}
.mp-vol input[type=range]::-moz-range-track{height:3px;border-radius:2px;background:var(--range-track);}
/* 列表按钮（☰）：字形偏细，字号略放大与控制条图标齐平 */
#mp-list-btn{font-size:16px;}
/* ===== 播放列表弹窗：序号+歌名+播放标记一行一条，当前曲主色高亮，内滚不撑破弹窗（横向滚动条彻底禁掉，纵向细身滚动条） ===== */
.mp-plist{max-height:52vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:6px;scrollbar-width:thin;scrollbar-color:var(--line) transparent;}
.mp-plist::-webkit-scrollbar{width:6px;}
.mp-plist::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px;}
.mp-plist::-webkit-scrollbar-track{background:transparent;}
.mp-pitem{
    display:flex;align-items:center;gap:10px;width:100%;text-align:left;
    padding:8px 12px;border:1px solid var(--border);border-radius:var(--r-card);
    background:var(--panel-2);color:var(--text);font-size:14px;cursor:pointer;
    transition:background .15s,border-color .15s;
}
.mp-pitem:hover{background:var(--surface-2);border-color:var(--line);}   /* 不再 translateX 位移：位移会撑出滚动区导致横向滚动条 */
.mp-pitem.cur{border-color:var(--accent);color:var(--accent);background:var(--surface-2);font-weight:bold;}
.mp-pno{flex:none;width:22px;text-align:center;font-size:12px;color:var(--muted);}
.mp-pname{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mp-pmark{flex:none;font-size:12px;color:var(--muted);}
.mp-pitem.cur .mp-pmark{color:var(--accent);}
/* ===== 大尺寸触屏兜底（iPad / 折叠屏展开：宽度>768 但没有鼠标） ===== */
@media (hover:none) and (min-width:769px){
    body{padding-bottom:96px;}
    .qun-name{display:none;}
    .qun-item{display:flex;align-items:center;}
    /* 图标+名字在窄屏会挤成两三行还盖住奖池，只留图标：点击本身就会复制/跳转 */
    .qun-tag{display:none;}
    .qun-float{
        right:auto;top:auto;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));
        transform:translateX(-50%);
        flex-direction:row;gap:14px;
        background:var(--qun-float-bg);border:1px solid var(--line);
        border-radius:24px;padding:6px 14px;
    }
    .qun-btn{width:44px;height:44px;border-radius:var(--r-card);}
    .qun-btn.qun-txt{font-size:11px;letter-spacing:0;padding:2px;}
    .card-line{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:52px;}
}
/* ===== 右侧悬浮群入口（60×60，图标或白底黑字汉字，点击跳转QQ加群） ===== */
.qun-float{
    position:fixed;
    right:18px;
    top:50%;
    transform:translateY(-50%);
    display:flex;
    flex-direction:column;
    gap:22px;
    z-index:900;
}
.qun-btn{
    width:60px;height:60px;
    padding:0;border:1px solid var(--line);border-radius:var(--r-card);
    background:var(--surface);
    cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    text-decoration:none;overflow:hidden;
    transition:transform .15s,box-shadow .2s,border-color .15s;
}
.qun-btn:hover{transform:scale(1.1);border-color:var(--accent);box-shadow:0 0 12px var(--glow);}
/* 盼之入口：底色改白，让红色 logo 更醒目 */
.qun-pz{background:#fff;}
.qun-btn svg{width:48px;height:48px;display:block;}
.qun-btn img{width:48px;height:48px;display:block;border-radius:6px;object-fit:cover;}
/* 群入口汉字（数据层 txt 字段驱动，\n 显式断成两行：上两字下三字）：白底黑字不加粗，不再用不清晰的图标 */
.qun-btn.qun-txt{background:#fff;color:#111;font-size:13px;font-weight:400;line-height:1.35;letter-spacing:1px;padding:4px;text-align:center;white-space:pre-line;}
.qun-name{
    position:absolute;
    right:68px;top:50%;
    transform:translateY(-50%);
    white-space:nowrap;
    font-size:12px;
    color:var(--accent);
    background:var(--qun-tip);
    border:1px solid var(--line);
    border-radius:var(--r-btn);
    padding:2px 8px;
    opacity:0;
    pointer-events:none;
    transition:opacity .15s;
}
.qun-item{position:relative;}
.qun-item:hover .qun-name{opacity:1;}
.qun-tag{display:none;}
/* ===== 移动端适配（主战场：QQ群里手机点开） ===== */
.toast{
    position:fixed;left:50%;bottom:15vh;transform:translateX(-50%);
    background:rgba(0,0,0,0.82);color:#fff;font-size:14px;
    padding:8px 18px;border-radius:20px;z-index:2000;pointer-events:none;
    white-space:nowrap;
}
@media (max-width:768px){
    body{padding:10px 10px 86px;}
    /* 标题：flex 真居中，播放器换行独占一行 */
    .header{flex-wrap:wrap;gap:8px;}
    .header h1{position:static;transform:none;flex:1 1 100%;order:1;font-size:22px;letter-spacing:2px;pointer-events:auto;}
    .mini-player{flex:1 1 100%;width:auto;order:2;opacity:1;}
    /* 重置/主题按钮组：换行后排在播放器下方、靠右对齐，不抢标题位置 */
    .header-actions{order:3;}
    .mp-bar{height:40px;}
    .mp-ctl{font-size:20px;padding:6px 10px;}
    /* 暂停竖条随按钮字号一起放大 */
    .mini-player.playing #mp-play{gap:4px;}
    .mini-player.playing #mp-play::before,
    .mini-player.playing #mp-play::after{width:4px;height:16px;}
    .mp-vol input[type=range]{width:90px;}
    .mp-vol input[type=range]::-webkit-slider-thumb{width:8px;height:8px;}
    .mp-vol input[type=range]::-moz-range-thumb{width:8px;height:8px;}
    /* 手机端播放器整行铺开，歌名可以显示完整并加大点击热区（点它切歌） */
    .mp-name{font-size:14px;max-width:140px;padding:9px 8px;color:var(--accent-2);}
    /* 页签、按钮触控区加大 */
    .btn-tab{padding:12px 10px;font-size:15px;}
    .btn{padding:11px 14px;min-height:40px;font-size:14px;}
    /* 窄屏：重置按钮不再绝对定位（会挤压 tab），回到文档流独占一行放在 tab 下方 */
    #btn-reset{position:static;transform:none;width:100%;margin-top:10px;text-align:center;}
    .operate-bar{gap:8px;}
    /* 导出/里程碑两个按钮整组换行并排一行，不再东一个西一个 */
    .right-group{margin-left:0;width:100%;flex-wrap:wrap;}
    /* 奖池卡片至少两列 */
    .grid-block{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;}
    .item-card{font-size:13px;}
    /* 群入口：右侧竖排 → 底部横排悬浮，不挡内容；名字标签同上隐藏，保证单行不撞高 */
    .qun-float{
        right:auto;top:auto;left:50%;bottom:10px;
        transform:translateX(-50%);
        flex-direction:row;gap:14px;
        background:var(--qun-float-bg);border:1px solid var(--line);
        border-radius:24px;padding:6px 14px;
    }
    .qun-item{display:flex;align-items:center;}
    .qun-btn{width:44px;height:44px;border-radius:var(--r-card);}
    .qun-btn.qun-txt{font-size:11px;letter-spacing:0;padding:2px;}
    .qun-btn svg{width:30px;height:30px;}
    .qun-btn:active{transform:scale(0.92);}
    .qun-name{display:none;}
    .qun-tag{display:none;}
    /* 触屏拿不到 hover 提示：S 区长条改为两行截断，保证看得到奖励名 */
    .card-line{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:52px;}
    /* 触控热区加大 */
    .modal-close{width:40px;height:40px;top:2px;margin:0 -12px -40px auto;}
    .modal-close::before,.modal-close::after{width:16px;height:2.5px;}
    .sel-chip{padding:9px 14px;min-height:38px;font-size:13px;}
    /* iPhone 底部横条不遮挡悬浮入口 */
    .qun-float{bottom:calc(10px + env(safe-area-inset-bottom));}
    .draw-result{word-break:break-word;}
}
/* =====================================================================
 * 主题精修：粉色 / 薄荷（放最后，靠 [data-theme] 高特异度稳定覆盖）
 * 原则：粉/绿只做氛围点缀不铺满；按钮转药丸；金色按钮转对应主色；柔雾软阴影；~6% 矢量纹理
 * ===================================================================== */
/* —— 开始抽奖 / 里程碑 / 重置：暗金亮金 → 樱花玫瑰（粉）/ 薄荷青（绿），白字取深端保对比 —— */
[data-theme="pink"] #btn-draw{background:linear-gradient(135deg,#e07aa0,#b85878);border-color:#c85e82;color:#fff;text-shadow:0 1px 2px rgba(120,40,70,0.25);}
[data-theme="pink"] #btn-draw:hover{background:linear-gradient(135deg,#d6489a,#a84e70);}
[data-theme="pink"] .btn-milestone{border-color:#c85e82;background:linear-gradient(135deg,#f097b8,#c85e82 55%,#e07aa0);color:#fff;text-shadow:0 1px 2px rgba(120,40,70,0.25);animation-name:msGlowPink;}
[data-theme="pink"] .btn-milestone:hover{background:linear-gradient(135deg,#e07aa0,#b85878 55%,#f7b6d3);}
@keyframes msGlowPink{0%,100%{box-shadow:0 0 6px rgba(200,94,130,0.4);}50%{box-shadow:0 0 16px rgba(200,94,130,0.7);}}
[data-theme="pink"] #btn-reset{background:#d1587a;border-color:#e08ba0;color:#fff;}
[data-theme="pink"] #btn-reset:hover{background:#c0456b;}
[data-theme="mint"] #btn-draw{background:linear-gradient(135deg,#4fb392,#2f8f74);border-color:#3a9d80;color:#fff;text-shadow:0 1px 2px rgba(20,70,55,0.25);}
[data-theme="mint"] #btn-draw:hover{background:linear-gradient(135deg,#3fa283,#268a6f);}
[data-theme="mint"] .btn-milestone{border-color:#3a9d80;background:linear-gradient(135deg,#63c3a3,#2f8f74 55%,#4fb392);color:#fff;text-shadow:0 1px 2px rgba(20,70,55,0.25);animation-name:msGlowMint;}
[data-theme="mint"] .btn-milestone:hover{background:linear-gradient(135deg,#4fb392,#2f8f74 55%,#8fd3bd);}
@keyframes msGlowMint{0%,100%{box-shadow:0 0 6px rgba(47,143,116,0.4);}50%{box-shadow:0 0 16px rgba(47,143,116,0.7);}}
[data-theme="mint"] #btn-reset{background:#c8586e;border-color:#d98a99;color:#fff;}
[data-theme="mint"] #btn-reset:hover{background:#b34a5f;}
/* S 档原生粉色、A 档原生金色（见基础 .item-S/.item-A），浅色主题不再单独覆盖 */
[data-theme="pink"] .ms-done .ms-badge,[data-theme="mint"] .ms-done .ms-badge{background:radial-gradient(circle,#ffd9e6,#e6a9c4);color:#7a2f4a;}
/* —— 柔雾软阴影（粉/绿微调色、低透明，拒绝硬黑）+ 抽中/选中柔光 —— */
[data-theme="pink"] .info-panel,[data-theme="pink"] .pool-wrap,[data-theme="pink"] .log-wrap,[data-theme="pink"] .ms-node{box-shadow:0 4px 14px rgba(255,180,200,0.18);}
[data-theme="pink"] .item-card{box-shadow:0 3px 10px rgba(255,180,200,0.16);}
[data-theme="pink"] .modal-box{box-shadow:0 12px 34px rgba(216,120,160,0.22);}
[data-theme="pink"] .item-card.drawn,[data-theme="pink"] .sel-chip.checked{box-shadow:0 2px 8px rgba(180,120,140,0.22);}
[data-theme="pink"] .theme-toggle{background:#fff;border-color:#e6a9c4;color:#b85878;}
[data-theme="pink"] .theme-toggle:hover{background:#ffeaf3;}
[data-theme="mint"] .info-panel,[data-theme="mint"] .pool-wrap,[data-theme="mint"] .log-wrap,[data-theme="mint"] .ms-node{box-shadow:0 4px 14px rgba(150,210,190,0.22);}
[data-theme="mint"] .item-card{box-shadow:0 3px 10px rgba(150,210,190,0.2);}
[data-theme="mint"] .modal-box{box-shadow:0 12px 34px rgba(60,140,115,0.2);}
[data-theme="mint"] .item-card.drawn,[data-theme="mint"] .sel-chip.checked{box-shadow:0 2px 8px rgba(90,140,120,0.22);}
[data-theme="mint"] .theme-toggle{background:#fff;border-color:#8fd3bd;color:#2f8f74;}
[data-theme="mint"] .theme-toggle:hover{background:#e7f6f0;}
/* —— 背景纹理：~5-6% 矢量小爱心/圆点，data-URI 零网络开销；底层叠加不干扰文字 —— */
[data-theme="pink"] body{
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42'%3E%3Cpath d='M21 27c-6-5-10-8-10-12a5 5 0 0 1 10-2 5 5 0 0 1 10 2c0 4-4 7-10 12z' fill='%23ff9ec0' fill-opacity='0.06'/%3E%3C/svg%3E"),
        radial-gradient(circle at 50% 0,var(--bg-glow) 0,var(--bg) 70%);
    background-repeat:repeat,no-repeat;
}
[data-theme="mint"] body{
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42'%3E%3Ccircle cx='21' cy='21' r='2' fill='%232f8f74' fill-opacity='0.05'/%3E%3C/svg%3E"),
        radial-gradient(circle at 50% 0,var(--bg-glow) 0,var(--bg) 70%);
    background-repeat:repeat,no-repeat;
}
/* ===== 自选奖池弹窗：浅色主题柔 shadow + 芯片白纱 + 错误条可读性 + 确认主色（主题精修段） ===== */
[data-theme="pink"] .sel-zone{box-shadow:0 3px 10px rgba(255,180,200,0.16);}
[data-theme="mint"] .sel-zone{box-shadow:0 3px 10px rgba(150,210,190,0.2);}
[data-theme="pink"] .sel-chip,[data-theme="mint"] .sel-chip{background-image:linear-gradient(165deg,rgba(255,255,255,0.42),rgba(255,255,255,0) 62%);}
/* 确认按钮随主题转主色渐变 */
[data-theme="pink"] #btn-confirm-select{background:linear-gradient(135deg,#e07aa0,#b85878);border-color:#c85e82;color:#fff;text-shadow:0 1px 2px rgba(120,40,70,0.25);}
[data-theme="pink"] #btn-confirm-select:hover{background:linear-gradient(135deg,#d6489a,#a84e70);}
[data-theme="mint"] #btn-confirm-select{background:linear-gradient(135deg,#4fb392,#2f8f74);border-color:#3a9d80;color:#fff;text-shadow:0 1px 2px rgba(20,70,55,0.25);}
[data-theme="mint"] #btn-confirm-select:hover{background:linear-gradient(135deg,#3fa283,#268a6f);}
/* 里程碑成长线：轨道起点跟主题氛围色、终点鎏金统一；压轴卡浅色系转暖鎏金，不用暗底刺眼；进度条起点也随主题转粉/转青 */
[data-theme="pink"] .ms-list::before{background:linear-gradient(to top,#f4a6c8,#c07ac0 45%,#f0c987 80%,#ffd75e);}
[data-theme="pink"] .ms-bar>span{background:linear-gradient(90deg,#e88ab4,var(--accent));}
[data-theme="mint"] .ms-list::before{background:linear-gradient(to top,#8fd3bd,#5ec3a8 45%,#e8cf87 80%,#ffd75e);}
[data-theme="mint"] .ms-bar>span{background:linear-gradient(90deg,#63c3a3,var(--accent));}
[data-theme="pink"] .ms-tier3,[data-theme="mint"] .ms-tier3{border:2px solid #e0a34f;background:linear-gradient(135deg,rgba(232,186,96,0.22),rgba(232,186,96,0) 68%),var(--panel);box-shadow:0 4px 18px rgba(230,170,90,0.45);}
[data-theme="pink"] .ms-tier1.ms-done .ms-badge,[data-theme="mint"] .ms-tier1.ms-done .ms-badge{background:var(--surface-2);color:var(--item-D);}
[data-theme="pink"] .ms-tier3 .ms-reward,[data-theme="mint"] .ms-tier3 .ms-reward{color:#a86f1d;}
[data-theme="pink"] .ms-tier3 .ms-tier-name,[data-theme="mint"] .ms-tier3 .ms-tier-name{color:#a86f1d;}
/* 压轴皇冠圆盘按主题分调：暗黑（武侠）用古铜底与金线浑然一体；粉/薄荷浅色卡面改香槟金圆盘，融入四周柔和节点不再突兀（仍不透光，照样能挡住轨道线） */
[data-theme="pink"] .ms-tier3 .ms-badge,[data-theme="mint"] .ms-tier3 .ms-badge{background:radial-gradient(circle at 50% 38%,#fff2cf,#f0cd76);border-color:rgba(212,175,55,0.5);}
[data-theme="pink"] .ms-tier3.ms-locked .ms-badge,[data-theme="mint"] .ms-tier3.ms-locked .ms-badge{filter:saturate(0.72) brightness(0.96);}

/* 提示/剩余类橙字统一转温润奶橙 */
[data-theme="pink"] .tip-text,[data-theme="pink"] .ms-remain,
[data-theme="mint"] .tip-text,[data-theme="mint"] .ms-remain{color:#c9803f;}
/* ===== 梦幻少女：物品名去厚重、标题加仙气 ===== */
/* 物品名/页签/标题：去掉加粗与增厚阴影（上版显胖显粗），回到纤细常规字重，只留字距呼吸感 */
[data-theme="pink"] .modal-title,
[data-theme="pink"] .sel-chip,[data-theme="pink"] .sel-zone-name,[data-theme="pink"] .item-card,
[data-theme="mint"] .modal-title,
[data-theme="mint"] .sel-chip,[data-theme="mint"] .sel-zone-name,[data-theme="mint"] .item-card{
    letter-spacing:.8px;font-weight:400;
}
/* 标题仙气渐变（粉：樱粉→香芋紫→雾蓝；绿：薄荷→青→雾蓝）；不支持 background-clip 时保持原纯色 */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
    [data-theme="pink"] .header h1,[data-theme="pink"] .modal-title,
    [data-theme="pink"] .pool-title,[data-theme="pink"] .block-title{
        background:linear-gradient(115deg,#e07aa0 0%,#c07ac0 45%,#8f9ae0 100%);
        -webkit-background-clip:text;background-clip:text;
        -webkit-text-fill-color:transparent;
        filter:drop-shadow(0 0 8px rgba(232,150,200,0.35));
    }
    [data-theme="mint"] .header h1,[data-theme="mint"] .modal-title,
    [data-theme="mint"] .pool-title,[data-theme="mint"] .block-title{
        background:linear-gradient(115deg,#3fa283 0%,#4aa8b8 50%,#7a9ae0 100%);
        -webkit-background-clip:text;background-clip:text;
        -webkit-text-fill-color:transparent;
        filter:drop-shadow(0 0 8px rgba(110,200,180,0.35));
    }
}
/* 卡片仙气：顶部一道极淡的白纱高光，让色块更通透不闷 */
[data-theme="pink"] .item-card,[data-theme="mint"] .item-card{
    background-image:linear-gradient(165deg,rgba(255,255,255,0.42),rgba(255,255,255,0) 62%);
}
/* =====================================================================
 * 交互动画：克制少女风（药丸按钮弹性上浮、卡片轻抬、页面淡入；无闪屏/爆炸）
 * ===================================================================== */
.btn,.btn-tab,.theme-toggle,.qun-btn,#btn-reset,.btn-milestone,#btn-draw,.modal-close{
    transition:transform .18s cubic-bezier(0.34,1.56,0.64,1),box-shadow .2s ease,background .2s ease,border-color .2s ease,color .2s ease;
}
.btn:hover,.btn-tab:hover,.theme-toggle:hover,.qun-btn:hover,.modal-close:hover{transform:translateY(-2px);}
.btn:active,.btn-tab:active,.theme-toggle:active,.qun-btn:active,.modal-close:active{transform:translateY(0) scale(0.96);}
.ms-node:hover{transform:translateY(-2px);}
@keyframes pageIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.container{animation:pageIn .45s ease-out both;}
/* 无障碍 / 防眩晕：系统要求减少动效时全部关闭（含呼吸、弹性、淡入） */
@media (prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important;}
    .container{opacity:1;transform:none;}
    .btn:hover,.btn-tab:hover,.sel-chip:hover,.ms-node:hover,.theme-toggle:hover,.qun-btn:hover{transform:none;}
}
/* ===== 播放列表弹窗：移动端加大触控热区（放文件末尾，避免被主题精修段高特异度覆盖） ===== */
@media (max-width:768px){
    .mp-pitem{padding:12px 14px;font-size:15px;}
    .mp-plist{max-height:60vh;}
}
