/* Social Pocket — base styles (light theme) */
:root {
  --bg: #F3F4F4;
  --bg-tint: #faf1f2;
  --surface: #FFFFFF;
  --ink: #2C2C2C;
  --muted: rgba(44, 44, 44, 0.6);
  --faint: rgba(44, 44, 44, 0.4);
  --line: rgba(44, 44, 44, 0.08);
  --plum: #853953;
  --aubergine: #612D53;
  --plum-bright: #c95f7e;
  --plum-soft: #a34a68;
  --grad: linear-gradient(135deg, #853953, #612D53);
  --grad-bright: linear-gradient(120deg, #c95f7e, #a34a68, #853953, #612D53);
  --grad-soft: linear-gradient(135deg, rgba(133, 57, 83, .12), rgba(97, 45, 83, .12));
  --radius: 22px;
  --radius-sm: 13px;
  --shadow: 0 24px 60px rgba(44, 44, 44, .12);
  --shadow-sm: 0 8px 24px rgba(44, 44, 44, .07);
  --font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
}

/* Dark theme */
[data-theme="dark"] {
  --bg: #0f0f1a;
  --bg-tint: #1a1a2e;
  --surface: #1e1e34;
  --ink: #f0f0f8;
  --muted: rgba(240, 240, 248, 0.78);
  --faint: rgba(240, 240, 248, 0.52);
  --line: rgba(240, 240, 248, 0.12);
  --grad-soft: linear-gradient(135deg, rgba(133, 57, 83, .30), rgba(97, 45, 83, .30));
  --shadow: 0 24px 60px rgba(0, 0, 0, .5);
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, .35);
}

/* Dark mode - component overrides */
[data-theme="dark"] .nav { background: linear-gradient(135deg, rgba(133,57,83,.95), rgba(97,45,83,.95)); backdrop-filter: blur(12px); border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .nav-inner { background: transparent; border-color: rgba(255,255,255,.1); box-shadow: 0 4px 20px rgba(0,0,0,.3); }
[data-theme="dark"] .brand-text { color: #fff; }
[data-theme="dark"] .brand-logo { filter: brightness(1.2); }
[data-theme="dark"] .hm-toggle span { background: #fff; }
[data-theme="dark"] .nav-login { color: #fff; }
[data-theme="dark"] .nav-login:hover { background: rgba(255,255,255,.15); }
[data-theme="dark"] .hm-menu { background: #16162a; border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .hm-head { border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .hm-foot { border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .lm-head { border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .lm-item:hover { background: rgba(133,57,83,.15); }
[data-theme="dark"] .lm-item b { color: #f0f0f8; }
[data-theme="dark"] .lm-ico { background: rgba(133,57,83,.2); color: #c95f7e; }
[data-theme="dark"] .lm-theme-btn { background: rgba(133,57,83,.15); color: #f0f0f8; }
[data-theme="dark"] .lm-theme-btn:hover { background: rgba(133,57,83,.25); }
[data-theme="dark"] .lm-auth { border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .lm-login { background: rgba(240,240,248,.06); color: #f0f0f8; border-color: rgba(240,240,248,.1); }
[data-theme="dark"] .lm-login:hover { border-color: var(--plum); color: #c95f7e; }
[data-theme="dark"] .nav-signup { box-shadow: 0 4px 14px rgba(0,0,0,.4); }
[data-theme="dark"] .hm-item:hover { background: rgba(133,57,83,.15); }
[data-theme="dark"] .hm-item b { color: #f0f0f8; }
[data-theme="dark"] .hm-item span { color: rgba(240,240,248,.55); }
[data-theme="dark"] .hm-logout { border-color: rgba(240,240,248,.1); color: rgba(240,240,248,.7); }
[data-theme="dark"] .hm-logout:hover { background: rgba(200,60,60,.12); border-color: rgba(200,60,60,.35); color: #ff8a80; }
[data-theme="dark"] .hm-theme-btn { background: rgba(133,57,83,.15); border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .hm-theme-btn:hover { background: rgba(133,57,83,.25); }

[data-theme="dark"] .ds-bal { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .ds-bal-label { opacity: .85; }
[data-theme="dark"] .ds-bal-sub { opacity: .7; }
[data-theme="dark"] .ds-bal-btn { background: rgba(255,255,255,.15); }
[data-theme="dark"] .ds-bal-btn:hover { background: rgba(255,255,255,.28); }
[data-theme="dark"] .ds-bal-btn2 { background: rgba(255,255,255,.08); }

[data-theme="dark"] .ds-qa { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ds-qa:hover { box-shadow: 0 4px 16px rgba(0,0,0,.35); border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .ds-qa b { color: #f0f0f8; }
[data-theme="dark"] .ds-qa span { color: rgba(240,240,248,.55); }
[data-theme="dark"] .ds-step { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ds-step b { color: #f0f0f8; }
[data-theme="dark"] .ds-step p { color: rgba(240,240,248,.65); }
[data-theme="dark"] .ds-tip { background: var(--surface); border-color: rgba(240,240,248,.06); color: rgba(240,240,248,.7); }
[data-theme="dark"] .ds-prog-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ds-welcome { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ds-welcome p { color: rgba(240,240,248,.65); }
[data-theme="dark"] .ds-w-top h1 { color: #f0f0f8; }
[data-theme="dark"] .ds-sec-title { color: #f0f0f8; }

[data-theme="dark"] .lb-pod { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .lb-pod-tall { box-shadow: 0 -4px 20px rgba(212,160,23,.1); border-color: rgba(212,160,23,.25); }
[data-theme="dark"] .lb-pod-name { color: #f0f0f8; }
[data-theme="dark"] .lb-self { border-color: rgba(133,57,83,.6); background: var(--surface); }
[data-theme="dark"] .lb-self-info b { color: #f0f0f8; }
[data-theme="dark"] .lb-self-tip { color: rgba(240,240,248,.5); }
[data-theme="dark"] .lb-row { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .lb-row:hover { background: rgba(133,57,83,.08); }
[data-theme="dark"] .lb-r-info b { color: #f0f0f8; }
[data-theme="dark"] .lb-r-info span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .lb-r-ava { background: rgba(133,57,83,.2); color: #c95f7e; }

[data-theme="dark"] .faq-item { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .faq-q { color: #f0f0f8; }
[data-theme="dark"] .faq-q:hover { background: rgba(133,57,83,.1); }
[data-theme="dark"] .faq-a { color: rgba(240,240,248,.65); border-color: rgba(240,240,248,.06); }

[data-theme="dark"] .rl-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .rl-card b { color: #f0f0f8; }
[data-theme="dark"] .rl-card p { color: rgba(240,240,248,.65); }
[data-theme="dark"] .sp-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .sp-card b { color: #f0f0f8; }
[data-theme="dark"] .sp-card p { color: rgba(240,240,248,.6); }
[data-theme="dark"] .fl-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .fl-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.35); border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .fl-card b { color: #f0f0f8; }

[data-theme="dark"] .wd-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .wd-bal-card { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .wd-bal-label { opacity: .85; }
[data-theme="dark"] .wd-bal-sub { opacity: .7; }
[data-theme="dark"] .wd-form-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .wd-form-title { color: #f0f0f8; }
[data-theme="dark"] .wd-select-wrap select { background: #14142a; border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .wd-select-wrap select:focus { border-color: var(--plum); box-shadow: 0 0 0 3px rgba(133,57,83,.25); }
[data-theme="dark"] .wd-field label { color: rgba(240,240,248,.6); }
[data-theme="dark"] .wd-field input { background: #14142a; border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .wd-field input::placeholder { color: rgba(240,240,248,.3); }
[data-theme="dark"] .wd-field input:focus { border-color: var(--plum); box-shadow: 0 0 0 3px rgba(133,57,83,.25); }
[data-theme="dark"] .wd-rules-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .wd-rules-title { color: #f0f0f8; }
[data-theme="dark"] .wd-rule b { color: #f0f0f8; }
[data-theme="dark"] .wd-rule span { color: rgba(240,240,248,.6); }
[data-theme="dark"] .inv-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-hero { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .inv-hero-desc { opacity: .85; }
[data-theme="dark"] .inv-code-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-code-title { color: #f0f0f8; }
[data-theme="dark"] .inv-code-box { background: #14142a; border-color: rgba(133,57,83,.4); }
[data-theme="dark"] .inv-code-hint { color: rgba(240,240,248,.45); }
[data-theme="dark"] .inv-how-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-how-title { color: #f0f0f8; }
[data-theme="dark"] .inv-step { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .inv-step-body b { color: #f0f0f8; }
[data-theme="dark"] .inv-step-body span { color: rgba(240,240,248,.55); }
[data-theme="dark"] .inv-stat { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-stat b { color: #f0f0f8; }
[data-theme="dark"] .inv-stat span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ew-quick-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-quick-card:hover { border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .ew-quick-card b { color: #f0f0f8; }
[data-theme="dark"] .ew-quick-card span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ew-how { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-how-title { color: #f0f0f8; }
[data-theme="dark"] .ew-how-step { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .ew-how-step b { color: #f0f0f8; }
[data-theme="dark"] .ew-how-step span { color: rgba(240,240,248,.55); }
[data-theme="dark"] .tx-summary { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .tx-sum-item b { color: #fff; }
[data-theme="dark"] .tx-sum-item span { opacity: .85; }
[data-theme="dark"] .tx-tab { background: var(--surface); border-color: rgba(240,240,248,.1); color: rgba(240,240,248,.6); }
[data-theme="dark"] .tx-tab:hover { border-color: rgba(133,57,83,.4); color: var(--plum); }
[data-theme="dark"] .tx-tab-active { background: var(--grad); border-color: transparent; }
[data-theme="dark"] .tx-tab-active:hover { color: #fff; }
[data-theme="dark"] .tx-section { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .tx-sec-head h2 { color: #f0f0f8; }
[data-theme="dark"] .tx-wd-link { background: rgba(220,38,38,.15); color: #f87171; }
[data-theme="dark"] .tx-wd-link:hover { background: rgba(220,38,38,.25); color: #f87171; }
[data-theme="dark"] .tx-withdraw-section { border-color: rgba(220,38,38,.2); }
[data-theme="dark"] .tx-row { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .tx-info b { color: #f0f0f8; }
[data-theme="dark"] .tx-info span { color: rgba(240,240,248,.45); }
[data-theme="dark"] .tx-amt-green { color: #34d399; }
[data-theme="dark"] .tx-amt-red { color: #f87171; }
[data-theme="dark"] .tx-ico-wd { background: rgba(248,113,113,.12); color: #f87171; }
[data-theme="dark"] .tx-st-pending { background: rgba(251,191,36,.12); color: #fbbf24; }
[data-theme="dark"] .tx-st-done { background: rgba(52,211,153,.12); color: #34d399; }
[data-theme="dark"] .tx-st-no { background: rgba(248,113,113,.12); color: #f87171; }
[data-theme="dark"] .tx-amt-purple { color: #a78bfa; }
[data-theme="dark"] .tx-date { color: rgba(240,240,248,.4); }
[data-theme="dark"] .tx-empty b { color: #f0f0f8; }
[data-theme="dark"] .tx-empty span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .pf-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-header { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-cover::after { opacity: .5; }
[data-theme="dark"] .pf-stat { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-stat b { color: #f0f0f8; }
[data-theme="dark"] .pf-stat span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .pf-info-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-info-text b { color: rgba(240,240,248,.5); }
[data-theme="dark"] .pf-info-text span { color: #f0f0f8; }
[data-theme="dark"] .pf-link { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-link:hover { border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .pf-link-text b { color: #f0f0f8; }
[data-theme="dark"] .pf-link-text span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .pf-link-arrow { background: rgba(240,240,248,.06); color: rgba(240,240,248,.4); }
[data-theme="dark"] .pf-logout { background: var(--surface); border-color: rgba(240,240,248,.08); color: rgba(240,240,248,.6); }
[data-theme="dark"] .pf-logout:hover { background: rgba(200,60,60,.1); border-color: rgba(200,60,60,.3); color: #ff8a80; }
[data-theme="dark"] .ew-balance { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-bal-card { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .ew-bal-label { opacity: .85; }
[data-theme="dark"] .ew-bal-sub { opacity: .7; }
[data-theme="dark"] .ew-bal-btn { background: rgba(255,255,255,.15); }
[data-theme="dark"] .ew-bal-btn:hover { background: rgba(255,255,255,.28); }
[data-theme="dark"] .ew-bal-btn2 { background: rgba(255,255,255,.08); }
[data-theme="dark"] .ew-stat { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-list { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-row { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .ew-row:hover { background: rgba(133,57,83,.08); }
[data-theme="dark"] .ew-row-info b { color: #f0f0f8; }
[data-theme="dark"] .ew-row-info span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ew-empty { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-empty b { color: #f0f0f8; }
[data-theme="dark"] .ew-empty span { color: rgba(240,240,248,.45); }
[data-theme="dark"] .tk-prog-card { box-shadow: 0 8px 30px rgba(0,0,0,.5); }
[data-theme="dark"] .tk-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .tk-card:hover { border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .tk-card-info b { color: #f0f0f8; }
[data-theme="dark"] .tk-card-info span { color: rgba(240,240,248,.6); }
[data-theme="dark"] .tk-card-price { color: #c95f7e; }
[data-theme="dark"] .tk-card-time { color: rgba(240,240,248,.45); }
[data-theme="dark"] .tk-card-bottom { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .tk-tabs-wrap { background: var(--bg); }
[data-theme="dark"] .tk-tab { background: var(--surface); border-color: rgba(240,240,248,.08); color: rgba(240,240,248,.5); }
[data-theme="dark"] .tk-tab:hover { border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .tk-ads-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .tk-ads-title b { color: #f0f0f8; }
[data-theme="dark"] .tk-ads-title span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .tk-ads-foot { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .tk-ad-card { background: #14142a; border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .tk-ad-sec { color: #f0f0f8; }
[data-theme="dark"] .tk-ad-bar { background: rgba(240,240,248,.08); }
[data-theme="dark"] .tk-empty { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .tk-empty b { color: #f0f0f8; }
[data-theme="dark"] .tk-empty span { color: rgba(240,240,248,.45); }
[data-theme="dark"] .tk-count { color: #c95f7e; background: rgba(133,57,83,.15); }
[data-theme="dark"] .tk-count-done { color: #4ade80; background: rgba(74,222,128,.1); }
[data-theme="dark"] .t-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .t-done { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .page-head h1 { color: #f0f0f8; }
[data-theme="dark"] .page-head p { color: rgba(240,240,248,.55); }
[data-theme="dark"] .ph-ico { background: rgba(133,57,83,.2); color: #c95f7e; }
[data-theme="dark"] .dash-back { color: rgba(240,240,248,.6); }
[data-theme="dark"] .dash-back:hover { color: #c95f7e; }

/* Auth */
[data-theme="dark"] .auth { background: var(--bg); }
[data-theme="dark"] .auth-card { background: #1a1a30; border-color: rgba(240,240,248,.08); box-shadow: 0 16px 48px rgba(0,0,0,.5); }
[data-theme="dark"] .auth-card::before { background: linear-gradient(135deg, rgba(133,57,83,.9), rgba(97,45,83,.9)); }
[data-theme="dark"] .auth-card-head h1 { color: #f0f0f8; }
[data-theme="dark"] .auth-card-head p { color: rgba(240,240,248,.55); }
[data-theme="dark"] .auth-mark { background: rgba(133,57,83,.15); }
[data-theme="dark"] .auth h2 { color: #f0f0f8; }
[data-theme="dark"] .auth p { color: rgba(240,240,248,.6); }
[data-theme="dark"] .auth-label { color: rgba(240,240,248,.6); }
[data-theme="dark"] .field input:focus { background: #14142a; }
[data-theme="dark"] .auth-switch { color: rgba(240,240,248,.5); }
[data-theme="dark"] .auth-switch a { color: #c95f7e; }
[data-theme="dark"] .auth-proof { color: rgba(240,240,248,.5); }
[data-theme="dark"] .auth-rate { color: rgba(240,240,248,.5); }
[data-theme="dark"] .auth-rate b { color: #f0f0f8; }
[data-theme="dark"] .auth-foot { color: rgba(240,240,248,.4); }
[data-theme="dark"] .back-btn { background: var(--surface); border-color: rgba(240,240,248,.08); color: #f0f0f8; }
[data-theme="dark"] .back-btn:hover { border-color: var(--plum); background: rgba(133,57,83,.1); }
[data-theme="dark"] .strength i { background: rgba(240,240,248,.1); }
[data-theme="dark"] .auth-bg-orb { opacity: .08; }
[data-theme="dark"] .page-head h1 { color: #f0f0f8; }
[data-theme="dark"] .ds-how-step { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .ds-how-body b { color: #f0f0f8; }
[data-theme="dark"] .ds-how-body p { color: rgba(240,240,248,.55); }
[data-theme="dark"] .ds-prog-card b { color: #f0f0f8; }
[data-theme="dark"] .ds-prog-card span { color: rgba(240,240,248,.45); }
[data-theme="dark"] .auth-alert.error { background: rgba(248,113,113,.12); color: #f87171; border-color: rgba(248,113,113,.25); }
[data-theme="dark"] .auth-alert.ok { background: rgba(52,211,153,.12); color: #34d399; border-color: rgba(52,211,153,.25); }

[data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea {
  background: #14142a; border-color: rgba(240,240,248,.12); color: #f0f0f8;
}
[data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder { color: rgba(240,240,248,.35); }
[data-theme="dark"] input:focus, [data-theme="dark"] select:focus, [data-theme="dark"] textarea:focus {
  border-color: var(--plum); box-shadow: 0 0 0 3px rgba(133,57,83,.25);
}
[data-theme="dark"] label { color: rgba(240,240,248,.7); }
[data-theme="dark"] ::-webkit-scrollbar-track { background: #0f0f1a; }
[data-theme="dark"] ::selection { background: var(--plum); color: #fff; }
[data-theme="dark"] .chip { background: rgba(133,57,83,.15); color: #c95f7e; border-color: rgba(133,57,83,.2); }
[data-theme="dark"] .ew-section { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ew-sec-head h2 { color: #f0f0f8; }
[data-theme="dark"] .ew-empty { color: rgba(240,240,248,.45); }
[data-theme="dark"] .ew-row { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .ew-row:hover { background: rgba(133,57,83,.08); }
[data-theme="dark"] .ew-info b { color: #f0f0f8; }
[data-theme="dark"] .ew-info span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ew-bal-amt { color: #f0f0f8; }
[data-theme="dark"] .ew-bal-label { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ew-bal-sub { color: rgba(240,240,248,.4); }
[data-theme="dark"] .ew-stat b { color: #f0f0f8; }
[data-theme="dark"] .ew-stat span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .wd-rules { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .wd-rules li { color: rgba(240,240,248,.6); }
[data-theme="dark"] .inv-steps { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-code-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .inv-code-card h3 { color: #f0f0f8; }
[data-theme="dark"] .inv-code-box { background: #14142a; border-color: rgba(240,240,248,.1); }
[data-theme="dark"] .inv-step b { color: #f0f0f8; }
[data-theme="dark"] .inv-step span { color: rgba(240,240,248,.55); }
[data-theme="dark"] .inv-stat { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-quick { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .pf-cell { background: rgba(133,57,83,.08); }
[data-theme="dark"] .pf-cell b { color: rgba(240,240,248,.6); }
[data-theme="dark"] .pf-cell span { color: #f0f0f8; }
[data-theme="dark"] .t-prog { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .t-bar { background: rgba(133,57,83,.2); }
[data-theme="dark"] .sp-form { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .sp-form h3 { color: #f0f0f8; }
[data-theme="dark"] .sp-contact { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .sp-contact h3 { color: #f0f0f8; }
[data-theme="dark"] .sp-contact p { color: rgba(240,240,248,.55); }
[data-theme="dark"] .hm-overlay { background: rgba(0,0,0,.6); }

/* Toast */
  [data-theme="dark"] .sp-popup-box { background: var(--surface); border: 1px solid rgba(240,240,248,.08); }
  [data-theme="dark"] .sp-popup-title { color: #f0f0f8; }
  [data-theme="dark"] .sp-popup-msg { color: rgba(240,240,248,.7); }

/* Auth alerts */
[data-theme="dark"] .auth-alert.error { background: rgba(248,113,113,.12); color: #f87171; border-color: rgba(248,113,113,.25); }
[data-theme="dark"] .auth-alert.ok { background: rgba(52,211,153,.12); color: #34d399; border-color: rgba(52,211,153,.25); }

/* Support button */
[data-theme="dark"] .sup-submit { background: var(--grad); color: #fff; box-shadow: 0 4px 16px rgba(133,57,83,.3); }
[data-theme="dark"] .sup-submit:hover { box-shadow: 0 6px 20px rgba(133,57,83,.4); }

/* Advertiser panel dark mode */
[data-theme="dark"] .adv-d-stat { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-d-stat b { color: #f0f0f8; }
[data-theme="dark"] .adv-d-stat span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .adv-sub-list { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-sub-item { border-color: rgba(240,240,248,.06); }
[data-theme="dark"] .adv-sub-item:hover { background: rgba(133,57,83,.08); }
[data-theme="dark"] .adv-sub-info b { color: #f0f0f8; }
[data-theme="dark"] .adv-task-mini { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-task-mini b { color: #f0f0f8; }
[data-theme="dark"] .adv-tm-bar { background: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-view-all { background: var(--surface); border-color: rgba(240,240,248,.08); color: #c95f7e; }
[data-theme="dark"] .adv-create-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-cs { color: rgba(240,240,248,.4); }
[data-theme="dark"] .adv-cs.active { color: #c95f7e; }
[data-theme="dark"] .adv-cs span { background: rgba(240,240,248,.08); color: rgba(240,240,248,.4); }
[data-theme="dark"] .adv-form-step h3 { color: #f0f0f8; }
[data-theme="dark"] .adv-plat-card { border-color: rgba(240,240,248,.08); background: var(--surface); }
[data-theme="dark"] .adv-plat-card b { color: #f0f0f8; }
[data-theme="dark"] .adv-plat-card:hover { border-color: rgba(133,57,83,.3); }
[data-theme="dark"] .adv-plat-card.selected { border-color: rgba(133,57,83,.6); background: rgba(133,57,83,.15); }
[data-theme="dark"] .adv-field input, [data-theme="dark"] .adv-field select { background: #14142a; border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .adv-field input::placeholder { color: rgba(240,240,248,.3); }
[data-theme="dark"] .adv-field input:focus, [data-theme="dark"] .adv-field select:focus { border-color: var(--plum); box-shadow: 0 0 0 3px rgba(133,57,83,.25); }
[data-theme="dark"] .adv-price-summary { background: rgba(240,240,248,.04); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-btn-back { background: var(--surface); border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .adv-review-card { background: rgba(240,240,248,.04); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-rv-row span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .adv-rv-row b { color: #f0f0f8; }
[data-theme="dark"] .adv-filter-btn { background: var(--surface); border-color: rgba(240,240,248,.08); color: rgba(240,240,248,.5); }
[data-theme="dark"] .adv-task-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-task-card h3 { color: #f0f0f8; }
[data-theme="dark"] .adv-task-card p { color: rgba(240,240,248,.5); }
[data-theme="dark"] .adv-tc-bar { background: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-sub-card { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-sc-user b { color: #f0f0f8; }
[data-theme="dark"] .adv-sc-user span { color: rgba(240,240,248,.45); }
[data-theme="dark"] .adv-report-item { background: var(--surface); border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-rpt-plat { color: #f0f0f8; }
[data-theme="dark"] .adv-rpt-bar { background: rgba(240,240,248,.08); }
[data-theme="dark"] .adv-soon h2 { color: #f0f0f8; }
[data-theme="dark"] .adv-soon > p { color: rgba(240,240,248,.55); }
[data-theme="dark"] .adv-soon-feat { background: var(--surface); border-color: rgba(240,240,248,.08); color: #f0f0f8; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font); color: var(--ink); background: var(--bg); line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
ul { list-style: none; }

::selection { background: var(--plum); color: #fff; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--plum), var(--aubergine)); border-radius: 8px; border: 2px solid var(--bg); }

.container { width: min(1120px, 92%); margin-inline: auto; }

/* Animated gradient text */
.grad-text {
  background: var(--grad-bright); background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: gradMove 5s ease-in-out infinite alternate;
}
@keyframes gradMove { 0% { background-position: 0% center; } 100% { background-position: 100% center; } }
@keyframes revealUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* Buttons — clean */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 24px; border: none; border-radius: 13px;
  font-size: 15px; font-weight: 600; letter-spacing: .2px;
  transition: transform .18s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
.btn:active { transform: scale(.97); }

.btn-primary { background: var(--grad); color: #fff; box-shadow: 0 10px 26px rgba(133, 57, 83, .35); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(133, 57, 83, .45); }

.btn-ghost { background: var(--surface); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.btn-ghost:hover { border-color: rgba(44, 44, 44, .25); transform: translateY(-2px); }

.btn-lg { padding: 16px 32px; font-size: 16px; border-radius: 15px; }

.section-pad { padding: 96px 0; }

/* Reveal on scroll — variants */
.reveal, .reveal-up, .reveal-l, .reveal-r, .reveal-zoom {
  opacity: 0; will-change: opacity, transform;
  transition: opacity .7s ease, transform .8s cubic-bezier(.22, 1, .36, 1);
}
.reveal, .reveal-up { transform: translateY(34px); }
.reveal-l { transform: translateX(-48px); }
.reveal-r { transform: translateX(48px); }
.reveal-zoom { transform: scale(.92) translateY(22px); }
.reveal.in, .reveal-up.in, .reveal-l.in, .reveal-r.in, .reveal-zoom.in { opacity: 1; transform: none; }

/* Back to top */
.to-top {
  position: fixed; right: 16px; bottom: 24px; z-index: 90;
  width: 44px; height: 44px; border-radius: 12px; border: none;
  background: var(--grad); color: #fff; font-size: 18px;
  box-shadow: 0 6px 18px rgba(133, 57, 83, .4);
  opacity: 0; pointer-events: none; transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease;
  display: grid; place-items: center;
}
.to-top.show { opacity: 1; pointer-events: auto; transform: none; }
.to-top:hover { transform: translateY(-3px); }

/* Ad overlay dark — overlay is dark by default, but reward screen adapts */
[data-theme="dark"] .ad-reward-screen { background: #08080f; }
[data-theme="dark"] .ad-overlay { background: #000; }
[data-theme="dark"] .ad-skip-btn:not(:disabled) { background: rgba(255,255,255,.95); color: #111; }
[data-theme="dark"] .ad-creative-card { background: rgba(0,0,0,.25); border-color: rgba(255,255,255,.1); }

/* Game task overlay dark */
[data-theme="dark"] .gt-overlay-box { background: #1a1a30; box-shadow: 0 24px 64px rgba(0,0,0,.7); }
[data-theme="dark"] .gt-section h3 { color: #f0f0f8; }
[data-theme="dark"] .gt-section-desc { color: rgba(240,240,248,.6); }
[data-theme="dark"] .gt-step { background: rgba(240,240,248,.04); color: #f0f0f8; }
[data-theme="dark"] .gt-req-box { background: rgba(239,68,68,.08); border-color: rgba(239,68,68,.2); }
[data-theme="dark"] .gt-req-box p { color: #f0f0f8; }
[data-theme="dark"] .gt-field input { background: #14142a; border-color: rgba(240,240,248,.1); color: #f0f0f8; }
[data-theme="dark"] .gt-upload-area { border-color: rgba(240,240,248,.12); }
[data-theme="dark"] .gt-upload-area:hover { background: rgba(133,57,83,.08); }
[data-theme="dark"] .gt-upload-text { color: #f0f0f8; }
[data-theme="dark"] .gt-submit-section { background: rgba(240,240,248,.04); }
[data-theme="dark"] .gt-upload-preview { background: #14142a; border-color: rgba(240,240,248,.1); }
[data-theme="dark"] .gt-submit-btn:disabled { background: rgba(240,240,248,.08); color: rgba(240,240,248,.3); }
[data-theme="dark"] .gt-dl-pending { background: rgba(245,158,11,.1); color: #FBBF24; }
[data-theme="dark"] .gt-dl-done { background: rgba(5,150,105,.1); color: #34D399; }
[data-theme="dark"] .gt-submit-locked { opacity: .4; }
[data-theme="dark"] .gt-upload-disabled { opacity: .4; }

/* Own task overlay dark */
[data-theme="dark"] .ot-overlay-box { background: #1a1a30; box-shadow: 0 24px 64px rgba(0,0,0,.7); }
[data-theme="dark"] .ot-section h3 { color: #f0f0f8; }
[data-theme="dark"] .ot-section p { color: rgba(240,240,248,.6); }
[data-theme="dark"] .ot-step { background: rgba(240,240,248,.04); color: #f0f0f8; }
[data-theme="dark"] .ot-pricing { background: rgba(240,240,248,.04); }
[data-theme="dark"] .ot-price-item { border-color: rgba(240,240,248,.08); }
[data-theme="dark"] .ot-price-item span { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ot-price-item b { color: #f0f0f8; }
[data-theme="dark"] .ot-contact p { color: rgba(240,240,248,.6); }
[data-theme="dark"] .ot-email-alt { color: rgba(240,240,248,.4) !important; }
[data-theme="dark"] .tk-card-own { background: rgba(133,57,83,.08) !important; border-color: rgba(133,57,83,.25) !important; }
[data-theme="dark"] .ot-hero { background: rgba(240,240,248,.04); }
[data-theme="dark"] .ot-hero b { color: #f0f0f8; }
[data-theme="dark"] .ot-benefit { background: rgba(240,240,248,.04); }
[data-theme="dark"] .ot-benefit span:last-child { color: rgba(240,240,248,.5); }
[data-theme="dark"] .ot-cat-row { background: rgba(240,240,248,.04); }
[data-theme="dark"] .ot-cat-price { color: #c95f7e; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .reveal, .reveal-up, .reveal-l, .reveal-r, .reveal-zoom { opacity: 1; transform: none; }
}