/* 绵绵俱乐部 · 增强功能样式（换肤 / 报表 / 进度 / 后台组件） */

/* ---------- 换肤：覆盖 app.css 的 :root 变量 ---------- */
html[data-theme="mint"]{
  --pink:#8fd4b6; --pink-deep:#4fa781; --lilac:#a9dfd0;
  --lilac-deep:#68b99b; --cream:#dff3c6; --ink:#3f6157; --ink-soft:#6f9288;
}
html[data-theme="mint"] body{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.5) 0 22px,rgba(255,255,255,0) 22px 46px),linear-gradient(160deg,#e6f7ee 0%,#eefaf3 40%,#e3f3fa 72%,#f4fbe8 100%)}
html[data-theme="sunset"]{
  --pink:#f6b48a; --pink-deep:#e07b52; --lilac:#f4c7a8;
  --lilac-deep:#d99a6c; --cream:#ffe0a8; --ink:#6b4a42; --ink-soft:#9b7568;
}
html[data-theme="sunset"] body{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.5) 0 22px,rgba(255,255,255,0) 22px 46px),linear-gradient(160deg,#ffeadf 0%,#fdeee3 40%,#fbe6ee 72%,#fff3dd 100%)}
html[data-theme="ocean"]{
  --pink:#93b9e8; --pink-deep:#4d7fc4; --lilac:#b4c9ee;
  --lilac-deep:#6f94cf; --cream:#cfe6f2; --ink:#3f4f70; --ink-soft:#7183a6;
}
html[data-theme="ocean"] body{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.5) 0 22px,rgba(255,255,255,0) 22px 46px),linear-gradient(160deg,#e3edfb 0%,#e9f1fc 40%,#dce9f8 72%,#eef6f5 100%)}

/* ---------- 用户端新增组件 ---------- */
.ex-card{margin-bottom:14px}
.ex-themes{display:flex;gap:8px;flex-wrap:wrap}
.ex-themes .chip{cursor:pointer}
.ex-share{text-align:center;padding:22px 14px;border-radius:20px;
  background:linear-gradient(140deg,#fdeaf3,#eee7fc 60%,#fdf5e6);margin-bottom:14px;position:relative;overflow:hidden}
.ex-share:after{content:"🎀";position:absolute;right:-8px;bottom:-22px;font-size:90px;opacity:.25}
.ex-share-logo{width:60px;height:60px;border-radius:20px;margin:0 auto 12px;display:grid;place-items:center;
  font-size:30px;background:linear-gradient(140deg,#fbd7e8,#e2d3f8);border:2px solid #fff}
.ex-share-line{background:rgba(255,255,255,.85);border:1px dashed rgba(190,160,220,.6);border-radius:12px;
  padding:10px;font-size:12px;color:#8b7aa8;line-height:1.7;word-break:break-all;position:relative;z-index:2}
.ex-track{border:1px dashed rgba(200,170,220,.6);border-radius:14px;padding:12px;margin-bottom:10px;background:rgba(255,255,255,.8)}
.ex-steps{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.ex-steps span{font-size:10px;padding:4px 9px;border-radius:12px;background:#f2ecf8;color:#a99cc0}
.ex-steps span.on{background:linear-gradient(110deg,#e7d8fb,#f9d7e8);color:#6b5099;font-weight:800}
.ex-steps i{color:#c9b9dd;font-style:normal;font-size:11px}

/* ---------- 后台新增组件 ---------- */
.ex-chart{display:flex;align-items:flex-end;gap:8px;height:160px;padding:10px 4px 0;
  border-bottom:1px solid #eee6f6;margin-top:10px}
.ex-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.ex-bar{width:70%;max-width:38px;border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,#c4a6ea,#f2b6d2);transition:height .4s}
.ex-bar.alt{background:linear-gradient(180deg,#a9d8ea,#c9b4ec)}
.ex-bar-val{font-size:10px;color:#8b7aa8;font-weight:700}
.ex-bar-col small{font-size:10px;color:#b6a9c9;margin-bottom:2px}
.ex-rank{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f6f2fa;font-size:13px}
.ex-rank:last-child{border-bottom:0}
.ex-rank-no{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;flex:none;
  background:linear-gradient(140deg,#ffedc4,#ffe3ae);color:#8a6a2c;font-weight:900;font-size:12px}
.ex-rank b{flex:1}
.ex-status{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;font-size:13px}
.ex-sel{width:100%;min-width:96px;border:1px solid #e8dff3;border-radius:8px;padding:5px 6px;font-size:12px;outline:0;background:#fff}
.ex-field{margin-bottom:12px;max-width:420px}
.ex-field label{display:block;font-size:12px;font-weight:700;color:#8b7aa8;margin-bottom:6px}
.ex-field input,.ex-field select{width:100%;border:1.5px solid #e8dff3;border-radius:10px;padding:10px 12px;outline:0}
.ex-field input:focus,.ex-field select:focus{border-color:#b79ae4}
.ex-inline{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.ex-inline input{flex:1;min-width:130px;border:1.5px solid #e8dff3;border-radius:10px;padding:9px 12px;outline:0}
.ex-inline .btn{flex:none}
#exCapWrap{margin-bottom:14px}
#exCapWrap label{display:block;text-align:left;font-size:12px;font-weight:700;color:#8b7aa8;margin-bottom:6px}
#exCapWrap input{width:100%;border:1.5px solid #e8dff3;border-radius:12px;padding:12px;outline:0;margin-bottom:0}
#exCapWrap input[type=hidden]{display:none}
@media(max-width:760px){
  .ex-chart{height:130px;gap:4px}
  .ex-bar-val{font-size:9px}.ex-bar-col small{font-size:9px}
  .ex-inline{flex-direction:column}.ex-inline .btn{width:100%}
}