/* Theme: Fluent — Segoe-like stack, 4px radii, acrylic-ish surfaces, accent bars,
   subtle depth, tile grid. Original stylesheet, inspired-by only. */
:root {
  --font: "Segoe UI", "Segoe UI Variable", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --bg: #f0f2f5; --surface: #fbfbfc; --surface-2: #e9ebef; --text: #1b1b1b; --muted: #616161; --border: #dcdfe4;
  --accent-text: #ffffff;
  --radius: 6px; --radius-sm: 4px; --radius-lg: 8px; --radius-btn: 4px; --radius-pill: 999px;
  --shadow: 0 0.3px 0.9px rgba(0, 0, 0, .1), 0 1.6px 3.6px rgba(0, 0, 0, .13);
  --shadow-lg: 0 6px 18px rgba(0, 0, 0, .18);
  --header-bg: rgba(243, 244, 247, .8); --header-text: #1b1b1b;
  --sidebar-bg: rgba(251, 251, 252, .9);
  --ok: #107c10; --warn: #c19c00; --err: #c42b1c;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1f1f1f; --surface: #2b2b2b; --surface-2: #383838; --text: #ffffff; --muted: #a6a6a6; --border: #414141;
    --shadow: 0 0.3px 0.9px rgba(0, 0, 0, .3), 0 1.6px 3.6px rgba(0, 0, 0, .4); --shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);
    --header-bg: rgba(32, 32, 32, .8); --header-text: #ffffff; --sidebar-bg: rgba(38, 38, 38, .95);
    --ok: #6ccb5f; --warn: #fce100; --err: #ff99a4;
  }
}
:root[data-theme="dark"] {
  --bg: #1f1f1f; --surface: #2b2b2b; --surface-2: #383838; --text: #ffffff; --muted: #a6a6a6; --border: #414141;
  --shadow: 0 0.3px 0.9px rgba(0, 0, 0, .3), 0 1.6px 3.6px rgba(0, 0, 0, .4); --shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);
  --header-bg: rgba(32, 32, 32, .8); --header-text: #ffffff; --sidebar-bg: rgba(38, 38, 38, .95);
  --ok: #6ccb5f; --warn: #fce100; --err: #ff99a4;
}

body { font-size: 14px; }
h1, h2, h3 { font-weight: 600; letter-spacing: 0; }
.hero__title { font-weight: 600; font-size: clamp(2.2rem, 4.5vw, 3.4rem); letter-spacing: -.02em; }
.section__title { font-weight: 600; }
.btn { border-radius: 4px; padding: 7px 14px; border-color: var(--border); box-shadow: 0 1px 0 rgba(0,0,0,.05); }
.btn--primary { box-shadow: 0 1px 0 rgba(0,0,0,.15); border-bottom-color: rgba(0,0,0,.25); }
.btn--ghost { box-shadow: none; border-color: transparent; background: transparent; }
.btn--lg { padding: 11px 22px; }
.input, .select, .textarea { border-radius: 4px; border-color: var(--border); border-bottom: 1px solid #8a8a8a; padding: 7px 11px; }
.input:focus, .select:focus, .textarea:focus { border-bottom: 2px solid var(--accent); box-shadow: none; padding-bottom: 6px; }
.card, .step, .stat, .feature, .plan, .loc, .hero-card, .cta__inner, .msg { background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: blur(24px) saturate(140%); -webkit-backdrop-filter: blur(24px) saturate(140%); }
.card, .step { padding: 18px 20px; }
.stat { border-left: 3px solid var(--accent); }
.stat--accent { border-left-color: var(--accent); }
.plan { border-top: 4px solid var(--border); padding: 22px; }
.plan--featured { border-top-color: var(--accent); }
.plan:hover { transform: none; border-top-color: var(--accent); }
.plan__badge { position: static; display: inline-block; width: max-content; border-radius: 2px; margin-bottom: -6px; }
.feature { border-top: 3px solid var(--accent); }
.feature__icon { border-radius: 4px; }
.features { gap: 12px; }
.section--alt { background: color-mix(in srgb, var(--accent) 6%, var(--bg)); }
.cycle-switch { border-radius: 4px; padding: 3px; }
.cycle-switch__btn { border-radius: 3px; }
.badge { border-radius: 3px; text-transform: none; }
.nav__link.is-active { box-shadow: inset 0 -3px 0 var(--accent); border-radius: 4px 4px 0 0; color: inherit; }
.sidebar__link { border-radius: 4px; }
.sidebar__link.is-active { background: var(--surface-2); color: var(--text); box-shadow: inset 3px 0 0 var(--accent); }
.sidebar { backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.table thead th { text-transform: none; letter-spacing: 0; font-size: 13px; }
.tabs__btn.is-active { border-bottom-width: 3px; }
.tabs__nav--pills .tabs__btn { border-radius: 4px; }
.choice input:checked + .choice__body { box-shadow: inset 3px 0 0 var(--accent); background: var(--surface); }
.pay-option:has(input:checked) { box-shadow: inset 3px 0 0 var(--accent); }
.alert { border-left: 4px solid var(--border); }
.alert--success { border-left-color: var(--ok); } .alert--error { border-left-color: var(--err); } .alert--warning { border-left-color: var(--warn); } .alert--info { border-left-color: var(--accent); }
.step__no { border-radius: 4px; }
.avatar { border-radius: 4px; }
.faq__item summary::after { color: var(--accent); }
.modal__box { border-radius: 8px; }
.theme-card__preview { border-radius: 4px; }