/* ══════════════════════════════════════════════════════════════════════════
   MEXTER2 · PAGES — hand-written skin layer for settings2.html + signals2.html
   Carries the mexter2.html console language (jewel violet-blue canvas, frosted
   glass, crisp gold hairline frames, Space Grotesk display type) onto the two
   sibling pages. k2.css supplies the body canvas + ambient nodes; everything
   here is page chrome. Loaded LAST on both pages so it wins the cascade.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --k2-gold:#f0c64f;
  --k2-gold-hi:#ebcf82;
  --k2-gold-line:rgba(240,198,79,.55);
  --k2-gold-line-hi:rgba(235,207,130,.8);
  --k2-gold-glow:0 0 22px -8px rgba(240,198,79,.35);
  --k2-azure:#2ee6f0;
  --k2-violet-line:rgba(232,210,168,.22);
  --k2-violet-line-hi:rgba(232,210,168,.45);
  --k2-mint:#3dffa0;
  --k2-up:#4dff9b;
  --k2-down:#ff4d6d;
  --k2-glass:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44));
  --k2-glass-soft:linear-gradient(160deg,rgba(127,114,88,.22),rgba(67,61,49,.32));
  --k2-shadow:0 10px 30px -16px rgba(30,26,19,.65);
  --k2-lift:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1),border-color .3s ease;
  --k2-font-display:'Space Grotesk','Nunito',ui-rounded,system-ui,sans-serif;
  --k2-gold-grad:linear-gradient(120deg,#f3e3b4,#f0c64f 42%,#dca536 78%,#836735);
}

/* ══════════════════════════════════════════════════════════════════════════
   SETTINGS2 — reskin of settings.html.
   The page carries several inline <style> layers that lean on !important;
   this sheet loads after all of them and prefixes every rule with
   body.k2-settings so specificity is never in doubt. Layout, ids, forms and
   JS are untouched — surface only.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── workspace: let the k2 jewel canvas + aurora show through ───────────── */
body.k2-settings #setBody.grid-bg{
  background:none!important;
}
body.k2-settings .grid-bg::before{
  background:radial-gradient(560px 300px at 50% 0%,rgba(255,255,255,.04),transparent 70%)!important;
  opacity:1!important;
}

/* ── type: Space Grotesk takes over the display jobs Fredoka had ────────── */
body.k2-settings .panel-header,
body.k2-settings .nav-tab,
body.k2-settings .cfg-tab,
body.k2-settings .sect,
body.k2-settings .const-title,
body.k2-settings .btn,
body.k2-settings .asset-card,
body.k2-settings .mode-card,
body.k2-settings .fee-card > *:first-child,
body.k2-settings #setHeader .gradient-text,
body.k2-settings #statTrades,
body.k2-settings #statEarned,
body.k2-settings #statBots,
body.k2-settings .tile .font-bold,
body.k2-settings h1,h2,h3{
  font-family:var(--k2-font-display)!important;
}

/* ── header + footer chrome: frosted bars ───────────────────────────────── */
body.k2-settings #setHeader{
  background:linear-gradient(180deg,rgba(70,64,52,.62),rgba(57,51,40,.55))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border-bottom:1px solid var(--k2-violet-line)!important;
  box-shadow:0 10px 30px -20px rgba(15,13,9,.9),0 1px 0 rgba(255,255,255,.05) inset!important;
}
body.k2-settings footer{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border-top:1px solid var(--k2-violet-line)!important;
}
body.k2-settings #setHeader .gradient-text{
  background:var(--k2-gold-grad)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;letter-spacing:.04em!important;
}
body.k2-settings .brand-sub{color:var(--k2-azure)!important}

/* header pills → glass chips */
body.k2-settings .nav-ver{
  background:rgba(240,198,79,.08)!important;
  border:1px solid var(--k2-gold-line)!important;
  color:var(--k2-gold-hi)!important;border-radius:999px!important;
}
body.k2-settings #connStatus{
  background:rgba(127,114,88,.25)!important;
  border:1px solid var(--k2-violet-line)!important;border-radius:999px!important;
  color:#e1d0b0!important;
}
body.k2-settings #balDisp{
  background:rgba(77,255,155,.08)!important;
  border:1px solid rgba(77,255,155,.4)!important;border-radius:999px!important;
  color:var(--k2-up)!important;
}

/* segmented nav → glass tabs, active = gold gradient.
   Mirrors the app console tablist spec in k2-src.css ([role="tablist"]) —
   keep the two in sync so both headers read as the same control. */
body.k2-settings .nav-seg{
  background:rgba(33,29,23,.45)!important;
  border:1px solid var(--k2-violet-line)!important;border-radius:999px!important;
  padding:3px!important;gap:1px!important;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.k2-settings .nav-tab{
  color:#e1d0b0!important;border-radius:999px!important;
  font-size:11.5px!important;font-weight:600!important;
  letter-spacing:.05em!important;text-transform:uppercase!important;
  padding:6px 14px!important;
  transition:background .25s ease,color .25s ease,box-shadow .45s var(--ease-flow)!important;
}
body.k2-settings .nav-tab:hover{background:rgba(232,193,115,.16)!important;color:#fbf8f3!important}
body.k2-settings .nav-tab.is-on{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  border:1px solid rgba(131,103,53,.9)!important;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset!important;
}
/* k2.css's console rule paints any href-less tab gold; here only .is-on earns it */
body.k2-settings [role=tablist] a:not([href]):not([onclick]):not(.is-on){
  background:transparent!important;color:#e1d0b0!important;box-shadow:none!important;
  border-color:transparent!important;
}

/* ── panels: frosted glass, crisp gold hairline frame, no washes ────────── */
body.k2-settings .panel,
body.k2-settings .glow,
body.k2-settings #setBody .panel,
body.k2-settings body .panel{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow),0 1px 0 rgba(255,255,255,.05) inset!important;
  transition:var(--k2-lift);
}
body.k2-settings .panel:hover{
  border-color:var(--k2-gold-line-hi)!important;
  box-shadow:0 0 26px -8px rgba(240,198,79,.45),var(--k2-shadow),0 1px 0 rgba(255,255,255,.06) inset!important;
}
/* the wallet panel keeps the same gold frame — no azure halo, no orange */
body.k2-settings #setLeft > .panel.glow{
  border-color:var(--k2-gold-line)!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow),0 1px 0 rgba(255,255,255,.05) inset!important;
}
body.k2-settings .panel-header,
body.k2-settings #setBody .panel .panel-header{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0))!important;
  border-bottom:1px solid rgba(240,198,79,.22)!important;
  border-radius:19px 19px 0 0!important;
  color:#f8f5ed!important;font-weight:600!important;letter-spacing:.14em!important;
}
body.k2-settings .panel-header svg{color:var(--k2-gold)!important;opacity:.95!important}

/* inner tiles: smaller glass cards, violet hairline */
body.k2-settings .tile{
  background:var(--k2-glass-soft)!important;
  backdrop-filter:blur(12px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.3)!important;
  border:1px solid var(--k2-violet-line)!important;
  border-radius:14px!important;
  box-shadow:var(--k2-shadow)!important;
}

/* ── inputs: dark glass, gold focus ring ────────────────────────────────── */
body.k2-settings .input-styled,
body.k2-settings input.input,
body.k2-settings select,
body.k2-settings .select{
  background:rgba(30,27,21,.6)!important;
  border:1px solid var(--k2-violet-line)!important;
  color:#fbf8f3!important;border-radius:10px!important;
  box-shadow:inset 0 2px 7px rgba(15,13,9,.5)!important;
  transition:border-color .2s,box-shadow .25s,background .2s!important;
}
body.k2-settings .input-styled::placeholder{color:#ad976f!important}
body.k2-settings .input-styled:hover{border-color:var(--k2-violet-line-hi)!important}
body.k2-settings .input-styled:focus,
body.k2-settings .input-styled:focus-visible{
  background:rgba(38,34,27,.75)!important;
  border-color:var(--k2-gold)!important;
  box-shadow:inset 0 2px 7px rgba(15,13,9,.5),0 0 0 3px rgba(240,198,79,.22)!important;
}
body.k2-settings .checkbox{border-color:var(--k2-violet-line-hi)!important;border-radius:6px!important}
body.k2-settings .checkbox-primary{--chkbg:var(--k2-gold);--chkfg:#211d13}
body.k2-settings .checkbox-primary:checked,
body.k2-settings .checkbox-primary[aria-checked=true]{
  background-color:var(--k2-gold)!important;border-color:#836735!important;
}
body.k2-settings :focus-visible{outline:2px solid rgba(240,198,79,.55);outline-offset:2px}

/* ── buttons ────────────────────────────────────────────────────────────── */
body.k2-settings .btn{border-radius:999px!important;letter-spacing:.06em!important;
  transition:var(--k2-lift),filter .2s ease!important}
body.k2-settings .btn-accent-solid{
  background:var(--k2-gold-grad)!important;
  color:#211d13!important;font-weight:700!important;
  border:1px solid rgba(131,103,53,.9)!important;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset!important;
}
body.k2-settings .btn-accent-solid:hover{filter:brightness(1.06);transform:translateY(-2px)}
body.k2-settings .btn-accent-solid:active{transform:translateY(1px)}
body.k2-settings .btn-quiet{
  background:rgba(46,230,240,.08)!important;color:var(--k2-azure)!important;
  border:1px solid rgba(46,230,240,.4)!important;box-shadow:none!important;
}
body.k2-settings .btn-quiet:hover{background:rgba(46,230,240,.15)!important;transform:translateY(-2px)}

/* ── strategy tabs: glass pills, active = gold ──────────────────────────── */
body.k2-settings #cfgTabBar{border-bottom:1px solid var(--k2-violet-line)!important}
body.k2-settings .cfg-tab{
  background:rgba(127,114,88,.18)!important;
  border:1px solid var(--k2-violet-line)!important;border-radius:999px!important;
  color:#e1d0b0!important;box-shadow:none!important;
  transition:var(--k2-lift),color .2s,background .3s!important;
}
body.k2-settings .cfg-tab:hover{
  background:rgba(232,193,115,.18)!important;color:#fbf8f3!important;
  border-color:var(--k2-violet-line-hi)!important;transform:translateY(-2px);
}
body.k2-settings .cfg-tab.active,
body.k2-settings .cfg-tab-const.active,
body.k2-settings .cfg-tab-simple.active,
body.k2-settings .cfg-tab-adv.active{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  border-color:rgba(131,103,53,.9)!important;
  box-shadow:0 8px 20px -10px rgba(240,198,79,.8),0 1px 0 rgba(255,255,255,.4) inset!important;
}
body.k2-settings .cfg-tab.active::after{display:none!important}
body.k2-settings .tag{
  background:rgba(33,29,23,.4)!important;
  border:1px solid var(--k2-violet-line)!important;color:#e1d0b0!important;
  border-radius:999px!important;
}
body.k2-settings .cfg-tab.active .tag{
  background:rgba(33,29,19,.18)!important;border-color:rgba(33,29,19,.3)!important;
  color:#211d13!important;
}

/* ── choice cards (market / mode / DCA / strictness / fees): glass, gold
      hairline when selected — tinted glass only, never a solid wash ────── */
body.k2-settings .asset-card,
body.k2-settings .mode-card,
body.k2-settings .fee-card{
  background:var(--k2-glass-soft)!important;
  backdrop-filter:blur(12px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.3)!important;
  border:1px solid var(--k2-violet-line)!important;
  border-radius:14px!important;color:#e6ddcc!important;
  box-shadow:var(--k2-shadow)!important;
  transition:var(--k2-lift),color .2s,background .3s!important;
}
body.k2-settings .asset-card:hover,
body.k2-settings .mode-card:hover,
body.k2-settings .fee-card:hover{
  border-color:var(--k2-violet-line-hi)!important;
  transform:translateY(-2px);color:#fbf8f3!important;
}
body.k2-settings .asset-card.active,
body.k2-settings .mode-card.active,
body.k2-settings .fee-card.active{
  background:linear-gradient(160deg,rgba(240,198,79,.10),rgba(127,114,88,.24))!important;
  border-color:var(--k2-gold-line-hi)!important;color:#fff!important;
  box-shadow:0 0 22px -8px rgba(240,198,79,.5),var(--k2-shadow)!important;
}
body.k2-settings .asset-card span,
body.k2-settings .mode-card span{color:#c1ac87!important}
body.k2-settings .asset-card.active span,
body.k2-settings .mode-card.active span{color:var(--k2-gold-hi)!important}

/* ── trading-hours heatmap ──────────────────────────────────────────────── */
body.k2-settings .hour-cell{
  background:rgba(38,34,27,.55)!important;
  border:1px solid var(--k2-violet-line)!important;
  color:#e1d0b0!important;border-radius:8px!important;
  transition:border-color .2s,color .2s,transform .3s!important;
}
body.k2-settings .hour-cell:hover{
  background:rgba(240,198,79,.10)!important;
  border-color:var(--k2-gold-line-hi)!important;color:#fff!important;
}
body.k2-settings .hour-cell.avoided{
  background:rgba(255,77,109,.14)!important;
  border-color:rgba(255,77,109,.55)!important;color:#ff8ba0!important;
}

/* ── constellation hero + running banner ────────────────────────────────── */
body.k2-settings .const-hero{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(14px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.3)!important;
  border:1px solid var(--k2-gold-line)!important;border-left:2px solid var(--k2-gold)!important;
  border-radius:16px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
}
body.k2-settings .const-title{color:var(--k2-gold-hi)!important;font-weight:700!important}
body.k2-settings #runningStrategyBanner{
  background:rgba(77,255,155,.07)!important;
  border:1px solid rgba(77,255,155,.35)!important;border-radius:12px!important;
  color:#a9f5cd!important;
}
body.k2-settings #runningStrategyName{color:#fff!important}

/* ── misc glass bits ────────────────────────────────────────────────────── */
body.k2-settings .hlp{
  background:rgba(127,114,88,.25)!important;border:1px solid var(--k2-violet-line)!important;
  color:#e1d0b0!important;
}
body.k2-settings .hlp:hover{
  background:rgba(240,198,79,.12)!important;color:var(--k2-gold-hi)!important;
  border-color:var(--k2-gold-line)!important;
}
body.k2-settings #hlpTip{
  background:rgba(50,45,36,.92)!important;
  backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
  border:1px solid var(--k2-violet-line-hi)!important;
  box-shadow:0 18px 44px rgba(15,13,9,.7)!important;
}

/* the pulsing heart that replaced the old "5" status glyph */
body.k2-settings .k2-heart{display:inline-flex;align-items:center;line-height:0;vertical-align:middle}

/* ══════════════════════════════════════════════════════════════════════════
   SIGNALS2 — reskin of signals.html (playground "toy" look → Mexter2).
   The page's own styles live in an inline <style> in <head> and don't use
   !important, so these rules (later in the cascade, body.k2-signals prefix)
   win outright. Every id, the polling script and /api/signals/live untouched.
   ══════════════════════════════════════════════════════════════════════════ */

/* sky → the jewel canvas shows through; aurora replaces the drifting clouds */
body.k2-signals .sky{background:transparent}
body.k2-signals .clouds{display:none!important}

/* display type */
body.k2-signals h1,
body.k2-signals h2,
body.k2-signals h3,
body.k2-signals .brand b,
body.k2-signals .ring .t,
body.k2-signals .coin .nm,
body.k2-signals .coin .dl,
body.k2-signals .lagrow .who,
body.k2-signals .sig .lead,
body.k2-signals .stat b,
body.k2-signals .btn,
body.k2-signals .navlinks a{
  font-family:var(--k2-font-display);
}

/* ── hud bar: frosted glass capsule with the gold hairline ──────────────── */
body.k2-signals #hud .bar{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:999px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
}
body.k2-signals .brand small{color:var(--k2-gold)}
body.k2-signals .navlinks a{
  color:#e1d0b0;border-radius:999px;
  transition:color .2s,background .3s,box-shadow .3s;
}
body.k2-signals .navlinks a:hover{background:rgba(232,193,115,.16);color:#fbf8f3}
body.k2-signals .navlinks a[aria-current]{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset;
}

/* ── pills → glass chips (semantic tints kept, as glass not solid fills) ── */
body.k2-signals .pill{
  background:rgba(127,114,88,.22);color:var(--k2-azure);
  border:1px solid var(--k2-violet-line);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
body.k2-signals .pill.y{background:rgba(240,198,79,.09);color:var(--k2-gold-hi);border-color:var(--k2-gold-line)}
body.k2-signals .pill.p{background:rgba(255,77,109,.09);color:#ff8ba0;border-color:rgba(255,77,109,.4)}
body.k2-signals .pill.g{background:rgba(77,255,155,.08);color:var(--k2-up);border-color:rgba(77,255,155,.4)}

/* ── alerts button: gold gradient pill; on = mint-tinted glass ──────────── */
body.k2-signals .btn{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;
  border:1px solid rgba(131,103,53,.9);
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset;
  transition:var(--k2-lift),filter .2s ease;
}
body.k2-signals .btn:hover{filter:brightness(1.06);transform:translateY(-2px)}
body.k2-signals .btn:active{transform:translateY(1px)}
body.k2-signals .btn.on{
  background:rgba(61,255,160,.12);color:var(--k2-mint);
  border:1px solid rgba(61,255,160,.5);
  box-shadow:0 0 22px -8px rgba(61,255,160,.5),var(--k2-shadow);
}

/* ── the big round card: frosted glass, gold hairline frame ─────────────── */
body.k2-signals .card{
  background:var(--k2-glass);
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:20px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
  transition:var(--k2-lift);
}
body.k2-signals .card:hover{
  border-color:var(--k2-gold-line-hi);
  box-shadow:0 0 26px -8px rgba(240,198,79,.45),var(--k2-shadow);
}
body.k2-signals .verdict p{color:#e1d0b0}

/* ── coin board: small glass tiles, semantic 1px borders + soft glows ───── */
body.k2-signals .coin{
  background:var(--k2-glass-soft);
  backdrop-filter:blur(12px) saturate(1.3);
  -webkit-backdrop-filter:blur(12px) saturate(1.3);
  border:1px solid var(--k2-violet-line);
  border-radius:14px;
  box-shadow:var(--k2-shadow);
  transition:var(--k2-lift);
}
body.k2-signals .coin:hover{transform:translateY(-2px);border-color:var(--k2-violet-line-hi)}
body.k2-signals .coin.UP{
  background:linear-gradient(160deg,rgba(77,255,155,.07),rgba(67,61,49,.32));
  border:1px solid rgba(77,255,155,.45);
  box-shadow:0 0 18px -8px rgba(77,255,155,.5),var(--k2-shadow);
}
body.k2-signals .coin.DOWN{
  background:linear-gradient(160deg,rgba(255,77,109,.07),rgba(67,61,49,.32));
  border:1px solid rgba(255,77,109,.45);
  box-shadow:0 0 18px -8px rgba(255,77,109,.5),var(--k2-shadow);
}
body.k2-signals .coin.lag{
  background:linear-gradient(160deg,rgba(240,198,79,.08),rgba(67,61,49,.32));
  border:1px solid var(--k2-gold-line);
  box-shadow:0 0 22px -8px rgba(240,198,79,.55),var(--k2-shadow);
}
body.k2-signals .coin .tag{
  background:rgba(127,114,88,.25);color:#e1d0b0;
  border:1px solid var(--k2-violet-line);
}
body.k2-signals .coin.UP .tag{background:rgba(77,255,155,.10);color:var(--k2-up);border-color:rgba(77,255,155,.35)}
body.k2-signals .coin.DOWN .tag{background:rgba(255,77,109,.10);color:#ff8ba0;border-color:rgba(255,77,109,.35)}
body.k2-signals .coin.lag .tag{background:rgba(240,198,79,.10);color:var(--k2-gold-hi);border-color:var(--k2-gold-line)}

/* ── laggard rows, tape rows, stat tiles, note: glass + violet hairline ─── */
body.k2-signals .lagrow,
body.k2-signals .sig,
body.k2-signals .stat{
  background:var(--k2-glass-soft);
  backdrop-filter:blur(12px) saturate(1.3);
  -webkit-backdrop-filter:blur(12px) saturate(1.3);
  border:1px solid var(--k2-violet-line);
  border-radius:14px;
  box-shadow:var(--k2-shadow);
  transition:var(--k2-lift);
}
body.k2-signals .lagrow:hover,
body.k2-signals .sig:hover{transform:translateY(-2px);border-color:var(--k2-violet-line-hi)}
body.k2-signals .lagrow.pass{
  background:linear-gradient(160deg,rgba(240,198,79,.08),rgba(67,61,49,.32));
  border:1px solid var(--k2-gold-line);
  box-shadow:0 0 22px -8px rgba(240,198,79,.5),var(--k2-shadow);
}
body.k2-signals .note{
  background:var(--k2-glass-soft);
  backdrop-filter:blur(12px) saturate(1.3);
  -webkit-backdrop-filter:blur(12px) saturate(1.3);
  border:1px solid var(--k2-violet-line);
  border-radius:14px;color:#e1d0b0;
  box-shadow:var(--k2-shadow);
}
body.k2-signals .note b{color:#fbf8f3}
body.k2-signals .stat s{color:#c1ac87}
body.k2-signals .sec .sub{color:#d1c0a0}
body.k2-signals .empty{color:#c1ac87}

/* ══════════════════════════════════════════════════════════════════════════
   BLOG2 — reskin of blog.html (daisyUI + tailwind CDN + mexter-blog.css).
   mexter-blog.css leans on !important; this section loads after it and uses the
   body.k2-blog prefix, so it wins. Links, markup and JSON-LD untouched.
   ══════════════════════════════════════════════════════════════════════════ */

/* old night-gradient + cloud blobs step aside for the k2 canvas + aurora */
body.k2-blog::before,
body.k2-blog::after{display:none!important}

/* display type: Space Grotesk takes Fredoka's jobs */
body.k2-blog h1,
body.k2-blog h2,
body.k2-blog h3,
body.k2-blog h4,
body.k2-blog .nav-label,
body.k2-blog .chip,
body.k2-blog .neon-static,
body.k2-blog .nav-card,
body.k2-blog .navbar a{
  font-family:var(--k2-font-display)!important;
}

/* ── navbar → the signals capsule: frosted glass, gold hairline ─────────── */
body.k2-blog .navbar{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:999px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  top:12px!important;
}
body.k2-blog .navbar .font-bold{color:#fbf8f3!important}
body.k2-blog .navbar .btn-ghost{
  border-radius:999px!important;color:#e1d0b0!important;
  transition:color .2s,background .3s!important;
}
body.k2-blog .navbar .btn-ghost:hover{background:rgba(232,193,115,.16)!important;color:#fbf8f3!important}

/* ── primary buttons → gold gradient pills ──────────────────────────────── */
body.k2-blog .neon-static{
  background:var(--k2-gold-grad)!important;color:#211d13!important;
  border:1px solid rgba(131,103,53,.9)!important;border-radius:999px!important;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset!important;
  font-weight:700!important;
  transition:var(--k2-lift),filter .2s ease!important;
}
body.k2-blog .neon-static:hover{
  background:var(--k2-gold-grad)!important;color:#211d13!important;
  filter:brightness(1.06);transform:translateY(-2px);
  box-shadow:0 14px 30px -12px rgba(240,198,79,.9),0 1px 0 rgba(255,255,255,.45) inset!important;
}
body.k2-blog .neon-static:active{transform:translateY(1px)}

/* ── page heading: gold gradient wordmark, gold kicker ──────────────────── */
body.k2-blog .gradient-text{
  background:var(--k2-gold-grad)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;
}
body.k2-blog main span[style*="#f67c28"]{color:var(--k2-gold-hi)!important}

/* ── post cards: same gold-hairline glass as the signals cards ──────────── */
body.k2-blog .post{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  transition:var(--k2-lift)!important;
}
body.k2-blog .post:hover{
  border-color:var(--k2-gold-line-hi)!important;
  transform:translateY(-2px);
  box-shadow:0 0 26px -8px rgba(240,198,79,.45),var(--k2-shadow)!important;
}
body.k2-blog .post h2{font-family:var(--k2-font-display)!important}
body.k2-blog .post p{color:#d9ccb2!important}

/* ── chips → tinted glass pills with 1px hairlines ──────────────────────── */
body.k2-blog .chip{border-width:1px!important;backdrop-filter:blur(8px)}
body.k2-blog .c-rules{background:rgba(234,200,128,.10)!important;border-color:rgba(234,200,128,.4)!important}
body.k2-blog .c-const{background:rgba(240,198,79,.09)!important;color:var(--k2-gold-hi)!important;border-color:var(--k2-gold-line)!important}
body.k2-blog .c-simple{background:rgba(77,255,155,.08)!important;border-color:rgba(77,255,155,.35)!important}
body.k2-blog .c-date{background:rgba(127,114,88,.22)!important;border-color:var(--k2-violet-line)!important}

/* ── sidebar article cards (article pages share this sheet) ─────────────── */
body.k2-blog .nav-card{
  background:var(--k2-glass-soft)!important;color:#e1d0b0!important;
  border:1px solid var(--k2-violet-line)!important;border-radius:14px!important;
  box-shadow:var(--k2-shadow)!important;
  transition:var(--k2-lift),color .2s!important;
}
body.k2-blog .nav-card:hover{
  background:var(--k2-glass-soft)!important;color:#fbf8f3!important;
  border-color:var(--k2-violet-line-hi)!important;transform:translateY(-2px);
  box-shadow:var(--k2-shadow)!important;
}
body.k2-blog .nav-card[style]{
  background:linear-gradient(160deg,rgba(240,198,79,.10),rgba(127,114,88,.24))!important;
  color:var(--k2-gold-hi)!important;border-color:var(--k2-gold-line-hi)!important;
  box-shadow:0 0 22px -8px rgba(240,198,79,.5),var(--k2-shadow)!important;
}
body.k2-blog .nav-label{color:var(--k2-gold-hi)!important}

/* ── footer → frosted bar, violet hairline ──────────────────────────────── */
body.k2-blog footer{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border-top:1px solid var(--k2-violet-line)!important;
}
body.k2-blog footer a{color:var(--k2-azure)!important}

/* thin k2 scrollbars instead of the chunky navy ones */
body.k2-blog *::-webkit-scrollbar{width:8px;height:8px}
body.k2-blog *::-webkit-scrollbar-track{background:transparent}
body.k2-blog *::-webkit-scrollbar-thumb{background:linear-gradient(#e8c17380,#2ee6f066);border:none;border-radius:99px}
body.k2-blog *::-webkit-scrollbar-thumb:hover{background:linear-gradient(#e8c173bf,#2ee6f099)}

/* ══════════════════════════════════════════════════════════════════════════
   CALCULATOR2 — reskin of calculator.html (politics.css + tools.css, plain
   CSS, no !important — later cascade + body.k2-calculator prefix wins).
   All ids, sliders, the model script and chart drawing untouched.
   ══════════════════════════════════════════════════════════════════════════ */

/* retone the page's own accent tokens to k2 gold (azure stays for links) */
body.k2-calculator{--amber:#f0c64f;--amber-hi:#ebcf82}

/* display type */
body.k2-calculator h1,
body.k2-calculator h2,
body.k2-calculator .res-big,
body.k2-calculator .how h3,
body.k2-calculator .fld-h output,
body.k2-calculator .periods b,
body.k2-calculator .be b,
body.k2-calculator .nav-r .l,
body.k2-calculator .btn-go,
body.k2-calculator .cap,
body.k2-calculator .stat span,
body.k2-calculator .panel-h h3{
  font-family:var(--k2-font-display);
}

/* ── nav → the signals capsule: floating frosted glass, gold hairline ───── */
body.k2-calculator .nav{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:999px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
  max-width:1120px;margin:14px auto 0;top:12px;
  padding:8px 10px 8px 16px;min-height:60px;
}
@media(max-width:1160px){body.k2-calculator .nav{margin:10px 12px 0}}
body.k2-calculator .brand{font-family:var(--k2-font-display);color:#fbf8f3}
body.k2-calculator .nav-r .l{border-radius:999px;transition:color .2s,background .3s,box-shadow .3s}
body.k2-calculator .nav-r .l:hover{color:#fbf8f3;background:rgba(232,193,115,.16)}
body.k2-calculator .nav-r .l[aria-current="page"]{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset;
}
body.k2-calculator .btn-go{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;border-radius:999px;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset;
  transition:var(--k2-lift),filter .2s ease;
}
body.k2-calculator .btn-go:hover{
  background:var(--k2-gold-grad);filter:brightness(1.06);transform:translateY(-2px);
}

/* ── panels → frosted glass, gold hairline frame ────────────────────────── */
body.k2-calculator .panel{
  background:var(--k2-glass);
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:20px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
  transition:var(--k2-lift);
}
body.k2-calculator .panel:hover{
  border-color:var(--k2-gold-line-hi);
  box-shadow:0 0 26px -8px rgba(240,198,79,.45),var(--k2-shadow);
}
body.k2-calculator .panel-h{border-bottom:1px solid var(--k2-violet-line)}
body.k2-calculator .fld{border-top:1px solid var(--k2-violet-line)}
body.k2-calculator .fld:first-of-type{border-top:0}
body.k2-calculator .periods,
body.k2-calculator .periods div,
body.k2-calculator .brk,
body.k2-calculator .brk div,
body.k2-calculator .be,
body.k2-calculator .chart-wrap{border-color:var(--k2-violet-line)}

/* ── range sliders: gold fill, frosted thumb with gold ring ─────────────── */
body.k2-calculator input[type=range]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,var(--k2-gold) var(--fill,50%),rgba(232,210,168,.14) var(--fill,50%));
}
body.k2-calculator input[type=range]::-moz-range-progress{background:var(--k2-gold)}
body.k2-calculator input[type=range]::-webkit-slider-thumb{
  background:#f4f1e6;border:3px solid #484134;box-shadow:0 0 0 1.5px var(--k2-gold),0 0 10px rgba(240,198,79,.55);
}
body.k2-calculator input[type=range]::-moz-range-thumb{
  background:#f4f1e6;border:3px solid #484134;box-shadow:0 0 0 1.5px var(--k2-gold),0 0 10px rgba(240,198,79,.55);
}
body.k2-calculator input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgba(240,198,79,.4)}

/* ── fee-plan segmented control: glass, active = gold ───────────────────── */
body.k2-calculator .seg{
  background:rgba(33,29,23,.45);border:1px solid var(--k2-violet-line);border-radius:999px;
}
body.k2-calculator .seg button{border-radius:999px;transition:color .2s,background .3s,box-shadow .3s}
body.k2-calculator .seg button:hover{color:#fbf8f3}
body.k2-calculator .seg button[aria-pressed="true"]{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;box-shadow:0 4px 14px -6px rgba(240,198,79,.8);
}
body.k2-calculator .seg button[aria-pressed="true"] small{color:rgba(33,29,19,.75)}
body.k2-calculator .chk input{accent-color:var(--k2-gold)}

/* ── results furniture ──────────────────────────────────────────────────── */
body.k2-calculator .warn{
  border:1px solid rgba(255,77,109,.4);border-radius:14px;
  background:linear-gradient(160deg,rgba(255,77,109,.07),rgba(67,61,49,.3));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:var(--k2-shadow);
}

/* ── "how the maths works" grid → glass tiles ───────────────────────────── */
body.k2-calculator .hg{
  background:var(--k2-violet-line);border:1px solid var(--k2-violet-line);border-radius:14px;
}
body.k2-calculator .hg > *{
  background:linear-gradient(160deg,rgba(127,114,88,.22),rgba(67,61,49,.32));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.k2-calculator .blk-h{border-bottom:1px solid var(--k2-violet-line)}
body.k2-calculator .blk-h h2 .n{color:var(--k2-gold)}

/* links stay azure */
body.k2-calculator .go{color:var(--k2-azure)}
body.k2-calculator .go:hover{color:#7ff3f7}

/* ── footer → frosted bar ───────────────────────────────────────────────── */
body.k2-calculator .foot{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border-top:1px solid var(--k2-violet-line);
}
body.k2-calculator .foot a{color:var(--k2-azure)}

/* ══════════════════════════════════════════════════════════════════════════
   HOME — reskin of index.html (the NIGHT ARCADE toy-box landing).
   The page's own styles are inline (no !important) and spread through the
   body, so the k2 links sit last, before </body>; every rule here carries the
   body.k2-home prefix and !important where inline style attributes compete.
   All ids, sections, scripts and API calls untouched.
   ══════════════════════════════════════════════════════════════════════════ */

/* the old sky + comets retire; the k2 jewel canvas + aurora + stars take over */
body.k2-home .sky,
body.k2-home .clouds{display:none!important}

/* display type: Space Grotesk takes every Fredoka job */
body.k2-home h1,
body.k2-home h2,
body.k2-home h3,
body.k2-home h4,
body.k2-home .disp,
body.k2-home .brand b,
body.k2-home .navlinks a,
body.k2-home .drawer a,
body.k2-home .btn,
body.k2-home .kicker,
body.k2-home .tag,
body.k2-home .sym,
body.k2-home .score .n,
body.k2-home .power .lv,
body.k2-home .mode .crown,
body.k2-home .step .lvl,
body.k2-home .knob,
body.k2-home .rc-head,
body.k2-home .rc-foot,
body.k2-home .medal,
body.k2-home .prize .val b,
body.k2-home .tt-h,
body.k2-home .tt-h2,
body.k2-home .pf-q,
body.k2-home .pf-h2{
  font-family:var(--k2-font-display)!important;
}

/* ── HUD → the signals capsule: frosted glass, gold hairline ────────────── */
body.k2-home #hud .bar{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:999px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
}
body.k2-home .brand small{color:var(--k2-gold)!important}
body.k2-home .navlinks a{
  color:#e1d0b0!important;
  transition:color .2s,background .3s,box-shadow .3s!important;
}
body.k2-home .navlinks a:hover{background:rgba(232,193,115,.16)!important;color:#fbf8f3!important;transform:none}
body.k2-home .navlinks a[aria-current]{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset!important;
}
body.k2-home .burger{
  background:rgba(127,114,88,.25)!important;border:1px solid var(--k2-violet-line)!important;
  border-radius:12px!important;
}
body.k2-home .drawer{
  background:linear-gradient(160deg,rgba(127,114,88,.4),rgba(67,61,49,.5))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
}
body.k2-home .drawer a:hover{background:rgba(232,193,115,.16)!important}

/* ── buttons → gold gradient pills (every colour variant unified) ────────── */
body.k2-home .btn,
body.k2-home .btn.go,
body.k2-home .btn.sun,
body.k2-home .btn.sky{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  border:1px solid rgba(131,103,53,.9)!important;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset!important;
  transition:var(--k2-lift),filter .2s ease!important;
}
body.k2-home .btn:hover,
body.k2-home .btn.go:hover,
body.k2-home .btn.sun:hover,
body.k2-home .btn.sky:hover{
  background:var(--k2-gold-grad)!important;filter:brightness(1.06);transform:translateY(-2px);
  box-shadow:0 14px 30px -12px rgba(240,198,79,.9),0 1px 0 rgba(255,255,255,.45) inset!important;
}
body.k2-home .btn:active{transform:translateY(1px)}
body.k2-home .btn.ghost{
  background:rgba(46,230,240,.08)!important;color:var(--k2-azure)!important;
  border:1px solid rgba(46,230,240,.4)!important;box-shadow:none!important;
}
body.k2-home .btn.ghost:hover{background:rgba(46,230,240,.15)!important}

/* ── cards → the signals card: glass, gold hairline, no toy edges ────────── */
body.k2-home .card,
body.k2-home .card.soft,
body.k2-home .card.blue,
body.k2-home .card.pinky,
body.k2-home .card.grass,
body.k2-home .card.sunny,
body.k2-home .card.grape,
body.k2-home .card.tang,
body.k2-home .racecab,
body.k2-home .tv{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  transition:var(--k2-lift)!important;
}
body.k2-home .card:hover,
body.k2-home .racecab:hover,
body.k2-home .tv:hover{
  border-color:var(--k2-gold-line-hi)!important;
  box-shadow:0 0 26px -8px rgba(240,198,79,.45),var(--k2-shadow)!important;
}
body.k2-home .racecab:hover{transform:none}

/* the broadcast screen inside the cabinet stays a dark screen, hairline only */
body.k2-home .rc-screen{border:1px solid var(--k2-violet-line)!important;box-shadow:inset 0 0 26px rgba(11,182,204,.10)!important}
body.k2-home .rc-top{
  background:rgba(127,114,88,.25)!important;border:1px solid var(--k2-violet-line)!important;
  color:var(--k2-azure)!important;
}

/* ── small tiles / rows → glass-soft, violet hairline (signals tile talk) ── */
body.k2-home .row,
body.k2-home .lb,
body.k2-home .step .box,
body.k2-home .tt-live{
  background:var(--k2-glass-soft)!important;
  backdrop-filter:blur(12px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.3)!important;
  border:1px solid var(--k2-violet-line)!important;
  border-radius:14px!important;
  box-shadow:var(--k2-shadow)!important;
  transition:var(--k2-lift)!important;
}
body.k2-home .lb:hover{
  border-color:var(--k2-violet-line-hi)!important;background:var(--k2-glass-soft)!important;
  transform:translateX(3px);
}
body.k2-home .bar{border:1px solid var(--k2-violet-line)!important;background:rgba(33,29,23,.5)!important}

/* score + power + mode tiles: same glass, gold hairline like signals cards */
body.k2-home .score,
body.k2-home .power,
body.k2-home .mode{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  transition:var(--k2-lift)!important;
}
body.k2-home .score:hover,
body.k2-home .mode:hover{border-color:var(--k2-gold-line-hi)!important}
body.k2-home .power:hover{transform:translateY(-2px)!important;border-color:var(--k2-gold-line-hi)!important}
body.k2-home .mode .crown{
  background:var(--k2-gold-grad)!important;color:#211d13!important;
  border:1px solid rgba(131,103,53,.9)!important;box-shadow:0 4px 14px -6px rgba(240,198,79,.8)!important;
}

/* ── pills / kickers / knobs / bubbles → glass chips ────────────────────── */
body.k2-home .kicker{
  background:rgba(240,198,79,.08)!important;color:var(--k2-gold-hi)!important;
  border:1px solid var(--k2-gold-line)!important;box-shadow:none!important;
}
body.k2-home .pill{
  background:rgba(127,114,88,.22)!important;color:var(--k2-azure)!important;
  border:1px solid var(--k2-violet-line)!important;
}
body.k2-home .pill.y{background:rgba(240,198,79,.09)!important;color:var(--k2-gold-hi)!important;border-color:var(--k2-gold-line)!important}
body.k2-home .pill.p{background:rgba(255,77,109,.09)!important;border-color:rgba(255,77,109,.4)!important}
body.k2-home .pill.g{background:rgba(77,255,155,.08)!important;border-color:rgba(77,255,155,.4)!important}
body.k2-home .pill.v{background:rgba(232,193,115,.10)!important;border-color:rgba(232,193,115,.4)!important}
body.k2-home .knob{
  background:rgba(127,114,88,.22)!important;color:#e6ddcc!important;
  border:1px solid var(--k2-violet-line)!important;box-shadow:none!important;
  transition:var(--k2-lift),color .2s!important;
}
body.k2-home .knob:hover{transform:translateY(-2px)!important;border-color:var(--k2-violet-line-hi)!important;color:#fbf8f3!important}
body.k2-home .bubble{
  background:rgba(127,114,88,.25)!important;border:1px solid var(--k2-violet-line)!important;
  box-shadow:none!important;backdrop-filter:blur(8px)!important;
}

/* ── prize boxes keep their semantics as tinted glass, never solid fills ── */
body.k2-home .prize{border-width:1px!important;border-radius:14px!important}
body.k2-home .prize.w{background:rgba(77,255,155,.07)!important;border-color:rgba(77,255,155,.4)!important}
body.k2-home .prize.l{background:rgba(255,77,109,.07)!important;border-color:rgba(255,77,109,.4)!important}
body.k2-home .prize.n{background:var(--k2-glass-soft)!important;border-color:var(--k2-violet-line)!important}

/* ── ticker strip → frosted band ────────────────────────────────────────── */
body.k2-home .trainstrip{
  background:linear-gradient(180deg,rgba(70,64,52,.5),rgba(57,51,40,.45))!important;
  backdrop-filter:blur(14px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.3)!important;
  border-top:1px solid var(--k2-violet-line)!important;
  border-bottom:1px solid var(--k2-violet-line)!important;
  box-shadow:none!important;
}

/* hero headline highlight: gold gradient, not the orange sticker */
body.k2-home .hero-copy h1 .pop{
  background:var(--k2-gold-grad)!important;color:#211d13!important;
  border:2px solid rgba(255,255,255,.75)!important;text-shadow:none!important;
  box-shadow:0 10px 26px -10px rgba(240,198,79,.8)!important;
}

/* the "how it runs" band blends into the jewel canvas */
body.k2-home #how{background:rgba(33,29,23,.35)!important}

/* ── politics-featured slider + tools teasers → same glass language ─────── */
body.k2-home .pf-view{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
}
body.k2-home .pf-btn{
  background:rgba(127,114,88,.25)!important;border:1px solid var(--k2-violet-line)!important;
  border-radius:999px!important;color:#e6ddcc!important;
}
body.k2-home .pf-btn:hover{border-color:var(--k2-gold-line)!important;color:var(--k2-gold-hi)!important}
body.k2-home .pf-r{background:transparent!important}
body.k2-home .tt-grid{
  background:var(--k2-violet-line)!important;
  border:1px solid var(--k2-gold-line)!important;border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
}
body.k2-home .tt-card{
  background:linear-gradient(160deg,rgba(127,114,88,.28),rgba(67,61,49,.4))!important;
  backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
  transition:background .3s!important;
}
body.k2-home .tt-card:hover{background:linear-gradient(160deg,rgba(127,114,88,.4),rgba(67,61,49,.5))!important}

/* ── footer → frosted bar ───────────────────────────────────────────────── */
body.k2-home footer{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border-top:1px solid var(--k2-violet-line)!important;
}
body.k2-home footer a{color:var(--k2-azure)!important}

/* ══════════════════════════════════════════════════════════════════════════
   REPLAY — reskin of replay.html (politics.css + tools.css, like calculator).
   All /api/replay ids and the viewer script untouched.
   ══════════════════════════════════════════════════════════════════════════ */

body.k2-replay{--amber:#f0c64f;--amber-hi:#ebcf82}

/* display type */
body.k2-replay h1,
body.k2-replay h2,
body.k2-replay .rp-head h2,
body.k2-replay .nav-r .l,
body.k2-replay .btn-go,
body.k2-replay .cap,
body.k2-replay .stat span,
body.k2-replay .stat b,
body.k2-replay .panel-h h3,
body.k2-replay .rp-btn{
  font-family:var(--k2-font-display);
}

/* nav → the signals capsule (identical to calculator) */
body.k2-replay .nav{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:999px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
  max-width:1120px;margin:14px auto 0;top:12px;
  padding:8px 10px 8px 16px;min-height:60px;
}
@media(max-width:1160px){body.k2-replay .nav{margin:10px 12px 0}}
body.k2-replay .brand{font-family:var(--k2-font-display);color:#fbf8f3}
body.k2-replay .nav-r .l{border-radius:999px;transition:color .2s,background .3s,box-shadow .3s}
body.k2-replay .nav-r .l:hover{color:#fbf8f3;background:rgba(232,193,115,.16)}
body.k2-replay .nav-r .l[aria-current="page"]{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset;
}
body.k2-replay .btn-go{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;border-radius:999px;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset;
  transition:var(--k2-lift),filter .2s ease;
}
body.k2-replay .btn-go:hover{background:var(--k2-gold-grad);filter:brightness(1.06);transform:translateY(-2px)}

/* panels → signals cards */
body.k2-replay .panel{
  background:var(--k2-glass);
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:20px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
}
body.k2-replay .panel-h{
  border-bottom:1px solid var(--k2-violet-line);
  background:transparent;border-radius:20px 20px 0 0;
}
body.k2-replay .rp-list .panel-h{background:transparent}

/* stat tiles → glass-soft, violet hairline */
body.k2-replay .hg{
  background:var(--k2-violet-line);border:1px solid var(--k2-violet-line);border-radius:14px;
}
body.k2-replay .hg > *{
  background:linear-gradient(160deg,rgba(127,114,88,.22),rgba(67,61,49,.32));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}

/* round list rows */
body.k2-replay .rp-item{border-top:1px solid var(--k2-violet-line);transition:background .25s}
body.k2-replay .rp-item:hover{background:rgba(232,193,115,.10)}
body.k2-replay .rp-item[aria-current="true"]{
  background:rgba(240,198,79,.07);box-shadow:inset 2px 0 0 var(--k2-gold);
}

/* viewer controls → glass chips; play = gold gradient */
body.k2-replay .rp-btn{
  background:rgba(127,114,88,.25);border:1px solid var(--k2-violet-line);
  border-radius:999px;color:#e6ddcc;
  transition:color .2s,border-color .2s,background .3s;
}
body.k2-replay .rp-btn:hover:not(:disabled){border-color:var(--k2-gold-line);color:var(--k2-gold-hi)}
body.k2-replay .rp-btn.play{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;border:1px solid rgba(131,103,53,.9);
}
body.k2-replay .rp-more{color:var(--k2-gold-hi);border-top:1px solid var(--k2-violet-line)}
body.k2-replay .rp-more:hover{color:#f3e3b4}

/* clock / coins / decide / results → signals tile language */
body.k2-replay .clock .bar{background:rgba(232,210,168,.12)}
body.k2-replay .coins,
body.k2-replay .decide,
body.k2-replay .results{
  border:1px solid var(--k2-violet-line);border-radius:14px;
  background:linear-gradient(160deg,rgba(127,114,88,.22),rgba(67,61,49,.32));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.k2-replay .coin{border-top:1px solid var(--k2-violet-line)}
body.k2-replay .coin:first-child{border-top:0}
body.k2-replay .coin.hd{background:rgba(243,235,222,.03)}
body.k2-replay .coin.target{background:rgba(240,198,79,.06);box-shadow:inset 2px 0 0 var(--k2-gold)}
body.k2-replay .decide.enter{border-color:rgba(77,255,155,.4);background:rgba(77,255,155,.06)}
body.k2-replay .decide.won{border-color:rgba(77,255,155,.45);background:rgba(77,255,155,.08)}
body.k2-replay .decide.lost{border-color:rgba(255,77,109,.45);background:rgba(255,77,109,.08)}
body.k2-replay .results{background:var(--k2-violet-line)}
body.k2-replay .results div{background:rgba(38,34,27,.65)}
body.k2-replay .kbd{border:1px solid var(--k2-violet-line);border-radius:5px}

/* footer → frosted bar */
body.k2-replay .foot{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border-top:1px solid var(--k2-violet-line);
}
body.k2-replay .foot a{color:var(--k2-azure)}

/* ══════════════════════════════════════════════════════════════════════════
   PRIVACY — mostly prose; navbar/footer/gradient come from the shared
   body.k2-blog rules (the page also carries k2-blog). Here: the prose card,
   the buttons, the alert box.
   ══════════════════════════════════════════════════════════════════════════ */

body.k2-privacy .prose{
  background:var(--k2-glass)!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:20px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  padding:30px 32px!important;
}
body.k2-privacy .prose h2,
body.k2-privacy .text-xl{font-family:var(--k2-font-display)!important}
body.k2-privacy .alert{
  background:rgba(127,114,88,.22)!important;
  border:1px solid var(--k2-violet-line)!important;border-radius:14px!important;
}
body.k2-privacy .btn-primary{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  border:1px solid rgba(131,103,53,.9)!important;border-radius:999px!important;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset!important;
  transition:var(--k2-lift),filter .2s ease!important;
}
body.k2-privacy .btn-primary:hover{filter:brightness(1.06);transform:translateY(-2px)}
body.k2-privacy .btn-outline{
  background:rgba(46,230,240,.08)!important;color:var(--k2-azure)!important;
  border:1px solid rgba(46,230,240,.4)!important;border-radius:999px!important;
}
body.k2-privacy .btn-outline:hover{background:rgba(46,230,240,.15)!important}

/* ══════════════════════════════════════════════════════════════════════════
   POLITICS — shared reskin of politics.html (index) + politics-market.html
   (the /politics/<slug> template). Both run on politics.css; its tokens are
   retoned here so every divider/panel picks up the Mexter2 values at once.
   All /api/politics JS and ids untouched.
   ══════════════════════════════════════════════════════════════════════════ */

body.k2-politics{
  --amber:#f0c64f;--amber-hi:#ebcf82;
  --hair:rgba(232,210,168,.18);--hair-2:rgba(232,210,168,.32);
  --panel:rgba(105,92,69,.35);--panel-2:rgba(127,114,88,.32);
}

/* display type */
body.k2-politics h1,
body.k2-politics .blk-h h2,
body.k2-politics .nav-r .l,
body.k2-politics .btn-go,
body.k2-politics .cap,
body.k2-politics .stat span,
body.k2-politics .stat b,
body.k2-politics .panel-h h3,
body.k2-politics .r-nm,
body.k2-politics .r-p b,
body.k2-politics .brand{
  font-family:var(--k2-font-display);
}

/* nav → the signals capsule */
body.k2-politics .nav{
  background:linear-gradient(160deg,rgba(127,114,88,.32),rgba(67,61,49,.44))!important;
  backdrop-filter:blur(18px) saturate(1.35)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35)!important;
  border:1px solid var(--k2-gold-line)!important;
  border-radius:999px!important;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow)!important;
  max-width:1120px;margin:14px auto 0;top:12px;
  padding:8px 10px 8px 16px;min-height:60px;
}
@media(max-width:1160px){body.k2-politics .nav{margin:10px 12px 0}}
body.k2-politics .nav-r .l{border-radius:999px;transition:color .2s,background .3s,box-shadow .3s}
body.k2-politics .nav-r .l:hover{color:#fbf8f3;background:rgba(232,193,115,.16)}
body.k2-politics .nav-r .l[aria-current="page"]{
  background:var(--k2-gold-grad);color:#211d13;font-weight:700;
  box-shadow:0 6px 18px -8px rgba(240,198,79,.75),0 1px 0 rgba(255,255,255,.4) inset;
}
body.k2-politics .btn-go{
  background:var(--k2-gold-grad)!important;color:#211d13!important;font-weight:700!important;
  border-radius:999px!important;
  box-shadow:0 10px 26px -12px rgba(240,198,79,.85),0 1px 0 rgba(255,255,255,.45) inset!important;
  transition:var(--k2-lift),filter .2s ease;
}
body.k2-politics .btn-go:hover{background:var(--k2-gold-grad)!important;filter:brightness(1.06);transform:translateY(-2px)}

/* panels → signals cards */
body.k2-politics .panel{
  background:var(--k2-glass);
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border:1px solid var(--k2-gold-line);
  border-radius:20px;
  box-shadow:var(--k2-gold-glow),var(--k2-shadow);
}
body.k2-politics .panel-h{border-bottom:1px solid var(--k2-violet-line)}

/* hairline grids / stat tiles → glass-soft */
body.k2-politics .hg{
  background:var(--k2-violet-line);
  border:1px solid var(--k2-violet-line);border-radius:14px;
}
body.k2-politics .hg > *{
  background:linear-gradient(160deg,rgba(127,114,88,.22),rgba(67,61,49,.32));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}

/* rule callout: gold edge on glass */
body.k2-politics .rule{
  border:1px solid var(--k2-gold-line);border-left:2px solid var(--k2-gold);
  border-radius:14px;background:linear-gradient(160deg,rgba(240,198,79,.06),rgba(67,61,49,.3));
}

/* chart tooltip → dark glass */
body.k2-politics .tip{
  background:rgba(50,45,36,.94)!important;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid var(--k2-violet-line-hi);
  box-shadow:0 18px 44px rgba(15,13,9,.7);
}

/* range sliders (model section) → gold fill like calculator */
body.k2-politics input[type=range]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,var(--k2-gold) var(--fill,50%),rgba(232,210,168,.14) var(--fill,50%));
}
body.k2-politics input[type=range]::-moz-range-progress{background:var(--k2-gold)}

/* links stay azure */
body.k2-politics .go{color:var(--k2-azure)}
body.k2-politics .go:hover{color:#7ff3f7}

/* footer → frosted bar */
body.k2-politics .foot{
  background:linear-gradient(180deg,rgba(58,52,41,.55),rgba(43,38,30,.6));
  backdrop-filter:blur(18px) saturate(1.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);
  border-top:1px solid var(--k2-violet-line);
}
body.k2-politics .foot a{color:var(--k2-azure)}
