/* ======================================================================
   自动续费扣费追回测算 · 订阅账单风
   薄荷绿 #10B981 + 警示红 #EF4444 + 白底（深主题墨绿底）
   ====================================================================== */
.arc{
  --mint:#10B981; --mint-deep:#059669; --mint-soft:#D1FAE5; --mint-faint:#F0FDF7;
  --red:#EF4444; --red-deep:#B91C1C; --red-soft:#FEE2E2;
  --amber:#D97706; --amber-soft:#FEF3C7;
  --bg:#FFFFFF; --bg-2:#F6FBF8;
  --ink:#13241B; --ink-sub:#57685E; --ink-faint:#93A69B;
  --line:#DCEDE3; --line-2:#EAF5EF;
  --r:12px;
  --shadow:0 1px 3px rgba(19,36,27,.07),0 12px 30px rgba(19,36,27,.09);
  --shadow-lg:0 2px 4px rgba(19,36,27,.10),0 20px 50px rgba(19,36,27,.14);
  color:var(--ink);
  font-family:-apple-system,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px; line-height:1.8;
  background:
    radial-gradient(720px 340px at 8% -120px, rgba(16,185,129,.07), transparent 60%),
    radial-gradient(520px 320px at 110% 20%, rgba(239,68,68,.05), transparent 60%),
    linear-gradient(180deg, #FFFFFF 0%, var(--bg-2) 100%);
  padding:0 16px 56px;
}
:root[data-theme="dark"] .arc{
  --mint:#34D399; --mint-deep:#10B981; --mint-soft:rgba(52,211,153,.16); --mint-faint:rgba(16,185,129,.08);
  --red:#F87171; --red-deep:#DC2626; --red-soft:rgba(239,68,68,.16);
  --amber:#FBBF24; --amber-soft:rgba(217,119,6,.16);
  --bg:#0B1611; --bg-2:#071009;
  --ink:#E7F4EC; --ink-sub:#9CB6A8; --ink-faint:#63796D;
  --line:#1D3729; --line-2:#152A1F;
  --shadow:0 1px 3px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.45);
  --shadow-lg:0 2px 4px rgba(0,0,0,.5),0 20px 50px rgba(0,0,0,.6);
  background:
    radial-gradient(720px 340px at 8% -120px, rgba(16,185,129,.12), transparent 60%),
    radial-gradient(520px 320px at 110% 20%, rgba(239,68,68,.08), transparent 60%),
    linear-gradient(180deg, #0D1B13 0%, #07100A 100%);
}
.arc *{box-sizing:border-box;}
.arc-wrap{max-width:1100px;margin:0 auto;}

/* ---------- Hero ---------- */
.arc-hero{margin-top:22px;background:linear-gradient(135deg,var(--mint) 0%,var(--mint-deep) 100%);color:#fff;border-radius:var(--r);padding:28px 30px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;}
.arc-hero::before{content:"🔄";position:absolute;right:-20px;top:-30px;font-size:200px;opacity:.08;}
.arc-hero::after{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--red),transparent 80%);}
:root[data-theme="dark"] .arc-hero{background:linear-gradient(135deg,#065F46 0%,#064E3B 100%);}
.arc-hero-badge{display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);border-radius:99px;padding:3px 14px;font-size:12px;font-weight:700;margin-bottom:10px;backdrop-filter:blur(4px);}
.arc-hero h1{margin:0 0 8px;font-size:clamp(24px,4vw,32px);font-weight:800;letter-spacing:.5px;}
.arc-hero p{margin:0;color:rgba(255,255,255,.92);font-size:14px;max-width:800px;position:relative;z-index:1;}
.arc-hero p b{color:#D1FAE5;font-weight:700;}
.arc-hero-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;position:relative;z-index:1;}
.arc-hero-points span{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);border-radius:99px;padding:4px 14px;font-size:12.5px;font-weight:600;backdrop-filter:blur(4px);}

/* ---------- Card ---------- */
.arc-card{margin-top:18px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:22px 26px;position:relative;}
.arc-card-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px dashed var(--line);gap:10px;}
.arc-card-hd h2{margin:0;font-size:17px;font-weight:800;color:var(--ink);}
.arc-tag{display:inline-block;background:var(--mint-soft);color:var(--mint-deep);border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;white-space:nowrap;}
:root[data-theme="dark"] .arc-tag{color:var(--mint);}
.arc-required{color:var(--ink-faint);font-size:12px;font-weight:600;white-space:nowrap;}

/* ---------- Form ---------- */
.arc-form-row{margin-bottom:16px;}
.arc-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;}
.arc-label{display:block;font-weight:700;margin-bottom:6px;color:var(--ink);font-size:13.5px;}
.arc-req{color:var(--red);font-weight:800;}
.arc-input{width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:14px;font-family:inherit;transition:border-color .15s,box-shadow .15s;}
:root[data-theme="dark"] .arc-input{background:#071009;border-color:var(--line);color:var(--ink);}
.arc-input:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 3px rgba(16,185,129,.14);}
.arc-hint{color:var(--ink-faint);font-size:12px;margin-top:4px;}

/* ---------- Chips ---------- */
.arc-chips{display:flex;flex-wrap:wrap;gap:8px;}
.arc-chip{border:1.5px solid var(--line);background:#fff;border-radius:8px;padding:8px 18px;font-size:13.5px;font-weight:700;cursor:pointer;color:var(--ink-sub);transition:all .14s;user-select:none;font-family:inherit;}
:root[data-theme="dark"] .arc-chip{background:#071009;}
.arc-chip:hover{border-color:var(--mint);color:var(--mint-deep);}
:root[data-theme="dark"] .arc-chip:hover{color:var(--mint);}
.arc-chip.on{background:var(--mint);border-color:var(--mint);color:#fff;box-shadow:0 2px 8px rgba(16,185,129,.3);}
:root[data-theme="dark"] .arc-chip.on{background:var(--mint);color:#fff;}
.arc-chip-pick{cursor:pointer;position:relative;display:inline-flex;align-items:center;}
.arc-chip-pick input{position:absolute;opacity:0;pointer-events:none;}
.arc-chip-pick span{pointer-events:none;}
.arc-chip-pick:has(input:checked){background:var(--mint);border-color:var(--mint);color:#fff;box-shadow:0 2px 8px rgba(16,185,129,.3);}
:root[data-theme="dark"] .arc-chip-pick:has(input:checked){background:var(--mint);color:#fff;}
.arc-chip-pick:has(input:focus-visible){outline:2px solid var(--mint);outline-offset:2px;}

/* ---------- Actions ---------- */
.arc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.arc-btn{border:none;border-radius:10px;padding:10px 22px;font-size:14px;font-weight:800;cursor:pointer;transition:all .14s;font-family:inherit;}
.arc-btn-primary{background:linear-gradient(135deg,var(--mint),var(--mint-deep));color:#fff;box-shadow:0 2px 10px rgba(16,185,129,.35);}
.arc-btn-primary:hover{filter:brightness(1.08);transform:translateY(-1px);}
.arc-btn-ghost{background:var(--bg-2);color:var(--ink);border:1px solid var(--line);}
:root[data-theme="dark"] .arc-btn-ghost{background:#0A130D;}
.arc-btn-ghost:hover{border-color:var(--mint);color:var(--mint-deep);}
:root[data-theme="dark"] .arc-btn-ghost:hover{color:var(--mint);}
.arc-btn-sm{padding:6px 14px;font-size:12.5px;border-radius:8px;}
.arc-btn-mini{border:none;border-radius:8px;padding:4px 12px;font-size:12px;font-weight:800;cursor:pointer;background:var(--mint-soft);color:var(--mint-deep);transition:filter .14s;font-family:inherit;}
:root[data-theme="dark"] .arc-btn-mini{color:var(--mint);}
.arc-btn-mini:hover{filter:brightness(1.06);}
.arc-msg{margin-top:10px;font-size:13px;min-height:20px;font-weight:700;}
.arc-msg.err{color:var(--red);}
.arc-msg.ok{color:var(--mint-deep);}
:root[data-theme="dark"] .arc-msg.ok{color:var(--mint);}

/* ---------- 违规判定横幅 ---------- */
.arc-banner{margin-top:18px;display:flex;gap:14px;align-items:flex-start;border-radius:var(--r);padding:16px 20px;border:1px solid transparent;box-shadow:var(--shadow);}
.arc-banner-icon{font-size:26px;line-height:1.3;flex:0 0 auto;}
.arc-banner-body{display:flex;flex-direction:column;gap:2px;}
.arc-banner-body b{font-size:16px;font-weight:800;}
.arc-banner-body span{font-size:13px;color:var(--ink-sub);}
.arc-banner.danger{background:var(--red-soft);border-color:rgba(239,68,68,.35);}
.arc-banner.danger b{color:var(--red-deep);}
:root[data-theme="dark"] .arc-banner.danger b{color:#FCA5A5;}
.arc-banner.warn{background:var(--amber-soft);border-color:rgba(217,119,6,.35);}
.arc-banner.warn b{color:var(--amber);}
:root[data-theme="dark"] .arc-banner.warn b{color:#FCD34D;}
.arc-banner.ok{background:var(--mint-soft);border-color:rgba(16,185,129,.35);}
.arc-banner.ok b{color:var(--mint-deep);}
:root[data-theme="dark"] .arc-banner.ok b{color:var(--mint);}

/* ---------- 金额大卡 + 双口径滑块 ---------- */
.arc-amount-card{background:linear-gradient(180deg,var(--bg) 0%,var(--mint-faint) 100%);border-left:4px solid var(--mint);}
:root[data-theme="dark"] .arc-amount-card{background:linear-gradient(180deg,#0B1611 0%,rgba(16,185,129,.06) 100%);}
.arc-amount-label{font-size:12.5px;font-weight:700;color:var(--ink-sub);letter-spacing:1px;}
.arc-amount-num{font-size:38px;font-weight:800;line-height:1.25;color:var(--mint-deep);font-variant-numeric:tabular-nums;}
:root[data-theme="dark"] .arc-amount-num{color:var(--mint);}
.arc-amount-sub{font-size:12.5px;color:var(--ink-faint);margin-top:2px;}
.arc-amount-hint{margin-top:14px;padding:10px 14px;background:var(--bg-2);border:1px dashed var(--line);border-radius:8px;font-size:12.5px;color:var(--ink-sub);}
:root[data-theme="dark"] .arc-amount-hint{background:#0A130D;}
.arc-slider-caps{display:flex;justify-content:space-between;align-items:flex-end;margin-top:16px;}
.arc-cap{display:flex;flex-direction:column;}
.arc-cap b{font-size:16px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.arc-cap span{font-size:11.5px;color:var(--ink-faint);font-weight:600;}
.arc-cap-r{align-items:flex-end;text-align:right;}
.arc-cap-r b{color:var(--mint-deep);}
:root[data-theme="dark"] .arc-cap-r b{color:var(--mint);}
.arc-slider{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:99px;margin:12px 0 6px;background:linear-gradient(90deg,var(--mint) 0%,var(--mint-deep) 100%);outline:none;cursor:pointer;}
.arc-slider:disabled{opacity:.45;cursor:not-allowed;}
.arc-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--mint);box-shadow:0 2px 8px rgba(16,185,129,.45);cursor:grab;}
.arc-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--mint);box-shadow:0 2px 8px rgba(16,185,129,.45);cursor:grab;}
.arc-slider:disabled::-webkit-slider-thumb{cursor:not-allowed;}
.arc-slider:focus-visible{box-shadow:0 0 0 3px rgba(16,185,129,.2);}
.arc-slider-scale{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-faint);font-weight:600;}

/* ---------- Grid 2 ---------- */
.arc-grid-2{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;margin-top:0;align-items:start;}
@media(max-width:820px){
  .arc-grid-2{grid-template-columns:1fr;}
  .arc-form-grid{grid-template-columns:1fr;}
  .arc-scripts{grid-template-columns:1fr !important;}
  .arc-paths{grid-template-columns:1fr !important;}
  .arc-amount-num{font-size:30px;}
}

/* ---------- 逐月扣费流水 ---------- */
.arc-ledger-head{display:flex;align-items:center;gap:10px;padding:6px 12px;font-size:12px;color:var(--ink-faint);font-weight:700;border-bottom:1px solid var(--line);}
.arc-ledger-box{max-height:320px;overflow:auto;}
.arc-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px dashed var(--line-2);border-left:3px solid transparent;border-radius:6px;transition:background .15s;}
.arc-row-idx{flex:0 0 26px;text-align:center;font-size:12px;font-weight:700;color:var(--ink-faint);}
.arc-row-date{flex:1;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;min-width:0;}
.arc-row-tag{flex:0 0 86px;text-align:center;font-size:11.5px;font-weight:700;border-radius:99px;padding:1px 6px;white-space:nowrap;}
.arc-tag-head{text-align:center;background:none;color:var(--ink-faint);}
.arc-row-amt{flex:0 0 76px;text-align:right;font-weight:800;font-variant-numeric:tabular-nums;}
.arc-row-mark{flex:0 0 58px;text-align:right;font-size:11.5px;font-weight:800;white-space:nowrap;}
.arc-row-bad{border-left-color:var(--red);}
.arc-row-bad .arc-row-idx{color:var(--red);}
.arc-row-tag.bad{color:var(--red);background:var(--red-soft);}
.arc-row-tag.warn{color:var(--amber);background:var(--amber-soft);}
.arc-row-tag.ok{color:var(--mint-deep);background:var(--mint-soft);}
:root[data-theme="dark"] .arc-row-tag.ok{color:var(--mint);}
.arc-row-in{background:var(--mint-faint);box-shadow:inset 0 0 0 1px var(--line);}
.arc-row-in .arc-row-mark::before{content:"✓ 追回";color:var(--mint-deep);}
:root[data-theme="dark"] .arc-row-in .arc-row-mark::before{color:var(--mint);}
.arc-row-total{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:12px 16px;border-radius:10px;background:linear-gradient(135deg,var(--mint) 0%,var(--mint-deep) 100%);color:#fff;box-shadow:0 2px 10px rgba(16,185,129,.3);}
.arc-row-total span{font-size:13px;font-weight:700;}
.arc-row-total span i{font-style:normal;}
.arc-row-total b{font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;}

/* ---------- 取消路径 ---------- */
.arc-paths{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.arc-path{background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;}
:root[data-theme="dark"] .arc-path{background:#0A130D;}
.arc-path-hd{font-weight:800;margin-bottom:4px;font-size:13.5px;}
.arc-path p{margin:0;font-size:12.5px;color:var(--ink-sub);line-height:1.8;}

/* ---------- 话术卡 ---------- */
.arc-scripts{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.arc-script-box{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg-2);}
:root[data-theme="dark"] .arc-script-box{background:#0A130D;}
.arc-script-hd{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px dashed var(--line);font-size:13px;font-weight:800;color:var(--ink);}
.arc-script{margin:0;padding:14px 16px;font-size:12.8px;line-height:1.9;white-space:pre-wrap;word-break:break-word;color:var(--ink);max-height:420px;overflow:auto;font-family:inherit;background:transparent;}

/* ---------- 证据清单 ---------- */
.arc-evidence{margin:0;padding-left:20px;}
.arc-evidence li{padding:6px 0;color:var(--ink);font-size:14px;}
.arc-evidence li b{color:var(--mint-deep);}
:root[data-theme="dark"] .arc-evidence li b{color:var(--mint);}
