/* v3.2 styles & overflow-safe */
.cctvsc{ --card-bg:#fff; --fg:#111827; --muted:#6b7280; --accent:#2563eb; --border:#e5e7eb; --soft:#f8fafc; --ring:#bfdbfe; }
@media (prefers-color-scheme: dark){ .cctvsc[data-theme="auto"]{ --card-bg:#0b1220; --fg:#e5e7eb; --muted:#9ca3af; --accent:#60a5fa; --border:#1f2937; --soft:#0f1629; --ring:#172554; } }
.cctvsc[data-theme="dark"]{ --card-bg:#0b1220; --fg:#e5e7eb; --muted:#9ca3af; --accent:#60a5fa; --border:#1f2937; --soft:#0f1629; --ring:#172554; }
.cctvsc[data-theme="light"]{ --card-bg:#fff; --fg:#111827; --muted:#6b7280; --accent:#2563eb; --border:#e5e7eb; --soft:#f8fafc; --ring:#bfdbfe; }
.cctvsc *, .cctvsc *::before, .cctvsc *::after{ box-sizing: border-box; }
.cctvsc .cctvsc-card{ max-width:980px; width:100%; margin:24px auto; background:var(--card-bg); color:var(--fg); border:1px solid var(--border); border-radius:14px; padding:22px 24px; }
.cctvsc h2{ margin:0 0 12px; font-size:24px; }
.theme-toggle{display:flex; gap:6px}
.theme-toggle .seg{position:relative; display:inline-flex; align-items:center}
.theme-toggle input{position:absolute; opacity:0}
.theme-toggle span{padding:6px 10px; border:1px solid var(--border); background:var(--soft)}
.theme-toggle input:checked + span{background:var(--accent); color:#fff; border-color:var(--accent)}
.cctvsc .cctvsc-header{display:flex; align-items:center; justify-content:space-between; gap:12px}
.single-col{ display:grid; grid-template-columns:1fr; gap:14px; }
.cctvsc label{ display:flex; flex-direction:column; gap:6px; font-weight:600; }
.cctvsc input, .cctvsc select{ border:1px solid var(--border); border-radius:8px; padding:10px 12px; background:#fff; color:#111; width:100%; max-width:100%; }
.cctvsc[data-theme="dark"] input, .cctvsc[data-theme="dark"] select, .cctvsc[data-theme="auto"] input, .cctvsc[data-theme="auto"] select{ background:#0e1526; color:#e5e7eb; border-color:var(--border); }
.cctvsc input:focus, .cctvsc select:focus{ outline:2px solid var(--ring); border-color:var(--accent); }
.row-field{ display:flex; gap:18px; align-items:center; border:none; padding:0; margin:0; flex-wrap:wrap; }
.row-field legend{ font-weight:700; margin-right:8px }
.row-field label{ font-weight:500; flex-direction:row; align-items:center; gap:6px; white-space:nowrap; }
.btn-primary{ background:var(--accent); color:#fff; border:none; padding:10px 16px; border-radius:8px; font-weight:700; cursor:pointer; width:max-content}
.btn-outline{ background:transparent; border:1px solid var(--accent); color:var(--fg); padding:8px 12px; border-radius:8px; cursor:pointer; }
.total-cap{ margin-top:10px; }
.cap-title{ font-weight:700; margin-bottom:6px }
.cap-line{ display:flex; align-items:center; gap:8px }
.cap-line input{ flex:1 1 auto; min-width:0; font-weight:700; }
.cap-sub{ color:var(--muted); margin-top:4px }
.muted{ color:var(--muted); font-size:13px }
.note{ margin-top:8px }
.adv{ margin-top:14px }
.adv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px }
@media (max-width:720px){ .adv-grid{ grid-template-columns:1fr; } }
.cctvsc .cctvsc-tablewrap{ margin-top:12px; border:1px solid var(--border); border-radius:10px; overflow-x:auto }
.cctvsc .cctvsc-table{ width:100%; border-collapse: collapse; font-size:14px }
.cctvsc .cctvsc-table th, .cctvsc .cctvsc-table td{ padding:8px 10px; border-bottom:1px solid var(--border); white-space:nowrap }
.row-actions button{ border:none; background:transparent; color:#ef4444; cursor:pointer }
.period-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
@media (max-width:640px){ .period-row{ grid-template-columns:1fr; } }