:root[data-theme="dark"] {
  --page:       #07111a;
  --surface:    #111c2a;
  --surface-2:  #0b1724;
  --surface-3:  #172436;
  --bg:         #07111a;
  --bg-2:       #0b1724;
  --bg-3:       #172436;

  --ink:        #f4f8fc;
  --text:       #dfe8f2;
  --text-2:     #c7d3e1;
  --muted:      #a5b4c7;
  --muted-2:    #6f8196;
  --line:       rgba(255,255,255,.08);
  --line-soft:  rgba(255,255,255,.055);
  --arrow:      #7ea9a0;

  --teal:       #00e8b8;
  --teal-d:     #20f5c8;
  --teal-l:     rgba(0,232,184,.35);
  --teal-f:     rgba(0,232,184,.09);
  --green:      #2ce6a1;
  --blue:       #25b7ff;
  --blue-d:     #67d5ff;
  --purple:     #8b5cf6;
  --purple-d:   #a855f7;
  --purple-l:   rgba(139,92,246,.32);
  --purple-f:   rgba(139,92,246,.11);
  --pink:       #f472b6;
  --orange:     #ffb648;
  --red:        #ff5d6c;

  --sh-xs:      0 1px 2px rgba(0,0,0,.4);
  --sh-sm:      0 2px 8px rgba(0,0,0,.45);
  --sh:         0 6px 24px -4px rgba(0,0,0,.5), 0 2px 6px -2px rgba(0,0,0,.35);
  --sh-lg:      0 20px 48px -12px rgba(0,0,0,.62), 0 8px 16px -8px rgba(0,0,0,.42);
  --sh-xl:      0 32px 72px -16px rgba(0,0,0,.68), 0 12px 24px -12px rgba(0,0,0,.48);
}

:root[data-theme="dark"] body { background: var(--page); }
:root[data-theme="dark"] ::selection { background: rgba(0,232,184,.28); color: #fff; }

:root[data-theme="dark"] #hero {
  background:
    radial-gradient(circle, rgba(94,234,212,.26) 1.1px, transparent 1px),
    radial-gradient(circle at 55% 20%, rgba(0,232,184,.08), transparent 40%),
    radial-gradient(circle at 80% 15%, rgba(139,92,246,.07), transparent 35%),
    linear-gradient(180deg, #07111a 0%, #091523 100%);
}
:root[data-theme="dark"] #hero::before {
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
}
:root[data-theme="dark"] #hero::after { opacity: .55; }

:root[data-theme="dark"] #svyaz,
:root[data-theme="dark"] #features,
:root[data-theme="dark"] #comparison,
:root[data-theme="dark"] #faq,
:root[data-theme="dark"] #pricing,
:root[data-theme="dark"] #hub {
  background:
    radial-gradient(circle, rgba(94,234,212,.26) 1.1px, transparent 1px),
    linear-gradient(180deg,
      #07111a 0%, #0b1724 16%, #0c1c2b 50%, #0b1724 84%, #07111a 100%);
  background-origin: border-box;
}
:root[data-theme="dark"] #geo,
:root[data-theme="dark"] #platform {
  background-color: #0b1724;
  background-image:
    linear-gradient(180deg, #07111a 0%, transparent 11%, transparent 89%, #07111a 100%);
  background-origin: border-box;
}
:root[data-theme="dark"] #trust,
:root[data-theme="dark"] #migration { background: var(--surface-2); }
:root[data-theme="dark"] #screenshots { background: var(--page); }

:root[data-theme="dark"] #svyaz::before,
:root[data-theme="dark"] #features::before,
:root[data-theme="dark"] #pricing::before,
:root[data-theme="dark"] #comparison::before,
:root[data-theme="dark"] #faq::before { opacity: .45; }

:root[data-theme="dark"] .cl-strip { background: var(--line); }
:root[data-theme="dark"] .cl-item { background: var(--surface); color: var(--muted-2); }
:root[data-theme="dark"] .cl-item:hover { background: var(--surface-3); color: var(--text); }

:root[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #17c1ac, #0d9488); color: #fff;
  box-shadow: 0 10px 26px -14px rgba(0,232,184,.9), inset 0 1px 0 rgba(255,255,255,.2);
}
:root[data-theme="dark"] .btn-primary:hover {
  background: linear-gradient(135deg, #20f5c8, #0f9e86);
  box-shadow: 0 14px 30px -12px rgba(0,232,184,.95), inset 0 1px 0 rgba(255,255,255,.24);
}
:root[data-theme="dark"] .btn-secondary:hover { border-color: var(--teal-l); background: var(--surface-3); }
:root[data-theme="dark"] .btn-white { background: var(--surface-3); color: var(--ink); }
:root[data-theme="dark"] .btn-white:hover { background: var(--surface); }

:root[data-theme="dark"] .qb-btn { background: #f2f7fb; color: #0f766e; }
:root[data-theme="dark"] .qb-btn:hover { background: #fff; }

:root[data-theme="dark"] footer {
  background:
    linear-gradient(180deg, #07111a 0, rgba(7,17,26,.45) 26px, transparent 68px),
    #050d15;
  color: rgba(226,234,243,.6);
}

:root[data-theme="dark"] .mm-veil {
  mix-blend-mode: normal;
  background: linear-gradient(90deg, rgba(6,34,37,.62) 0%, rgba(7,17,26,.3) 46%, transparent 78%);
}
:root[data-theme="dark"] .mm-veil::before { display: none; }
:root[data-theme="dark"] .mm-streak { opacity: .8; }
:root[data-theme="dark"] .mm-dots { opacity: .55; }
:root[data-theme="dark"] .mm-veil::after { opacity: .75; }
:root[data-theme="dark"] .mm-glow { opacity: .8; }

:root[data-theme="dark"] .sv-phone { outline-color: rgba(255,255,255,.07); }
:root[data-theme="dark"] .sv-chat { background: linear-gradient(180deg, #0d1826 0%, #0a1420 100%); }
:root[data-theme="dark"] .sv-bub { background: var(--surface-3); color: var(--text); }
:root[data-theme="dark"] .msg-bubble { background: var(--surface-3); }

:root[data-theme="dark"] .geo-map {
  background: linear-gradient(160deg, #0e1b28, #101f2c);
  box-shadow: 0 18px 44px -24px rgba(0,0,0,.6), 0 2px 6px -2px rgba(0,0,0,.4);
}
:root[data-theme="dark"] .geo-nums {
  background: linear-gradient(165deg, #111c2a 0%, #0e1a26 62%, #0d1b25 100%);
  border-color: rgba(0,232,184,.16);
  box-shadow: 0 18px 44px -24px rgba(0,0,0,.6), 0 2px 6px -2px rgba(0,0,0,.4);
}
:root[data-theme="dark"] .geo-sea { fill: #0c1a24; }

:root[data-theme="dark"] .geo-num { background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.07); }
:root[data-theme="dark"] .geo-num:hover { border-color: rgba(0,232,184,.3); }
:root[data-theme="dark"] .geo-ld { fill: rgba(0,232,184,.09); }

:root[data-theme="dark"] .pri-max {
  border-color: #a3e635;
  background: linear-gradient(180deg, #111c2a 0%, rgba(163,230,53,.07) 100%);
  box-shadow: 0 12px 32px -8px rgba(163,230,53,.2);
}
:root[data-theme="dark"] .pri-max .pri-pop-tag { background: linear-gradient(135deg, #bef264, #84cc16); color: #14210a; }
:root[data-theme="dark"] .pri-max .pri-name { color: #bef264; }
:root[data-theme="dark"] .pri-max .pri-seat-ic { background: rgba(163,230,53,.14); color: #bef264; }
:root[data-theme="dark"] .pri-max .pri-list li::before {
  background-color: rgba(163,230,53,.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bef264' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}
:root[data-theme="dark"] .pri-cur-max { background: linear-gradient(135deg, #bef264, #84cc16); box-shadow: 0 6px 16px -4px rgba(163,230,53,.45); }
:root[data-theme="dark"] .pri-seat-bonus { background: linear-gradient(135deg, rgba(190,242,100,.22), rgba(132,204,22,.16)); border-color: rgba(163,230,53,.4); }
:root[data-theme="dark"] .pri-seat-bonus .pri-seat-ic { background: rgba(163,230,53,.2); color: #d9f99d; }
:root[data-theme="dark"] .pri-max .pri-plus,
:root[data-theme="dark"] .pri-max .pri-toggle { color: #bef264; }
:root[data-theme="dark"] .pri-toggle { color: #bef264; }
:root[data-theme="dark"] .pri-toggle:hover { background: rgba(163,230,53,.1); }

:root[data-theme="dark"] .pri-max .pri-inc { color: #bef264; }

:root[data-theme="dark"] .comp-no { color: var(--muted-2); }
:root[data-theme="dark"] .comp-no::before {
  background-color: rgba(255,93,108,.16);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5d6c' stroke-width='3' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E");
}

:root[data-theme="dark"] #screenshots,
:root[data-theme="dark"] #trust,
:root[data-theme="dark"] #migration {
  background:
    radial-gradient(circle, rgba(94,234,212,.26) 1.1px, transparent 1px),
    linear-gradient(180deg,
      #07111a 0%, #0b1724 9%, #0b1724 91%, #07111a 100%);
  background-origin: border-box;
}

@media (min-width: 1330px) {
  :root[data-theme="dark"] .hdr-prog,
  .hdr-prog { position: fixed; left: 0; top: 0; bottom: auto; z-index: 320; }
}

:root[data-theme="dark"] .sv-ph-top {
  background: linear-gradient(135deg, #0b6f66 0%, #0d8b7d 62%, #0f9e8c 100%);
}

:root[data-theme="dark"] .pri-max {
  border-color: transparent;
  background:
    linear-gradient(180deg, #111c2a 0%, rgba(163,230,53,.06) 100%) padding-box,
    linear-gradient(150deg, #d9f99d 0%, #a3e635 34%, #22c55e 72%, #10b981 100%) border-box;
  box-shadow: 0 12px 34px -10px rgba(101,204,63,.28);
}
:root[data-theme="dark"] .pri-max .pri-pop-tag {
  background: linear-gradient(120deg, #d9f99d, #a3e635 45%, #22c55e); color: #0d2010;
}
:root[data-theme="dark"] .pri-cur-max { background: linear-gradient(135deg, #bef264, #22c55e); }
:root[data-theme="dark"] .pri-seat-bonus {
  background: linear-gradient(135deg, rgba(190,242,100,.2), rgba(34,197,94,.16));
  border-color: rgba(163,230,53,.38);
}

:root[data-theme="dark"] .mm-veil {
  width: min(760px, 52vw);
}

:root[data-theme="dark"] .mm-streak,
:root[data-theme="dark"] .mm-dots,
:root[data-theme="dark"] .mm-veil::after {
  right: auto; width: min(600px, 38vw);
  background: linear-gradient(90deg,
    rgba(6,34,37,.72) 0%, rgba(7,20,30,.5) 34%, rgba(7,17,26,.24) 62%, transparent 88%);
}

:root[data-theme="dark"] { color-scheme: dark; scrollbar-color: rgba(0,232,184,.45) transparent; scrollbar-width: thin; }
:root[data-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; }
:root[data-theme="dark"] ::-webkit-scrollbar-track { background: transparent; }
:root[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(0,232,184,.4); border-radius: 8px; border: 2px solid transparent; background-clip: content-box;
}
:root[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(0,232,184,.65); background-clip: content-box; }

:root[data-theme="dark"] .comp-table thead tr { background: var(--surface-2); }
:root[data-theme="dark"] .comp-table th.hl { background: rgba(0,232,184,.08); }

:root[data-theme="dark"] .hv-add { background: linear-gradient(135deg, #17c1ac, #0d9488); }

:root[data-theme="dark"] .mm-glow { opacity: .42; filter: blur(64px); }

:root[data-theme="dark"] .mm-dots {
  left: 4%; bottom: 4%; right: auto; width: 64%; height: 48%; opacity: .9;
  background-image: radial-gradient(circle, rgba(94,234,212,.55) 1.1px, transparent 1.1px);
  background-size: 17px 17px;
}
:root[data-theme="dark"] .mm-streak { opacity: .55; }

:root[data-theme="dark"] .mm-dots {
  left: 6%; bottom: 5%; width: 46%; height: 26%; opacity: .5;
  background-size: 15px 15px;
}

:root[data-theme="dark"] body::after {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(94,234,212,.3) 1.1px, transparent 1.1px);
  background-size: 30px 30px;
  mask-image: linear-gradient(90deg, #000 0%, transparent 26%, transparent 74%, #000 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 26%, transparent 74%, #000 100%);
}

@media (max-width: 768px) {
  :root[data-theme="dark"] .header,
  :root[data-theme="dark"] .header.hdr-tight {
    background: linear-gradient(180deg,
      rgba(13,28,43,.96) 0%, rgba(13,28,43,.9) 62%, rgba(13,28,43,.34) 88%, rgba(13,28,43,0) 100%);
    border-bottom: 0;
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  }
  :root[data-theme="dark"] .hdr-lang-btn,
  :root[data-theme="dark"] .hdr-theme {
    background: rgba(255,255,255,.05);
    border-color: rgba(94,234,212,.16);
    color: rgba(220,240,236,.9);
  }
  :root[data-theme="dark"] .hdr-lang-btn:hover,
  :root[data-theme="dark"] .hdr-theme:hover { border-color: rgba(94,234,212,.34); color: #fff; }
  :root[data-theme="dark"] .hdr-lang-flag { box-shadow: 0 0 0 1px rgba(255,255,255,.12); }
  :root[data-theme="dark"] .hdr-lang-menu {
    background: #0a2b2d; border-color: rgba(94,234,212,.16);
    box-shadow: 0 22px 48px -16px rgba(0,0,0,.75);
  }
  :root[data-theme="dark"] .hdr-lang-menu button { color: rgba(214,238,233,.85); }
  :root[data-theme="dark"] .hdr-lang-menu button:hover { background: rgba(94,234,212,.09); color: #fff; }

  :root[data-theme="dark"] .m-more-card { background: var(--surface); }
  :root[data-theme="dark"] .m-more-card > a { color: var(--text); border-bottom-color: var(--line); }
  :root[data-theme="dark"] .m-mi.ic-blue { color: #67d5ff; background: rgba(37,183,255,.14); }
  :root[data-theme="dark"] .m-mi.ic-teal { color: #5eead4; background: rgba(0,232,184,.14); }
  :root[data-theme="dark"] .m-mi.ic-purple { color: #c4b5fd; background: rgba(139,92,246,.16); }
  :root[data-theme="dark"] .m-mi.ic-orange { color: #ffb648; background: rgba(255,182,72,.14); }
  :root[data-theme="dark"] .m-mi.ic-pink { color: #f9a8d4; background: rgba(244,114,182,.14); }
  :root[data-theme="dark"] .mob-nav { border-top-color: var(--line); }
  :root[data-theme="dark"] .mob-nav a { color: var(--text); }
  :root[data-theme="dark"] .mob-nav a:hover { background: var(--surface-3); }
}

@media (max-width: 768px) {
  :root[data-theme="dark"] .m-bbar { box-shadow: 0 18px 40px -16px rgba(6,34,37,.6); }
  :root[data-theme="dark"] .m-bbar::before {
    background-image:
      radial-gradient(closest-side, rgba(45,212,191,.26), rgba(45,212,191,0)),
      linear-gradient(103deg, #062225 0%, #0a2f30 46%, #0d3b39 100%);
    mask-image:
      linear-gradient(90deg, transparent 0, #000 9px, #000 calc(100% - 9px), transparent 100%),
      linear-gradient(180deg, transparent 0, #000 7px, #000 calc(100% - 7px), transparent 100%);
    -webkit-mask-image:
      linear-gradient(90deg, transparent 0, #000 9px, #000 calc(100% - 9px), transparent 100%),
      linear-gradient(180deg, transparent 0, #000 7px, #000 calc(100% - 7px), transparent 100%);
    mask-composite: intersect; -webkit-mask-composite: source-in;
  }
  :root[data-theme="dark"] .m-bbar::after {
    opacity: .34;
    background-image: radial-gradient(circle, rgba(94,234,212,.42) 1px, transparent 1px);
  }
  :root[data-theme="dark"] .m-bi svg { color: rgba(214,238,233,.78); }
  :root[data-theme="dark"] .m-bi span { color: rgba(214,238,233,.72); }
  :root[data-theme="dark"] .m-bi.on {
    background: linear-gradient(100deg, rgba(45,212,191,.19), rgba(45,212,191,.07));
    box-shadow: inset 0 0 0 1px rgba(94,234,212,.18);
  }
  :root[data-theme="dark"] .m-bi.on svg { color: #5eead4; }
  :root[data-theme="dark"] .m-bi.on span { color: #fff; }
  :root[data-theme="dark"] .m-bi::after { background: #34d399; box-shadow: 0 0 10px 1px rgba(52,211,153,.7); }
  :root[data-theme="dark"] .m-bhome.on { background: none; box-shadow: none; }
  :root[data-theme="dark"] .m-bhome svg {
    background: rgba(148,163,184,.07);
    box-shadow: inset 0 0 0 1px rgba(148,163,184,.16);
  }
  :root[data-theme="dark"] .m-bhome.on svg {
    color: #5eead4;
    background: linear-gradient(155deg, rgba(45,212,191,.22), rgba(45,212,191,.07));
    box-shadow: inset 0 0 0 1px rgba(94,234,212,.4), 0 10px 20px -13px rgba(45,212,191,.9);
  }
}