/* ============================================================================
   等级 / VIP / 认证 徽章  —— static/css/level.css
   ---------------------------------------------------------------------------
   风格: 燃系火焰(橙红流动 + 粒子飞散 + 呼吸外发光), 适配暗色与明亮主题
   纯 CSS/SVG 实现, 无 GIF、无外部图片; 手机端自动缩小, 减少动态偏好时静止
   依赖: 元素上由 PHP 注入 --lv-c1 / --lv-c2 两个主色变量
   ============================================================================ */

/* ---------------------------- 等级徽章(火焰六边形) ---------------------------- */
.lvbadge{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:21px;height:23px;margin-left:4px;vertical-align:-5px;
  filter:drop-shadow(0 0 5px rgba(255,86,0,.55));
  transition:transform .22s var(--ease, cubic-bezier(.16,1,.3,1));
}
.lvbadge:hover{transform:scale(1.16) translateY(-1px)}

/* 六边形本体: 渐变 + 内发光 */
.lvbadge .lvb-flame{
  position:absolute;inset:0;
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  background:linear-gradient(160deg,var(--lv-c1,#ff9a3d) 0%,var(--lv-c2,#ff4d13) 58%,#5e0c00 100%);
  box-shadow:inset 0 0 7px rgba(255,214,150,.55);
  overflow:hidden;
}
/* 内部上窜的火焰 */
.lvbadge .lvb-flame::before{
  content:"";position:absolute;inset:-40%;
  background:radial-gradient(circle at 50% 118%,rgba(255,255,255,.42) 0%,
             #ffc46b 14%,#ff5a00 38%,rgba(255,60,0,0) 64%);
  mix-blend-mode:screen;
  animation:lvb-surge 2.2s ease-in-out infinite;
}
/* 斜向扫光 */
.lvbadge .lvb-flame::after{
  content:"";position:absolute;top:-60%;left:-120%;width:60%;height:220%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);
  transform:rotate(18deg);
  animation:lvb-sweep 3.4s ease-in-out infinite;
}
@keyframes lvb-surge{
  0%,100%{transform:translateY(12%) scale(1.02);opacity:.85}
  45%    {transform:translateY(-6%) scale(1.14);opacity:1}
  70%    {transform:translateY(2%)  scale(1.05);opacity:.9}
}
@keyframes lvb-sweep{
  0%,62% {left:-120%}
  86%,100%{left:150%}
}

/* 等级数字 */
.lvbadge .lvb-num{
  position:relative;z-index:2;
  font:900 11px/1 system-ui,-apple-system,"PingFang SC",sans-serif;
  color:#fff;letter-spacing:-.3px;
  text-shadow:0 0 4px rgba(255,255,255,.6),0 1px 0 rgba(90,10,0,.9);
}

/* 飞散粒子 */
.lvbadge .lvb-spark{position:absolute;inset:0;z-index:1;pointer-events:none}
.lvbadge .lvb-spark i{
  position:absolute;bottom:16%;left:50%;width:2px;height:2px;border-radius:50%;
  background:#ffd9a0;box-shadow:0 0 4px 1px rgba(255,150,40,.9);opacity:0;
  animation:lvb-rise 2.6s ease-out infinite;
}
.lvbadge .lvb-spark i:nth-child(1){left:34%;animation-delay:.2s}
.lvbadge .lvb-spark i:nth-child(2){left:56%;animation-delay:1.1s}
.lvbadge .lvb-spark i:nth-child(3){left:46%;animation-delay:1.9s}
@keyframes lvb-rise{
  0%  {transform:translate(0,0) scale(1);opacity:0}
  18% {opacity:1}
  100%{transform:translate(var(--dx,4px),-16px) scale(.3);opacity:0}
}
.lvbadge .lvb-spark i:nth-child(1){--dx:-5px}
.lvbadge .lvb-spark i:nth-child(2){--dx:5px}
.lvbadge .lvb-spark i:nth-child(3){--dx:1px}

/* LV0: 冷灰, 不发光(未起步) */
.lvbadge.lv0{filter:none}
.lvbadge.lv0 .lvb-flame{box-shadow:none}
.lvbadge.lv0 .lvb-flame::before,
.lvbadge.lv0 .lvb-flame::after{display:none}
.lvbadge.lv0 .lvb-spark{display:none}

/* 高等级额外光环 */
.lvbadge.lv5{filter:drop-shadow(0 0 6px rgba(255,60,0,.8))}
.lvbadge.lv6{
  filter:drop-shadow(0 0 7px rgba(255,120,0,.9)) drop-shadow(0 0 14px rgba(255,200,80,.45));
  animation:lvb-beat 2.6s ease-in-out infinite;
}
@keyframes lvb-beat{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}

/* 尺寸 */
.lvbadge.sm{width:17px;height:19px;margin-left:3px;vertical-align:-4px}
.lvbadge.sm .lvb-num{font-size:9px}
.lvbadge.lg{width:27px;height:30px;margin-left:7px;vertical-align:-7px}
.lvbadge.lg .lvb-num{font-size:14px}

/* ---------------------------- VIP / SVIP 宝石 ---------------------------- */
.vipbadge{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  height:16px;padding:0 6px;margin-left:5px;vertical-align:1px;
  font:900 9.5px/1 system-ui,-apple-system,sans-serif;letter-spacing:.5px;
  background:linear-gradient(135deg,#ffe08a,#e0a51c);
  color:#3d2600;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);
  filter:drop-shadow(0 0 3px rgba(255,190,60,.55));
}
.vipbadge .vb-core{position:relative;z-index:2}
.vipbadge .vb-halo{
  position:absolute;inset:-4px;z-index:1;border-radius:8px;
  background:radial-gradient(circle,rgba(255,170,40,.6),transparent 68%);
  filter:blur(3px);animation:vb-breathe 2.6s ease-in-out infinite;
}
@keyframes vb-breathe{0%,100%{opacity:.45;transform:scale(.94)}50%{opacity:.95;transform:scale(1.08)}}

/* SVIP: 更亮, 红金渐变 + 快速流光 */
.vipbadge.vip-svip{
  background:linear-gradient(115deg,#ffd76a 0%,#ff2f6d 45%,#ff9a3d 70%,#ffd76a 100%);
  background-size:260% 100%;
  color:#2b0800;
  animation:svip-flow 3.2s linear infinite;
  filter:drop-shadow(0 0 5px rgba(255,90,60,.75));
}
@keyframes svip-flow{0%{background-position:0% 50%}100%{background-position:260% 50%}}
.vipbadge.vip-svip .vb-halo{background:radial-gradient(circle,rgba(255,70,90,.65),transparent 70%)}

.vipbadge.sm{height:14px;padding:0 5px;font-size:8.5px;margin-left:3px}
.vipbadge.lg{height:19px;padding:0 8px;font-size:11px;margin-left:7px;vertical-align:2px}

/* ---------------------------- 认证(蓝V 发光) ---------------------------- */
.vbadge-glow{
  position:relative;display:inline-flex;align-items:center;color:#1d9bf0;
  margin-left:2px;vertical-align:-3px;
  filter:drop-shadow(0 0 4px rgba(29,155,240,.75));
  animation:vglow 3.2s ease-in-out infinite;
}
@keyframes vglow{
  0%,100%{filter:drop-shadow(0 0 3px rgba(29,155,240,.55))}
  50%    {filter:drop-shadow(0 0 7px rgba(29,155,240,.95))}
}
:root[data-theme="light"] .vbadge-glow{color:#0b7fd4}

/* ---------------------------- 头像等级环 ---------------------------- */
.lvring{
  position:absolute;left:0;top:0;z-index:3;pointer-events:none;
  filter:drop-shadow(0 0 6px rgba(255,90,20,.45));
}
.lvring .lvring-fill{
  position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from -90deg,var(--lv-c2,#ff4d13) var(--pct,0%),
             rgba(255,255,255,.17) 0);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4.5px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4.5px));
  animation:ring-turn 9s linear infinite;
}
@keyframes ring-turn{to{transform:rotate(360deg)}}
.lvring.lv0{opacity:.25;filter:none}

/* ---------------------------- 主页头部叠加布局 ---------------------------- */
.pf-avatar-wrap{position:relative;display:inline-block}
.pf-avatar-wrap .lvring{left:-6px;top:-6px}
.pf-badges{display:inline-flex;align-items:center;gap:1px;margin-left:2px;flex-wrap:wrap}

/* 等级小卡(主页右侧信息栏) */
.lvcard{
  margin-top:12px;padding:13px 15px;border-radius:14px;
  background:
    radial-gradient(120% 90% at 0% 0%,rgba(255,110,30,.16),transparent 60%),
    var(--bg-elev);
  border:1px solid rgba(255,120,40,.28);
}
.lvcard .lc-top{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.lvcard .lc-lv{font:900 19px/1 system-ui,sans-serif;color:#ff8a3d}
.lvcard .lc-title{font-size:12.5px;color:var(--text-dim)}
.lvcard .lc-bar{
  position:relative;height:9px;border-radius:999px;overflow:hidden;
  background:rgba(255,255,255,.08);
}
.lvcard .lc-bar>i{
  position:absolute;inset:0 auto 0 0;border-radius:999px;
  background:linear-gradient(90deg,#ff9a3d,#ff2f00 70%,#ffd76a);
  box-shadow:0 0 8px rgba(255,90,20,.7);
  transition:width .8s var(--ease,cubic-bezier(.16,1,.3,1));
}
.lvcard .lc-bar>i::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);
  animation:lc-shine 2.4s ease-in-out infinite;
}
@keyframes lc-shine{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
.lvcard .lc-meta{display:flex;justify-content:space-between;margin-top:7px;font-size:11.5px;color:var(--text-mute)}

/* 明亮主题微调 */
:root[data-theme="light"] .lvbadge{filter:drop-shadow(0 0 4px rgba(255,90,0,.4))}
:root[data-theme="light"] .lvcard{background:radial-gradient(120% 90% at 0% 0%,rgba(255,110,30,.12),transparent 60%),#f7f8fa}

/* 手机端: 缩小并降帧负担 */
@media (max-width:640px){
  .lvbadge{width:18px;height:20px;margin-left:3px}
  .lvbadge .lvb-num{font-size:9.5px}
  .lvbadge.lg{width:23px;height:25px}
  .lvbadge.lg .lvb-num{font-size:12px}
  .vipbadge{height:14px;padding:0 5px;font-size:8.5px}
  .lvring{display:none}       /* 小屏隐藏进度环, 避免压住头像 */
}

/* 尊重"减少动态"偏好: 一律静止 */
@media (prefers-reduced-motion:reduce){
  .lvbadge, .lvbadge *,
  .vipbadge, .vipbadge *,
  .vbadge-glow, .lvring .lvring-fill,
  .lvcard .lc-bar>i::after{animation:none!important}
  .lvbadge:hover{transform:none}
}


/* ============================================================================
   等级详情页 /level.php
   ============================================================================ */

/* 顶部大卡 */
.lvhero{
  position:relative;overflow:hidden;margin:12px 0 0;padding:20px 20px 18px;
  border-radius:18px;
  background:
    radial-gradient(120% 120% at 50% -20%,rgba(255,120,40,.22),transparent 62%),
    linear-gradient(180deg,#1a1210,#0e0e11);
  border:1px solid rgba(255,120,40,.28);
}
.lvh-glow{
  position:absolute;left:50%;top:-40%;width:520px;height:320px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(255,90,20,.35),transparent 66%);
  filter:blur(18px);animation:lvh-breathe 4.6s ease-in-out infinite;pointer-events:none;
}
@keyframes lvh-breathe{0%,100%{opacity:.55;transform:translateX(-50%) scale(.95)}50%{opacity:1;transform:translateX(-50%) scale(1.08)}}
.lvh-main{position:relative;display:flex;align-items:center;gap:14px}
.lvh-badge{display:inline-flex;align-items:center;gap:4px}
.lvh-badge .lvbadge.lg{width:46px;height:52px;margin-left:0}
.lvh-badge .lvbadge.lg .lvb-num{font-size:22px}
.lvh-info{min-width:0}
.lvh-name{font-size:19px;font-weight:800;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lvh-lv{
  font:900 12px/1 system-ui,sans-serif;padding:4px 9px;border-radius:999px;
  color:#1a0a00;background:linear-gradient(135deg,var(--lv-c1,#ff9a3d),var(--lv-c2,#ff2f00));
  box-shadow:0 0 10px rgba(255,90,20,.5);
}
.lvh-title{font-size:12.5px;color:#ffb98a;font-weight:600}
.lvh-exp{margin-top:5px;font-size:12px;color:var(--text-dim)}
.lvh-barwrap{position:relative;margin-top:16px}
.lvh-bar{position:relative;height:12px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.lvh-bar>i{
  position:absolute;inset:0 auto 0 0;border-radius:999px;
  background:linear-gradient(90deg,#ff9a3d,#ff2f00 68%,#ffd76a);
  box-shadow:0 0 12px rgba(255,90,20,.8);
  transition:width 1s var(--ease,cubic-bezier(.16,1,.3,1));
}
.lvh-bar>i::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);
  animation:lc-shine 2.2s ease-in-out infinite;
}
.lvh-barmeta{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--text-dim)}
.lvh-barmeta b{color:#ffb347;font-size:14px}

/* 等级阶梯 */
.lvladder,.lvtasks,.lvlog{margin-top:18px}
.lvladder h2,.lvtasks h2,.lvlog h2{font-size:16.5px;font-weight:800;margin-bottom:10px}
.ladder{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:9px}
.rung{
  display:flex;align-items:center;gap:9px;padding:10px 11px;border-radius:12px;
  background:#121215;border:1px solid #232328;opacity:.42;
  transition:transform .22s var(--ease,cubic-bezier(.16,1,.3,1)),opacity .22s;
}
.rung.on{opacity:1;border-color:color-mix(in srgb,var(--lv-c2) 45%,#232328);
  background:linear-gradient(150deg,color-mix(in srgb,var(--lv-c2) 12%,#121215),#121215)}
.rung.cur{box-shadow:0 0 0 1px var(--lv-c2),0 0 16px -2px var(--lv-c2);transform:translateY(-1px)}
.rung:hover{transform:translateY(-2px)}
.rung-badge{width:24px;height:26px;flex:0 0 auto;position:relative;display:inline-flex;align-items:center;justify-content:center}
.rung-txt{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.rung-txt b{font-size:12.5px}
.rung-txt span{font-size:11px;color:var(--text-mute)}

/* 任务格 */
.taskgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px}
.task{padding:11px 12px;border-radius:12px;background:#121215;border:1px solid #232328}
.task.done{border-color:rgba(0,186,124,.45);background:linear-gradient(150deg,rgba(0,186,124,.1),#121215)}
.task-h{display:flex;align-items:center;gap:6px;font-size:12.5px}
.task-ico{color:#ff9a3d;display:inline-flex}
.task-name{flex:1;font-weight:600}
.task-val{font-size:11px;color:var(--text-dim);font-variant-numeric:tabular-nums}
.task.done .task-val{color:#00ba7c}
.task-bar{position:relative;height:5px;border-radius:999px;background:rgba(255,255,255,.08);margin:8px 0 6px;overflow:hidden}
.task-bar>i{position:absolute;inset:0 auto 0 0;border-radius:999px;
  background:linear-gradient(90deg,#ff9a3d,#ff2f00);transition:width .7s var(--ease,cubic-bezier(.16,1,.3,1))}
.task.done .task-bar>i{background:linear-gradient(90deg,#00ba7c,#00d18b)}
.task-f{font-size:10.5px;color:var(--text-mute)}

/* 明细表 */
.lvlog .dtable td.num{font-variant-numeric:tabular-nums;text-align:right}
.lvlog .dtable td.up{color:#ff8a3d;font-weight:700}
.lvlog .dtable td.down{color:#f4212e;font-weight:700}
.lvlog .dtable td.dim{color:var(--text-mute)}

/* 权益 */
.perks{display:flex;flex-direction:column;gap:8px}
.perk{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;line-height:1.5}
.perk b{
  flex:0 0 auto;font:900 10.5px/1 system-ui,sans-serif;padding:4px 7px;border-radius:6px;
  color:#1a0a00;background:linear-gradient(135deg,#ffb545,#ff4d13);
}
.perk span{color:var(--text-dim)}

:root[data-theme="light"] .lvh-exp{color:#7a6a5e}
:root[data-theme="light"] .lvh-barmeta{color:#6b5d52}
:root[data-theme="light"] .lvh-barmeta b{color:#d2551f}
:root[data-theme="light"] .lvh-title{color:#b4491c}
:root[data-theme="light"] .lvh-bar{background:rgba(0,0,0,.09)}
:root[data-theme="light"] .rung{opacity:.5}
:root[data-theme="light"] .rung.on{opacity:1}
:root[data-theme="light"] .rung-txt span{color:#8b8178}
:root[data-theme="light"] .task-f{color:#8b8178}
:root[data-theme="light"] .lvhero{
  background:radial-gradient(120% 120% at 50% -20%,rgba(255,120,40,.16),transparent 62%),#fbf7f4;
  border-color:rgba(255,120,40,.3);
}
:root[data-theme="light"] .lvh-name{color:#231a14}
:root[data-theme="light"] .rung{background:#f6f7f9;border-color:#e3e6ea}
:root[data-theme="light"] .task{background:#f6f7f9;border-color:#e3e6ea}

@media (max-width:640px){
  .lvhero{padding:16px 14px}
  .lvh-badge .lvbadge.lg{width:38px;height:43px}
  .lvh-badge .lvbadge.lg .lvb-num{font-size:18px}
  .ladder{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .taskgrid{grid-template-columns:1fr 1fr}
  .lvh-name{font-size:16.5px}
}

@media (prefers-reduced-motion:reduce){
  .lvh-glow,.lvh-bar>i::after{animation:none!important}
}


/* ============================================================================
   内容审核: 帖子底部操作条 + 推荐标识
   ============================================================================ */
.feat-tag{
  display:inline-flex;align-items:center;gap:3px;margin-left:auto;margin-right:6px;
  padding:2px 7px;border-radius:999px;font-size:11px;font-weight:700;
  color:#3d2600;background:linear-gradient(135deg,#ffd76a,#ff9a3d);
  box-shadow:0 0 8px rgba(255,160,40,.45);
}
.feat-tag svg{width:11px;height:11px}

.modbar{
  position:relative;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:12px 0 2px;padding:9px 10px 9px 14px;
  border-radius:13px;
  background:linear-gradient(180deg,rgba(255,168,64,.075),rgba(255,168,64,.028));
  border:1px solid rgba(255,168,64,.24);
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset;
}
/* 左侧一道琥珀色提亮：一眼分辨「这是审核工具条」，不是内容 */
.modbar::before{
  content:"";position:absolute;left:2px;top:12px;bottom:12px;width:3px;
  border-radius:3px;
  background:linear-gradient(180deg,#ffc46b,#ff8a3d);
  box-shadow:0 0 10px rgba(255,160,60,.5);
}

.modbar-tip{
  display:inline-flex;align-items:center;gap:5px;
  margin-right:auto;
  padding:4px 10px 4px 8px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.5px;
  color:#ffbe74;
  background:rgba(255,168,64,.14);
  border:1px solid rgba(255,168,64,.28);
  white-space:nowrap;
}
.modbar-tip svg{width:13px;height:13px;flex:0 0 auto}

.modbtn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:32px;padding:0 13px;
  border-radius:9px;
  font-size:12.5px;font-weight:600;letter-spacing:.2px;
  color:var(--text-dim);
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.13);
  cursor:pointer;white-space:nowrap;
  transition:transform .16s var(--ease,cubic-bezier(.16,1,.3,1)),
             background .16s,border-color .16s,color .16s,box-shadow .16s;
}
.modbtn svg{width:15px;height:15px;flex:0 0 auto}
.modbtn:hover{transform:translateY(-1px);color:var(--text);background:rgba(255,255,255,.1)}
.modbtn:active{transform:translateY(0) scale(.985)}
.modbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.modbtn:disabled{opacity:.5;cursor:default;transform:none;box-shadow:none}

/* 封禁：危险红 */
.modbtn.ban{color:#ff8a93;background:rgba(244,33,46,.1);border-color:rgba(244,33,46,.32)}
.modbtn.ban:hover{
  color:#ffb0b6;background:rgba(244,33,46,.18);border-color:rgba(244,33,46,.6);
  box-shadow:0 8px 18px -10px rgba(244,33,46,.7);
}
/* 推荐：琥珀金 */
.modbtn.feat{color:#ffc46b;background:rgba(255,170,40,.1);border-color:rgba(255,170,40,.32)}
.modbtn.feat:hover{
  color:#ffd79a;background:rgba(255,170,40,.18);border-color:rgba(255,170,40,.62);
  box-shadow:0 8px 18px -10px rgba(255,170,40,.7);
}
/* 已推荐 → 取消推荐：虚线感，提示"再点就撤回" */
.modbtn.on{
  color:#ffc46b;background:rgba(255,170,40,.06);
  border-style:dashed;border-color:rgba(255,170,40,.45);
}

/* ---------------- 亮色主题 ---------------- */
:root[data-theme="light"] .modbar{
  background:linear-gradient(180deg,#fff8ef,#fffdfa);
  border-color:#f2d6b0;
  box-shadow:0 1px 2px rgba(180,120,40,.06);
}
:root[data-theme="light"] .modbar-tip{
  color:#a35c00;background:#ffeccc;border-color:#f5d5a6;
}
:root[data-theme="light"] .modbtn{
  color:#4a5261;background:#fff;border-color:#e2e6ec;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
:root[data-theme="light"] .modbtn:hover{
  color:#111820;background:#f7f9fc;border-color:#cfd6df;
  box-shadow:0 4px 10px -6px rgba(16,24,40,.28);
}
:root[data-theme="light"] .modbtn.ban{color:#c8102e;background:#fff1f2;border-color:#f6c9cd}
:root[data-theme="light"] .modbtn.ban:hover{color:#a50d26;background:#ffe4e6;border-color:#e88b93}
:root[data-theme="light"] .modbtn.feat{color:#96610a;background:#fffaf0;border-color:#f3dcae}
:root[data-theme="light"] .modbtn.feat:hover{color:#7a4d05;background:#fff3d9;border-color:#e2bd6f}
:root[data-theme="light"] .modbtn.on{color:#8a5a08;background:#fffdf7;border-color:#e8c98a}

@media (max-width:640px){
  .modbar{margin-left:0;padding:9px 9px 10px 12px;gap:8px}
  /* 标签只占自己那点宽度，不拉满整行 */
  .modbar-tip{
    width:auto;flex:0 0 auto;
    margin:0 0 1px;padding:4px 9px 4px 7px;
    font-size:11px;
  }
  .modbtn{
    flex:1 1 0;min-width:0;height:40px;
    font-size:13px;padding:0 6px;gap:5px;
  }
  .modbtn svg{width:16px;height:16px}
}
/* 超窄屏：按钮竖排，避免文字被压断 */
@media (max-width:340px){
  .modbtn{flex:1 1 100%}
}

/* ============================================================================
   审核原因弹窗（替代浏览器原生 prompt）
   ============================================================================ */
.mrm-mask{
  position:fixed;inset:0;z-index:220;
  display:grid;place-items:center;padding:20px;
  background:rgba(6,7,10,.66);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  animation:mrmFade .16s ease-out both;
}
:root[data-theme="light"] .mrm-mask{background:rgba(24,26,32,.42)}
@keyframes mrmFade{from{opacity:0}to{opacity:1}}
@keyframes mrmRise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.mrm{
  width:100%;max-width:430px;
  /* 矮屏保护：整体高度不超视口，超了让原因列表自己滚，标题和按钮永远可见 */
  max-height:calc(100vh - 32px);
  max-height:calc(100dvh - 32px);
  display:flex;flex-direction:column;
  border-radius:18px;overflow:hidden;
  background:var(--bg-elev,#16171d);
  border:1px solid var(--border,#2a2c34);
  box-shadow:0 28px 70px -24px rgba(0,0,0,.85);
  animation:mrmRise .26s cubic-bezier(.16,1,.3,1) both;
}
.mrm-head{
  flex:0 0 auto;
  display:flex;align-items:flex-start;gap:11px;
  padding:18px 18px 14px;
  border-bottom:1px solid var(--border,#2a2c34);
}
.mrm-ico{
  flex:0 0 auto;width:36px;height:36px;border-radius:11px;
  display:grid;place-items:center;
}
.mrm-ico svg{width:19px;height:19px}
.mrm.is-ban .mrm-ico{color:#ff8a93;background:rgba(244,33,46,.14);border:1px solid rgba(244,33,46,.3)}
.mrm.is-feat .mrm-ico{color:#ffc46b;background:rgba(255,170,40,.14);border:1px solid rgba(255,170,40,.3)}
.mrm-t{font-size:15.5px;font-weight:800;letter-spacing:.2px;color:var(--text)}
.mrm-s{margin-top:3px;font-size:12.3px;line-height:1.55;color:var(--text-dim)}

.mrm-body{
  flex:1 1 auto;min-height:0;
  display:flex;flex-direction:column;
  padding:16px 18px 4px;
}
.mrm-label{
  display:block;margin:0 0 9px;
  font-size:12px;font-weight:700;letter-spacing:.3px;color:var(--text-dim);
}
.mrm-opts{
  flex:1 1 auto;min-height:0;
  display:flex;flex-direction:column;gap:7px;
  overflow-y:auto;overscroll-behavior:contain;
  padding-right:2px;
  scrollbar-width:thin;
}
.mrm-opts::-webkit-scrollbar{width:6px}
.mrm-opts::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:3px}
/* 底部渐隐：提示"下面还有选项"；滚到底由 JS 加 .at-end 取消 */
.mrm-opts{
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 18px),transparent 100%);
  mask-image:linear-gradient(to bottom,#000 calc(100% - 18px),transparent 100%);
}
.mrm-opts.at-end{
  -webkit-mask-image:none;mask-image:none;
}

.mrm-opt{
  position:relative;
  display:flex;align-items:center;gap:10px;
  padding:9px 11px;border-radius:12px;cursor:pointer;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
  transition:background .15s,border-color .15s,transform .15s;
}
.mrm-opt:hover{background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.17)}
.mrm-opt:active{transform:scale(.995)}
.mrm-opt input{position:absolute;opacity:0;pointer-events:none}

/* 图标块 */
.mrm-oi{
  flex:0 0 auto;width:30px;height:30px;border-radius:9px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.06);
  color:var(--text-dim);
  transition:background .15s,color .15s;
}
.mrm-oi svg{width:16px;height:16px}

/* 标题 + 说明 */
.mrm-ot{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.mrm-ot b{
  font-size:13px;font-weight:700;letter-spacing:.2px;
  color:var(--text);line-height:1.35;
}
.mrm-ot i{
  font-style:normal;font-size:11.3px;line-height:1.4;
  color:var(--text-mute,#7f848f);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* 右侧勾选圈 */
.mrm-dot{
  flex:0 0 auto;width:17px;height:17px;border-radius:50%;
  border:1.7px solid rgba(255,255,255,.22);
  display:grid;place-items:center;
  transition:border-color .15s,background .15s;
}
.mrm-dot::after{
  content:"";width:7px;height:7px;border-radius:50%;
  background:#fff;transform:scale(0);
  transition:transform .16s cubic-bezier(.16,1,.3,1);
}
.mrm-opt:has(input:checked){background:rgba(255,255,255,.09)}
.mrm-opt:has(input:checked) .mrm-dot::after{transform:scale(1)}
.mrm-opt:has(input:focus-visible){
  outline:none;
  box-shadow:0 0 0 3px rgba(251,114,153,.26);
}

/* 封禁：选中转红 */
.mrm.is-ban .mrm-opt:has(input:checked){
  background:rgba(244,33,46,.12);
  border-color:rgba(244,33,46,.5);
}
.mrm.is-ban .mrm-opt:has(input:checked) .mrm-oi{
  background:rgba(244,33,46,.2);color:#ff9aa2;
}
.mrm.is-ban .mrm-opt:has(input:checked) .mrm-dot{
  border-color:#f4212e;background:#f4212e;
}
.mrm.is-ban .mrm-opt:has(input:checked) .mrm-ot b{color:#ffb3b9}

/* 推荐：选中转金 */
.mrm.is-feat .mrm-opt:has(input:checked){
  background:rgba(255,170,40,.12);
  border-color:rgba(255,170,40,.5);
}
.mrm.is-feat .mrm-opt:has(input:checked) .mrm-oi{
  background:rgba(255,170,40,.2);color:#ffc46b;
}
.mrm.is-feat .mrm-opt:has(input:checked) .mrm-dot{
  border-color:#ffb020;background:#ffb020;
}
.mrm.is-feat .mrm-opt:has(input:checked) .mrm-ot b{color:#ffd79a}

/* 亮色主题 */
:root[data-theme="light"] .mrm-opt{background:#f8f9fc;border-color:#e6eaf0}
:root[data-theme="light"] .mrm-opt:hover{background:#eff2f8;border-color:#d6dce6}
:root[data-theme="light"] .mrm-oi{background:#eef1f6;color:#5a6472}
:root[data-theme="light"] .mrm-dot{border-color:#c8cfda}
:root[data-theme="light"] .mrm-opt:has(input:checked){background:#fff}
:root[data-theme="light"] .mrm.is-ban .mrm-opt:has(input:checked){background:#fff1f2;border-color:#e88b93}
:root[data-theme="light"] .mrm.is-ban .mrm-opt:has(input:checked) .mrm-oi{background:#ffe0e3;color:#c8102e}
:root[data-theme="light"] .mrm.is-ban .mrm-opt:has(input:checked) .mrm-ot b{color:#b30d26}
:root[data-theme="light"] .mrm.is-feat .mrm-opt:has(input:checked){background:#fffaf0;border-color:#e2bd6f}
:root[data-theme="light"] .mrm.is-feat .mrm-opt:has(input:checked) .mrm-oi{background:#ffeecd;color:#96610a}
:root[data-theme="light"] .mrm.is-feat .mrm-opt:has(input:checked) .mrm-ot b{color:#8a5a08}

.mrm-note{
  flex:0 0 auto;
  display:block;width:100%;margin-top:14px;
  padding:10px 12px;border-radius:11px;resize:vertical;
  min-height:66px;max-height:140px;
  font:inherit;font-size:13px;line-height:1.6;
  color:var(--text);background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.11);
  transition:border-color .15s,box-shadow .15s;
}
.mrm-note::placeholder{color:var(--text-mute,#7a7f8a)}
.mrm-note:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(251,114,153,.16);
}

.mrm-acts{
  flex:0 0 auto;
  display:flex;gap:9px;justify-content:flex-end;
  padding:14px 18px 18px;
}
.mrm-btn{
  height:40px;padding:0 18px;border-radius:11px;
  font-size:13.5px;font-weight:700;letter-spacing:.3px;
  color:var(--text-dim);background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.13);
  transition:background .15s,border-color .15s,color .15s,transform .15s;
}
.mrm-btn:hover{color:var(--text);background:rgba(255,255,255,.11)}
.mrm-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mrm-btn.primary{color:#fff;border-color:transparent}
.mrm.is-ban .mrm-btn.primary{
  background:linear-gradient(135deg,#f4212e,#c2101c);
  box-shadow:0 10px 24px -12px rgba(244,33,46,.85);
}
.mrm.is-feat .mrm-btn.primary{
  color:#3d2600;background:linear-gradient(135deg,#ffd76a,#ff9a3d);
  box-shadow:0 10px 24px -12px rgba(255,160,40,.85);
}
.mrm-btn.primary:hover{transform:translateY(-1px);filter:brightness(1.05)}
.mrm-btn:disabled{opacity:.55;cursor:default;transform:none}

/* 亮色主题 */
:root[data-theme="light"] .mrm{background:#fff;border-color:#e6e9ef}
:root[data-theme="light"] .mrm-head{border-color:#eef1f5}
:root[data-theme="light"] .mrm-opt{background:#f7f8fb;border-color:#e4e8ee;color:#4a5261}
:root[data-theme="light"] .mrm-opt:hover{background:#eff2f7;color:#111820}
:root[data-theme="light"] .mrm-note{background:#f7f8fb;border-color:#e4e8ee}
:root[data-theme="light"] .mrm-btn{background:#f2f4f8;border-color:#e0e5ec;color:#4a5261}
:root[data-theme="light"] .mrm-btn:hover{background:#e9edf4;color:#111820}
:root[data-theme="light"] .mrm-btn.primary{color:#fff}
:root[data-theme="light"] .mrm.is-feat .mrm-btn.primary{color:#3d2600}

@media (max-height:560px){
  .mrm-head{padding:14px 16px 11px}
  .mrm-body{padding:12px 16px 2px}
  .mrm-s{display:none}
  .mrm-note{min-height:48px;margin-top:10px}
  .mrm-acts{padding:10px 16px 14px}
}
@media (max-width:520px){
  .mrm{max-width:none;border-radius:16px;max-height:calc(100dvh - 20px)}
  .mrm-note{min-height:56px}
  .mrm-acts{flex-direction:column-reverse}
  .mrm-btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  .mrm-mask,.mrm{animation:none!important}
  .modbtn:hover{transform:none}
}

/* 探索页 热门/推荐 切换 */
.exp-switch{display:flex;gap:6px;margin:14px 0 2px}
.exp-switch .sw{
  padding:6px 16px;border-radius:999px;font-size:13px;font-weight:600;
  color:var(--text-dim);background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);transition:all .18s var(--ease,cubic-bezier(.16,1,.3,1));
}
.exp-switch .sw:hover{color:var(--text);background:rgba(255,255,255,.09)}
.exp-switch .sw.on{
  color:#3d2600;background:linear-gradient(135deg,#ffd76a,#ff9a3d);
  border-color:transparent;box-shadow:0 0 10px rgba(255,160,40,.4);
}
:root[data-theme="light"] .exp-switch .sw{background:#f2f4f7;border-color:#e0e4e9;color:#5a6470}
:root[data-theme="light"] .exp-switch .sw.on{color:#fff;background:#f2547d;border-color:transparent}