/* ============================================================================
 * gallery.css — the monochrome SaaS theme for the Command Center.
 *
 * A clean operator console, not a museum: flat light panels, a near-black
 * icon rail, hairline gray rules, system-sans type throughout. Retheme of
 * the original Old-Master gallery skin — selector structure is unchanged
 * (still scoped to `body.gallery` / `.pg-*`), only the token VALUES and a
 * handful of structural rules (backdrop, sidebar, topbar) changed.
 *
 * Token contract: the app's pages already read --bg --surface --ink --ink2
 * --muted --line --line2 --chip --good --warn --bad --sh* --r*. This file
 * redefines them on `body.gallery` (which shadows :root AND html.cc-dark for
 * every descendant). The --g-* gradients stay on :root so brand.js can still
 * override them with a client's brand colours (white-label keeps working).
 * ========================================================================== */

:root{
  color-scheme:light; /* on :root, not just body: an iframe whose root scheme differs from its parent gets an opaque canvas */
  --serif:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif; /* display stack — kept the --serif variable NAME so every existing var(--serif) call site (headings, big numbers) picks up the new sans face with no per-rule edits */
  /* accent gradients — kept for tenant white-label (brand.js overrides these per client). */
  --g-indigo:linear-gradient(135deg,#2C4A7A 0%,#4A6FA5 100%);
  --g-violet:linear-gradient(135deg,#6E3A44 0%,#A23B2A 100%);
  --g-blue:linear-gradient(135deg,#2C4A7A 0%,#4F7F6B 100%);
  --g-emerald:linear-gradient(135deg,#3F6B5A 0%,#6FA58C 100%);
  --g-amber:linear-gradient(135deg,#C68A2E 0%,#A23B2A 100%);
  --g-sky:linear-gradient(135deg,#4A6FA5 0%,#7FA3C8 100%);
  --g:linear-gradient(135deg,#27272A 0%,#09090B 100%);
  --accent:#18181B;
}

body.gallery{
  --ground:#F4F4F5; --bg:#F4F4F5;
  --surface:#FFFFFF; --surface-solid:#FFFFFF; --surface-2:#F4F4F5;
  --ink:#18181B; --ink2:#3F3F46; --muted:#71717A;
  --parchment:#18181B; --gilt:#18181B; --gilt-2:#27272A; --gilt-soft:rgba(24,24,27,.35);
  --line:rgba(24,24,27,.10); --line2:rgba(24,24,27,.16); --chip:rgba(24,24,27,.045);
  --good:#16A34A; --warn:#D97706; --bad:#DC2626;
  --tint-good:rgba(22,163,74,.12); --tint-good-ink:#15803D;
  --tint-warn:rgba(217,119,6,.12);  --tint-warn-ink:#B45309;
  --tint-bad:rgba(220,38,38,.12);   --tint-bad-ink:#B91C1C;
  --tint-info:rgba(63,63,70,.10);  --tint-info-ink:#3F3F46;
  --sh:0 1px 2px rgba(0,0,0,.05);
  --sh-md:0 8px 24px rgba(0,0,0,.07);
  --sh-lg:0 24px 60px rgba(0,0,0,.14);
  --r:14px; --r-sm:9px;
  color-scheme:light;
  background:var(--ground);
  color:var(--ink);
}

/* ---- flat ground (no painting in the monochrome theme) ---- */
body.gallery .backdrop{display:none;}

/* ---- type ---- */
body.gallery{font-size:14px;}
body.gallery h1,body.gallery h2,body.gallery h3,body.gallery h3.sect,body.gallery .ttl b,body.gallery .brand b{font-family:var(--serif);font-weight:600;letter-spacing:-.005em;color:var(--parchment);}
body.gallery h3.sect{font-size:22px;line-height:1.15;padding-bottom:8px;margin:26px 0 12px;border-bottom:1px solid var(--line);text-transform:none;letter-spacing:-.005em;}
body.gallery h3.sect:first-child{margin-top:4px;}
body.gallery .ttl b{font-size:19px;}
body.gallery .brand b{font-size:19px;letter-spacing:0;}
body.gallery .brand div span{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:10px;}
body.gallery .muted{color:var(--muted);}
body.gallery .nodata{color:var(--muted);font-family:var(--serif);font-style:italic;font-size:15px;}

/* ---- shell: sidebar · topbar · content ---- */
/* the icon rail stays near-black regardless of the light content area — locally re-point the
   shared ink/line/chip tokens so every existing var(--ink2)/var(--muted)/var(--line) rule below
   (nav, labels, footer) reads correctly on a dark background with no per-rule edits. */
body.gallery .side{
  --ink:#F4F4F5; --ink2:#D4D4D8; --muted:#A1A1AA; --parchment:#FFFFFF;
  --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.16); --chip:rgba(255,255,255,.08);
  --gilt:#FFFFFF; --gilt-2:#FFFFFF; --gilt-soft:rgba(255,255,255,.4);
  background:#0A0A0B;border-right:1px solid rgba(255,255,255,.08);color:var(--ink);
}
body.gallery .side .mk,body.gallery .brand .mk{background:var(--g);box-shadow:0 2px 10px rgba(24,24,27,.08);}
body.gallery .nav{color:var(--ink2);border-radius:10px;transition:background .15s,color .15s;}
body.gallery .nav svg{opacity:.75;}
body.gallery .nav:hover{background:var(--chip);color:var(--ink);}
body.gallery .nav.on,body.gallery .nav.active,body.gallery .nav[aria-current]{background:rgba(255,255,255,.10);color:var(--gilt-2);box-shadow:inset 2px 0 0 var(--gilt);}
body.gallery .nav.on svg,body.gallery .nav.active svg{opacity:1;}
body.gallery .navlbl{color:var(--muted);letter-spacing:.12em;font-size:10px;}
body.gallery .foot{color:var(--muted);border-top:1px solid var(--line);}
body.gallery .top{background:transparent;border-bottom:1px solid var(--line);}
body.gallery .top h1,body.gallery .top .h{font-family:var(--serif);font-size:24px;font-weight:700;}
body.gallery .top .s{color:var(--muted);}
body.gallery .wrap{background:transparent;}

/* ---- panels ---- */
body.gallery .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
body.gallery .card .card{background:var(--surface-2);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;}

/* ---- placards (stat cards) ---- */
body.gallery .stat.hero .n{background:var(--g);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
body.gallery .stat .n{font-family:var(--serif);font-weight:500;font-size:40px;line-height:1;letter-spacing:-.01em;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;margin-top:10px;}
body.gallery .stat .l{font-size:10.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:8px;}
body.gallery .stat .d{font-size:11.5px;color:var(--muted);margin-top:8px;}
body.gallery .stat .d.up{color:var(--good);} body.gallery .stat .d.dn{color:var(--bad);}
body.gallery .stat .ico{background:rgba(24,24,27,.10)!important;border:1px solid var(--line2);border-radius:10px;box-shadow:none;color:var(--gilt-2);}
body.gallery .stat .ico svg{stroke:var(--gilt-2);}
body.gallery .stat .ico svg *{stroke:var(--gilt-2);}
body.gallery .snap .n,body.gallery .kv b,body.gallery .b .n{font-family:var(--serif);font-variant-numeric:tabular-nums lining-nums;}
body.gallery .b .n{font-size:26px;font-weight:500;}
body.gallery .b .l,body.gallery .kv span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}

/* ---- chips · badges · tags ---- */
body.gallery .chip,body.gallery .badge,body.gallery .tag,body.gallery .pill,body.gallery .rtag,body.gallery .win,body.gallery .fchip{background:var(--chip);border:1px solid var(--line);color:var(--ink2);border-radius:999px;font-weight:650;letter-spacing:.03em;}
body.gallery .rtag.owner{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);}
body.gallery .chip .dot{box-shadow:0 0 0 3px rgba(0,0,0,.25);}
body.gallery .fchip.on{background:rgba(24,24,27,.16);color:var(--gilt-2);border-color:var(--line2);}

/* ---- buttons · inputs ---- */
body.gallery .btn{background:var(--g);color:#FFFFFF;border:0;font-weight:750;letter-spacing:.01em;box-shadow:0 8px 24px rgba(24,24,27,.22);}
body.gallery .btn:hover{filter:brightness(1.06);}
body.gallery .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line2);box-shadow:none;}
body.gallery .btn.ghost:hover{background:var(--chip);}
body.gallery input,body.gallery select,body.gallery textarea{background:rgba(24,24,27,.05);border:1px solid var(--line2);color:var(--ink);border-radius:10px;}
body.gallery input::placeholder,body.gallery textarea::placeholder{color:var(--muted);}
body.gallery input:focus,body.gallery select:focus,body.gallery textarea:focus{border-color:var(--gilt);box-shadow:0 0 0 3px rgba(24,24,27,.18);outline:none;}
body.gallery input[type=checkbox],body.gallery input[type=radio],body.gallery input[type=range]{accent-color:var(--gilt);}

/* ---- rows · tables · tasks ---- */
body.gallery .task,body.gallery .adrow,body.gallery .logrow,body.gallery .ev,body.gallery .conv,body.gallery .opp,body.gallery .mixrow,body.gallery .post{border-color:var(--line);}
body.gallery .task .tx{color:var(--ink);} body.gallery .task .due{color:var(--muted);}
body.gallery .pr{border-radius:999px;} body.gallery .pr.high{background:var(--bad);} body.gallery .pr.med{background:var(--warn);} body.gallery .pr.low{background:var(--muted);}
body.gallery .tbl th{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:650;border-bottom:1px solid var(--line2);}
body.gallery .tbl td{border-bottom:1px solid var(--line);color:var(--ink2);}
body.gallery .tbl tr:hover td{background:var(--chip);}
body.gallery .track,body.gallery .fbar,body.gallery .fmini .fm{background:rgba(24,24,27,.08);}
body.gallery .fr{background:transparent;border-top-color:var(--line);}
body.gallery .fr .val{font-family:var(--serif);font-size:21px;font-weight:600;font-variant-numeric:tabular-nums lining-nums;}
body.gallery .fr .src{background:var(--chip);border:1px solid var(--line);}
body.gallery .fr.bn{background:var(--tint-bad);box-shadow:inset 3px 0 0 var(--bad);}
body.gallery .bn.bad{background:var(--tint-bad);color:var(--tint-bad-ink);} body.gallery .bn.ok{background:var(--tint-good);color:var(--tint-good-ink);}
body.gallery .bnbadge{background:var(--tint-bad);color:var(--tint-bad-ink);border:1px solid rgba(212,106,85,.35);}
body.gallery .gtext{background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ---- menus · banners · embedded tools ---- */
body.gallery .acctmenu,body.gallery .asbanner{background:var(--surface-solid);border:1px solid var(--line2);box-shadow:var(--sh-lg);}
body.gallery .acctmenu .mi:hover{background:var(--chip);}
body.gallery .ava{background:var(--g);color:#FFFFFF;box-shadow:0 0 0 2px rgba(24,24,27,.35);}
body.gallery .tool-frame{border:1px solid var(--line);border-radius:var(--r);background:transparent;box-shadow:none;}
body.gallery .arrow{color:var(--muted);}

/* ---- phone shell ---- */
body.gallery #mbar{background:rgba(0,0,0,.88);border-top:1px solid var(--line2);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);}
body.gallery #mbar button{color:var(--muted);}
body.gallery #mbar button.on{color:var(--gilt-2);}
body.gallery #mbar button.on svg{stroke:var(--gilt-2);}

/* ---- scrollbars ---- */
body.gallery ::-webkit-scrollbar{width:10px;height:10px;}
body.gallery ::-webkit-scrollbar-thumb{background:rgba(24,24,27,.25);border-radius:8px;border:2px solid transparent;background-clip:padding-box;}
body.gallery ::-webkit-scrollbar-track{background:transparent;}

/* ---- respect reduced motion ---- */
@media (prefers-reduced-motion:reduce){ body.gallery .backdrop{transition:none;} }

/* ---- phone sizing ---- */
@media (max-width:760px){ body.gallery .stat .n{font-size:32px;} body.gallery h3.sect{font-size:20px;} }

/* ---- display weight: Advercase / Instrument Serif are single-weight — no synthetic bold ---- */
body.gallery h1,body.gallery h2,body.gallery h3,body.gallery h3.sect,body.gallery .ttl b,body.gallery .brand b,body.gallery .stat .n,body.gallery .b .n,body.gallery .fr .val,body.gallery .snap .n,body.gallery .kv b,body.gallery .top h1{font-weight:700;font-synthesis:none;letter-spacing:-.01em;}
body.gallery .stat .n{font-size:42px;}

/* ---- embedded tool pages (?embed=1 inside the dashboard iframe): float on the shell's painting ---- */
body.gallery.embed{background:transparent;}
body.gallery.embed .backdrop{display:none;}
body.gallery .bar,body.gallery .top,body.gallery header{background:transparent;}

/* ===== PAGE PARTS — generated by dev/build-gallery.py from dev/css-parts/*.css; edit the parts, not this block ===== */

/* ---- part: pages.css ---- */
/* ============================================================================
 * pages.css — per-page gallery overrides for login.html · home.html · onboarding.html.
 * Concatenated into gallery.css after the shared rules. Every rule is scoped to the
 * page's body class (body.gallery.pg-login / .pg-home / .pg-onboarding) because these
 * pages reuse class names other pages own (.nav .mk .top .bar .grid .foot .hero .card).
 * Only what the shared rules do not already reach: hardcoded light hexes in the pages'
 * own <style>, indigo shadows, and the serif/small-caps typography pass.
 * ========================================================================== */

/* ---------------------------------------------------------------- login.html
 * One frosted placard centred on the Canaletto; gilt mark + gilt submit; dark inputs. */
body.gallery.pg-login .card{background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh-lg);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);padding:36px 32px;}
body.gallery.pg-login .mk{background:var(--g);box-shadow:0 8px 24px rgba(24,24,27,.28);}
body.gallery.pg-login h1{font-size:24px;line-height:1.12;}
body.gallery.pg-login .sub{color:var(--ink2);}
body.gallery.pg-login label{color:var(--muted);font-size:10.5px;font-weight:650;letter-spacing:.12em;}
body.gallery.pg-login input{border-radius:11px;}
body.gallery.pg-login .btn{border-radius:12px;}
body.gallery.pg-login .err{color:var(--bad);}
body.gallery.pg-login .foot{color:var(--muted);border-top:1px solid var(--line);padding-top:14px;}

/* ---------------------------------------------------------------- home.html
 * Public landing page (OAuth reviewer reads it): markup untouched, dark gallery look only.
 * No hero wrapper exists, so the hero copy sits straight on the painting: a heavier scrim
 * on this page + a soft shadow keep the parchment type legible over Canaletto's sky. */
body.gallery.pg-home .backdrop::after{background:linear-gradient(180deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.66) 45%,rgba(0,0,0,.92) 100%),radial-gradient(120% 90% at 50% 15%,rgba(0,0,0,0) 40%,rgba(0,0,0,.55) 100%);}
body.gallery.pg-home .brand{font-family:var(--serif);font-weight:400;font-size:18px;letter-spacing:-.005em;color:var(--parchment);}
body.gallery.pg-home .mk{background:var(--g);box-shadow:0 6px 22px rgba(24,24,27,.25);}
body.gallery.pg-home h1{font-size:clamp(34px,6.4vw,56px);line-height:1.06;max-width:700px;}
body.gallery.pg-home h1 + p{font-family:var(--serif);font-style:italic;font-weight:400!important;letter-spacing:0!important;color:var(--ink2);}
body.gallery.pg-home .lede{color:var(--ink2);}
body.gallery.pg-home .btn{border-radius:12px;}
body.gallery.pg-home .btn.ghost{color:var(--ink);}
body.gallery.pg-home .btn.ghost:hover{color:var(--gilt-2);}
body.gallery.pg-home .card{padding:22px;}
body.gallery.pg-home .card b{font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.2;letter-spacing:-.005em;color:var(--parchment);margin:10px 0 6px;}
body.gallery.pg-home .card p{color:var(--ink2);}
body.gallery.pg-home .foot{color:var(--muted);border-top:1px solid var(--line);}
body.gallery.pg-home .foot a{color:var(--ink2);}
body.gallery.pg-home .foot a:hover{color:var(--gilt-2);}

/* ---------------------------------------------------------------- onboarding.html
 * Two-stage questionnaire over the School of Athens. Frosted hero/cards/nav, gilt progress
 * + active step, ultramarine framework callouts, dark fields. Field names/JS untouched. */
body.gallery.pg-onboarding a{color:var(--gilt-2);}
body.gallery.pg-onboarding .top{background:transparent;border-bottom:1px solid var(--line);padding-bottom:16px;backdrop-filter:none;-webkit-backdrop-filter:none;}
body.gallery.pg-onboarding .mk .ic{background:var(--g);box-shadow:0 6px 22px rgba(24,24,27,.25);}
body.gallery.pg-onboarding .mk b{font-family:var(--serif);font-weight:400;font-size:18px;letter-spacing:-.005em;color:var(--parchment);}
body.gallery.pg-onboarding .mk .sub{color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase;}
body.gallery.pg-onboarding .top .right{color:var(--muted);}
/* hero / step header */
body.gallery.pg-onboarding .hero{background:linear-gradient(135deg,rgba(24,24,27,.12),rgba(24,24,27,0) 48%),var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
body.gallery.pg-onboarding .kick{color:var(--gilt-2);font-size:10.5px;font-weight:650;letter-spacing:.14em;}
body.gallery.pg-onboarding .hero h1{font-size:34px;line-height:1.1;margin:10px 0 10px;}
body.gallery.pg-onboarding .hero p{color:var(--ink2);}
body.gallery.pg-onboarding .hero p b{color:var(--ink);font-weight:650;}
body.gallery.pg-onboarding .stp{background:var(--chip);border:1px solid var(--line);color:var(--ink2);}
body.gallery.pg-onboarding .stp .num{background:rgba(0,0,0,.10);color:var(--muted);}
body.gallery.pg-onboarding .stp.done{background:var(--tint-good);border-color:rgba(111,165,140,.40);color:var(--tint-good-ink);}
body.gallery.pg-onboarding .stp.done .num{background:var(--good);color:#FFFFFF;}
body.gallery.pg-onboarding .stp.active{background:rgba(24,24,27,.14);border-color:var(--line2);color:var(--gilt-2);box-shadow:0 0 0 3px rgba(24,24,27,.12);}
body.gallery.pg-onboarding .stp.active .num{background:var(--g);color:#FFFFFF;}
/* section cards + fields */
body.gallery.pg-onboarding .card h2{font-size:22px;line-height:1.15;}
body.gallery.pg-onboarding .card .lead{color:var(--ink2);}
body.gallery.pg-onboarding .f label{color:var(--ink);}
body.gallery.pg-onboarding .f .hint{color:var(--muted);}
body.gallery.pg-onboarding .f input,body.gallery.pg-onboarding .f select,body.gallery.pg-onboarding .f textarea{background:rgba(24,24,27,.05);border:1px solid var(--line2);color:var(--ink);border-radius:11px;}
body.gallery.pg-onboarding .f input:focus,body.gallery.pg-onboarding .f select:focus,body.gallery.pg-onboarding .f textarea:focus{border-color:var(--gilt);box-shadow:0 0 0 3px rgba(24,24,27,.18);}
body.gallery.pg-onboarding .f select option{background:var(--surface-solid);color:var(--ink);}
body.gallery.pg-onboarding .sub-h{color:var(--gilt-2);font-weight:650;letter-spacing:.12em;}
body.gallery.pg-onboarding .frame{background:var(--tint-info);border:1px solid rgba(74,111,165,.40);color:var(--ink2);}
body.gallery.pg-onboarding .frame b{color:var(--tint-info-ink);}
body.gallery.pg-onboarding .center-wrap h1{font-weight:400!important;}
/* sticky section nav + progress */
body.gallery.pg-onboarding .nav{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);color:var(--ink2);}
body.gallery.pg-onboarding .nav:hover{background:var(--surface);color:var(--ink2);}
body.gallery.pg-onboarding .nav .pct{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-onboarding .nav .pbar{background:rgba(24,24,27,.08);}
body.gallery.pg-onboarding .nav .pbar span{background:var(--g);}
body.gallery.pg-onboarding .nav a{color:var(--ink2);}
body.gallery.pg-onboarding .nav a:hover{background:var(--chip);color:var(--ink);}
body.gallery.pg-onboarding .nav a .dot{background:rgba(0,0,0,.18);}
body.gallery.pg-onboarding .nav a.part-done .dot{background:var(--good);box-shadow:0 0 0 3px rgba(111,165,140,.18);}
/* save pill · finish bar · errors · buttons */
body.gallery.pg-onboarding .savepill{background:var(--surface);border:1px solid var(--line2);box-shadow:var(--sh-lg);color:var(--ink2);}
body.gallery.pg-onboarding .savepill .d{background:var(--muted);}
body.gallery.pg-onboarding .savepill.saving .d{background:var(--warn);}
body.gallery.pg-onboarding .savepill.saved .d{background:var(--good);}
body.gallery.pg-onboarding .finishbar{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
body.gallery.pg-onboarding .finishbar .t{color:var(--ink2);}
body.gallery.pg-onboarding .finishbar .t b{font-family:var(--serif);font-weight:400;font-size:16px;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-onboarding .err{color:var(--bad);}
body.gallery.pg-onboarding .btn{border-radius:12px;}

/* ---- part: tools-automations.css ---- */
/* ============================================================================
 * tools-automations.css — gallery overrides for public/automations.html (the display-only Automations tab).
 * Part file (dev/css-parts): body.gallery-prefixed overrides ONLY, folded into public/gallery.css by
 * dev/build-gallery.py and scoped to body.gallery.pg-automations. The page's own <style> carries the old
 * SaaS palette as a fallback; this re-points its surfaces, pills and stat tiles at the painting's tokens.
 * ========================================================================== */
/* ---- automations.html ---- */
body.gallery.pg-automations .stat, body.gallery.pg-automations .card{ background:var(--surface); border:1px solid var(--line); box-shadow:var(--sh-md); }
body.gallery.pg-automations .stat .v{ font-family:var(--serif); font-weight:500; color:var(--parchment); font-variant-numeric:tabular-nums lining-nums; }
body.gallery.pg-automations h1{ font-family:var(--serif); font-weight:500; color:var(--parchment); }
body.gallery.pg-automations .card h2, body.gallery.pg-automations .kind, body.gallery.pg-automations .stat .k{ color:var(--muted); }
body.gallery.pg-automations .pill{ background:var(--chip); color:var(--ink2); }
body.gallery.pg-automations .pill.on{ background:var(--tint-good); color:var(--tint-good-ink); }
body.gallery.pg-automations .pill.off{ background:var(--chip); color:var(--muted); }
body.gallery.pg-automations .pill.bad{ background:var(--tint-bad); color:var(--tint-bad-ink); }
body.gallery.pg-automations .pill.warn{ background:var(--tint-warn); color:var(--tint-warn-ink); }
body.gallery.pg-automations .steps code, body.gallery.pg-automations .sub code{ background:var(--chip); color:var(--ink); }
body.gallery.pg-automations .note{ background:var(--surface-2); color:var(--ink2); }
body.gallery.pg-automations .rails li:before{ background:var(--gilt); }
body.gallery.pg-automations th{ color:var(--muted); border-color:var(--line); } body.gallery.pg-automations td{ border-color:var(--line); }
body.gallery.pg-automations .row{ border-color:var(--line); }

/* ---- part: tools-forms.css ---- */
/* ============================================================================
 * tools-forms.css — gallery overrides for public/forms.html (the Forms tool).
 *
 * Part file (dev/css-parts): body.gallery-prefixed overrides ONLY, folded into
 * public/gallery.css by dev/build-gallery.py and scoped to body.gallery.pg-forms.
 * forms.html's own <style> carries the old SaaS palette as a fallback; what
 * follows neutralises the hardcoded hexes (indigo .btn, #fff panels, #FECACA
 * danger, #14110E preview stage chrome) so every surface sits on the painting.
 * Deliberately untouched: the live-preview host's form.js theme (the def's own
 * accent/mode — it must look exactly as it will on the public page) and the
 * QR canvas (#fff / #000 are data — a scanner needs them literal).
 * ========================================================================== */

/* ---- forms.html ---- */
body.gallery.pg-forms .card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-md);}
body.gallery.pg-forms .subcard,body.gallery.pg-forms .itemrow{background:var(--surface-2);border-color:var(--line);}
body.gallery.pg-forms .btn.danger{background:var(--tint-bad);color:var(--tint-bad-ink);border:1px solid rgba(212,106,85,.38);box-shadow:none;}
body.gallery.pg-forms .btn.danger:hover{filter:none;background:rgba(212,106,85,.30);}
body.gallery.pg-forms .btn.ghost:hover{border-color:var(--gilt-soft);color:var(--ink);}
body.gallery.pg-forms .icobtn{background:transparent;border-color:var(--line2);color:var(--ink2);}
body.gallery.pg-forms .icobtn:hover{background:rgba(24,24,27,.14);color:var(--gilt-2);}
body.gallery.pg-forms .qrow .ty,body.gallery.pg-forms .tpick .ty{font-family:ui-monospace,Menlo,monospace;}
body.gallery.pg-forms .kindchip{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.38);}
body.gallery.pg-forms .frow2:hover{background:var(--chip);}
body.gallery.pg-forms .previewbox{background:var(--surface-solid);border-color:var(--line2);box-shadow:var(--sh-lg);}
body.gallery.pg-forms .previewbox .pvbar{background:rgba(0,0,0,.55);border-bottom-color:var(--line);}
body.gallery.pg-forms .previewbox.mobilepv .pvhost{border-color:var(--line2);}
body.gallery.pg-forms .stat .n{font-family:var(--serif);font-weight:500;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-forms .code{background:rgba(24,24,27,.08);border-color:var(--line);color:var(--ink2);}
body.gallery.pg-forms .url{background:var(--surface-solid);color:var(--ink2);border:1px solid var(--line);}
body.gallery.pg-forms .sw{background:rgba(24,24,27,.08);border-color:var(--line2);}
body.gallery.pg-forms .sw.on{background:rgba(24,24,27,.3);border-color:var(--gilt);}
body.gallery.pg-forms .setrow{border-top-color:var(--line);}
body.gallery.pg-forms .chk{color:var(--ink2);}
body.gallery.pg-forms .linkbtn{color:var(--gilt-2);}
body.gallery.pg-forms .note{background:var(--tint-info);border:1px solid rgba(74,111,165,.45);color:var(--ink2);}
body.gallery.pg-forms .note.warn{background:var(--tint-warn);border-color:rgba(221,174,82,.4);color:var(--tint-warn-ink);}
body.gallery.pg-forms .bar2 .tr{background:rgba(24,24,27,.08);}
body.gallery.pg-forms .bar2 .tr i{background:var(--g);}
body.gallery.pg-forms .stt th{color:var(--muted);border-bottom-color:var(--line2);}
body.gallery.pg-forms .stt td{border-bottom-color:var(--line);color:var(--ink2);}
body.gallery.pg-forms .stt tr:hover td{background:var(--chip);}
body.gallery.pg-forms input[type=color]{background:rgba(24,24,27,.05);border:1px solid var(--line2);}
body.gallery.pg-forms input[type=range]{background:rgba(24,24,27,.08);border:none;border-radius:999px;accent-color:var(--gilt);box-shadow:none;}
body.gallery.pg-forms .qrbox{background:#fff;}   /* QR needs a literal white quiet zone — scanner data, not chrome */
/* the question rows (Questions), the flow (Logic) and the per-question breakdowns (Insights) — surfaces on the painting */
body.gallery.pg-forms .qitem{background:var(--surface-2);border-color:var(--line);}
body.gallery.pg-forms .qitem.open{background:rgba(24,24,27,.08);border-color:var(--line2);}
body.gallery.pg-forms .qrow{background:transparent;border:0;} body.gallery.pg-forms .qrow:hover{background:rgba(24,24,27,.07);}
body.gallery.pg-forms .qrow .ty{background:rgba(24,24,27,.05);border-color:var(--line);color:var(--muted);}
body.gallery.pg-forms .qedit{border-top-color:var(--line);}
body.gallery.pg-forms .fnode::before{background:var(--line2);} body.gallery.pg-forms .fnode .n{background:var(--surface-solid);color:var(--gilt-2);}
body.gallery.pg-forms .farrow .fcond{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.4);}
body.gallery.pg-forms .farrow.dim .fcond{background:transparent;color:var(--muted);border-color:var(--line);}
body.gallery.pg-forms .qibar,body.gallery.pg-forms .drow .dbar,body.gallery.pg-forms .dcol .dbar{background:rgba(24,24,27,.08);}
body.gallery.pg-forms .qibar i{background:rgba(0,0,0,.22);} body.gallery.pg-forms .drow .dbar i,body.gallery.pg-forms .dcol .dbar i{background:rgba(24,24,27,.05);}
body.gallery.pg-forms .qibar i.ans,body.gallery.pg-forms .drow.best .dbar i,body.gallery.pg-forms .dcol.best .dbar i{background:var(--g);}   /* .best, never .win — gallery's .win is the window chip */


/* ---- part: tools-links-story.css ---- */
/* ============================================================================
 * tools-links-story.css — gallery overrides for the two tool pages
 *   public/links.html  ·  public/storybuilder.html
 * CHROME ONLY. Deliberately untouched data colours: links BG_PRESETS + the
 * preset tiles (the client's public booking page), storybuilder HL_SWATCHES /
 * HL_MAP / hlStyle (story highlight colours), the frame-bg swatch gradients
 * (story-render BG g1–g4), the #0D0D12 preview stages, and everything that
 * reaches story-render.js / a canvas.
 * Every rule is body.gallery-prefixed and out-specifies the page's own <style>
 * AND gallery.css's generic .btn/.badge/input/.top rules, so it works no matter
 * where the lead concatenates it.
 * ========================================================================== */

/* ---------- shared (both pages) ---------- */
body.gallery ::selection{background:rgba(24,24,27,.35);}
body.gallery .btn.danger{background:var(--tint-bad);color:var(--tint-bad-ink);border:1px solid rgba(212,106,85,.38);box-shadow:none;}
body.gallery .btn.danger:hover{filter:none;background:rgba(212,106,85,.30);}
body.gallery .btn.ghost:hover{border-color:var(--gilt-soft);color:var(--ink);}

/* ---------- links.html ---------- */
body.gallery.pg-links .note{background:var(--tint-info);border:1px solid rgba(74,111,165,.45);color:var(--ink2);}
body.gallery.pg-links .note code{color:var(--tint-info-ink);}
body.gallery.pg-links .preset{background:var(--chip);border:1px solid var(--line);color:var(--ink2);}
body.gallery.pg-links .preset:hover{border-color:var(--gilt-soft);color:var(--ink);}
body.gallery.pg-links .lcard,body.gallery.pg-links .stat{background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
/* .lcard .top is a card header row, not the shell topbar — undo gallery's .top hairline + blur */
body.gallery.pg-links .lcard .top{background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;}
body.gallery.pg-links .lcard .top b{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:17px;letter-spacing:-.01em;color:var(--parchment);}
body.gallery.pg-links .lstats b{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:17px;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-links .tg{background:var(--chip);color:var(--ink2);border:1px solid var(--line);}
body.gallery.pg-links .tg.src{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.4);}
body.gallery.pg-links .tg.ct{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.4);}
body.gallery.pg-links .url{color:var(--gilt-2);background:rgba(24,24,27,.05);border:1px solid var(--line);}
body.gallery.pg-links .spark .b{background:var(--g);}
body.gallery.pg-links .clk .m,body.gallery.pg-links .lstats .s{color:var(--muted);}

/* ---------- storybuilder.html ---------- */
/* top bar (standalone only) */
body.gallery.pg-storybuilder .view-tabs{background:var(--chip);border-color:var(--line);}
body.gallery.pg-storybuilder .view-tab{color:var(--ink2);}
body.gallery.pg-storybuilder .view-tab.on{background:rgba(24,24,27,.14);color:var(--gilt-2);}

/* production desk */
body.gallery.pg-storybuilder .inbox-panel{background:var(--surface-2);border-right-color:var(--line);}
body.gallery.pg-storybuilder .inbox-head{border-bottom-color:var(--line);}
body.gallery.pg-storybuilder .inbox-head h3{font-family:inherit;font-weight:650;font-size:10.5px;letter-spacing:.12em;color:var(--muted);}
body.gallery.pg-storybuilder .idea-card{background:var(--surface-2);border:1px solid var(--line);box-shadow:none;}
body.gallery.pg-storybuilder .desk-head h1{font-size:24px;}
body.gallery.pg-storybuilder .seq-card,body.gallery.pg-storybuilder .perf-panel,body.gallery.pg-storybuilder .controls-col .ctrl-section{background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
body.gallery.pg-storybuilder .seq-card:hover{border-color:var(--gilt-soft);box-shadow:0 0 0 3px rgba(24,24,27,.16),var(--sh-md);}
body.gallery.pg-storybuilder .stab{background:var(--chip);border-color:var(--line);color:var(--ink2);}
body.gallery.pg-storybuilder .stab:hover{border-color:var(--gilt-soft);}
body.gallery.pg-storybuilder .stab.on{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);}
body.gallery.pg-storybuilder .stab.on .cnt{background:rgba(24,24,27,.22);color:var(--gilt-2);}
body.gallery.pg-storybuilder .stab:not(.on) .cnt{background:rgba(24,24,27,.05);color:var(--muted);}
body.gallery.pg-storybuilder .empty-state,body.gallery.pg-storybuilder .inbox-empty,body.gallery.pg-storybuilder .inbox-loading,body.gallery.pg-storybuilder .media-empty{color:var(--muted);font-family:var(--serif);font-style:italic;font-size:15px;}
body.gallery.pg-storybuilder .empty-state b,body.gallery.pg-storybuilder .inbox-empty b{font-weight:400;color:var(--ink2);}

/* status badges — gallery's generic .badge otherwise flattens the four states to chip */
body.gallery.pg-storybuilder .badge.draft{background:var(--chip);color:var(--ink2);border-color:var(--line);}
body.gallery.pg-storybuilder .badge.in_progress{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.4);}
body.gallery.pg-storybuilder .badge.scheduled{background:var(--tint-warn);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.4);}
body.gallery.pg-storybuilder .badge.published{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.4);}
body.gallery.pg-storybuilder .dirty-badge{color:var(--tint-warn-ink);background:var(--tint-warn);border-color:rgba(221,174,82,.4);}

/* builder: shell panels float on the painting; the columns' own solid --bg goes transparent */
body.gallery.pg-storybuilder #page-builder,body.gallery.pg-storybuilder .controls-col{background:transparent;}
body.gallery.pg-storybuilder .builder-bar{background:var(--surface);border-bottom-color:var(--line);}
body.gallery.pg-storybuilder .frame-card-col,body.gallery.pg-storybuilder .strip-row{background:var(--surface-2);border-color:var(--line);}
body.gallery.pg-storybuilder .builder-bar .seq-title-input{background:transparent;border:1px solid transparent;border-radius:10px;font-family:var(--serif);font-weight:400;font-synthesis:none;letter-spacing:-.01em;color:var(--parchment);box-shadow:none;}
body.gallery.pg-storybuilder .builder-bar .seq-title-input:focus{background:rgba(24,24,27,.05);border-color:var(--line2);box-shadow:none;}
body.gallery.pg-storybuilder select.status-pill{background:rgba(24,24,27,.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%239F9482' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 9px center;border:1px solid var(--line2);border-radius:999px;color:var(--ink2);}
body.gallery.pg-storybuilder .btn.icon-btn{background:var(--chip);color:var(--ink2);border:1px solid var(--line);box-shadow:none;}
body.gallery.pg-storybuilder .btn.icon-btn:hover{background:rgba(24,24,27,.14);color:var(--gilt-2);filter:none;}
body.gallery.pg-storybuilder .templates-dd{background:var(--surface-solid);border-color:var(--line2);box-shadow:var(--sh-lg);}
body.gallery.pg-storybuilder .templates-dd button{color:var(--ink);}
body.gallery.pg-storybuilder .templates-dd button:hover{background:var(--chip);}
body.gallery.pg-storybuilder .ctrl-section h4,body.gallery.pg-storybuilder .fc-title,body.gallery.pg-storybuilder .strip-label,body.gallery.pg-storybuilder .fmt-lbl{color:var(--muted);letter-spacing:.1em;}
body.gallery.pg-storybuilder .fc-help b,body.gallery.pg-storybuilder .editor-help b{color:var(--ink2);}

/* text editor + formatting toolbar (the swatch FILLS are story highlight data — only rings/hover change) */
body.gallery.pg-storybuilder .fmt-bar{background:var(--chip);border-color:var(--line);}
body.gallery.pg-storybuilder .fmtbtn{background:transparent;border-color:var(--line2);color:var(--ink2);}
body.gallery.pg-storybuilder .fmtbtn:hover{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);box-shadow:none;}
body.gallery.pg-storybuilder .fmt-sep{background:var(--line2);}
body.gallery.pg-storybuilder .frame-rte{background:rgba(24,24,27,.05);border-color:var(--line2);color:var(--ink);}
body.gallery.pg-storybuilder .frame-rte:focus{border-color:var(--gilt);box-shadow:0 0 0 3px rgba(24,24,27,.18);}
body.gallery.pg-storybuilder .swatch{border-color:rgba(0,0,0,.85);box-shadow:0 0 0 1px var(--line2);}
body.gallery.pg-storybuilder .swatch:hover{box-shadow:0 0 0 3px rgba(24,24,27,.4);}
body.gallery.pg-storybuilder .swatch.swatch-none{background:var(--parchment);}
body.gallery.pg-storybuilder .ov-handle:active{border-color:var(--gilt-2);box-shadow:0 0 0 2px var(--gilt);}
body.gallery.pg-storybuilder .overlay-row{background:var(--chip);}

/* sliders — gallery's generic input rule otherwise boxes the 4px track in a 1px border */
body.gallery.pg-storybuilder input[type=range]{background:rgba(24,24,27,.08);border:none;border-radius:999px;accent-color:var(--gilt);box-shadow:none;}
body.gallery.pg-storybuilder input[type=range]:focus{border:none;box-shadow:none;}

/* filmstrip */
body.gallery.pg-storybuilder .strip-thumb .strip-tools button:hover{background:var(--gilt);color:#FFFFFF;}
body.gallery.pg-storybuilder .strip-thumb .strip-tools button.del:hover{background:var(--bad);color:#fff;}
body.gallery.pg-storybuilder .strip-add{border-color:var(--line2);color:var(--muted);}
body.gallery.pg-storybuilder .strip-add:hover{border-color:var(--gilt);color:var(--gilt-2);}

/* modals · toast · spinner · performance */
body.gallery.pg-storybuilder .media-modal-inner{background:var(--surface-solid);border-color:var(--line2);box-shadow:var(--sh-lg);}
body.gallery.pg-storybuilder .media-modal-close{color:var(--ink2);}
body.gallery.pg-storybuilder .media-thumb{background:rgba(24,24,27,.08);}
body.gallery.pg-storybuilder .media-thumb:hover{border-color:var(--gilt);}
body.gallery.pg-storybuilder .media-thumb .mdel{background:var(--bad);}
body.gallery.pg-storybuilder .toast{background:var(--surface-solid);border-color:var(--line2);color:var(--ink);box-shadow:var(--sh-lg);}
body.gallery.pg-storybuilder .toast.warn{background:var(--surface-solid);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.55);}
body.gallery.pg-storybuilder .toast.err{background:var(--surface-solid);color:var(--tint-bad-ink);border-color:rgba(212,106,85,.55);}
body.gallery.pg-storybuilder .toast.ok{background:var(--surface-solid);color:var(--tint-good-ink);border-color:rgba(111,165,140,.55);}
body.gallery.pg-storybuilder .spinner{border-color:rgba(0,0,0,.18);border-top-color:var(--gilt);}
body.gallery.pg-storybuilder .ig-dot.on{background:var(--gilt-2);}
body.gallery.pg-storybuilder .perf-stat .pv{font-family:var(--serif);font-weight:400;font-synthesis:none;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}

/* ---- part: tools-polish.css ---- */
/* ============================================================================
 * tools-polish.css — gallery polish for the tool pages
 * (media · attribution · offerbuilder · funnelbuilder · mathengine · video ·
 *  conversations · docs · brief).
 *
 * Part file (dev/css-parts): body.gallery-prefixed overrides ONLY, meant to load
 * after gallery.css. Each tool page ships its own <style> with the old SaaS
 * palette (indigo gradients, #fff panels, pastel status badges). Tokens the
 * page reads via var(--…) are already re-pointed by body.gallery, so what
 * follows neutralises the HARDCODED hexes and the white-on-indigo active states,
 * page by page. No ids, classes, text or logic are touched.
 *
 * Already covered by gallery.css (not repeated): .card, .btn, .btn.ghost,
 * input/select/textarea (+ :focus ring), .chip/.badge/.tag/.pill base, .tbl th/td,
 * .stat .n/.l/.ico, .side, .top, h1–h3 (serif 400), .nodata, scrollbars.
 * ========================================================================== */

/* ---- shared tool chrome (every tool page) ---- */
/* the sticky top bar: gallery.css paints .bar transparent, so content scrolled under it — frost it.
   Scoped to the tool-page bar shape (.bar > .l > .mk); home.html's .bar (> .brand) is untouched; embed hides it anyway. */
body.gallery:not(.embed) .bar:has(> .l > .mk){background:var(--surface);border-bottom:1px solid var(--line);}
body.gallery .bar .l .mk{background:var(--g);box-shadow:0 6px 22px rgba(24,24,27,.25);}
body.gallery .bar .l b{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:18px;letter-spacing:-.01em;color:var(--parchment);}
body.gallery .bar .back{color:var(--muted);opacity:1;}
body.gallery .bar .back:hover{color:var(--gilt-2);}
body.gallery ::selection{background:rgba(24,24,27,.35);color:var(--ink);}
/* buttons: #A5B4FC ghost hover · #FECACA danger border */
body.gallery .btn.ghost:hover{border-color:var(--gilt-soft);color:var(--ink);}
body.gallery .btn.danger{background:var(--tint-bad);color:var(--tint-bad-ink);border:1px solid rgba(212,106,85,.38);box-shadow:none;}
body.gallery .btn.danger:hover{filter:none;background:rgba(212,106,85,.30);}
/* headings that carry an inline SaaS weight (offerbuilder's card h2s) */
body.gallery h2[style*="font-weight"]{font-weight:400!important;}
/* small-caps field labels */
body.gallery label.fl{font-size:10.5px;font-weight:650;letter-spacing:.12em;color:var(--muted);}
/* info / warn / ok notes (#EFF6FF+#BFDBFE · #EEF2FF+#E0E7FF · #FFFBEB+#FDE68A+#92400E · #ECFDF5+#A7F3D0+#065F46) */
body.gallery .note{background:var(--tint-info);border:1px solid rgba(74,111,165,.38);color:var(--tint-info-ink);}
body.gallery .note.warn{background:var(--tint-warn);border-color:rgba(221,174,82,.38);color:var(--tint-warn-ink);}
body.gallery .note.ok{background:var(--tint-good);border-color:rgba(111,165,140,.38);color:var(--tint-good-ink);}
/* tiny tags */
body.gallery .tg{background:var(--chip);border:1px solid var(--line);color:var(--ink2);}
/* toggle switches (#6366F1 on · #fff knob) */
body.gallery .sw{background:rgba(0,0,0,.16);}
body.gallery .sw.on{background:var(--gilt);}
body.gallery .sw::after{background:var(--parchment);box-shadow:0 1px 2px rgba(0,0,0,.4);}
/* free-standing list cards (saved offers / funnels / flows / videos / player settings) read as frosted panels;
   their .top is a flex title row, not the shell topbar gallery.css styles */
body.gallery .ocard,body.gallery .fcard,body.gallery .vcard,body.gallery .setcard{background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-md);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);}
body.gallery .ocard .top,body.gallery .fcard .top{background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;}
body.gallery .ocard > .top b,body.gallery .fcard > .top b,body.gallery .fcard > .row > b,body.gallery .vbody b,body.gallery .setcard .hd b,body.gallery .acard .at{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:17px;letter-spacing:-.01em;color:var(--parchment);}
/* placards nested inside a panel flatten, like gallery's .card .card */
body.gallery .card .stat{background:var(--surface-2);border-color:var(--line);box-shadow:none;}
body.gallery .card .role:has(> .v){background:var(--surface-2);border-color:var(--line);box-shadow:none;}
/* KPI / stat icon tiles: gilt tile, gilt glyph — the inline gradient background and the svg's fill="#fff" are both attributes, hence !important / attribute selectors */
body.gallery .stat .ico svg,body.gallery .kpi .ico svg{fill:var(--gilt-2);}
body.gallery .stat .ico svg [fill="#fff"],body.gallery .kpi .ico svg [fill="#fff"]{fill:var(--gilt-2);}
/* inline code */
body.gallery code{background:var(--chip);border:1px solid var(--line);color:var(--ink2);}

/* ---- media.html ---- */
/* hexes neutralised: #DDD6FE selection · #A5B4FC ghost hover · #FECACA danger · --violet(#6366F1) hover/over · #EEF2FF drop.over ·
   #0D0D12 thumb/pv · rgba(255,255,255,.92) play disc · #fff toast text on var(--ink) (parchment) · rgba(15,20,35,.55) modal scrim · indigo .frow.on/.fill */
body.gallery.pg-media .rail{background:var(--surface-2);border-right-color:var(--line);}
body.gallery.pg-media .rail h3{font-family:inherit;font-size:10.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
body.gallery.pg-media .rail .frow{border-color:var(--line);}
body.gallery.pg-media .frow.on{background:rgba(24,24,27,.14);color:var(--gilt-2);box-shadow:inset 0 0 0 1px var(--line2);}
body.gallery.pg-media .drop{border:1px dashed var(--line2);background:var(--surface-2);color:var(--muted);}
body.gallery.pg-media .drop b{color:var(--ink);}
body.gallery.pg-media .drop.over{border-color:var(--gilt);background:rgba(24,24,27,.10);color:var(--ink2);}
body.gallery.pg-media .uprow .fill{background:var(--g);}
body.gallery.pg-media .uprow.err .fill{background:var(--bad);}
body.gallery.pg-media .asset:hover{border-color:var(--gilt-soft);box-shadow:0 0 0 3px rgba(24,24,27,.14);}
body.gallery.pg-media .asset .thumb{background-color:var(--surface-solid);}
body.gallery.pg-media .asset .playico{background:rgba(0,0,0,.92);}
body.gallery.pg-media .modal{background:rgba(0,0,0,.66);}
body.gallery.pg-media .modal-inner{background:var(--surface-solid);border:1px solid var(--line2);box-shadow:var(--sh-lg);}
body.gallery.pg-media .modal .pv{background:var(--bg);}
body.gallery.pg-media .modal-close{color:var(--muted);}
body.gallery.pg-media .modal-close:hover{color:var(--ink);}
body.gallery.pg-media .toast{background:var(--surface-solid);color:var(--ink);border:1px solid var(--line2);}
body.gallery.pg-media .toast.err{background:var(--surface-solid);color:var(--tint-bad-ink);border-color:rgba(212,106,85,.55);}
body.gallery.pg-media .toast.ok{background:var(--surface-solid);color:var(--tint-good-ink);border-color:rgba(111,165,140,.55);}
body.gallery.pg-media .toast.warn{background:var(--surface-solid);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.55);}
body.gallery.pg-media .head .sub{color:var(--muted);}

/* ---- attribution.html ---- */
/* hexes neutralised: indigo .tab.on / .dp.on · #fff .seg span.on · #FEF3C7/#FDE68A/#92400E .demo · #DCFCE7/#166534 .node.conv · #EDE9FE/#5B21B6 .node.sale ·
   #0b1020/#cbd5e1 .snippet · #EDE9FE/#5B21B6 .creative-badge.video · #DBEAFE/#1E40AF .creative-badge.reel · gradient KPI tiles with stroke="#fff" */
body.gallery.pg-attribution .tab.on{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);box-shadow:none;}   /* also mathengine */
body.gallery.pg-attribution .demo{background:var(--tint-warn);border-color:rgba(221,174,82,.38);color:var(--tint-warn-ink);}
body.gallery.pg-attribution .kpi .ico{background:rgba(24,24,27,.10)!important;border:1px solid var(--line2);color:var(--gilt-2);}
body.gallery.pg-attribution .kpi .ico svg *{stroke:var(--gilt-2);}
body.gallery.pg-attribution .kpi .n{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:30px;letter-spacing:-.01em;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-attribution .kpi .l{font-size:10.5px;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
body.gallery.pg-attribution .node{border:1px solid var(--line);}
body.gallery.pg-attribution .node.conv{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-attribution .node.sale{background:rgba(24,24,27,.16);color:var(--gilt-2);border-color:var(--line2);}
body.gallery.pg-attribution .seg{background:rgba(24,24,27,.05);border:1px solid var(--line);}
body.gallery.pg-attribution .seg span.on{background:rgba(24,24,27,.14);color:var(--gilt-2);box-shadow:inset 0 0 0 1px var(--line2);}
body.gallery.pg-attribution .snippet{background:var(--surface-solid);color:var(--ink2);border:1px solid var(--line);}
body.gallery.pg-attribution .drange .dp{background:var(--chip);border-color:var(--line);color:var(--ink2);}
body.gallery.pg-attribution .drange .dp.on{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);box-shadow:none;}
body.gallery.pg-attribution .creative-badge{background:var(--chip);border:1px solid var(--line);color:var(--ink2);}
body.gallery.pg-attribution .creative-badge.video{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.38);}
body.gallery.pg-attribution .creative-badge.reel{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-attribution .funbar{background:rgba(24,24,27,.08);box-shadow:inset 0 0 0 1px var(--line);}

/* ---- offerbuilder.html ---- */
/* hexes neutralised: #7C3AED range accent · #FFFBEB .lev.weak · #7C3AED/#EEF0F6 dial · #F5F3FF/#DDD6FE/#6D28D9 .tip ·
   #DCFCE7/#166534 · #FEF3C7/#92400E · #FEE2E2/#991B1B .mult · #EDE9FE/#6D28D9 · #DCFCE7/#166534 · #E0E7FF/#3730A3 .tg */
/* .sect here is a section CONTAINER (h2 + body), not index.html's h3.sect title — undo gallery.css's title styling on the box, put it on the h2 */
body.gallery.pg-offerbuilder .sect:has(> h2){font-family:inherit;font-size:inherit;color:inherit;letter-spacing:inherit;border-bottom:0;padding-bottom:0;margin:22px 0 0;}   /* also funnelbuilder */
body.gallery.pg-offerbuilder .sect > h2{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:20px;letter-spacing:-.01em;color:var(--parchment);}
body.gallery.pg-offerbuilder .lev input[type=range]{accent-color:var(--gilt);}
body.gallery.pg-offerbuilder .lev.weak{background:var(--tint-warn);border:1px solid rgba(221,174,82,.30);}
body.gallery.pg-offerbuilder .lev .lv{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:22px;letter-spacing:-.01em;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-offerbuilder .dial{background:conic-gradient(var(--dc,var(--gilt)) calc(var(--p,0)*1%),rgba(0,0,0,.10) 0);}
body.gallery.pg-offerbuilder .dial .in{background:var(--surface-solid);box-shadow:inset 0 0 0 1px var(--line);}
body.gallery.pg-offerbuilder .dial .in .n{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:34px;letter-spacing:-.01em;font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-offerbuilder .tip{background:var(--surface-2);border-color:var(--line);color:var(--ink2);}
body.gallery.pg-offerbuilder .tip b{color:var(--gilt-2);}
body.gallery.pg-offerbuilder .totrow{border-top-color:var(--line2);}
body.gallery.pg-offerbuilder .totrow .tv{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:26px;letter-spacing:-.01em;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-offerbuilder .mult{border:1px solid var(--line);}
body.gallery.pg-offerbuilder .mult.ok{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-offerbuilder .mult.mid{background:var(--tint-warn);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.38);}
body.gallery.pg-offerbuilder .mult.bad{background:var(--tint-bad);color:var(--tint-bad-ink);border-color:rgba(212,106,85,.38);}
body.gallery.pg-offerbuilder .tg.sc{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.38);}
body.gallery.pg-offerbuilder .tg.pr{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-offerbuilder .tg.mx{background:rgba(24,24,27,.16);color:var(--gilt-2);border-color:var(--line2);}
body.gallery.pg-offerbuilder .li .x:hover{color:var(--bad);}

/* ---- funnelbuilder.html ---- */
/* hexes neutralised: #A5B4FC / #8B5CF6+#C7D2FE55 .acard hover/on · violet-gradient .stepnum · #EDE9FE/#6D28D9 .tg.arch · #DCFCE7/#166534 .tg.price ·
   #7C3AED/#F1F3F9 .url · #E0E7FF/#3730A3 .pill.vid · #DCFCE7/#166534 .pill.form · #FCE7F3/#9D174D .pill.book */
body.gallery.pg-funnelbuilder .acard{background:var(--surface-2);border:1px solid var(--line);}
body.gallery.pg-funnelbuilder .acard:hover{border-color:var(--gilt-soft);}
body.gallery.pg-funnelbuilder .acard.on{border-color:var(--gilt);background:rgba(24,24,27,.10);box-shadow:0 0 0 3px rgba(24,24,27,.18);}
body.gallery.pg-funnelbuilder .acard .stages{color:var(--muted);}
body.gallery.pg-funnelbuilder .stepnum{background:rgba(24,24,27,.16);color:var(--gilt-2);box-shadow:inset 0 0 0 1px var(--line2);}
body.gallery.pg-funnelbuilder .tg.arch{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.38);}
body.gallery.pg-funnelbuilder .tg.price{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-funnelbuilder .url{background:var(--surface-solid);color:var(--ink2);border:1px solid var(--line);}   /* also links.html's .url */
body.gallery.pg-funnelbuilder .pill.vid{background:var(--tint-info);color:var(--tint-info-ink);border-color:rgba(74,111,165,.38);}
body.gallery.pg-funnelbuilder .pill.form{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-funnelbuilder .pill.book{background:var(--tint-warn);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.38);}

/* ---- mathengine.html ---- */
/* hexes neutralised: #A5B4FC .preset hover · indigo .preset.on · #fff-on-surface .tab.on · #FAFBFE tr.em · #DCFCE7/#166534 · #FEF3C7/#92400E · #FEE2E2/#991B1B .tg ·
   #6366F1/#8B5CF6/#EC4899 splitbar · #EFF6FF/#BFDBFE · #FEF3C7/#FDE68A · #F0FDF4/#BBF7D0 .diag · indigo gradient hero number */
body.gallery.pg-mathengine .preset{background:var(--chip);border-color:var(--line);color:var(--ink2);}   /* also links.html */
body.gallery.pg-mathengine .preset:hover{border-color:var(--gilt-soft);}
body.gallery.pg-mathengine .preset.on{background:rgba(24,24,27,.14);color:var(--gilt-2);border-color:var(--line2);}
body.gallery.pg-mathengine .tabs:has(> button.tab){background:rgba(24,24,27,.05);border:1px solid var(--line);}
body.gallery.pg-mathengine button.tab{color:var(--ink2);}
body.gallery.pg-mathengine button.tab.on{box-shadow:inset 0 0 0 1px var(--line2);}   /* borderless button tabs get the ring via inset shadow */
body.gallery.pg-mathengine .stat.hero .n{background:var(--g);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}   /* also brief */
body.gallery.pg-mathengine tr.em td{background:rgba(24,24,27,.07);color:var(--ink);}
body.gallery.pg-mathengine thead th{color:var(--muted);border-bottom-color:var(--line2);}
body.gallery.pg-mathengine .tg.good{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-mathengine .tg.warn{background:var(--tint-warn);color:var(--tint-warn-ink);border-color:rgba(221,174,82,.38);}
body.gallery.pg-mathengine .tg.bad{background:var(--tint-bad);color:var(--tint-bad-ink);border-color:rgba(212,106,85,.38);}
body.gallery.pg-mathengine .role .r{font-size:10.5px;font-weight:650;letter-spacing:.1em;}
body.gallery.pg-mathengine .role .v{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:26px;letter-spacing:-.01em;color:var(--parchment);font-variant-numeric:tabular-nums lining-nums;}
body.gallery.pg-mathengine .splitbar{box-shadow:inset 0 0 0 1px var(--line);}   /* also brief */
body.gallery.pg-mathengine .splitbar .s{color:var(--parchment);text-shadow:0 1px 2px rgba(0,0,0,.45);}
body.gallery.pg-mathengine .splitbar .s.tofu{background:#4A6FA5;}
body.gallery.pg-mathengine .splitbar .s.mofu{background:#6FA58C;}
body.gallery.pg-mathengine .splitbar .s.bofu{background:#C68A2E;}
body.gallery.pg-mathengine .diag{border-color:var(--line);}   /* also brief */
body.gallery.pg-mathengine .diag.VOLUME{background:var(--tint-info);border-color:rgba(74,111,165,.38);}
body.gallery.pg-mathengine .diag.QUALITY{background:var(--tint-warn);border-color:rgba(221,174,82,.38);}
body.gallery.pg-mathengine .diag.BALANCED{background:var(--tint-good);border-color:rgba(111,165,140,.38);}
body.gallery.pg-mathengine .secttl{font-family:var(--serif);font-weight:400;font-synthesis:none;font-size:20px;letter-spacing:-.01em;color:var(--parchment);}   /* also brief */

/* ---- video.html ---- */
/* hexes neutralised: #EEF2FF/#E0E7FF .note (shared rule) · #0b1020 .vthumb · #6366F1/#fff .sw (shared) · #fff→#fafbff .eg track · gradient stat tiles with fill="#fff" (shared) */
body.gallery.pg-video .vthumb{background-color:var(--surface-solid);}
body.gallery.pg-video .eg{background:rgba(24,24,27,.05);border-color:var(--line);}
body.gallery.pg-video .eg .b{background:var(--g-sky);}
body.gallery.pg-video .axis{color:var(--muted);}

/* ---- conversations.html ---- */
/* hexes neutralised: #EEF2FF/#E0E7FF .note (shared) · var(--bg) solid .step · indigo/violet .step .n (inline background → !important) · #DCFCE7/#166534 .pill.live · #6366F1/#fff .sw (shared) */
body.gallery.pg-conversations .step{background:var(--surface-2);border:1px solid var(--line);}
body.gallery.pg-conversations .step .n{background:rgba(24,24,27,.16)!important;color:var(--gilt-2);box-shadow:inset 0 0 0 1px var(--line2);}
body.gallery.pg-conversations .pill.live{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}

/* ---- docs.html ---- */
/* hexes neutralised: #EEF2FF .row.on · #4338CA .row.on b · #DCFCE7/#166534 .tag.sh · #A5B4FC/#C7D2FE55 focus (gallery.css) · #fff .side/.doc pre (tokens) */
body.gallery.pg-docs .row.on{background:rgba(24,24,27,.14);box-shadow:inset 2px 0 0 var(--gilt);}
body.gallery.pg-docs .row.on b{color:var(--gilt-2);}
body.gallery.pg-docs .tag.sh{background:var(--tint-good);color:var(--tint-good-ink);border-color:rgba(111,165,140,.38);}
body.gallery.pg-docs .grp{letter-spacing:.12em;font-weight:650;}
body.gallery.pg-docs .doc h2{font-size:28px;line-height:1.15;}
body.gallery.pg-docs .doc pre{background:var(--surface-solid);color:var(--ink2);border-color:var(--line);}

/* ---- brief.html ---- */
/* hexes neutralised: #EFF6FF/#BFDBFE .note (shared) · indigo/#fff .ai · indigo gradient hero number (mathengine rule) · #6366F1/#8B5CF6/#EC4899 splitbar (mathengine rule) ·
   #EFF6FF/#FEF3C7/#F0FDF4 .diag (mathengine rule) · chip counter on .lst.acts */
body.gallery.pg-brief .ai{background:rgba(24,24,27,.08);border:1px solid var(--line2);color:var(--ink);box-shadow:none;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.45;}
body.gallery.pg-brief .ai .tag{background:transparent;border:0;border-radius:0;padding:0;opacity:1;color:var(--gilt-2);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;font-size:10px;letter-spacing:.12em;}
body.gallery.pg-brief .lst li{border-top-color:var(--line);}
body.gallery.pg-brief .lst.acts li::before{background:rgba(24,24,27,.16);color:var(--gilt-2);box-shadow:inset 0 0 0 1px var(--line2);}
body.gallery.pg-brief .brieftext{color:var(--ink2);}