/* ==========================================================================
   Norhart "Alive" theme — soft cool-grey surfaces + vibrant blue energy.
   Shared by every page (link AFTER theme2.css). CSS only, GPU-cheap:
   - travelling light strips = tiny pseudo-elements, background-position sweep
     (same technique as Panel 9's "Grok in control" .gline hairline)
   - page atmosphere = one fixed layer animated with transform only
   - every animation lives inside prefers-reduced-motion: no-preference
   Scopes: html[data-theme="theme2"] (light + dark), html[data-alive="trading"].
   Admin opts into a calmer version with html[data-alive="subtle"].
   ========================================================================== */

html[data-theme="theme2"] {
  --al-cyan: #22d3ee;
  --al-blue: #3b82f6;
  --al-blue-d: #155eef;
  --al-violet: #a855f7;
  --al-run: linear-gradient(90deg, transparent, #22d3ee 28%, #3b82f6 55%, #a855f7 80%, transparent);
  --al-bg: #e6ecf5;
  --al-bg2: #eef2f9;
  --al-card: linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,247,252,.94));
  --al-patch: #e7edf6;
  --al-edge: rgba(59, 110, 230, .18);
  --al-edge-hi: rgba(59, 130, 246, .38);
  --al-shadow: 0 1px 2px rgba(30, 58, 120, .06), 0 10px 28px rgba(37, 78, 170, .09);
  --al-shadow-hi: 0 1px 2px rgba(30, 58, 120, .08), 0 14px 34px rgba(37, 99, 235, .18);
  --al-strip-a: .95;
  --bg: #e9eef6;
  --line: #dbe3ef;
  --line-strong: #c4d0e3;
  --shadow: var(--al-shadow);
}
html[data-theme="theme2"][data-mode="dark"] {
  --al-bg: #0b1324;
  --al-bg2: #101a30;
  --al-card: linear-gradient(180deg, rgba(25,38,64,.92), rgba(18,28,50,.92));
  --al-patch: #1a2744;
  --al-edge: rgba(96, 165, 250, .20);
  --al-edge-hi: rgba(96, 165, 250, .45);
  --al-shadow: 0 1px 2px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.30);
  --al-shadow-hi: 0 1px 2px rgba(0,0,0,.4), 0 14px 34px rgba(37, 99, 235, .28);
  --bg: #0b1324;
  --line: #22314d;
  --line-strong: #31446a;
}

/* ---------- Page atmosphere: grey-blue base + soft living glows ---------- */
html[data-theme="theme2"] {
  background: linear-gradient(180deg, var(--al-bg) 0%, var(--al-bg2) 48%, var(--al-bg) 100%) no-repeat 0 0 / 100% 100% var(--al-bg);
  min-height: 100vh;
}
html[data-theme="theme2"] body { background: transparent !important; }
html[data-theme="theme2"]::before {
  content: ""; position: fixed; inset: -6%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(52vmax 36vmax at 8% -6%, rgba(59,130,246,.20), transparent 62%),
    radial-gradient(44vmax 32vmax at 100% 4%, rgba(34,211,238,.13), transparent 62%),
    radial-gradient(46vmax 36vmax at 78% 108%, rgba(124,92,246,.10), transparent 64%);
  will-change: transform;
}
html[data-theme="theme2"][data-mode="dark"]::before {
  background:
    radial-gradient(52vmax 36vmax at 8% -6%, rgba(59,130,246,.30), transparent 62%),
    radial-gradient(44vmax 32vmax at 100% 4%, rgba(34,211,238,.16), transparent 62%),
    radial-gradient(46vmax 36vmax at 78% 108%, rgba(124,92,246,.18), transparent 64%);
}
/* Edge glow frame (very soft, breathes) */
html[data-theme="theme2"]::after {
  content: ""; position: fixed; inset: 0; z-index: 9985; pointer-events: none;
  box-shadow: inset 0 0 70px rgba(59,130,246,.10), inset 0 0 0 1px rgba(59,130,246,.10);
}
/* Viewport strips: light running along the top and bottom edges */
html[data-theme="theme2"] body::before,
html[data-theme="theme2"] body::after {
  content: ""; position: fixed; left: 0; right: 0; height: 3px; z-index: 9990; pointer-events: none;
  background: var(--al-run) -45% 0 / 38% 100% no-repeat, linear-gradient(90deg, transparent, rgba(59,130,246,.35), transparent);
  box-shadow: 0 0 10px rgba(59,130,246,.35);
  opacity: var(--al-strip-a);
}
html[data-theme="theme2"] body::before { top: 0; }
html[data-theme="theme2"] body::after { bottom: 0; background-position: 145% 0, 0 0; }

/* ---------- Surfaces: soft glass cards, blue-tinted edges ---------- */
html[data-theme="theme2"] .glass,
html[data-theme="theme2"] .modal-shell,
html[data-theme="theme2"] .card,
html[data-theme="theme2"] .auth-card,
html[data-theme="theme2"] .app-prompt,
html[data-theme="theme2"] .reassure {
  background: var(--al-card) !important;
  border-color: var(--al-edge) !important;
  box-shadow: var(--al-shadow) !important;
}
html[data-theme="theme2"] .toast {
  background: var(--al-card) !important;
  border-color: var(--al-edge-hi) !important;
  box-shadow: var(--al-shadow-hi) !important;
}
html[data-theme="theme2"] .card-hover:hover,
html[data-theme="theme2"] .glass:hover {
  border-color: var(--al-edge-hi) !important;
  box-shadow: var(--al-shadow-hi) !important;
}
/* Mild grey patches: inner tiles & wells */
html[data-theme="theme2"] .bg-slate-800,
html[data-theme="theme2"] .bg-slate-800\/60,
html[data-theme="theme2"] .bg-slate-900\/50,
html[data-theme="theme2"] .bg-slate-700,
html[data-theme="theme2"] .bg-slate-950\/40,
html[data-theme="theme2"] .bg-slate-950\/50,
html[data-theme="theme2"] .bg-slate-950\/60 {
  background-color: var(--al-patch) !important;
}
html[data-theme="theme2"] section.border-y {
  background: linear-gradient(180deg, rgba(255,255,255,.7), rgba(231,237,246,.8)) !important;
  border-color: var(--al-edge) !important;
}
html[data-theme="theme2"][data-mode="dark"] section.border-y { background: rgba(16,26,48,.8) !important; }

/* Header / nav / sidebar / tab bar: grey-blue glass with a lit lower edge */
html[data-theme="theme2"] nav.site-nav,
html[data-theme="theme2"] header.auth-header,
html[data-theme="theme2"] .mobile-header,
html[data-theme="theme2"] nav.nav {
  background: linear-gradient(180deg, rgba(246,249,254,.92), rgba(233,239,248,.88)) !important;
  border-color: var(--al-edge) !important;
  box-shadow: 0 1px 0 var(--al-edge), 0 8px 24px rgba(37,78,170,.07) !important;
}
html[data-theme="theme2"] aside.sidebar {
  background: linear-gradient(180deg, rgba(246,249,254,.96), rgba(231,237,247,.96)) !important;
  border-right-color: var(--al-edge) !important;
}
html[data-theme="theme2"] footer {
  background: linear-gradient(180deg, rgba(238,243,250,.9), rgba(228,235,246,.95)) !important;
  border-color: var(--al-edge) !important;
}
html[data-theme="theme2"] .tab-bar {
  background: linear-gradient(180deg, rgba(248,250,254,.96), rgba(234,240,249,.98)) !important;
  border-top-color: var(--al-edge) !important;
  box-shadow: 0 -6px 20px rgba(37,78,170,.08) !important;
}
html[data-theme="theme2"][data-mode="dark"] nav.site-nav,
html[data-theme="theme2"][data-mode="dark"] header.auth-header,
html[data-theme="theme2"][data-mode="dark"] .mobile-header,
html[data-theme="theme2"][data-mode="dark"] nav.nav,
html[data-theme="theme2"][data-mode="dark"] .tab-bar {
  background: linear-gradient(180deg, rgba(20,31,54,.94), rgba(13,21,38,.94)) !important;
  box-shadow: 0 1px 0 var(--al-edge), 0 8px 24px rgba(0,0,0,.3) !important;
}
html[data-theme="theme2"][data-mode="dark"] aside.sidebar,
html[data-theme="theme2"][data-mode="dark"] footer {
  background: linear-gradient(180deg, rgba(20,31,54,.96), rgba(13,21,38,.96)) !important;
}

/* Nav: alive selection */
html[data-theme="theme2"] .nav-link { transition: background-color .2s, color .2s, box-shadow .2s; }
html[data-theme="theme2"] .nav-link:hover { background: rgba(59,130,246,.10); }
html[data-theme="theme2"] .nav-link.active,
html[data-theme="theme2"] .tab-bar > a.text-brand-400,
html[data-theme="theme2"] .tab-bar .tab-btn-active,
html[data-theme="theme2"] .tab-btn-active {
  background: linear-gradient(90deg, rgba(59,130,246,.18), rgba(59,130,246,.06)) !important;
  color: #1347c7 !important;
  box-shadow: inset 3px 0 0 var(--al-blue), 0 0 18px rgba(59,130,246,.18);
}
html[data-theme="theme2"] .tab-bar .tab-btn-active,
html[data-theme="theme2"] .tab-bar > a.text-brand-400 { box-shadow: inset 0 -3px 0 var(--al-blue), 0 0 16px rgba(59,130,246,.18); }
html[data-theme="theme2"][data-mode="dark"] .nav-link.active,
html[data-theme="theme2"][data-mode="dark"] .tab-bar > a.text-brand-400,
html[data-theme="theme2"][data-mode="dark"] .tab-btn-active { color: #9cc4ff !important; }
html[data-theme="theme2"] .tab-btn-active svg { stroke: #1d63f0; }

/* ---------- Light strips on key surfaces ---------- */
html[data-theme="theme2"] nav.site-nav,
html[data-theme="theme2"] header.auth-header,
html[data-theme="theme2"] .mobile-header,
html[data-theme="theme2"] nav.nav,
html[data-theme="theme2"] .auth-card,
html[data-theme="theme2"] .widget,
html[data-theme="theme2"] .hero-stats > .glass,
html[data-theme="theme2"] #view-dashboard .balance-grid > .glass,
html[data-theme="theme2"] main > .grid > .glass:first-child { position: relative; }

html[data-theme="theme2"] nav.site-nav::after,
html[data-theme="theme2"] header.auth-header::after,
html[data-theme="theme2"] .mobile-header::after,
html[data-theme="theme2"] nav.nav::after,
html[data-theme="theme2"] .auth-card::after,
html[data-theme="theme2"] .widget::after,
html[data-theme="theme2"] .hero-stats > .glass::after,
html[data-theme="theme2"] #view-dashboard .balance-grid > .glass::after,
html[data-theme="theme2"] main > .grid > .glass:first-child::after,
html[data-theme="theme2"] .tab-bar::after {
  content: ""; position: absolute; height: 2px; pointer-events: none; z-index: 2;
  background: var(--al-run) -45% 0 / 38% 100% no-repeat, linear-gradient(90deg, transparent, rgba(59,130,246,.30), transparent);
  box-shadow: 0 0 8px rgba(59,130,246,.30);
}
/* nav-like: strip on the lower edge, full width */
html[data-theme="theme2"] nav.site-nav::after,
html[data-theme="theme2"] header.auth-header::after,
html[data-theme="theme2"] .mobile-header::after,
html[data-theme="theme2"] nav.nav::after { left: 0; right: 0; bottom: -1px; }
html[data-theme="theme2"] .tab-bar::after { left: 0; right: 0; top: -1px; background-position: 145% 0, 0 0; }
/* cards: strip on the top edge, inset from rounded corners */
html[data-theme="theme2"] .auth-card::after,
html[data-theme="theme2"] .widget::after,
html[data-theme="theme2"] .hero-stats > .glass::after,
html[data-theme="theme2"] #view-dashboard .balance-grid > .glass::after,
html[data-theme="theme2"] main > .grid > .glass:first-child::after { left: 14px; right: 14px; top: -1px; border-radius: 2px; }

/* ---------- Primary buttons: vibrant blue + periodic shimmer ---------- */
html[data-theme="theme2"] .btn-primary,
html[data-theme="theme2"] button.btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red),
html[data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red) {
  background: linear-gradient(115deg, #155eef 0%, #2d7bff 38%, #6aa8ff 50%, #2d7bff 62%, #155eef 100%) 0 0 / 260% 100% !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(37,99,235,.32), inset 0 1px 0 rgba(255,255,255,.25) !important;
  transition: box-shadow .2s ease, transform .2s ease;
}
html[data-theme="theme2"] .btn-primary:hover,
html[data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red):hover {
  background-position: 100% 0 !important;
  box-shadow: 0 0 0 4px rgba(59,130,246,.20), 0 10px 28px rgba(37,99,235,.45), inset 0 1px 0 rgba(255,255,255,.3) !important;
  transform: translateY(-1px);
}
html[data-theme="theme2"] .btn-ghost { transition: box-shadow .2s, border-color .2s, background-color .2s; }
html[data-theme="theme2"] .btn-ghost:hover {
  background: #fff !important; border-color: var(--al-blue) !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,.14), 0 6px 18px rgba(37,99,235,.14);
}
html[data-theme="theme2"] .btn-emerald { box-shadow: 0 6px 16px rgba(6,118,71,.26) !important; }
html[data-theme="theme2"] .btn-red { box-shadow: 0 6px 16px rgba(180,35,24,.24) !important; }
html[data-theme="theme2"] .btn-ghost.active { box-shadow: 0 0 0 3px rgba(59,130,246,.16), 0 0 18px rgba(59,130,246,.18); }

/* Inputs: alive focus */
html[data-theme="theme2"] .input:focus,
html[data-theme="theme2"] .input-shell:focus-within,
html[data-theme="theme2"] .field input:focus,
html[data-theme="theme2"] .pin-grid input:focus,
html[data-theme="theme2"] .otp-grid input:focus {
  box-shadow: 0 0 0 4px rgba(59,130,246,.18), 0 0 20px rgba(59,130,246,.22) !important;
}
html[data-theme="theme2"][data-mode="dark"] .input,
html[data-theme="theme2"][data-mode="dark"] .input-shell,
html[data-theme="theme2"][data-mode="dark"] .field input { background: #121c33 !important; }

/* ---------- Key numbers & headline ---------- */
html[data-theme="theme2"] #bal-avail,
html[data-theme="theme2"] #stat-balance {
  background: linear-gradient(100deg, #0a2a73 0%, #155eef 60%, #2d7bff 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}
html[data-theme="theme2"][data-mode="dark"] #bal-avail,
html[data-theme="theme2"][data-mode="dark"] #stat-balance {
  background: linear-gradient(100deg, #dbeafe 0%, #93c5fd 55%, #67e8f9 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
}
html[data-theme="theme2"] .hero-title .grad,
html[data-theme="theme2"] .text-gradient,
html[data-theme="theme2"] h1 .grad {
  background: linear-gradient(100deg, #155eef 0%, #2d7bff 55%, #6d4df2 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}
html[data-theme="theme2"][data-mode="dark"] .hero-title .grad,
html[data-theme="theme2"][data-mode="dark"] .text-gradient,
html[data-theme="theme2"][data-mode="dark"] h1 .grad {
  background: linear-gradient(100deg, #60a5fa 0%, #67e8f9 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
}
html[data-theme="theme2"] .hero-stats .glass p:last-child { color: #0f2a6b !important; }
html[data-theme="theme2"][data-mode="dark"] .hero-stats .glass p:last-child { color: #e8f0ff !important; }
/* Profit = green, loss = red: unchanged from theme2 */

/* Live dots / badges breathe softly */
html[data-theme="theme2"] .marquee { background: transparent; }


/* "Get the app" section (index): its helper text was written for a dark page — keep it readable on the light base */
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-hint b,
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-step p b { color: #1d2939; }
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-meta,
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-hint,
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-step p { color: #475467; }
html[data-theme="theme2"]:not([data-mode="dark"]) .ga-step { background: var(--al-patch); border-color: var(--al-edge); }

/* ---------- Trading desk (standalone dark page) ---------- */
html[data-alive="trading"] {
  --bg: #0d1524; --p1: #141f34; --p2: #1c2a46; --ln: #27375a; --ac: #2f8cff;
  --al-run: linear-gradient(90deg, transparent, #22d3ee 28%, #3b82f6 55%, #a855f7 80%, transparent);
  background: #0d1524;
}
html[data-alive="trading"] body {
  background:
    radial-gradient(60vmax 40vmax at 6% -8%, rgba(59,130,246,.22), transparent 62%),
    radial-gradient(46vmax 34vmax at 100% 0%, rgba(34,211,238,.12), transparent 62%),
    var(--bg);
}
html[data-alive="trading"] .top,
html[data-alive="trading"] .tk,
html[data-alive="trading"] .wl,
html[data-alive="trading"] .pos,
html[data-alive="trading"] .mnav { background: linear-gradient(180deg, #17233b, #121c30); border-color: rgba(96,165,250,.18); }
html[data-alive="trading"] .row.sel { background: linear-gradient(90deg, rgba(47,140,255,.28), rgba(47,140,255,.08)); box-shadow: inset 3px 0 0 var(--ac); }
html[data-alive="trading"] .row:hover { background: rgba(47,140,255,.10); }
html[data-alive="trading"] .tab.on,
html[data-alive="trading"] .bar span.on { background: rgba(47,140,255,.2); box-shadow: inset 0 0 0 1px rgba(96,165,250,.35); }
html[data-alive="trading"] .flt button.on,
html[data-alive="trading"] .rvt button.on,
html[data-alive="trading"] .cbtn,
html[data-alive="trading"] .av { background: linear-gradient(115deg, #1f6fff, #2f8cff 50%, #22b8f0); color: #fff; }
html[data-alive="trading"] .cbtn { box-shadow: 0 4px 16px rgba(47,140,255,.4); }
html[data-alive="trading"] .go:not(.sig):not(:disabled) {
  background: linear-gradient(115deg, #1f6fff 0%, #2f8cff 38%, #6fb0ff 50%, #2f8cff 62%, #1f6fff 100%) 0 0 / 260% 100%;
  color: #fff; box-shadow: 0 6px 20px rgba(47,140,255,.4), inset 0 1px 0 rgba(255,255,255,.25);
}
html[data-alive="trading"] .tk.mt-off .go { background: var(--p2); box-shadow: none; }
html[data-alive="trading"] .go:hover:not(:disabled) { box-shadow: 0 0 0 4px rgba(47,140,255,.22), 0 10px 28px rgba(47,140,255,.5); }
html[data-alive="trading"] .in:focus,
html[data-alive="trading"] .search:focus { box-shadow: 0 0 0 3px rgba(47,140,255,.25), 0 0 18px rgba(47,140,255,.25); }
html[data-alive="trading"] .card { background: linear-gradient(180deg, #19274a, #131e36); border-color: rgba(96,165,250,.28); box-shadow: 0 20px 50px rgba(0,0,0,.5), 0 0 40px rgba(47,140,255,.12); }
html[data-alive="trading"] .logo em { color: #5eb0ff; }
html[data-alive="trading"] body::before,
html[data-alive="trading"] body::after {
  content: ""; position: fixed; left: 0; right: 0; height: 3px; z-index: 9990; pointer-events: none;
  background: var(--al-run) -45% 0 / 38% 100% no-repeat, linear-gradient(90deg, transparent, rgba(59,130,246,.35), transparent);
  box-shadow: 0 0 10px rgba(59,130,246,.4);
}
html[data-alive="trading"] body::before { top: 0; }
html[data-alive="trading"] body::after { bottom: 0; background-position: 145% 0, 0 0; }
html[data-alive="trading"] .top,
html[data-alive="trading"] .tk,
html[data-alive="trading"] .hd { position: relative; }
html[data-alive="trading"] .top::after,
html[data-alive="trading"] .tk::after,
html[data-alive="trading"] .hd::after {
  content: ""; position: absolute; left: 0; right: 0; height: 2px; pointer-events: none; z-index: 2;
  background: var(--al-run) -45% 0 / 38% 100% no-repeat, linear-gradient(90deg, transparent, rgba(59,130,246,.30), transparent);
  box-shadow: 0 0 8px rgba(59,130,246,.35);
}
html[data-alive="trading"] .top::after { bottom: -1px; }
html[data-alive="trading"] .tk::after { top: -1px; }
html[data-alive="trading"] .hd::after { bottom: -1px; }

/* ---------- Admin: same language, calmer ---------- */
html[data-alive="subtle"] { --al-strip-a: .6; }
html[data-alive="subtle"][data-theme="theme2"]::after { display: none; }
html[data-alive="subtle"][data-theme="theme2"] body::after { display: none; }
html[data-alive="subtle"][data-theme="theme2"] .btn-primary,
html[data-alive="subtle"][data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red) {
  background-size: 100% 100% !important;
  box-shadow: 0 3px 10px rgba(37,99,235,.2), inset 0 1px 0 rgba(255,255,255,.2) !important;
}

/* ---------- Motion (opt-in only; reduced-motion users get a calm static look) ---------- */
@keyframes al-run   { from { background-position: -45% 0, 0 0; } to { background-position: 145% 0, 0 0; } }
@keyframes al-run-r { from { background-position: 145% 0, 0 0; } to { background-position: -45% 0, 0 0; } }
@keyframes al-drift { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(-2.5%, 2%, 0) scale(1.07); } }
@keyframes al-edge  { from { opacity: .75; } to { opacity: 1; } }
@keyframes al-sheen { 0%, 78% { background-position: 0 0; } 100% { background-position: 100% 0; } }

@media (prefers-reduced-motion: no-preference) {
  html[data-theme="theme2"]::before { animation: al-drift 60s ease-in-out infinite alternate; }
  html[data-theme="theme2"]::after  { animation: al-edge 14s ease-in-out infinite alternate; }
  html[data-theme="theme2"] body::before { animation: al-run 15s linear infinite; }
  html[data-theme="theme2"] body::after  { animation: al-run-r 20s linear infinite; }
  html[data-theme="theme2"] nav.site-nav::after,
  html[data-theme="theme2"] header.auth-header::after,
  html[data-theme="theme2"] .mobile-header::after,
  html[data-theme="theme2"] nav.nav::after { animation: al-run 12s linear infinite 2.5s; }
  html[data-theme="theme2"] .auth-card::after,
  html[data-theme="theme2"] .widget::after,
  html[data-theme="theme2"] .hero-stats > .glass::after,
  html[data-theme="theme2"] #view-dashboard .balance-grid > .glass::after,
  html[data-theme="theme2"] main > .grid > .glass:first-child::after { animation: al-run 10s linear infinite; }
  html[data-theme="theme2"] .hero-stats > .glass:nth-child(2)::after,
  html[data-theme="theme2"] #view-dashboard .balance-grid > .glass:nth-child(2)::after { animation-delay: 1.6s; }
  html[data-theme="theme2"] .hero-stats > .glass:nth-child(3)::after,
  html[data-theme="theme2"] #view-dashboard .balance-grid > .glass:nth-child(3)::after { animation-delay: 3.2s; }
  html[data-theme="theme2"] .tab-bar::after { animation: al-run-r 13s linear infinite; }
  html[data-theme="theme2"] .btn-primary,
  html[data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red) { animation: al-sheen 13s ease-in-out infinite; }
  html[data-alive="trading"] body::before { animation: al-run 15s linear infinite; }
  html[data-alive="trading"] body::after  { animation: al-run-r 20s linear infinite; }
  html[data-alive="trading"] .top::after,
  html[data-alive="trading"] .hd::after { animation: al-run 12s linear infinite 2.5s; }
  html[data-alive="trading"] .tk::after { animation: al-run-r 10.5s linear infinite; }
  html[data-alive="trading"] .go:not(.sig):not(:disabled) { animation: al-sheen 13s ease-in-out infinite; }
  html[data-alive="subtle"][data-theme="theme2"]::before,
  html[data-alive="subtle"][data-theme="theme2"] .btn-primary,
  html[data-alive="subtle"][data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red) { animation: none; }
  html[data-alive="subtle"][data-theme="theme2"] body::before { animation-duration: 25s; }
}
/* Low-end / small phones: keep the strips, drop the large animated layers */
@media (max-width: 640px) {
  @media (prefers-reduced-motion: no-preference) {
    html[data-theme="theme2"]::before { animation: none; }
    html[data-theme="theme2"]::after { animation: none; }
    html[data-theme="theme2"] .btn-primary,
    html[data-theme="theme2"] .btn:not(.btn-ghost):not(.btn-emerald):not(.btn-red) { animation-duration: 16s; }
  }
  html[data-theme="theme2"]::before { will-change: auto; }
}
@media print { html::before, html::after, body::before, body::after { display: none !important; } }