/* GullyChain sites in the Gully Terminal design system (now rendered in Studio Light: lightify() + studio-light/). Parts: design/terminal/tokens.css, sites/_shared/term-base.css,
   sites/_shared/term-extra.css, design/terminal/components.css, sites/_shared/term-terminal.css (the skin).
   Built by sites/_shared/build.mjs; do not edit the copy in a site folder. */
/*!
 * Gully Terminal design system: tokens. gully-labs/gully-ops design/terminal/tokens.css (spec: README.md next to it).
 * One neutral near-black system, one accent per product taken from that product's brand kit
 * (Desktop\GULLY LABS GRAPHICS\<product>). Pick the product with data-product on <html> (or any wrapper):
 *   <html data-product="chain">   chain | labs | pay | rpc | ai | security | studio | holdermaps
 * Every component in components.css and every chart in chart-kit.js reads only these variables.
 */
:root {
  /* ---- neutrals (shared by every product; the ground comes from the product kit below) ---- */
  --t-bg: #FFFFFF;
  --t-surface: color-mix(in srgb, var(--t-bg), #fff 3%);
  --t-surface-2: color-mix(in srgb, var(--t-bg), #fff 6%);
  --t-line: rgba(11,13,18,.09);        /* 1 px rules, table rows, panel borders */
  --t-line-strong: rgba(11,13,18,.16); /* hover, focus-within, axis */
  --t-grid: rgba(11,13,18,.05);        /* chart gridlines, the grid motif */
  --t-text: #0B0D12;
  --t-muted: #5B6270;
  --t-faint: #5B6270;

  /* ---- semantic ---- */
  --t-up: #0B6640;
  --t-down: #B42318;
  --t-warn: #7A4A00;
  --t-idle: #5B6270;

  /* ---- product accent (overridden per product below) ---- */
  --t-accent: #0A86C2;
  --t-accent-2: #16A34A;
  --t-on-accent: #FFFFFF;                    /* text on an accent fill */
  --t-accent-soft: color-mix(in srgb, var(--t-accent) 14%, transparent);
  --t-accent-line: color-mix(in srgb, var(--t-accent) 45%, transparent);

  /* ---- chart series (accent first, then neutral steps; never a rainbow) ---- */
  --t-s1: var(--t-accent);
  --t-s2: var(--t-accent-2);
  --t-s3: #5B6270;
  --t-s4: #C9D1DA;
  --t-s5: #4F5965;

  /* ---- type ---- */
  --t-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; /* product kit font set below */
  --t-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --t-fs-2xs: 11px;  /* small caps labels */
  --t-fs-xs: 12px;
  --t-fs-sm: 13px;
  --t-fs-base: 15px;
  --t-fs-md: 17px;
  --t-fs-lg: 20px;
  --t-fs-xl: clamp(22px, 2.2vw, 28px);   /* h2 */
  --t-fs-2xl: clamp(30px, 3.4vw, 40px);  /* KPI value, section display */
  --t-fs-3xl: clamp(34px, 4.6vw, 58px);  /* h1 */
  --t-lh: 1.55;
  --t-track-label: .12em;

  /* ---- 8 px grid ---- */
  --t-1: 4px;  --t-2: 8px;  --t-3: 12px; --t-4: 16px; --t-5: 24px;
  --t-6: 32px; --t-7: 40px; --t-8: 48px; --t-9: 64px; --t-10: 80px;
  --t-gutter: 16px;                          /* page side gutter; 32 px from 900 px up */
  --t-maxw: 1280px;
  --t-topbar-h: 56px;

  /* ---- shape and motion ---- */
  --t-r: 4px;      /* buttons, inputs, panels */
  --t-r-sm: 2px;   /* bars, tags */
  --t-r-pill: 999px; /* status pills only */
  --t-ease: cubic-bezier(.2, .8, .2, 1);
  --t-dur: 180ms;
  --t-dur-chart: 900ms;
  color-scheme: light;
}
@media (min-width: 900px) { :root { --t-gutter: 32px; } }

/* ---- products (primary colour, ground and font from each brand kit's CLAUDE_INTEGRATION_PROMPT.md / tokens.json) ---- */
[data-product="chain"] {      /* Gully Chain kit v3: tokens.json */
  --t-bg: #FFFFFF; --t-accent: #0A86C2; --t-accent-2: #16A34A; --t-on-accent: #FFFFFF;
  --t-font-sans: "Exo 2", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="labs"] {       /* Gully Labs: --gl-* */
  --t-bg: #06050D; --t-accent: #00D2FF; --t-accent-2: #7B3BFF; --t-on-accent: #06050D;
  --t-font-sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="pay"] {        /* Gully Pay: --gp-* */
  --t-bg: #09131F; --t-accent: #3479FD; --t-accent-2: #16B2FE; --t-on-accent: #FFFFFF;
  --t-font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="rpc"] {        /* GullyRPC: --gully-orange */
  --t-bg: #0B0907; --t-accent: #FF7300; --t-accent-2: #C9BFB6; --t-on-accent: #0B0907;
  --t-font-sans: "Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="ai"] {         /* GullyAI: --gully-cyan */
  --t-bg: #03070B; --t-accent: #00F0F2; --t-accent-2: #1A98FF; --t-on-accent: #03070B;
  --t-font-sans: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="security"] {   /* GullySecurity: --gs-gold */
  --t-bg: #0C0D0D; --t-accent: #F2B232; --t-accent-2: #C9CACC; --t-on-accent: #16161A;
  --t-font-sans: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="studio"] {     /* GullyStudio: --gs-blue */
  --t-bg: #06121F; --t-accent: #1E8BFF; --t-accent-2: #19D3FF; --t-on-accent: #FFFFFF;
  --t-font-sans: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
}
[data-product="holdermaps"] { /* HolderMaps: --hm-yellow */
  --t-bg: #0A0A0A; --t-accent: #FFD52E; --t-accent-2: #FDB813; --t-on-accent: #0A0A0A;
  --t-font-sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* re-derive the mixes under each product (custom properties resolve where they are declared) */
[data-product] {
  --t-surface: color-mix(in srgb, var(--t-bg), #fff 3%);
  --t-surface-2: color-mix(in srgb, var(--t-bg), #fff 6%);
  --t-accent-soft: color-mix(in srgb, var(--t-accent) 14%, transparent);
  --t-accent-line: color-mix(in srgb, var(--t-accent) 45%, transparent);
  --t-s1: var(--t-accent);
  --t-s2: var(--t-accent-2);
}

:root{
  /* GullyChain brand kit (brand/tokens.json) */
  --gc-night:#FFFFFF;--gc-ink:#F6F7F9;--gc-blue:#0A86C2;--gc-cyan:#0A86C2;--gc-green:#16A34A;--gc-white:#0B0D12;--gc-muted:#5B6270;
  --gc-chain-gradient:linear-gradient(90deg,#0A86C2,#16A34A);
  --gc-font:'Exo 2',system-ui,sans-serif;
  /* page roles */
  --gc-black:var(--gc-night);--gc-line:rgba(91,98,112,.18);--gc-royal:var(--gc-blue);--gc-electric:var(--gc-blue);--gc-indigo:var(--gc-blue);
  --gc-text:var(--gc-white);--gc-up:var(--gc-green);--gc-down:#B42318;
  --gc-radius-card:22px;--gc-radius-pill:9999px;
  --f-head:var(--gc-font);--f-tag:var(--gc-font);--f-badge:var(--gc-font);--f-body:var(--gc-font);--f-num:var(--gc-font);
  --f-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --grid:rgba(91,98,112,.10);--up:var(--gc-green);--down:#B42318;
  color-scheme: light;
}
.gc-ink{background:var(--gc-ink)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--gc-black);color:var(--gc-text);font-family:var(--f-body);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
h1,h2,h3{font-family:var(--f-head);font-weight:800;letter-spacing:-.02em;margin:0;line-height:1.02}
p{margin:0}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding:0 16px}
@media (min-width:900px){.wrap{padding:0 28px}}
:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.num{font-family:var(--f-num);font-weight:600;font-variant-numeric:tabular-nums}
.lab{font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:14px;color:var(--gc-muted)}
.lab.cy{color:var(--gc-cyan)}
.muted{color:var(--gc-muted)}
.up{color:var(--up)}.down{color:var(--down)}

/* wordmark */
.wm{font-family:var(--f-head);font-weight:800;letter-spacing:-.02em;color:#0B0D12;text-decoration:none;display:inline-flex;align-items:center;gap:0;font-size:22px;line-height:1}

.wm img{height:40px;width:auto;display:block}
@media (max-width:640px){.wm img{height:32px}}
.wm .c{background:var(--gc-chain-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}

/* signature buttons */
.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 20px 0 18px;border-radius:var(--gc-radius-pill);font-family:var(--f-body);font-weight:800;font-size:15px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .12s ease,box-shadow .15s ease,border-color .15s ease;white-space:nowrap}
.btn .ic{width:18px;height:18px}
.btn .ar{width:16px;height:16px;transition:transform .2s ease}
.btn:hover .ar{transform:translateX(4px)}
.btn:active{transform:scale(.98)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%)}
.btn:hover::after{transform:translateX(120%);transition:transform .7s ease}
.btn.pri{background:var(--gc-cyan);color:#FFFFFF}
.btn.pri:hover{box-shadow:0 0 0 4px rgba(10,134,194,.2)}
.btn.sec{background:var(--gc-royal);color:#0B0D12}
.btn.sec::after{background:linear-gradient(115deg,transparent 35%,rgba(10,134,194,.45) 50%,transparent 65%)}
.btn.sec:hover{box-shadow:0 0 0 4px rgba(10,134,194,.22)}
.btn.ter{background:transparent;color:#0B0D12;border-color:var(--gc-line)}
.btn.ter::after{background:linear-gradient(115deg,transparent 35%,rgba(10,134,194,.25) 50%,transparent 65%)}
.btn.ter:hover{border-color:var(--gc-electric)}
.btn.sm{min-height:36px;padding:0 14px 0 12px;font-size:14px}
.btn.xs{min-height:30px;padding:0 10px;font-size:13px;gap:6px}

/* top bar */
.nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--gc-line)}
.nav .wrap{display:flex;flex-wrap:nowrap;white-space:nowrap;align-items:center;justify-content:space-between;height:60px;gap:14px}
.nav ul{list-style:none;margin:0;padding:0;display:none;gap:2px}
.nav ul a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 11px;border-radius:8px;text-decoration:none;color:var(--gc-muted);font-weight:600;font-size:14px;transition:color .15s ease,background .15s ease}
.nav ul a:hover,.nav ul a[aria-current="true"]{color:#0B0D12;background:var(--gc-ink)}
.nav ul a:hover .ic,.nav ul a[aria-current="true"] .ic{color:var(--gc-cyan)}
@media (min-width:900px){.nav ul{display:flex}}
@media (max-width:1399px){.nav ul a span{display:none}.nav ul a{padding:0 9px}}
.navr{display:flex;align-items:center;gap:10px;flex:none}
@media (max-width:1279px){.nav .btn.docs{display:none}.nav .btn.sm{min-height:36px;font-size:14px;padding:0 13px 0 11px}}
@media (max-width:1099px){.nav .btn.wal span{display:none}.nav .btn.wal{padding:0 11px}}
.pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px;border-radius:var(--gc-radius-pill);border:1px solid var(--gc-line);background:var(--gc-ink);font-size:13px;font-weight:600;color:var(--gc-muted);white-space:nowrap;font-family:var(--f-num);font-variant-numeric:tabular-nums}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--gc-muted);flex:none}
.pill.live{color:#0B0D12}.pill.live .dot{background:var(--gc-cyan);box-shadow:0 0 0 0 rgba(10,134,194,.5);animation:breathe 2.4s ease-in-out infinite}
.pill.replay{color:#0B0D12;border-color:var(--gc-muted)}
.pill.down .dot{background:var(--down)}
.pill.flash .dot{animation:ping .9s ease-out 1}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(10,134,194,.6)}100%{box-shadow:0 0 0 12px rgba(10,134,194,0)}}
@keyframes breathe{0%,100%{box-shadow:0 0 0 0 rgba(10,134,194,.45)}50%{box-shadow:0 0 0 5px rgba(10,134,194,0)}}
@media (max-width:640px){.nav .wrap{gap:8px}.navr{gap:6px}.nav .btn.wal,.nav .btn.docs{display:none}.nav .btn.pri span{display:none}.nav .btn.pri{padding:0 11px}.nav .pill{padding:0 9px}.nav .pill span:last-child{max-width:100px;overflow:hidden;text-overflow:ellipsis}}
/* header fit (brand audit 2026-10-26): one line at every width, rightmost control inside the viewport. The Docs pill
   duplicated the Docs menu item, the status pill text is capped, phones keep the logo, a dot-only pill and the rocket. */
.nav .btn.docs{display:none}
.nav .wm{flex:none}.nav nav{min-width:0}
.tbtn{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;flex:none}
.nav .pill span:last-child{max-width:190px;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1599px){.nav .pill span:last-child{max-width:150px}}
@media (max-width:640px){.nav .btn.pri .ar{display:none}.nav .btn.pri{padding:0 10px}}
@media (max-width:480px){.nav .pill{width:32px;padding:0;justify-content:center;gap:0}.nav .pill span:last-child{display:none}}

/* replay banner */
.banner{display:none;background:var(--gc-ink);border-bottom:1px solid var(--gc-muted);color:var(--gc-muted);font-size:14px;padding:8px 0}
.banner.on{display:block}
.banner b{color:#0B0D12;font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;margin-right:6px}

/* terminal frame */
.term{border:1px solid var(--gc-line);background:var(--gc-ink);position:relative}
.term .th{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--gc-line);min-height:38px}
.term .th .lab{font-size:13px}
.term .th .r{display:flex;align-items:center;gap:8px;font-family:var(--f-num);font-size:12px;color:var(--gc-muted);font-variant-numeric:tabular-nums}
.k{display:inline-block;font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:var(--gc-cyan)}
.k.sell{color:var(--down)}.k.buy{color:var(--up)}

/* hero: chart wall */
.hero{padding:26px 0 18px;position:relative}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 400px at 85% 0%,rgba(10,134,194,.14),transparent 70%);pointer-events:none}
.hero .wrap{display:grid;grid-template-columns:1fr;gap:18px;position:relative}
@media (min-width:900px){.hero .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}}
@media (min-width:1200px){.hero .wrap{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:28px}}
.copy{display:flex;flex-direction:column;justify-content:center;gap:16px;min-width:0}
.copy .badge{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:var(--gc-radius-pill);background:var(--gc-blue);color:#0B0D12;font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:14px;width:max-content}
.copy h1{font-size:clamp(40px,4.6vw,64px)}
.copy h1 em{font-style:normal;color:var(--gc-cyan)}
.copy .promise{color:var(--gc-muted);font-size:clamp(15px,1.15vw,17px);max-width:480px}
.copy .promise b{color:#0B0D12;font-weight:600}
.ctas{display:flex;flex-wrap:wrap;gap:10px}
.rpcrow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--f-num);font-size:13px;color:var(--gc-muted)}
.rpcrow code{font-family:var(--f-mono);color:#0B0D12;background:var(--gc-ink);border:1px solid var(--gc-line);padding:4px 8px;border-radius:6px;font-size:12.5px}
.rpcrow .btn.xs{color:var(--gc-muted)}
.wall{display:flex;flex-direction:column;min-width:0;height:100%}
.wall .plot{position:relative;flex:1;min-height:190px}
@media (max-width:899px){.wall .plot{height:240px;flex:none}}
.wall svg.main{position:absolute;left:12px;top:10px;width:calc(100% - 24px);height:calc(100% - 16px);display:block;overflow:visible}
.wall .hn{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:12px 12px 0}
.wall .hn b{font-family:var(--f-head);font-weight:800;font-size:clamp(30px,3vw,44px);letter-spacing:-.02em;line-height:1}
.wall .hn span{color:var(--gc-muted);font-size:13px}
.gl{stroke:var(--grid);stroke-width:1}
.ax{stroke:var(--gc-line);stroke-width:1}
.at{font-family:var(--f-num);font-size:11px;fill:var(--gc-muted);font-variant-numeric:tabular-nums}
.ln{fill:none;stroke:var(--gc-cyan);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.ar{fill:url(#fade)}
.xh{stroke:var(--gc-muted);stroke-width:1;opacity:0}
.hit{fill:transparent;cursor:crosshair}
.dot{fill:var(--gc-cyan);stroke:#FFFFFF;stroke-width:2;opacity:0}
.end{fill:var(--gc-cyan);stroke:var(--gc-ink);stroke-width:2}
.ln2{fill:none;stroke:#0B0D12;stroke-width:2.5;stroke-linecap:round;opacity:0}
.ln2.on{opacity:.8;animation:sweep 5s linear infinite}
@keyframes sweep{from{stroke-dashoffset:var(--L2)}to{stroke-dashoffset:0}}
.ring{fill:none;stroke:var(--gc-cyan);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
.ring.on{animation:ringp 2.2s ease-out infinite}
@keyframes ringp{0%{opacity:.8;transform:scale(.5)}100%{opacity:0;transform:scale(3.4)}}
.ar.live{animation:wash 7s ease-in-out infinite}
@keyframes wash{0%,100%{opacity:1}50%{opacity:.5}}
.pulse{fill:none;stroke:var(--gc-cyan);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.pulse.go{animation:pulse 1.4s ease-out 1}
@keyframes pulse{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(3)}}
.slide{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tbtn{background:transparent;border:1px solid var(--gc-line);color:var(--gc-muted);border-radius:var(--gc-radius-pill);height:26px;padding:0 10px;font:600 12px var(--f-body);cursor:pointer}
.tbtn[aria-pressed="true"],.tbtn:hover{color:#0B0D12;border-color:var(--gc-electric)}
table.dt{width:100%;border-collapse:collapse;font-size:12.5px;margin:4px 0 8px;font-family:var(--f-num);font-variant-numeric:tabular-nums}
table.dt th,table.dt td{text-align:right;padding:3px 6px;border-top:1px solid var(--gc-line)}
table.dt th:first-child,table.dt td:first-child{text-align:left}
table.dt caption{text-align:left;color:var(--gc-muted);padding:4px 6px;font-size:12px;font-family:var(--f-body)}
.dtwrap{position:absolute;inset:6px 12px;overflow:auto}
[hidden]{display:none!important}
.gc-tip{position:fixed;z-index:50;pointer-events:none;background:var(--gc-ink);border:1px solid var(--gc-line);border-radius:10px;padding:8px 10px;font-size:12.5px;line-height:1.4;color:var(--gc-muted);opacity:0;transition:opacity .12s ease;max-width:260px}
.gc-tip.on{opacity:1}
.gc-tip b{display:block;color:#0B0D12;font-family:var(--f-num);font-weight:600;font-size:15px;font-variant-numeric:tabular-nums}

/* ticker */
.tape{border-top:1px solid var(--gc-line);height:38px;display:flex;align-items:stretch;overflow:hidden;background:var(--gc-night);flex:none}
.tape .lb{display:flex;align-items:center;padding:0 12px;border-right:1px solid var(--gc-line);flex:none}
.tape .tv{flex:1;min-width:0;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#FFFFFF 5%,#FFFFFF 95%,transparent);mask-image:linear-gradient(90deg,transparent,#FFFFFF 5%,#FFFFFF 95%,transparent)}
.tape .trk{position:absolute;left:0;top:0;height:100%;display:flex;white-space:nowrap;animation:tape 60s linear infinite;will-change:transform}
.tape:hover .trk,.tape:focus-within .trk{animation-play-state:paused}
@keyframes tape{to{transform:translateX(-50%)}}
.tape .it{display:inline-flex;align-items:center;gap:8px;padding:0 22px;font-family:var(--f-num);font-size:13px;color:var(--gc-muted);font-variant-numeric:tabular-nums;border-right:1px solid var(--gc-line)}
.tape .it b{color:#0B0D12;font-weight:600}
.tape .it .ic{width:14px;height:14px;color:var(--gc-muted)}
.tape.static .trk{animation:none;position:static}.tape.static .tv{overflow-x:auto;mask-image:none;-webkit-mask-image:none}

/* stat strip */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--gc-line);border:1px solid var(--gc-line);border-top:0}
@media (min-width:768px){.stats{grid-template-columns:repeat(3,1fr)}.tile:last-child{grid-column:span 2}}
@media (min-width:1200px){.stats{grid-template-columns:repeat(5,1fr)}.tile:last-child{grid-column:auto}}
.tile{background:var(--gc-ink);padding:12px 14px 10px;display:flex;flex-direction:column;gap:6px;min-width:0;position:relative;overflow:hidden}
@media (max-width:767px){.tile:last-child{grid-column:span 2}}
.tile .lab{font-size:12.5px}
.tile .v{font-family:var(--f-head);font-weight:800;font-size:clamp(22px,2vw,30px);letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.tile .v small{font-family:var(--f-body);font-weight:600;font-size:12px;color:var(--gc-muted);letter-spacing:0;margin-left:6px}
.tile .sub{font-size:12px;color:var(--gc-muted);font-family:var(--f-num);font-variant-numeric:tabular-nums}
.tile svg{width:100%;height:40px;display:block;overflow:visible}
.spark .l{fill:none;stroke:var(--gc-royal);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.spark .a{fill:var(--gc-royal);opacity:.12}
.spark .d{fill:var(--gc-cyan);stroke:var(--gc-ink);stroke-width:1.5;animation:dotp 2.4s ease-in-out infinite}
@keyframes dotp{0%,100%{opacity:1}50%{opacity:.35}}
.spark rect{fill:var(--gc-royal)}
.spark rect.last{fill:var(--gc-cyan)}
.tile.flash::after{content:"";position:absolute;inset:0;background:rgba(10,134,194,.1);animation:fade 1s ease-out forwards;pointer-events:none}
@keyframes fade{to{opacity:0}}

/* sections */
section{padding:34px 0}
.sh{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:8px 20px;margin-bottom:14px}
.sh h2{font-size:clamp(22px,2.4vw,30px)}
.sh p{color:var(--gc-muted);font-size:14px;margin-top:4px;max-width:600px}
.sh .lab{display:block;margin-bottom:6px}

/* market table */
.mk{overflow-x:auto}
table.m{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
table.m th{font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12.5px;color:var(--gc-muted);text-align:right;padding:9px 12px;border-bottom:1px solid var(--gc-line);white-space:nowrap}
table.m th:first-child,table.m td:first-child{text-align:left}
table.m td{padding:9px 12px;border-bottom:1px solid var(--gc-line);text-align:right;font-family:var(--f-num);font-variant-numeric:tabular-nums;white-space:nowrap;vertical-align:middle}
table.m tr:last-child td{border-bottom:0}
table.m tbody tr{transition:background .15s ease}
table.m tbody tr:hover{background:rgba(91,98,112,.08)}
table.m tbody tr.pulse{animation:rowp 1.2s ease-out 1}
@keyframes rowp{0%{background:rgba(10,134,194,.16)}100%{background:transparent}}
.sym{display:flex;align-items:center;gap:10px;font-family:var(--f-body)}
.sym .av{width:28px;height:28px;border-radius:50%;background:var(--gc-night);border:1px solid var(--gc-line);display:grid;place-items:center;font:800 11px var(--f-badge);color:var(--gc-cyan);flex:none}
img.av{object-fit:cover;padding:0;box-sizing:border-box}
table.m tbody tr{position:relative;cursor:pointer}
a.sym{color:inherit;text-decoration:none;border-radius:6px}
a.sym::after{content:"";position:absolute;inset:0}
a.sym:focus-visible{outline:none}
table.m tbody tr:focus-within{background:rgba(10,134,194,.08);box-shadow:inset 2px 0 0 var(--gc-cyan)}
a.sym:hover b{color:var(--gc-cyan)}
.tape a.it{text-decoration:none}.tape a.it:hover,.tape a.it:focus-visible{background:var(--gc-ink);color:#0B0D12;outline:none}
.sym b{font-weight:800;display:block;line-height:1.1}
.sym span{color:var(--gc-muted);font-size:12px}
.curve{display:inline-flex;align-items:center;gap:8px;justify-content:flex-end}
.curve i{display:block;width:72px;height:4px;border-radius:2px;background:rgba(91,98,112,.14);overflow:hidden}
.curve i b{display:block;height:100%;background:var(--gc-royal);border-radius:2px}
.curve i b.done{background:var(--gc-cyan)}
table.m svg{width:96px;height:28px;display:block;margin-left:auto}
table.m .empty td{text-align:left;color:var(--gc-muted);font-family:var(--f-body)}

/* product strip */
.prods{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--gc-line);border:1px solid var(--gc-line)}
@media (min-width:700px){.prods{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1100px){.prods{grid-template-columns:repeat(6,1fr)}}
.prod{background:var(--gc-ink);display:flex;flex-direction:column;gap:8px;padding:14px;text-decoration:none;min-width:0;transition:background .15s ease;position:relative}
.prod:hover{background:rgba(91,98,112,.08)}
.prod .top{display:flex;align-items:center;gap:8px;color:#0B0D12}
.prod .top .ic{color:var(--gc-cyan);width:18px;height:18px}
.prod h3{font-size:15px;font-weight:800;letter-spacing:-.01em}
.prod p{color:var(--gc-muted);font-size:12.5px;line-height:1.4;flex:1}
.prod .v{font-family:var(--f-head);font-weight:800;font-size:22px;letter-spacing:-.02em;line-height:1}
.prod .v small{display:block;font-family:var(--f-num);font-weight:600;font-size:11.5px;color:var(--gc-muted);letter-spacing:0;margin-top:4px;font-variant-numeric:tabular-nums}
.prod .go{position:absolute;right:12px;top:14px;color:var(--gc-muted);display:inline-flex}
.prod .go .ic{width:14px;height:14px;transition:transform .2s ease}
.prod:hover .go{color:var(--gc-cyan)}
.prod:hover .go .ic{transform:translate(2px,-2px)}
.prod .flash{animation:cflash 1.2s ease-out 1}
@keyframes cflash{0%{color:var(--gc-cyan)}100%{color:#0B0D12}}

/* stepper */
.street{display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--gc-line)}
@media (min-width:1000px){.street{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--gc-line)}
@media (min-width:1000px){.steps{border-bottom:0;border-right:1px solid var(--gc-line)}}
.steps li{border-right:1px solid var(--gc-line)}
.steps li:last-child{border-right:0}
.steps button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:8px;padding:14px 12px 16px;color:var(--gc-muted);font:600 14px var(--f-body);width:100%;box-sizing:border-box;transition:color .15s ease,background .15s ease;min-height:100%}
.steps button .n{font-family:var(--f-num);font-size:12px;color:var(--gc-muted);letter-spacing:.04em}
.steps button .ic{color:var(--gc-muted)}
.steps button:hover{color:#0B0D12;background:rgba(91,98,112,.08)}
.steps button[aria-current="step"]{color:#0B0D12;background:rgba(91,98,112,.08)}
.steps button[aria-current="step"] .ic,.steps button[aria-current="step"] .n{color:var(--gc-cyan)}
.steps button.done .n{color:var(--gc-royal)}
.steps button.done .ic{color:var(--gc-royal)}
.steps button:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:-2px}
.steps .bar{height:3px;width:100%;background:rgba(91,98,112,.14);border-radius:2px;overflow:hidden;margin-top:auto}
.steps .bar i{display:block;height:100%;width:0;background:var(--gc-chain-gradient);transition:width .4s ease}
.steps button.done .bar i,.steps button[aria-current="step"] .bar i{width:100%}
.spanel{padding:16px 18px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.spanel .lab{font-size:12.5px}
.spanel p{color:var(--gc-muted);font-size:15px;max-width:560px}
.spanel p b{color:#0B0D12;font-weight:600}
.spanel .ctas{margin-top:2px}

/* CTA + footer */
.cta{border-top:1px solid var(--gc-line);background:radial-gradient(700px 260px at 50% 110%,rgba(10,134,194,.28),transparent 70%),#FFFFFF;padding:42px 0}
.cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px}
.cta h2{font-size:clamp(26px,3.2vw,40px)}
.cta h2 em{font-style:normal;background:var(--gc-chain-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta p{color:var(--gc-muted);max-width:520px;margin-top:8px;font-size:15px}
footer{border-top:1px solid var(--gc-line);padding:22px 0;background:#FFFFFF}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center}
.tag{font-family:var(--f-tag);font-weight:600;letter-spacing:.2em;font-size:11px;color:#0B0D12;margin-top:8px;display:block;text-transform:none}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px;font-size:13.5px}
.badges{display:flex;flex-wrap:wrap;gap:12px}
.badges img{width:189px;height:56px;display:block}
footer ul a{color:var(--gc-muted);text-decoration:none}
footer ul a:hover{color:#0B0D12}
footer .copy2{font-size:12.5px;color:var(--gc-muted);width:100%;font-family:var(--f-num)}
footer .fbot{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding-top:12px;border-top:1px solid var(--gc-line)}
footer .fbot .copy2{width:auto;margin:0}
.glb{display:inline-flex;line-height:0;border-radius:8px;flex:none}
.glb img{height:32px;width:auto}
.glb:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:3px}
@media (max-width:640px){.glb img{height:26px}}
.desc{font-family:var(--f-num);font-weight:600;letter-spacing:.2em;font-size:11px;color:var(--gc-muted);text-transform:uppercase}

/* toasts */
.toasts{position:fixed;right:16px;bottom:16px;z-index:60;display:flex;flex-direction:column;gap:10px;width:min(360px,calc(100vw - 32px));pointer-events:none}
.toast{pointer-events:auto;position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;background:var(--gc-ink);border:1px solid var(--gc-line);border-radius:22px;padding:14px 14px 16px 16px;box-shadow:0 10px 30px rgba(11,13,18,0.16);animation:tin .35s cubic-bezier(.2,.8,.2,1)}
.toast.out{animation:tout .25s ease forwards}
@keyframes tin{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes tout{to{opacity:0;transform:translateY(8px)}}
.toast .ic{color:var(--gc-cyan);margin-top:1px}
.toast.warn .ic{color:var(--gc-muted)}
.toast b{display:block;font-weight:800;font-size:15px}
.toast span{display:block;color:var(--gc-muted);font-size:13px;margin-top:2px;word-break:break-word;font-family:var(--f-mono)}
.toast .x{all:unset;cursor:pointer;color:var(--gc-muted);width:24px;height:24px;display:grid;place-items:center;border-radius:50%}
.toast .x:hover{color:#0B0D12}
.toast .x:focus-visible{outline:2px solid var(--gc-cyan)}
.toast .pb{position:absolute;left:16px;right:16px;bottom:0;height:3px;border-radius:2px;background:var(--gc-cyan);transform-origin:left;animation:pb linear forwards}
@keyframes pb{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important;transition-duration:.001s!important}.toast .pb,.btn::after,.pill.live .dot{animation:none}.tape .trk{animation:none;position:static}.tape .tv{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.ln2.on,.ring.on,.ar.live,.spark .d{animation:none}}

/* ---------- part 2: term-extra.css (testnet, docs, dev portal) ---------- */
/* fixes for class names the landing reuses (pill dot vs chart dot, button arrow vs chart area) */
.pill .dot{opacity:1;stroke:none}
.btn .ar,.ic.ar{fill:none}
.skip:focus{position:fixed;left:12px;top:12px;width:auto;height:auto;clip:auto;z-index:99;background:var(--gc-cyan);color:#FFFFFF;padding:10px 14px;border-radius:var(--gc-radius-pill);font-weight:800;text-decoration:none}
.mono,code,kbd,pre{font-family:var(--f-mono)}
.hide-s{}
@media (max-width:640px){.hide-s{display:none!important}}

/* header: site tag next to the logo, drawer button (docs) */
.navl{display:flex;align-items:center;gap:10px;flex:none}
.navl .wm img{max-width:none}
@media (max-width:1599px){.nav.sub ul a span{display:none}.nav.sub ul a{padding:0 9px}}
.stag{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:var(--gc-radius-pill);background:var(--gc-ink);border:1px solid var(--gc-cyan);color:var(--gc-cyan);font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px}
.mbtn{all:unset;cursor:pointer;display:none;place-items:center;width:40px;height:40px;border-radius:10px;color:#0B0D12}
.mbtn:hover{background:var(--gc-ink)}
.mbtn:focus-visible{outline:2px solid var(--gc-cyan)}
@media (max-width:899px){.mbtn{display:grid}}
@media (max-width:420px){.stag{display:none}}
@media (max-width:480px){.nav.hasmenu .pill{display:none}}
@media (min-width:900px) and (max-width:1180px){.nav .pill{display:none}}

/* page hero (sub sites): copy left, live chart wall right */
.hero.sub{padding:22px 0 16px}
.hero.sub .copy h1{font-size:clamp(34px,3.6vw,52px)}
.hero.sub .wall .plot{min-height:210px}
.thi{width:14px!important;height:14px!important;vertical-align:-2px;margin-right:6px}
.tgl{display:inline-flex;gap:4px}
.wall .th .r{flex-wrap:wrap;justify-content:flex-end}
.wall .plot svg.main{position:absolute;left:12px;top:10px;width:calc(100% - 24px);height:calc(100% - 16px);display:block;overflow:visible}
.bar-r{fill:var(--gc-royal);transition:fill .15s ease}
.bar-r.last{fill:var(--gc-cyan)}
.bar-r.on{fill:#0B0D12}
.hbar{fill:var(--gc-royal)}
.hbar.top{fill:var(--gc-cyan)}
.empty-t{font-family:var(--f-body);font-size:13px;fill:var(--gc-muted)}

/* stat strip variants: 4 tiles */
@media (min-width:768px){.stats.n4{grid-template-columns:repeat(4,1fr)}.stats.n4 .tile:last-child{grid-column:auto}}
@media (min-width:1200px){.stats.n4{grid-template-columns:repeat(4,1fr)}}
@media (max-width:767px){.stats.n4 .tile:last-child{grid-column:auto}}

/* tabs in a terminal frame */
.tabs{background:var(--gc-ink)}
.tabbar{padding:0 6px!important;overflow-x:auto;scrollbar-width:none}
.tabbar .tl{display:flex;gap:2px}
.tabbar [role="tab"]{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;color:var(--gc-muted);font:600 14px var(--f-body);white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabbar [role="tab"] .ic{width:16px;height:16px}
.tabbar [role="tab"]:hover{color:#0B0D12}
.tabbar [role="tab"][aria-selected="true"]{color:#0B0D12;border-bottom-color:var(--gc-cyan)}
.tabbar [role="tab"][aria-selected="true"] .ic{color:var(--gc-cyan)}
.tabbar [role="tab"]:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:-4px}
.tpanel{padding:14px;min-height:120px}
.tpanel:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:-2px}
.tpanel.flush{padding:0}
.scroll{max-height:380px;overflow:auto;scrollbar-width:thin}

/* stepper: variable step count + panels */
.steps.n5{grid-template-columns:repeat(5,1fr)}
.steps.n3{grid-template-columns:repeat(3,1fr)}
.steps button .sl{display:block}
@media (max-width:560px){.steps.n5 button{padding:12px 6px 14px;font-size:12.5px}.steps.n5 .sl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
.spanels{min-width:0}
.spanel h3{font-size:19px;letter-spacing:-.01em}
.spanel .code,.spanel .cmd{max-width:640px}
.snav{margin-top:4px}

/* code, commands, copy */
.cbtn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 9px;border:1px solid var(--gc-line);border-radius:var(--gc-radius-pill);color:var(--gc-muted);font:600 12px var(--f-body);white-space:nowrap;flex:none}
.cbtn .ic{width:13px;height:13px}
.cbtn:hover{color:#0B0D12;border-color:var(--gc-electric)}
.cbtn:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:2px}
.cbtn.ok{color:var(--gc-cyan);border-color:var(--gc-cyan)}
.code{border:1px solid var(--gc-line);background:var(--gc-night);border-radius:12px;overflow:hidden;margin:12px 0}
.code-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px 6px 12px;border-bottom:1px solid var(--gc-line);font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:11.5px;color:var(--gc-muted)}
.code pre{margin:0;padding:12px 14px;overflow-x:auto;font-size:13px;line-height:1.55;color:#0B0D12}
.code pre:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:-2px}
.code .c{color:var(--gc-muted)}
.cmd{display:flex;align-items:center;gap:8px;min-width:0;border:1px solid var(--gc-line);background:var(--gc-night);border-radius:10px;padding:6px 6px 6px 12px;margin:8px 0}
.cmd code{flex:1;min-width:0;overflow-x:auto;white-space:nowrap;font-size:13px;color:#0B0D12;scrollbar-width:none}
.addr{display:inline-flex;align-items:center;gap:8px;max-width:100%}
.addr a{color:#0B0D12;text-decoration:none;font-size:12.5px;overflow:hidden;text-overflow:ellipsis}
.addr a:hover{color:var(--gc-cyan);text-decoration:underline}

/* key/value and data tables */
table.kv{width:100%;border-collapse:collapse;font-size:14px}
table.kv th,table.kv td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--gc-line);vertical-align:middle}
table.kv tr:last-child th,table.kv tr:last-child td{border-bottom:0}
table.kv th{font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:var(--gc-muted);white-space:nowrap;width:1%}
table.kv td{color:#0B0D12;word-break:break-word}
table.kv td .cbtn{margin-left:8px;vertical-align:middle}
table.kv a{color:#0B0D12}
table.kv a:hover{color:var(--gc-cyan)}
table.m td.l,table.m th.l{text-align:left}
table.m .grp th{text-align:left;color:var(--gc-cyan);background:var(--gc-night);position:sticky;top:0;z-index:1}
table.m thead th{position:sticky;top:0;background:var(--gc-ink);z-index:2}
table.m td .spk{width:96px;height:24px;display:inline-block;vertical-align:middle}
table.m td .spk-n{display:inline-block;min-width:22px;text-align:right;color:var(--gc-muted);margin-left:6px}
table.m a{color:#0B0D12;text-decoration:none}
table.m a:hover{color:var(--gc-cyan);text-decoration:underline}

/* two columns inside a tab */
.cols{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:1000px){.cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.panelc{border:1px solid var(--gc-line);background:var(--gc-night);min-width:0}
.panelc .ph{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-bottom:1px solid var(--gc-line)}
.panelc .ph .lab{font-size:12.5px}
.panelc .pb{padding:10px 12px}
.panelc .mini{position:relative;height:150px}
.panelc .mini.tall{height:250px}
.panelc .mini svg.main{position:absolute;left:8px;top:8px;width:calc(100% - 16px);height:calc(100% - 12px);overflow:visible}

/* service status list: icon + label, never colour alone */
.svc{list-style:none;margin:0;padding:0}
.svc li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:8px 12px;border-bottom:1px solid var(--gc-line);font-size:13.5px}
.svc li:last-child{border-bottom:0}
.svc b{font-weight:800}
.svc .d{grid-column:1/-1;color:var(--gc-muted);font-size:12.5px}
.svc .d a{color:var(--gc-muted)}
.st{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:var(--gc-radius-pill);font:800 11px var(--f-badge);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border:1px solid var(--gc-line);color:var(--gc-muted)}
.st .ic{width:12px;height:12px}
.st.live{background:var(--gc-green);border-color:var(--gc-green);color:#FFFFFF}
.st.beta,.st.next{background:var(--gc-ink);border-color:var(--gc-blue);color:#0B0D12}
.st.wip,.st.wait,.st.soon{color:#0B0D12}
.st.down{background:var(--down);border-color:var(--down);color:#FFFFFF}

/* FAQ */
.faq{display:grid;grid-template-columns:1fr;gap:0}
@media (min-width:1000px){.faq{grid-template-columns:1fr 1fr;column-gap:24px}}
.faq details{border-bottom:1px solid var(--gc-line)}
.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;min-height:44px;font-weight:800;font-size:14.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:16px;height:16px;color:var(--gc-cyan);transition:transform .2s ease;flex:none}
.faq details[open] summary .ic{transform:rotate(90deg)}
.faq summary:focus-visible{outline:2px solid var(--gc-cyan);outline-offset:2px}
.faq p{color:var(--gc-muted);font-size:14px;padding:0 0 12px 26px}

/* tool / product grid (landing .prods), 4 per row */
.prods.p4{grid-template-columns:repeat(1,1fr)}
@media (min-width:600px){.prods.p4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.prods.p4{grid-template-columns:repeat(4,1fr)}}
.prod .st{position:absolute;right:12px;top:12px}
.prod .host{font-family:var(--f-mono);font-size:11.5px;color:var(--gc-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prods.flat{border:0}

/* prose (dev subpages) */
.prose{max-width:820px}
.prose h2{font-size:clamp(20px,2vw,26px);margin:26px 0 8px}
.prose h3{font-size:17px;margin:18px 0 6px}
.prose p,.prose li{color:var(--gc-muted);font-size:15px;line-height:1.6}
.prose p{margin:8px 0}
.prose strong,.prose b{color:#0B0D12}
.prose a{color:var(--gc-cyan)}
.prose code{font-size:.9em;color:#0B0D12;background:var(--gc-night);border:1px solid var(--gc-line);border-radius:6px;padding:1px 5px}
.prose pre code{background:none;border:0;padding:0}
.prose ul{padding-left:20px}
.prose table{width:100%;border-collapse:collapse;font-size:14px}
.prose th,.prose td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--gc-line);vertical-align:top}
.prose th{color:#0B0D12}
.tbl{overflow-x:auto;border:1px solid var(--gc-line);margin:12px 0}
.callout{border:1px solid var(--gc-line);border-left:3px solid var(--gc-cyan);background:var(--gc-ink);border-radius:0 12px 12px 0;padding:10px 14px;margin:14px 0}
.callout .ct{font-family:var(--f-badge);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:var(--gc-cyan);margin:0 0 4px;display:flex;align-items:center;gap:6px}
.callout .ct .ic{width:14px;height:14px}
.callout.warning{border-left-color:var(--down)}.callout.warning .ct{color:var(--down)}
.callout.soon{border-left-color:var(--gc-blue)}.callout.soon .ct{color:#0B0D12}
.callout.live{border-left-color:var(--gc-green)}.callout.live .ct{color:var(--gc-green)}
.callout p{margin:4px 0}

/* footer: official channels */
footer ul.soc{gap:8px;width:100%}
footer ul.soc a{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid var(--gc-line);border-radius:var(--gc-radius-pill);color:var(--gc-muted);font-weight:600;font-size:13px;transition:color .15s ease,border-color .15s ease}
footer ul.soc a .ic{width:15px;height:15px}
footer ul.soc a:hover{color:#0B0D12;border-color:var(--gc-electric)}
footer ul.soc a:hover .ic{color:var(--gc-cyan)}

/* section rhythm for compact pages */
section.tight{padding:22px 0}
.page-h{padding:24px 0 6px}
.page-h h1{font-size:clamp(30px,3.2vw,44px)}
.page-h h1 em{font-style:normal;color:var(--gc-cyan)}
.page-h p{color:var(--gc-muted);max-width:640px;margin-top:8px;font-size:15.5px}
.note{color:var(--gc-muted);font-size:13px;margin-top:10px}
.note a{color:var(--gc-cyan)}
.note code{font-size:12px;color:#0B0D12}
@media (prefers-reduced-motion:reduce){.faq summary .ic{transition:none}}
/* GullyChain product switcher (sites/_shared/gc-switcher) at the left of the header */
gc-switcher{flex:none;min-height:40px}

/* chain logos (design/chains pack via chain-icon.mjs): 16/20/24 px, name always written next to the mark */
.chn{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;white-space:nowrap;line-height:1.2}
.chn-ic{flex:none;display:inline-block;vertical-align:-3px;border-radius:50%}
.chn-tn{font:600 9.5px/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:#7A4A00;border:1px solid rgba(245,165,36,.45);border-radius:9999px;padding:2px 6px}

/*!
 * Gully Terminal design system: components. gully-labs/gully-ops design/terminal/components.css
 * Needs tokens.css first. Every class is prefixed t- so it can sit next to an app's own CSS without collisions.
 * Layout primitives: t-topbar (+ t-switch product switcher), t-hero, t-kpis, t-section, t-panel, t-table,
 * t-features, t-pricing, t-faq, t-steps, t-ticker, t-uptime, t-footer (+ t-badge). Charts: t-chart (chart-kit.js).
 */

/* =============================== base (opt in with class="t-body" on <body>) =============================== */
.t-body { margin: 0; background: var(--t-bg); color: var(--t-text); font: 400 var(--t-fs-base)/var(--t-lh) var(--t-font-sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; text-rendering: optimizeLegibility; }
.t-body *, .t-body *::before, .t-body *::after { box-sizing: border-box; }
.t-body h1, .t-body h2, .t-body h3, .t-body h4 { margin: 0; font-family: var(--t-font-sans); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; color: var(--t-text); }
.t-body p { margin: 0; }
.t-body a { color: inherit; }
.t-body img, .t-body svg { max-width: 100%; }
.t-body :focus-visible { outline: 2px solid var(--t-accent); outline-offset: 2px; border-radius: var(--t-r-sm); }
.t-body ::selection { background: var(--t-accent); color: var(--t-on-accent); }
.t-wrap { width: 100%; max-width: calc(var(--t-maxw) + 2 * var(--t-gutter)); margin: 0 auto; padding: 0 var(--t-gutter); }
.t-mono, .t-num { font-family: var(--t-font-mono); font-variant-numeric: tabular-nums; letter-spacing: 0; }
.t-label { font: 500 var(--t-fs-2xs)/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); color: var(--t-muted); }
.t-label--accent { color: var(--t-accent); }
.t-muted { color: var(--t-muted); }
.t-up { color: var(--t-up); } .t-down { color: var(--t-down); }
.t-accent { color: var(--t-accent); }
.t-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.t-skip { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--t-accent); color: var(--t-on-accent); padding: 8px 12px; border-radius: var(--t-r); font-weight: 600; }
.t-skip:focus { top: 8px; }
.t-ic { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.t-link { color: var(--t-accent); text-decoration: none; border-bottom: 1px solid var(--t-accent-line); }
.t-link:hover { border-bottom-color: var(--t-accent); }
.t-code { font: 500 var(--t-fs-sm)/1.4 var(--t-font-mono); color: var(--t-text); background: var(--t-surface); border: 1px solid var(--t-line); border-radius: var(--t-r-sm); padding: 2px 6px; white-space: nowrap; }

/* motifs: use as accents only (one per view) */
.t-grid-bg { background-image: linear-gradient(var(--t-grid) 1px, transparent 1px), linear-gradient(90deg, var(--t-grid) 1px, transparent 1px); background-size: 32px 32px; background-position: -1px -1px; }
.t-scan { position: relative; }
.t-scan::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(11,13,18,.018) 0 1px, transparent 1px 3px); }
.t-cursor::after { content: ""; display: inline-block; width: .55em; height: 1em; margin-left: 3px; vertical-align: -.12em; background: var(--t-accent); animation: t-blink 1.1s steps(1) infinite; }
@keyframes t-blink { 50% { opacity: 0; } }

/* reveal on scroll (chart-kit.js adds .is-in; without JS everything is visible) */
.t-js [data-t-reveal] { opacity: 0; transform: translateY(8px); transition: opacity .5s var(--t-ease), transform .5s var(--t-ease); }
.t-js [data-t-reveal].is-in { opacity: 1; transform: none; }

/* =============================== buttons, pills, tags =============================== */
.t-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: var(--t-r); border: 1px solid var(--t-line-strong); background: transparent; color: var(--t-text); font: 600 14px/1 var(--t-font-sans); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background var(--t-dur) ease, border-color var(--t-dur) ease, color var(--t-dur) ease, transform .1s ease; }
.t-btn:hover { border-color: var(--t-accent); }
.t-btn:active { transform: translateY(1px); }
.t-btn .t-ic { width: 16px; height: 16px; }
.t-btn .t-ar { transition: transform var(--t-dur) var(--t-ease); }
.t-btn:hover .t-ar { transform: translateX(3px); }
.t-btn--primary { background: var(--t-accent); border-color: var(--t-accent); color: var(--t-on-accent); }
.t-btn--primary:hover { background: color-mix(in srgb, var(--t-accent), #fff 14%); border-color: color-mix(in srgb, var(--t-accent), #fff 14%); }
.t-btn--quiet { border-color: transparent; color: var(--t-muted); }
.t-btn--quiet:hover { color: var(--t-text); border-color: var(--t-line); }
.t-btn--sm { min-height: 32px; padding: 0 12px; font-size: 13px; }
.t-btn--xs { min-height: 26px; padding: 0 8px; font: 500 12px/1 var(--t-font-mono); }
.t-btn.is-ok { border-color: var(--t-up); color: var(--t-up); }

.t-pill { display: inline-flex; align-items: center; gap: 8px; height: 28px; padding: 0 10px; border: 1px solid var(--t-line); border-radius: var(--t-r-pill); font: 500 12px/1 var(--t-font-mono); color: var(--t-muted); white-space: nowrap; text-decoration: none; }
.t-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--t-idle); flex: none; }
.t-pill.is-live, .t-dot.is-live { color: var(--t-text); }
.is-live > .t-dot, .t-dot.is-live { background: var(--t-up); box-shadow: 0 0 0 0 color-mix(in srgb, var(--t-up) 50%, transparent); animation: t-breathe 2.4s ease-in-out infinite; }
.is-down > .t-dot, .t-dot.is-down { background: var(--t-down); }
.is-warn > .t-dot, .t-dot.is-warn { background: var(--t-warn); }
.t-pill.is-down { color: var(--t-down); border-color: color-mix(in srgb, var(--t-down) 40%, transparent); }
@keyframes t-breathe { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--t-up) 45%, transparent); } 50% { box-shadow: 0 0 0 5px transparent; } }
.t-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border: 1px solid var(--t-line-strong); border-radius: var(--t-r-sm); font: 500 10.5px/1 var(--t-font-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--t-muted); white-space: nowrap; }
.t-tag--live { color: var(--t-up); border-color: color-mix(in srgb, var(--t-up) 45%, transparent); }
.t-tag--new { color: var(--t-accent); border-color: var(--t-accent-line); }
.t-tag--soon { color: var(--t-warn); border-color: color-mix(in srgb, var(--t-warn) 40%, transparent); }

/* =============================== top bar + product switcher =============================== */
.t-topbar { position: sticky; top: 0; z-index: 40; background: color-mix(in srgb, var(--t-bg) 88%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--t-line); }
.t-topbar > .t-wrap { display: flex; align-items: center; gap: 16px; height: var(--t-topbar-h); }
.t-brand { display: inline-flex; align-items: center; gap: 10px; flex: none; text-decoration: none; color: var(--t-text); font-weight: 700; }
.t-brand img { display: block; height: 28px; width: auto; }
@media (max-width: 640px) { .t-brand img { height: 24px; } }
.t-nav { display: none; align-items: center; gap: 2px; margin-left: 8px; min-width: 0; }
.t-nav a { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 10px; border-radius: var(--t-r); color: var(--t-muted); text-decoration: none; font-size: 14px; font-weight: 500; white-space: nowrap; transition: color var(--t-dur), background var(--t-dur); }
.t-nav a .t-ic { width: 16px; height: 16px; }
.t-nav a:hover, .t-nav a[aria-current] { color: var(--t-text); background: var(--t-surface); }
.t-nav a[aria-current] .t-ic { color: var(--t-accent); }
@media (min-width: 960px) { .t-nav { display: flex; } }
.t-topbar-r { margin-left: auto; display: flex; align-items: center; gap: 8px; flex: none; }
@media (max-width: 520px) { .t-topbar-r .t-pill span:not(.t-dot) { display: none; } .t-topbar-r .t-pill { width: 28px; padding: 0; justify-content: center; } }

/* product switcher: <details class="t-switch"> (no JS); menu items for every Gully product */
.t-switch { position: relative; flex: none; }
.t-switch > summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px; border: 1px solid var(--t-line); border-radius: var(--t-r); color: var(--t-muted); font: 500 12px/1 var(--t-font-mono); cursor: pointer; user-select: none; }
.t-switch > summary::-webkit-details-marker { display: none; }
.t-switch > summary:hover, .t-switch[open] > summary { color: var(--t-text); border-color: var(--t-line-strong); }
.t-switch > summary .t-ic { width: 14px; height: 14px; }
.t-switch-menu { position: absolute; left: 0; top: calc(100% + 8px); z-index: 50; width: min(560px, calc(100vw - 2 * var(--t-gutter))); display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--t-line); border: 1px solid var(--t-line-strong); border-radius: var(--t-r); overflow: hidden; box-shadow: 0 16px 40px rgba(11,13,18,0.16); }
.t-switch-menu a { display: grid; grid-template-columns: 10px 1fr; gap: 2px 10px; align-items: center; padding: 12px 14px; background: var(--t-bg); text-decoration: none; color: var(--t-text); }
.t-switch-menu a:hover, .t-switch-menu a:focus-visible { background: var(--t-surface-2); outline: none; }
.t-switch-menu a i { width: 8px; height: 8px; border-radius: 2px; background: var(--c, var(--t-muted)); }
.t-switch-menu a b { font-weight: 600; font-size: 14px; }
.t-switch-menu a span { grid-column: 2; color: var(--t-muted); font-size: 12px; }
.t-switch-menu a[aria-current] { box-shadow: inset 2px 0 0 var(--t-accent); }
.t-switch-menu .t-switch-foot { grid-column: 1 / -1; padding: 10px 14px; background: var(--t-surface); color: var(--t-muted); font: 500 11px/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); }
@media (max-width: 640px) { .t-switch-menu { position: fixed; left: var(--t-gutter); right: var(--t-gutter); top: calc(var(--t-topbar-h) + 4px); width: auto; grid-template-columns: 1fr; max-height: calc(100vh - 80px); overflow: auto; } }
/* The menu is a <nav> inside the site header, so a broad site rule like `.nav nav { display:flex }` used to squeeze it
   into one row (2026-10-28, gullystudio.xyz). These selectors outrank that: the menu is always a two-column grid. */
.t-switch > .t-switch-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); flex: none; justify-content: stretch; align-items: stretch; width: min(620px, calc(100vw - 2 * var(--t-gutter))); min-width: 0; }
.t-switch > .t-switch-menu .t-switch-head { grid-column: 1 / -1; padding: 10px 16px; background: var(--t-surface); color: var(--t-muted); font: 500 11px/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); }
.t-switch > .t-switch-menu a { grid-template-columns: 10px minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 14px 16px; min-height: 68px; transition: background .12s ease; }
.t-switch > .t-switch-menu a b { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t-switch > .t-switch-menu a span { grid-column: 2 / -1; min-width: 0; line-height: 1.4; }
.t-switch > .t-switch-menu a em { grid-column: 3; grid-row: 1; font: 600 10px/1 var(--t-font-mono); font-style: normal; text-transform: uppercase; letter-spacing: var(--t-track-label); color: var(--t-accent); padding: 4px 6px; border: 1px solid var(--t-line-strong); border-radius: var(--t-r); }
.t-switch > .t-switch-menu a .t-switch-out { grid-column: 3; grid-row: 1; width: 14px; height: 14px; color: var(--t-muted); opacity: 0; transition: opacity .12s ease; }
.t-switch > .t-switch-menu a:hover .t-switch-out, .t-switch > .t-switch-menu a:focus-visible .t-switch-out { opacity: 1; }
.t-switch > .t-switch-menu a:hover b, .t-switch > .t-switch-menu a:focus-visible b { color: var(--c, var(--t-text)); }
.t-switch > .t-switch-menu a[aria-current] { background: var(--t-surface); box-shadow: inset 3px 0 0 var(--c, var(--t-accent)); }
@media (max-width: 640px) { .t-switch > .t-switch-menu { grid-template-columns: 1fr; width: auto; } }

/* mobile menu: <details class="t-menu"> holding a copy of the nav links */
.t-menu { display: block; }
.t-menu > summary { list-style: none; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--t-line); border-radius: var(--t-r); cursor: pointer; color: var(--t-text); }
.t-menu > summary::-webkit-details-marker { display: none; }
.t-menu-panel { position: fixed; left: 0; right: 0; top: var(--t-topbar-h); bottom: 0; z-index: 45; overflow: auto; background: var(--t-bg); border-top: 1px solid var(--t-line); padding: 8px var(--t-gutter) 24px; }
.t-menu-panel a { display: flex; align-items: center; gap: 10px; min-height: 48px; border-bottom: 1px solid var(--t-line); color: var(--t-text); text-decoration: none; font-weight: 500; }
.t-menu-panel a .t-ic { color: var(--t-accent); }
@media (min-width: 960px) { .t-menu { display: none; } }

/* =============================== hero =============================== */
.t-hero { position: relative; padding: var(--t-8) 0 var(--t-6); border-bottom: 1px solid var(--t-line); }
.t-hero > .t-wrap { display: grid; gap: var(--t-6); align-items: center; }
@media (min-width: 1000px) { .t-hero > .t-wrap { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--t-7); } }
.t-hero.t-grid-bg { background-position: center top; }
.t-eyebrow { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; font: 500 var(--t-fs-2xs)/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); color: var(--t-muted); text-decoration: none; }
.t-eyebrow b { color: var(--t-accent); font-weight: 500; }
.t-h1 { font-size: var(--t-fs-3xl); font-weight: 700; letter-spacing: -.03em; line-height: 1.02; margin-top: var(--t-4) !important; }
.t-h1 em { font-style: normal; color: var(--t-accent); }
.t-lede { margin-top: var(--t-4) !important; max-width: 560px; color: var(--t-muted); font-size: var(--t-fs-md); line-height: 1.55; }
.t-lede b { color: var(--t-text); font-weight: 600; }
.t-cta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--t-5); }
.t-kv { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: var(--t-5); }
.t-kv > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.t-kv code { font: 500 var(--t-fs-sm)/1.3 var(--t-font-mono); color: var(--t-text); word-break: break-all; }

/* =============================== panel (the terminal window) =============================== */
.t-panel { position: relative; border: 1px solid var(--t-line); border-radius: var(--t-r); background: var(--t-surface); min-width: 0; }
.t-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; padding: 8px 14px; border-bottom: 1px solid var(--t-line); }
.t-panel-head .t-label { display: inline-flex; align-items: center; gap: 8px; }
.t-panel-head .t-label .t-ic { width: 14px; height: 14px; color: var(--t-accent); }
.t-panel-head .t-right { display: flex; align-items: center; gap: 8px; }
.t-panel-body { padding: 14px; }
.t-panel-foot { padding: 8px 14px; border-top: 1px solid var(--t-line); font: 400 var(--t-fs-xs)/1.4 var(--t-font-mono); color: var(--t-faint); }
.t-panel.is-off .t-panel-body { opacity: .7; }
.t-readout { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.t-readout b { font: 600 var(--t-fs-2xl)/1 var(--t-font-mono); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.t-readout span { color: var(--t-muted); font-size: var(--t-fs-sm); }
.t-seg { display: inline-flex; border: 1px solid var(--t-line); border-radius: var(--t-r); overflow: hidden; }
.t-seg button { all: unset; cursor: pointer; padding: 0 10px; height: 26px; display: inline-flex; align-items: center; font: 500 12px/1 var(--t-font-mono); color: var(--t-muted); border-right: 1px solid var(--t-line); }
.t-seg button:last-child { border-right: 0; }
.t-seg button[aria-pressed="true"] { color: var(--t-on-accent); background: var(--t-accent); }
.t-seg button:focus-visible { outline: 2px solid var(--t-accent); outline-offset: -2px; }

/* =============================== KPI strip =============================== */
.t-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--t-line); border: 1px solid var(--t-line); border-radius: var(--t-r); overflow: hidden; }
@media (min-width: 768px) { .t-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .t-kpis { grid-template-columns: repeat(var(--t-kpi-cols, 6), minmax(0, 1fr)); } }
.t-kpi { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 12px; background: var(--t-bg); min-width: 0; overflow: hidden; }
.t-kpi .t-label { display: flex; align-items: center; gap: 6px; }
.t-kpi .t-label .t-ic { width: 13px; height: 13px; }
.t-kpi-v { font: 600 clamp(22px, 2vw, 28px)/1.05 var(--t-font-mono); letter-spacing: -.03em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t-kpi-v small { font: 400 12px/1 var(--t-font-mono); color: var(--t-muted); letter-spacing: 0; margin-left: 6px; }
.t-kpi-d { font: 500 12px/1.2 var(--t-font-mono); }
.t-kpi-s { font: 400 11.5px/1.35 var(--t-font-mono); color: var(--t-faint); }
.t-kpi svg { display: block; width: 100%; height: 32px; overflow: visible; }
.t-kpi.is-flash::after { content: ""; position: absolute; inset: 0; background: var(--t-accent-soft); animation: t-fade 1s ease-out forwards; pointer-events: none; }
@keyframes t-fade { to { opacity: 0; } }

/* =============================== section =============================== */
.t-section { padding: var(--t-9) 0; border-bottom: 1px solid var(--t-line); }
.t-section--tight { padding: var(--t-7) 0; }
.t-section-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px 32px; margin-bottom: var(--t-5); }
.t-section-head > div { max-width: 720px; }
.t-section-head .t-label { display: inline-flex; align-items: center; gap: 8px; }
.t-section-head .t-label::before { content: ""; width: 14px; height: 1px; background: var(--t-accent); }
.t-h2 { font-size: var(--t-fs-xl); margin-top: 10px !important; }
.t-intro { margin-top: 8px !important; color: var(--t-muted); max-width: 640px; }
.t-grid-2 { display: grid; gap: var(--t-4); }
@media (min-width: 1000px) { .t-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.t-grid-3 { display: grid; gap: var(--t-4); }
@media (min-width: 900px) { .t-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* =============================== data table =============================== */
.t-table-wrap { overflow-x: auto; border: 1px solid var(--t-line); border-radius: var(--t-r); }
.t-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.t-table th { text-align: left; padding: 10px 14px; font: 500 var(--t-fs-2xs)/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); color: var(--t-muted); border-bottom: 1px solid var(--t-line); white-space: nowrap; background: var(--t-surface); }
.t-table td { padding: 10px 14px; border-bottom: 1px solid var(--t-line); vertical-align: middle; }
.t-table tr:last-child td { border-bottom: 0; }
.t-table tbody tr { transition: background var(--t-dur); }
.t-table tbody tr:hover { background: var(--t-surface); }
.t-table .r, .t-table td.t-num, .t-table th.r { text-align: right; }
.t-table td.t-num { font-family: var(--t-font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.t-table .t-empty td { color: var(--t-muted); }
.t-table tr.is-new { animation: t-row 1.2s ease-out 1; }
@keyframes t-row { from { background: var(--t-accent-soft); } to { background: transparent; } }

/* =============================== feature grid =============================== */
.t-features { display: grid; grid-template-columns: 1fr; gap: 1px; background: var(--t-line); border: 1px solid var(--t-line); border-radius: var(--t-r); overflow: hidden; }
@media (min-width: 640px) { .t-features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .t-features { grid-template-columns: repeat(var(--t-feat-cols, 3), minmax(0, 1fr)); } }
.t-feature { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 20px; background: var(--t-bg); min-width: 0; text-decoration: none; color: inherit; transition: background var(--t-dur); }
a.t-feature:hover { background: var(--t-surface); }
.t-feature-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.t-feature-ic { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--t-line-strong); border-radius: var(--t-r); color: var(--t-accent); }
.t-feature h3 { font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.t-feature p { color: var(--t-muted); font-size: 14px; line-height: 1.5; }
.t-feature .t-meta { margin-top: auto; padding-top: 6px; font: 400 12px/1.3 var(--t-font-mono); color: var(--t-faint); }
a.t-feature .t-go { position: absolute; right: 16px; bottom: 16px; color: var(--t-faint); transition: color var(--t-dur), transform var(--t-dur); }
a.t-feature:hover .t-go { color: var(--t-accent); transform: translate(2px, -2px); }

/* =============================== pricing =============================== */
.t-pricing { display: grid; gap: 1px; background: var(--t-line); border: 1px solid var(--t-line); border-radius: var(--t-r); overflow: hidden; }
@media (min-width: 900px) { .t-pricing { grid-template-columns: repeat(var(--t-plans, 3), minmax(0, 1fr)); } }
.t-plan { display: flex; flex-direction: column; gap: 14px; padding: 24px; background: var(--t-bg); position: relative; }
.t-plan--featured { background: var(--t-surface); box-shadow: inset 0 2px 0 var(--t-accent); }
.t-plan-price { font: 600 34px/1 var(--t-font-mono); letter-spacing: -.03em; }
.t-plan-price small { font: 400 13px/1 var(--t-font-mono); color: var(--t-muted); margin-left: 4px; letter-spacing: 0; }
.t-plan ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 14px; color: var(--t-muted); }
.t-plan li { display: grid; grid-template-columns: 16px 1fr; gap: 8px; }
.t-plan li::before { content: ""; width: 8px; height: 1px; margin-top: .75em; background: var(--t-accent); }
.t-plan .t-btn { margin-top: auto; }

/* =============================== FAQ =============================== */
.t-faq { border-top: 1px solid var(--t-line); }
.t-faq details { border-bottom: 1px solid var(--t-line); }
.t-faq summary { list-style: none; display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; cursor: pointer; font-weight: 600; }
.t-faq summary::-webkit-details-marker { display: none; }
.t-faq summary::after { content: "+"; font: 400 18px/1 var(--t-font-mono); color: var(--t-accent); transition: transform var(--t-dur); }
.t-faq details[open] summary::after { transform: rotate(45deg); }
.t-faq details > div { padding: 0 0 18px; color: var(--t-muted); max-width: 760px; }

/* =============================== stepper =============================== */
.t-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; border: 1px solid var(--t-line); border-radius: var(--t-r); overflow: hidden; counter-reset: t-step; }
@media (min-width: 800px) { .t-steps { grid-template-columns: repeat(var(--t-step-cols, 4), minmax(0, 1fr)); } }
.t-steps li { counter-increment: t-step; padding: 18px; border-bottom: 1px solid var(--t-line); display: flex; flex-direction: column; gap: 6px; }
@media (min-width: 800px) { .t-steps li { border-bottom: 0; border-right: 1px solid var(--t-line); } .t-steps li:last-child { border-right: 0; } }
.t-steps li::before { content: counter(t-step, decimal-leading-zero); font: 500 12px/1 var(--t-font-mono); color: var(--t-accent); }
.t-steps b { font-weight: 600; }
.t-steps span { color: var(--t-muted); font-size: 14px; }

/* =============================== ticker (marquee) =============================== */
.t-ticker { display: flex; align-items: stretch; height: 34px; border-bottom: 1px solid var(--t-line); background: var(--t-bg); overflow: hidden; font: 400 12.5px/1 var(--t-font-mono); }
.t-ticker-lb { display: flex; align-items: center; gap: 8px; padding: 0 12px; border-right: 1px solid var(--t-line); color: var(--t-text); flex: none; text-transform: uppercase; letter-spacing: .08em; font-size: 11px; text-decoration: none; }
.t-ticker-v { position: relative; flex: 1; min-width: 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.t-ticker-trk { position: absolute; left: 0; top: 0; height: 100%; display: flex; white-space: nowrap; animation: t-tape var(--t-tape-dur, 60s) linear infinite; will-change: transform; }
.t-ticker:hover .t-ticker-trk, .t-ticker:focus-within .t-ticker-trk { animation-play-state: paused; }
@keyframes t-tape { to { transform: translateX(-50%); } }
.t-ticker-it { display: inline-flex; align-items: center; gap: 8px; padding: 0 18px; color: var(--t-muted); border-right: 1px solid var(--t-line); text-decoration: none; }
.t-ticker-it b { color: var(--t-text); font-weight: 500; }
a.t-ticker-it:hover { color: var(--t-text); background: var(--t-surface); }

/* =============================== uptime strip =============================== */
.t-uptime { display: grid; gap: 0; }
.t-uptime-row { display: grid; grid-template-columns: minmax(110px, 1.2fr) minmax(0, 3fr) auto; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--t-line); text-decoration: none; color: inherit; }
.t-uptime-row:last-child { border-bottom: 0; }
.t-uptime-row .n { display: flex; align-items: center; gap: 8px; font-size: 13.5px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t-uptime-row .ms { font: 500 12px/1 var(--t-font-mono); color: var(--t-muted); text-align: right; min-width: 56px; }
.t-uptime-cells { display: flex; gap: 2px; height: 18px; min-width: 0; }
.t-uptime-cells i { flex: 1; min-width: 2px; border-radius: 1px; background: var(--t-up); opacity: .85; transform-origin: bottom; }
.t-uptime-cells i.d { background: var(--t-down); opacity: 1; }
.t-uptime-cells i.n { background: var(--t-line-strong); opacity: .6; }
a.t-uptime-row:hover .n { color: var(--t-accent); }
@media (max-width: 520px) { .t-uptime-row { grid-template-columns: minmax(0, 1fr) auto; } .t-uptime-cells { grid-column: 1 / -1; grid-row: 2; } }

/* =============================== charts (chart-kit.js) =============================== */
.t-chart { position: relative; min-height: var(--t-chart-h, 180px); }
.t-chart > svg.t-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; }
.t-svg .gl { stroke: var(--t-grid); stroke-width: 1; }
.t-svg .ax { stroke: var(--t-line-strong); stroke-width: 1; }
.t-svg .at { font: 400 10.5px var(--t-font-mono); fill: var(--t-faint); font-variant-numeric: tabular-nums; }
.t-svg .ln { fill: none; stroke: var(--t-accent); stroke-width: 1.75; stroke-linejoin: round; stroke-linecap: round; }
.t-svg .ln2 { fill: none; stroke: var(--t-text); stroke-width: 2; stroke-linecap: round; opacity: 0; }
.t-svg .ln2.on { opacity: .55; animation: t-sweep 5s linear infinite; }
@keyframes t-sweep { from { stroke-dashoffset: var(--L2); } to { stroke-dashoffset: 0; } }
.t-svg .ar.live { animation: t-wash 7s ease-in-out infinite; }
@keyframes t-wash { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.t-svg .xh { stroke: var(--t-muted); stroke-width: 1; stroke-dasharray: 2 3; opacity: 0; }
.t-svg .hit, .t-svg .hitb { fill: transparent; cursor: crosshair; }
.t-svg .hitb:focus-visible, .t-svg .hit:focus-visible { outline: none; stroke: var(--t-accent); stroke-width: 1; }
.t-svg .dot { fill: var(--t-accent); stroke: var(--t-bg); stroke-width: 2; opacity: 0; }
.t-svg .end { fill: var(--t-accent); stroke: var(--t-bg); stroke-width: 2; }
.t-svg .ring, .t-svg .pulse { fill: none; stroke: var(--t-accent); stroke-width: 1.5; opacity: 0; transform-box: fill-box; transform-origin: center; }
.t-svg .ring.on { animation: t-ring 2.2s ease-out infinite; }
.t-svg .pulse.go { animation: t-ring 1.4s ease-out 1; }
@keyframes t-ring { 0% { opacity: .8; transform: scale(.5); } 100% { opacity: 0; transform: scale(3.2); } }
.t-svg .slide { transition: transform .5s var(--t-ease); }
.t-svg .bar-r { fill: color-mix(in srgb, var(--t-accent) 55%, transparent); transition: fill var(--t-dur); }
.t-svg .bar-r.last, .t-svg .bar-r.on { fill: var(--t-accent); }
.t-svg .sg { transition: opacity var(--t-dur); }
.t-svg .s-0 { fill: var(--t-s1); } .t-svg .s-1 { fill: var(--t-s2); } .t-svg .s-2 { fill: var(--t-s3); } .t-svg .s-3 { fill: var(--t-s4); } .t-svg .s-4 { fill: var(--t-s5); }
.t-svg .trk { fill: none; stroke: var(--t-line); }
.t-svg .arc { fill: none; stroke: var(--t-accent); stroke-linecap: butt; }
.t-svg .arc.s-1 { stroke: var(--t-s2); } .t-svg .arc.s-2 { stroke: var(--t-s3); } .t-svg .arc.s-3 { stroke: var(--t-s4); } .t-svg .arc.s-4 { stroke: var(--t-s5); }
.t-svg .cv { font: 600 22px var(--t-font-mono); fill: var(--t-text); letter-spacing: -.02em; }
.t-svg .cl { font: 400 10.5px var(--t-font-mono); fill: var(--t-muted); text-transform: uppercase; letter-spacing: .1em; }
.t-svg .empty-t { font: 400 12.5px var(--t-font-mono); fill: var(--t-muted); }
.t-spark { display: block; width: 100%; height: 32px; overflow: visible; }
.t-spark .l { fill: none; stroke: var(--t-accent); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.t-spark .a { fill: var(--t-accent); opacity: .1; }
.t-spark .d { fill: var(--t-accent); stroke: var(--t-bg); stroke-width: 1.5; }
.t-spark rect { fill: color-mix(in srgb, var(--t-accent) 50%, transparent); }
.t-spark rect.last { fill: var(--t-accent); }
.t-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font: 400 12px/1 var(--t-font-mono); color: var(--t-muted); }
.t-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 1px; margin-right: 6px; vertical-align: 0; background: var(--c); }
.t-tip { position: fixed; z-index: 80; pointer-events: none; max-width: 260px; padding: 8px 10px; border: 1px solid var(--t-line-strong); border-radius: var(--t-r); background: var(--t-bg); box-shadow: 0 10px 30px rgba(11,13,18,0.16); font: 400 12px/1.45 var(--t-font-mono); color: var(--t-muted); opacity: 0; transition: opacity .12s ease; }
.t-tip.on { opacity: 1; }
.t-tip b { display: block; color: var(--t-text); font-weight: 600; font-size: 14px; }
.t-empty { display: grid; place-items: center; min-height: 120px; padding: 16px; color: var(--t-muted); font: 400 12.5px/1.5 var(--t-font-mono); text-align: center; border: 1px dashed var(--t-line); border-radius: var(--t-r); }

.hb-row { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 12px; align-items: center; }
@media (max-width: 520px) { .hb-row { grid-template-columns: 1fr; } .hb-row .hb-gauge { max-width: 180px; margin: 0 auto; } }

/* =============================== toast =============================== */
.t-toasts { position: fixed; right: 16px; bottom: 16px; z-index: 90; display: flex; flex-direction: column; gap: 8px; width: min(360px, calc(100vw - 32px)); pointer-events: none; }
.t-toast { pointer-events: auto; position: relative; overflow: hidden; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; padding: 12px 12px 14px 14px; background: var(--t-bg); border: 1px solid var(--t-line-strong); border-left: 2px solid var(--t-accent); border-radius: var(--t-r); box-shadow: 0 10px 30px rgba(11,13,18,0.16); animation: t-tin .3s var(--t-ease); }
.t-toast b { display: block; font-weight: 600; font-size: 14px; }
.t-toast span { display: block; color: var(--t-muted); font: 400 12px/1.4 var(--t-font-mono); margin-top: 2px; word-break: break-word; }
.t-toast.is-warn { border-left-color: var(--t-warn); }
@keyframes t-tin { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* =============================== footer =============================== */
.t-footer { padding: var(--t-7) 0 var(--t-5); border-top: 1px solid var(--t-line); background: var(--t-bg); font-size: 14px; }
.t-footer-grid { display: grid; gap: var(--t-6); grid-template-columns: 1fr; }
@media (min-width: 700px) { .t-footer-grid { grid-template-columns: minmax(0, 1.4fr) repeat(var(--t-foot-cols, 3), minmax(0, 1fr)); } }
.t-footer h4 { font: 500 var(--t-fs-2xs)/1.3 var(--t-font-mono); text-transform: uppercase; letter-spacing: var(--t-track-label); color: var(--t-muted); margin-bottom: 12px !important; }
.t-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.t-footer ul a { color: var(--t-text); text-decoration: none; opacity: .85; }
.t-footer ul a:hover { color: var(--t-accent); opacity: 1; }
.t-footer-about p { color: var(--t-muted); margin-top: 12px !important; max-width: 360px; }
.t-footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-top: var(--t-6); padding-top: var(--t-4); border-top: 1px solid var(--t-line); font: 400 12px/1.5 var(--t-font-mono); color: var(--t-faint); }
.t-badge { display: inline-flex; line-height: 0; border-radius: var(--t-r); flex: none; }
.t-badge img { height: 40px; width: auto; display: block; }

/* =============================== reduced motion: keep fades and value changes, drop movement =============================== */
@media (prefers-reduced-motion: reduce) {
  .t-ticker-trk { animation: none; position: static; }
  .t-ticker-v { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .t-svg .ln2.on, .t-svg .ring.on, .t-svg .ar.live, .is-live > .t-dot, .t-dot.is-live, .t-cursor::after { animation: none; }
  .t-js [data-t-reveal] { transform: none; transition: opacity .2s linear; }
  .t-btn, .t-btn .t-ar, .t-svg .slide { transition: none; }
}

/* Gully Terminal skin for the GullyChain sites (gullychain.xyz, /testnet, docs.gullychain.xyz, dev.gullychain.xyz).
   Loaded after the GullyChain kit CSS (term-base.css + term-extra.css, landing.css, ticker.css, docs.css, dev.css) and
   after design/terminal/tokens.css + components.css: it maps the kit's classes onto the Terminal tokens, so the pages
   keep their markup, ids and live scripts and take the Terminal look: flat 1 px rules, 4 px radius, JetBrains Mono for
   every number and label, one accent (#0A86C2), no glows or gradient text. Source: sites/_shared/term-terminal.css */
:root {
  --gc-night: var(--t-bg); --gc-black: var(--t-bg); --gc-ink: var(--t-surface); --gc-white: var(--t-text); --gc-text: var(--t-text);
  --gc-muted: var(--t-muted); --gc-line: var(--t-line); --line: var(--t-line); --line2: var(--t-line-strong); --soft: rgba(11,13,18,.04);
  --gc-royal: var(--t-accent); --gc-electric: var(--t-accent); --gc-indigo: var(--t-accent); --gc-blue: var(--t-accent);
  --gc-chain-gradient: linear-gradient(90deg, var(--t-accent), var(--t-accent));
  --gc-radius-card: var(--t-r); --r-card: var(--t-r); --grid: var(--t-grid);
  --f-num: var(--t-font-mono); --f-badge: var(--t-font-mono); --f-tag: var(--t-font-mono); --mono: var(--t-font-mono); --f-mono: var(--t-font-mono);
  --f-body: var(--t-font-sans); --f-head: var(--t-font-sans); --gc-font: var(--t-font-sans);
  --up: var(--t-up); --gc-up: var(--t-up); --down: var(--t-down); --gc-down: var(--t-down);
}
body { background: var(--t-bg); font-weight: 400; }
h1, h2, h3, h4 { font-weight: 700 !important; letter-spacing: -.025em; }
b, strong { font-weight: 600; }

/* labels: 11 px mono caps */
.lab, .gtk-lbt, .desc, .tag, .stag, .st, .k, .eyebrow, .mf, .mega h3, .drawer h3, footer h3, footer h4, .sg h3, .toc h3, th {
  font-family: var(--t-font-mono) !important; letter-spacing: .1em;
}
.lab { font-weight: 500 !important; font-size: 11px !important; color: var(--t-muted); }
.lab.cy { color: var(--t-accent); }
.lab .ic, .lab svg { width: 13px; height: 13px; }

/* numbers: mono */
.num, .v, .tile .v, .prod .v, .wall .hn b, .hn b, .big b, .nn-k dd, .hchart .big b, .kv b, .kv dd, .gtk-blk, .gtk-m, .ms, .val, time, .pill, code, kbd, pre {
  font-family: var(--t-font-mono) !important; font-variant-numeric: tabular-nums;
}
.tile .v, .prod .v, .wall .hn b, .hn b, .big b, .nn-k dd, .kv b { font-weight: 600 !important; letter-spacing: -.03em; }
.tile .v small, .prod .v small { font-family: var(--t-font-mono) !important; font-weight: 400 !important; }

/* gradient text and glows off: one accent */
.grad, .copy h1 em, .cta h2 em, .wm .c { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; color: var(--t-accent) !important; }
.hero::before, .hero::after { display: none !important; }
.hero { background-image: linear-gradient(var(--t-grid) 1px, transparent 1px), linear-gradient(90deg, var(--t-grid) 1px, transparent 1px); background-size: 32px 32px; background-position: center -1px;
  -webkit-mask-image: none; border-bottom: 1px solid var(--t-line); }
.cta, .final { background: var(--t-surface) !important; }
.bf, .chip, .mega, .qres, .toast { box-shadow: 0 16px 40px rgba(11,13,18,0.16) !important; }
.gtk::before { background: var(--t-accent) !important; opacity: .35 !important; }
.gtk::after { display: none !important; }
.doc h1::after { height: 2px !important; width: 48px !important; background: var(--t-accent) !important; }
.road li.ok:not(:last-child)::before { background: var(--t-accent) !important; }

/* shape: 4 px everywhere except status pills, dots and avatars */
.card, .term, .bf, .chip, .mega, .ml, .faq details, .final, .skv, .ssteps, .ssteps .m, .kv, .code, .cmd, .callout, .toast, .qres, .qres a,
.stats, .prods, .street, .feat, .row, .prod, .hr a, .mvr, .se a, .sbtn, .tabs, .tab, .seg, .seg button, .ctab, .lk, .stack li,
.cbtn, .tbtn, .tag, .stag, .st, .chip2, .eyebrow, .burger, .mbtn, .mi, .more, .search input, .sg a, .gtk-t, .masc, .final .masc,
footer ul.soc a, .nav ul a, .rpc code, .rpcrow code, .prose code, .doc :not(pre) > code, .bf .url, .skip, .glb {
  border-radius: var(--t-r) !important;
}
.callout { border-radius: 0 var(--t-r) var(--t-r) 0 !important; }
.mvr .trk, .mvr .bar, .meter, .meter i, .curve i, .curve i b, .steps .bar { border-radius: 1px !important; }

/* buttons: flat, no shine, accent primary, outlined secondary */
.btn { border-radius: var(--t-r) !important; min-height: 40px; font-weight: 600 !important; font-family: var(--t-font-sans); letter-spacing: 0; }
.btn::after { display: none !important; }
.btn.sm { min-height: 34px; }
.btn.pri { background: var(--t-accent) !important; color: var(--t-on-accent) !important; border-color: var(--t-accent) !important; }
.btn.pri:hover { background: color-mix(in srgb, var(--t-accent), #fff 14%) !important; box-shadow: none !important; }
.btn.sec { background: transparent !important; color: var(--t-text) !important; border: 1px solid var(--t-line-strong) !important; }
.btn.sec:hover, .btn.ter:hover { border-color: var(--t-accent) !important; box-shadow: none !important; }
.btn.ter { background: transparent !important; color: var(--t-muted) !important; border: 1px solid var(--t-line) !important; }
.btn.ter:hover { color: var(--t-text) !important; }
.cbtn, .tbtn { font-family: var(--t-font-mono) !important; font-weight: 500 !important; font-size: 12px !important; }
.tab[aria-selected="true"], .seg button[aria-pressed="true"], .ctab[aria-selected="true"], .ctab[aria-pressed="true"] { background: var(--t-accent) !important; color: var(--t-on-accent) !important; }

/* status pills: mono, the live dot is green (up), offline red */
.pill { font-weight: 500 !important; font-size: 12px !important; background: transparent !important; }
.pill.live .dot, .gtk-lb .gtk-dot.on, .eyebrow .dot { background: var(--t-up) !important; }
.pill.down .dot { background: var(--t-down) !important; }

/* tiles and icons */
.feat > .ic { background: transparent !important; border: 1px solid var(--t-line-strong); color: var(--t-accent) !important; }
.tile, .prod { background: var(--t-bg) !important; }
.spark .l { stroke: var(--t-accent) !important; } .spark .a { fill: var(--t-accent) !important; opacity: .1 !important; }
.spark rect { fill: color-mix(in srgb, var(--t-accent) 50%, transparent) !important; } .spark rect.last { fill: var(--t-accent) !important; }
.gc-tip { border-radius: var(--t-r) !important; border-color: var(--t-line-strong) !important; background: var(--t-bg) !important; font-family: var(--t-font-mono) !important; font-size: 12px !important; }
.gc-tip b { font-family: var(--t-font-mono) !important; font-weight: 600 !important; font-size: 14px !important; }
.at { font-family: var(--t-font-mono) !important; font-size: 10.5px !important; fill: var(--t-faint) !important; }
.ln { stroke: var(--t-accent) !important; stroke-width: 1.75 !important; }
.bar-r { fill: color-mix(in srgb, var(--t-accent) 55%, transparent) !important; } .bar-r.last, .bar-r.on { fill: var(--t-accent) !important; }
.s-launch { fill: var(--t-s1) !important; } .s-trade { fill: var(--t-s2) !important; } .s-swap { fill: var(--t-s3) !important; } .s-quest { fill: var(--t-s4) !important; }
.sw.s-launch, i.s-launch { background: var(--t-s1) !important; } .sw.s-trade, i.s-trade { background: var(--t-s2) !important; } .sw.s-swap, i.s-swap { background: var(--t-s3) !important; } .sw.s-quest, i.s-quest { background: var(--t-s4) !important; }

/* toasts: Terminal toast */
.toast { border-left: 2px solid var(--t-accent) !important; background: var(--t-bg) !important; }
.toast .pb { background: var(--t-accent) !important; left: 0 !important; right: 0 !important; height: 2px !important; }

/* footer: the Gully products column is added by the build next to the kit footer */
footer { background: var(--t-bg) !important; }
.glb img { height: 40px !important; }
@media (max-width: 640px) { .glb img { height: 32px !important; } }

/* Gully product switcher next to the GullyChain switcher */
.nav .t-switch { margin-left: 4px; }
@media (max-width: 1099px) { .nav .t-switch > summary span { display: none; } }
@media (max-width: 420px) { .nav .t-switch { display: none; } }

/* announcement bar (term.mjs announceBar, dismissed by term.js) */
.annb{background:linear-gradient(90deg,rgba(10,134,194,.16),rgba(10,134,194,.16));border-bottom:1px solid rgba(10,134,194,.35);font:600 13.5px/1.3 var(--gc-font)}
.annb[hidden]{display:none}
.annb .wrap{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px}
.annb .annl{display:inline-flex;align-items:center;gap:8px;color:var(--gc-white);text-decoration:none;padding:8px 0;min-width:0}
.annb .annl span{overflow:hidden;text-overflow:ellipsis}
.annb .annl .ic{width:16px;height:16px;color:var(--gc-cyan);flex:none}
.annb .annl:hover span{text-decoration:underline}
.annb .annl .ar{transition:transform .18s ease}
.annb .annl:hover .ar{transform:translateX(3px)}
.annb .annx{display:none;margin-left:auto;flex:none;width:32px;height:32px;place-items:center;background:transparent;border:0;color:var(--gc-muted);cursor:pointer;border-radius:4px}
.annb.js .annx{display:grid}
.annb .annx:hover{color:var(--gc-white);background:rgba(11,13,18,.06)}
.annb .annx .ic{width:16px;height:16px}
.annb.js .annl{margin-left:auto}
@media (max-width:520px){.annb{font-size:12.5px}.annb .annl .ar{display:none}}

/*!
 * Studio Light (S): Gully Chain design tokens. gully-labs/gully-ops sites/_shared/studio-light/tokens.css (spec: README.md).
 * Compact, minimal, corporate-modern on white. Inter 400-800 for everything (Exo 2 800 only in the GullyChain
 * wordmark), 14 px base, radii 8/10/12/14, one accent. Every class in components.css and every chart in charts.js
 * reads only these variables. data-product on <html> may swap the accent (chain is the default).
 */
:root {
  /* ---- surfaces ---- */
  --sl-bg: #FFFFFF;
  --sl-surface: #F6F7F9;
  --sl-surface-2: #F4F5F7;
  --sl-hover: #F1F2F4;
  --sl-border: #E6E8EC;
  --sl-border-strong: #D5D9E0;   /* secondary buttons, inputs */
  --sl-divider: #F0F1F4;         /* chart gridlines, list rules */
  --sl-night: #05080D;           /* mascot card ground (the kit art has a dark ground) */

  /* ---- text (all >= 4.5:1 on white) ---- */
  --sl-text: #0B0D12;
  --sl-text-2: #3D4350;
  --sl-muted: #5B6270;

  /* ---- accent + links ---- */
  --sl-accent: #0A86C2;          /* fills, chart series 1, focus ring; text only at >= 14px bold (4.3:1) */
  --sl-on-accent: #FFFFFF;
  --sl-accent-soft: #E6F4FB;
  --sl-link: #075F8C;            /* 7.0:1 */
  --sl-link-hover: #04456A;

  /* ---- semantic (text on tint) ---- */
  --sl-ok: #0B6640;     --sl-ok-bg: #E5F6EE;
  --sl-info: #075F8C;   --sl-info-bg: #E6F4FB;
  --sl-warn: #7A4A00;   --sl-warn-bg: #FFF4DE;
  --sl-danger: #B42318; --sl-danger-bg: #FDECEA;
  --sl-live: #E5484D;   /* the live dot */

  /* ---- chart series ---- */
  --sl-s1: var(--sl-accent);
  --sl-s2: #16A34A;
  --sl-s3: #6366F1;
  --sl-s4: #F59E0B;
  --sl-s5: #8C93A0;

  /* ---- type ---- */
  --sl-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sl-font-brand: "Exo 2", "Inter", system-ui, sans-serif;  /* GullyChain wordmark only */
  --sl-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sl-fs-xs: 11px; --sl-fs-sm: 12px; --sl-fs-md: 13px; --sl-fs: 14px; --sl-fs-lg: 16px; --sl-fs-xl: 17px;
  --sl-fs-h3: 16px; --sl-fs-h2: 22px; --sl-fs-h1: clamp(32px, 4.2vw, 52px);
  --sl-lh: 1.5;

  /* ---- shape, space, motion ---- */
  --sl-r-sm: 8px; --sl-r: 10px; --sl-r-md: 12px; --sl-r-lg: 14px; --sl-r-xl: 20px; --sl-r-pill: 999px;
  --sl-gutter: 16px; --sl-maxw: 1280px; --sl-header-h: 56px;
  --sl-shadow: 0 10px 24px rgba(11, 13, 18, .12);
  --sl-shadow-pop: 0 18px 48px rgba(11, 13, 18, .16), 0 0 0 1px rgba(11, 13, 18, .04);
  --sl-ease: cubic-bezier(.2, .8, .2, 1);
  --sl-dur: 160ms;
  color-scheme: light;
}
@media (min-width: 900px) { :root { --sl-gutter: 32px; } }

/* Gully Studio surfaces keep the Studio blue, darkened to pass 4.5:1 as text on white */
[data-product="studio"] { --sl-accent: #1A6FD1; --sl-accent-soft: #E8F1FC; --sl-link: #155BB0; --sl-link-hover: #0F4485; }

/*!
 * Studio Light (S): components. gully-labs/gully-ops sites/_shared/studio-light/components.css (spec: README.md).
 * Every class is prefixed sl-. Reads only tokens.css. All motion is off under prefers-reduced-motion.
 */
.sl-body { margin: 0; background: var(--sl-bg); color: var(--sl-text); font: 400 var(--sl-fs)/var(--sl-lh) var(--sl-font); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.sl-body *, .sl-body *::before, .sl-body *::after { box-sizing: border-box; }
.sl-body a { color: var(--sl-link); text-decoration: none; }
.sl-body a:hover { color: var(--sl-link-hover); }
.sl-body :focus-visible { outline: 2px solid var(--sl-accent); outline-offset: 2px; border-radius: 6px; }
.sl-wrap { width: 100%; max-width: var(--sl-maxw); margin: 0 auto; padding: 0 var(--sl-gutter); }
.sl-skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--sl-text); color: #fff !important; padding: 8px 12px; border-radius: var(--sl-r-sm); }
.sl-skip:focus { left: 8px; }
.sl-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sl-ic { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sl-num { font-variant-numeric: tabular-nums; }
.sl-muted { color: var(--sl-muted); }

/* ---- brand lockup: kit dark tile icon + kit light-bg wordmark SVG (slWordmark/slLockup), never redrawn ---- */
.sl-wm { display: inline-flex; align-items: center; gap: 8px; flex: none; white-space: nowrap; line-height: 1; text-decoration: none !important; color: var(--sl-text) !important; }
.sl-wm .sl-wm-i { display: block; flex: none; width: 32px; height: 32px; max-width: none; }
.sl-wm .sl-wm-t { display: block; flex: none; width: auto; height: 24px; max-width: none; }
.sl-wm.sm .sl-wm-i { width: 28px; height: 28px; }
.sl-wm.sm .sl-wm-t { height: 20px; }
.sl-wm small { font: 600 12px/1 var(--sl-font); color: var(--sl-muted); margin-left: 2px; }
@media (max-width: 380px) { .sl-wm:not(.sm) .sl-wm-t { height: 20px; } }
.sl-cbadge img { display: block; max-width: 100%; height: auto; }

/* ---- header + nav (menu icons) ---- */
.sl-header { position: sticky; top: 0; z-index: 30; background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 1px solid var(--sl-border); }
.sl-header > .sl-wrap { height: var(--sl-header-h); display: flex; align-items: center; gap: 16px; }
.sl-nav { display: flex; gap: 2px; min-width: 0; }
.sl-nav a { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border-radius: var(--sl-r-sm); font-weight: 500; color: var(--sl-text-2); white-space: nowrap; transition: background var(--sl-dur); }
.sl-nav a:hover { background: var(--sl-hover); color: var(--sl-text); }
.sl-nav a[aria-current="page"] { background: var(--sl-hover); color: var(--sl-text); font-weight: 700; }
.sl-spacer { flex: 1; }
@media (max-width: 900px) { .sl-nav { display: none; } }

/* side nav (dashboards: Studio Console, admin) */
.sl-side { border-right: 1px solid var(--sl-border); padding: 16px 12px; display: flex; flex-direction: column; gap: 2px; }
.sl-side a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--sl-r-sm); font-weight: 500; color: var(--sl-text-2); transition: background var(--sl-dur); }
.sl-side a:hover { background: var(--sl-hover); color: var(--sl-text); }
.sl-side a[aria-current="page"] { background: var(--sl-hover); color: var(--sl-text); font-weight: 700; }

/* ---- buttons ---- */
.sl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: var(--sl-r-sm); border: 1px solid transparent; font: 700 14px/1 var(--sl-font); cursor: pointer; white-space: nowrap; text-decoration: none; transition: transform .15s ease, background .15s, border-color .15s; }
.sl-btn:hover { transform: translateY(-1px); }
.sl-btn:active { transform: none; }
.sl-btn-dark { background: var(--sl-text); color: #FFFFFF !important; }
.sl-btn-dark:hover { background: #23262E; }
.sl-btn-pri { background: var(--sl-accent); color: var(--sl-on-accent) !important; font-weight: 800; }
.sl-btn-pri:hover { background: #0877AD; }
.sl-btn-sec { background: var(--sl-bg); color: var(--sl-text) !important; border-color: var(--sl-border-strong); }
.sl-btn-sec:hover { background: var(--sl-hover); }
.sl-btn-ghost { background: transparent; color: var(--sl-text-2) !important; }
.sl-btn-ghost:hover { background: var(--sl-hover); }
.sl-btn-lg { min-height: 46px; padding: 0 20px; border-radius: var(--sl-r); font-size: 15px; }
.sl-btn-sm { min-height: 30px; padding: 0 10px; font-size: 13px; }
.sl-btn[disabled], .sl-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; }

/* ---- type ---- */
.sl-h1 { margin: 0; font-size: var(--sl-fs-h1); line-height: 1.04; letter-spacing: -.035em; font-weight: 800; }
.sl-h2 { margin: 0; font-size: var(--sl-fs-h2); line-height: 1.2; letter-spacing: -.02em; font-weight: 800; }
.sl-h3 { margin: 0; font-size: var(--sl-fs-h3); font-weight: 800; }
.sl-lede { margin: 0; font-size: var(--sl-fs-xl); color: var(--sl-muted); line-height: 1.5; max-width: 560px; }
.sl-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--sl-link); }
.sl-label { font-size: 12px; color: var(--sl-muted); font-weight: 500; }

/* ---- cards, KPI tiles ---- */
.sl-card { background: var(--sl-bg); border: 1px solid var(--sl-border); border-radius: var(--sl-r-lg); padding: 16px; }
.sl-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.sl-card-head > b, .sl-card-head > h2, .sl-card-head > h3 { flex: 1; font-size: 14px; font-weight: 800; margin: 0; }
.sl-card-lift { transition: transform .2s ease, box-shadow .2s ease; }
.sl-card-lift:hover { transform: translateY(-4px); box-shadow: var(--sl-shadow); }
.sl-kpis { display: grid; grid-template-columns: repeat(var(--sl-kpi-cols, 4), minmax(0, 1fr)); gap: 14px; }
@media (max-width: 900px) { .sl-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
.sl-kpi { border: 1px solid var(--sl-border); border-radius: var(--sl-r-md); padding: 14px; display: flex; flex-direction: column; gap: 4px; min-width: 0; transition: border-color var(--sl-dur); }
.sl-kpi:hover { border-color: var(--sl-accent); }
.sl-kpi-v { display: flex; align-items: flex-end; gap: 8px; }
.sl-kpi-v b { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sl-kpi-v svg { width: 80px; height: 28px; flex: none; }
.sl-kpi-d { font-size: 12px; font-weight: 700; color: var(--sl-ok); }
.sl-kpi-d.down { color: var(--sl-danger); }
.sl-kpi-d.flat { color: var(--sl-muted); font-weight: 500; }
/* stat strip (landing): label + value + sparkline in a row, divided by a top rule */
.sl-stats { display: grid; grid-template-columns: repeat(var(--sl-stat-cols, 4), minmax(0, 1fr)); gap: 16px; border-top: 1px solid var(--sl-border); padding-top: 18px; }
.sl-stat { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sl-stat > div { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.sl-stat b { font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.sl-stat svg { width: 90px; height: 30px; flex: none; }
@media (max-width: 760px) { .sl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sl-stat svg { width: 64px; } }

/* ---- pills, tags ---- */
.sl-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: var(--sl-r-pill); font-size: 12px; font-weight: 700; background: var(--sl-surface); color: var(--sl-text-2); white-space: nowrap; }
.sl-pill.ok { background: var(--sl-ok-bg); color: var(--sl-ok); }
.sl-pill.info { background: var(--sl-info-bg); color: var(--sl-info); }
.sl-pill.warn { background: var(--sl-warn-bg); color: var(--sl-warn); }
.sl-pill.danger { background: var(--sl-danger-bg); color: var(--sl-danger); }
.sl-tag { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .02em; border-radius: 5px; padding: 2px 6px; background: var(--sl-warn-bg); color: var(--sl-warn); }
.sl-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sl-live); flex: none; }
.sl-dot.ok { background: #16A34A; } .sl-dot.idle { background: #8C93A0; }
.sl-live { animation: sl-pulse 1.4s ease-in-out infinite; }

/* ---- tables ---- */
.sl-table-wrap { overflow-x: auto; border: 1px solid var(--sl-border); border-radius: var(--sl-r-md); }
.sl-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sl-table th { text-align: left; font-weight: 600; font-size: 12px; color: var(--sl-muted); background: var(--sl-surface); padding: 9px 12px; border-bottom: 1px solid var(--sl-border); white-space: nowrap; }
.sl-table td { padding: 10px 12px; border-bottom: 1px solid var(--sl-divider); vertical-align: middle; }
.sl-table tr:last-child td { border-bottom: 0; }
.sl-table tbody tr:hover td { background: var(--sl-surface); }
.sl-table td.num, .sl-table th.num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---- segmented control / tabs ---- */
.sl-seg { display: inline-flex; gap: 2px; padding: 2px; border-radius: var(--sl-r-sm); background: var(--sl-surface); }
.sl-seg button, .sl-seg a { all: unset; cursor: pointer; padding: 4px 10px; border-radius: 6px; font-size: 12px; font-weight: 600; color: var(--sl-muted); }
.sl-seg [aria-selected="true"], .sl-seg [aria-pressed="true"], .sl-seg [aria-current="page"] { background: var(--sl-text); color: #FFFFFF; }
.sl-seg :focus-visible { outline: 2px solid var(--sl-accent); }

/* ---- stepper ---- */
.sl-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--sl-step-cols, 3), minmax(0, 1fr)); gap: 10px; counter-reset: sl-step; }
.sl-steps li { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--sl-border); border-radius: var(--sl-r-md); counter-increment: sl-step; min-width: 0; }
.sl-steps li::before { content: counter(sl-step); flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: var(--sl-surface); color: var(--sl-text); }
.sl-steps li[aria-current="step"]::before { background: var(--sl-accent); color: #fff; }
.sl-steps li.done::before { content: "\2713"; background: var(--sl-ok-bg); color: var(--sl-ok); }
.sl-steps b { display: block; font-size: 13px; }
.sl-steps span { font-size: 12px; color: var(--sl-muted); }
@media (max-width: 760px) { .sl-steps { grid-template-columns: 1fr; } }

/* ---- progress ---- */
.sl-prog { height: 6px; border-radius: 3px; background: var(--sl-divider); overflow: hidden; }
.sl-prog > span { display: block; height: 100%; border-radius: 3px; background: var(--sl-accent); }
.sl-prog.run > span { background-image: linear-gradient(45deg, rgba(255,255,255,.35) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.35) 50%, rgba(255,255,255,.35) 75%, transparent 75%); background-size: 28px 28px; animation: sl-stripe 1s linear infinite; }

/* ---- toasts ---- */
.sl-toasts { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: flex; flex-direction: column; gap: 8px; max-width: min(380px, calc(100vw - 32px)); }
.sl-toast { display: flex; gap: 10px; align-items: flex-start; background: var(--sl-bg); color: var(--sl-text); border: 1px solid var(--sl-border); border-left: 3px solid var(--sl-accent); border-radius: var(--sl-r); padding: 10px 12px; box-shadow: var(--sl-shadow-pop); font-size: 13px; animation: sl-rise .25s ease-out both; }
.sl-toast.ok { border-left-color: #16A34A; } .sl-toast.warn { border-left-color: #F59E0B; } .sl-toast.danger { border-left-color: var(--sl-danger); }
.sl-toast b { display: block; font-size: 13px; }

/* ---- mascot card (kit art has a dark ground: always on --sl-night) ---- */
.sl-mascot { margin: 0; position: relative; min-height: 220px; border-radius: var(--sl-r-xl); overflow: hidden; background: var(--sl-night); isolation: isolate; }
.sl-mascot > img { position: absolute; right: 8px; bottom: 0; height: 94%; max-height: 300px; width: auto; display: block; transition: transform .3s ease; z-index: -1; }
.sl-mascot:hover > img { transform: scale(1.04) rotate(-2deg); }
.sl-mascot .sl-say { position: absolute; left: 14px; top: 14px; max-width: 200px; background: #FFFFFF; color: var(--sl-text); border-radius: 14px 14px 14px 4px; padding: 9px 11px; font-size: 13px; font-weight: 600; line-height: 1.35; }
.sl-mascot .sl-say-2 { display: none; }
.sl-mascot:hover .sl-say-1, .sl-mascot:focus-within .sl-say-1 { display: none; }
.sl-mascot:hover .sl-say-2, .sl-mascot:focus-within .sl-say-2 { display: inline; }
.sl-mascot .sl-float { position: absolute; left: 14px; bottom: 14px; width: 200px; background: rgba(255,255,255,.97); color: var(--sl-text); border-radius: var(--sl-r-md); padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; }
.sl-mascot .sl-float b { font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.sl-mascot .sl-float svg { width: 100%; height: 30px; }
.sl-bob { animation: sl-bob 3.2s ease-in-out infinite; }

/* ---- charts (charts.js) ---- */
.sl-chart { position: relative; width: 100%; }
.sl-chart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sl-chart .grid { stroke: var(--sl-divider); stroke-width: 1; }
.sl-chart .axis { fill: var(--sl-muted); font: 500 11px var(--sl-font); }
.sl-chart .empty { fill: var(--sl-muted); font: 500 12px var(--sl-font); }
.sl-chart-x { display: flex; justify-content: space-between; font-size: 11px; color: var(--sl-muted); margin-top: 4px; }
.sl-tip { position: absolute; pointer-events: none; background: var(--sl-text); color: #fff; font-size: 12px; font-weight: 600; padding: 4px 8px; border-radius: 6px; white-space: nowrap; transform: translate(-50%, -120%); z-index: 2; }
.sl-draw { stroke-dasharray: var(--sl-len, 1400); stroke-dashoffset: 0; animation: sl-draw 1.6s ease-out both; }
.sl-fade { animation: sl-fade 1.2s .4s ease-out both; }
.sl-bar { transform-box: fill-box; transform-origin: bottom; animation: sl-grow .8s var(--sl-ease) both; }
.sl-rise { animation: sl-rise .6s ease-out both; }

/* ---- footer + Powered by Gully Labs badge ---- */
.sl-footer { border-top: 1px solid var(--sl-border); padding: 20px 0; font-size: 13px; color: var(--sl-muted); }
.sl-footer > .sl-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.sl-footer nav { display: flex; flex-wrap: wrap; gap: 4px 16px; flex: 1; }
.sl-footer nav a { color: var(--sl-text-2); font-weight: 500; }
.sl-badge img { display: block; height: 32px; width: auto; }
/* Community & bots (sites/_shared/community.json): icon, name, one-line description */
.sl-commw { padding: 16px 0 4px; border-top: 1px solid var(--sl-border); margin-top: 14px; width: 100%; }
.sl-commw h3 { margin: 0 0 10px; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 0 !important; text-transform: none !important; }
.sl-commw h3 a { color: var(--sl-text) !important; text-decoration: none; }
.sl-commw h3 a:hover { color: var(--sl-link) !important; }
.sl-comm { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 14px; }
@media (max-width: 1000px) { .sl-comm { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .sl-comm { grid-template-columns: minmax(0, 1fr); } }
.sl-comm a { display: flex; gap: 10px; align-items: flex-start; padding: 8px; margin: 0 -8px; border-radius: var(--sl-r); color: var(--sl-text-2) !important; text-decoration: none; transition: background var(--sl-dur); }
.sl-comm a:hover { background: var(--sl-hover); }
.sl-comm .ic, .sl-comm svg { width: 16px; height: 16px; flex: none; margin-top: 2px; color: var(--sl-accent); stroke: currentColor; fill: none; stroke-width: 2; }
.sl-comm span { display: flex; flex-direction: column; min-width: 0; }
.sl-comm b { font-size: 13px; color: var(--sl-text); }
.sl-comm small { font-size: 12px; color: var(--sl-muted); line-height: 1.4; }

/* ---- motion ---- */
@keyframes sl-draw { from { stroke-dashoffset: var(--sl-len, 1400); } to { stroke-dashoffset: 0; } }
@keyframes sl-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes sl-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes sl-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes sl-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes sl-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes sl-stripe { from { background-position: 0 0; } to { background-position: 28px 0; } }
@media (prefers-reduced-motion: reduce) {
  .sl-draw, .sl-fade, .sl-bar, .sl-rise, .sl-bob, .sl-live, .sl-toast, .sl-prog.run > span { animation: none !important; }
  .sl-btn, .sl-card-lift, .sl-mascot > img, .sl-kpi { transition: none !important; }
  .sl-btn:hover, .sl-card-lift:hover, .sl-mascot:hover > img { transform: none !important; }
}

/*!
 * Studio Light (S) skin. gully-labs/gully-ops sites/_shared/studio-light/skin.css (spec: README.md).
 * Loaded LAST on pages built from the older GullyChain kit (term-base/term-extra/landing/ticker/docs/dev CSS) and the
 * Gully Terminal system (design/terminal, --t-*): it points every old token at Studio Light, so the pages keep their
 * markup, ids and live scripts and take the S look (white, Inter, 8-14 px radii, one accent #0A86C2, ink buttons).
 * Literal dark colours inside those stylesheets are converted at build time by lightify() in studio-light.mjs.
 */
:root, [data-product] {
  /* Gully Terminal tokens -> Studio Light */
  --t-bg: var(--sl-bg); --t-surface: var(--sl-surface); --t-surface-2: var(--sl-surface-2);
  --t-line: var(--sl-border); --t-line-strong: var(--sl-border-strong); --t-grid: var(--sl-divider);
  --t-text: var(--sl-text); --t-muted: var(--sl-muted); --t-faint: var(--sl-muted);
  --t-up: var(--sl-ok); --t-down: var(--sl-danger); --t-warn: var(--sl-warn); --t-idle: #8C93A0;
  --t-accent: var(--sl-accent); --t-accent-2: var(--sl-s2); --t-on-accent: #FFFFFF;
  --t-accent-soft: var(--sl-accent-soft); --t-accent-line: rgba(10, 134, 194, .45);
  --t-s1: var(--sl-s1); --t-s2: var(--sl-s2); --t-s3: var(--sl-s3); --t-s4: var(--sl-s4); --t-s5: var(--sl-s5);
  --t-font-sans: var(--sl-font); --t-font-mono: var(--sl-font);
  --t-r: var(--sl-r); --t-r-sm: 6px; --t-fs-base: 14px;
  /* GullyChain kit tokens -> Studio Light */
  --gc-night: var(--sl-bg); --gc-black: var(--sl-bg); --gc-ink: var(--sl-surface); --gc-white: var(--sl-text); --gc-text: var(--sl-text);
  --gc-muted: var(--sl-muted); --gc-line: var(--sl-border); --line: var(--sl-border); --line2: var(--sl-border-strong); --soft: var(--sl-surface);
  --gc-cyan: var(--sl-accent); --gc-green: var(--sl-s2); --gc-blue: var(--sl-accent); --gc-royal: var(--sl-accent); --gc-electric: var(--sl-accent); --gc-indigo: var(--sl-accent);
  --gc-chain-gradient: linear-gradient(90deg, var(--sl-accent), var(--sl-accent));
  --gc-radius-card: var(--sl-r-lg); --r-card: var(--sl-r-lg); --grid: var(--sl-divider);
  --f-head: var(--sl-font); --f-body: var(--sl-font); --f-num: var(--sl-font); --f-badge: var(--sl-font); --f-tag: var(--sl-font); --gc-font: var(--sl-font);
  --mono: var(--sl-font-mono); --f-mono: var(--sl-font-mono);
  --up: var(--sl-ok); --gc-up: var(--sl-ok); --down: var(--sl-danger); --gc-down: var(--sl-danger);
  color-scheme: light;
}
html, body { background: var(--sl-bg) !important; color: var(--sl-text); }
body { font-family: var(--sl-font); font-size: 14px; line-height: 1.5; }
h1, h2, h3, h4 { font-family: var(--sl-font) !important; font-weight: 800 !important; letter-spacing: -.02em; color: var(--sl-text); }
:focus-visible { outline: 2px solid var(--sl-accent) !important; outline-offset: 2px; }

/* code stays monospaced; labels and numbers are Inter */
code, kbd, pre, pre code, .mono, .gtk-blk { font-family: var(--sl-font-mono) !important; }
.lab, .t-label, .gtk-lbt, .desc, .tag, .stag, .eyebrow, .mf, .mega h3, .drawer h3, footer h3, footer h4, .sg h3, .toc h3, th {
  letter-spacing: 0 !important; text-transform: none !important; font-family: var(--sl-font) !important;
}
.lab, .t-label { font-size: 12px !important; font-weight: 600 !important; color: var(--sl-muted); }
.lab.cy, .t-label--accent { color: var(--sl-link) !important; }
.num, .v, .t-kpi-v, .t-readout { font-variant-numeric: tabular-nums; letter-spacing: -.01em !important; }
.tile .v, .prod .v, .t-kpi-v, .hn b, .big b, .nbig b { font-weight: 800 !important; }

/* links */
a { color: inherit; }
.prose a, .doc a, .t-link { color: var(--sl-link) !important; }
.prose a:hover, .doc a:hover { color: var(--sl-link-hover) !important; }

/* buttons: ink or accent fill, 1 px #D5D9E0 secondary, 8 px radius, no shimmer or glow */
.btn, .t-btn { border-radius: var(--sl-r-sm) !important; font-family: var(--sl-font) !important; font-weight: 700 !important; min-height: 38px; box-shadow: none !important; transition: transform .15s ease, background .15s, border-color .15s !important; }
.btn::after { display: none !important; }
.btn:hover, .t-btn:hover { transform: translateY(-1px); }
.btn.pri, .t-btn--primary { background: var(--sl-accent) !important; border-color: var(--sl-accent) !important; color: #FFFFFF !important; font-weight: 800 !important; }
.btn.pri:hover, .t-btn--primary:hover { background: #0877AD !important; }
.btn.sec, .t-btn--secondary { background: var(--sl-text) !important; border-color: var(--sl-text) !important; color: #FFFFFF !important; }
.btn.sec:hover, .t-btn--secondary:hover { background: #23262E !important; }
.btn.ter, .t-btn--ghost, .t-btn:not(.t-btn--primary):not(.t-btn--secondary) { background: var(--sl-bg) !important; border: 1px solid var(--sl-border-strong) !important; color: var(--sl-text) !important; }
.btn.ter:hover, .t-btn--ghost:hover { background: var(--sl-hover) !important; }
.btn.sm { min-height: 34px; } .btn.xs { min-height: 28px; }
.cbtn { border-radius: var(--sl-r-sm) !important; }

/* header */
.nav, .t-topbar { background: rgba(255, 255, 255, .94) !important; border-bottom: 1px solid var(--sl-border) !important; }
.nav ul a, .t-nav a { color: var(--sl-text-2); font-weight: 500; border-radius: var(--sl-r-sm); }
.nav ul a:hover, .nav ul a[aria-current="true"], .nav ul a[aria-current="page"], .t-nav a:hover, .t-nav a[aria-current="page"] { color: var(--sl-text) !important; background: var(--sl-hover); }
.mega, .drawer, .qres, .t-switch-menu { background: var(--sl-bg) !important; border: 1px solid var(--sl-border) !important; border-radius: var(--sl-r-lg) !important; box-shadow: var(--sl-shadow-pop) !important; }
.bf, .chip, .toast, .t-toast, .t-tip { box-shadow: var(--sl-shadow) !important; }
.wm img { filter: none; }

/* pills */
.pill, .t-pill { border-radius: var(--sl-r-pill) !important; background: var(--sl-surface) !important; border-color: var(--sl-border) !important; color: var(--sl-text-2) !important; font-family: var(--sl-font) !important; font-weight: 700; }
.pill.live, .pill.on, .t-pill--up { background: var(--sl-ok-bg) !important; color: var(--sl-ok) !important; border-color: transparent !important; }
.st.live { background: var(--sl-ok-bg) !important; border-color: transparent !important; color: var(--sl-ok) !important; }
.st.beta, .st.next { background: var(--sl-info-bg) !important; border-color: transparent !important; color: var(--sl-info) !important; }
.st.wip, .st.wait, .st.soon { background: var(--sl-warn-bg) !important; border-color: transparent !important; color: var(--sl-warn) !important; }
.st.down { background: var(--sl-danger-bg) !important; border-color: transparent !important; color: var(--sl-danger) !important; }
.tag.live { background: var(--sl-ok-bg) !important; color: var(--sl-ok) !important; border-color: transparent !important; }
.tag.roll { background: var(--sl-info-bg) !important; color: var(--sl-info) !important; border-color: transparent !important; }
.tag.soon { background: var(--sl-warn-bg) !important; color: var(--sl-warn) !important; border-color: transparent !important; }

/* cards, panels, tiles: white with a 1 px border, 12-14 px radius, hover lift */
.card, .panel, .t-panel, .ncard, .tile, .prod, .spanel, .rsn-card, .wall, .term, .code, .t-kpi { border-radius: var(--sl-r-lg); }
.card, .ncard, .rsn-card, .t-panel { background: var(--sl-bg) !important; border: 1px solid var(--sl-border) !important; }
.prod, .eco-card, .t-feature { transition: transform .2s ease, box-shadow .2s ease; }
.prod:hover, .eco-card:hover { transform: translateY(-4px); box-shadow: var(--sl-shadow); }
.hero { background-image: none !important; }
.hero::before, .hero::after, .t-scan::after, .t-grid-bg { display: none !important; background: none !important; }
.cta, .final { background: var(--sl-surface) !important; }
.code, pre { background: var(--sl-surface) !important; color: var(--sl-text) !important; border-radius: var(--sl-r-md); }

/* tables */
table th { background: var(--sl-surface); color: var(--sl-muted) !important; font-weight: 600 !important; font-size: 12px !important; }
table.m tbody tr:hover, .t-table tbody tr:hover { background: var(--sl-surface) !important; }

/* tabs and segmented controls: ink selected state */
.tabbar [role="tab"][aria-selected="true"], .htab[aria-selected="true"], .tab[aria-selected="true"], .ctab[aria-selected="true"] { color: var(--sl-text) !important; }
.t-seg [aria-pressed="true"], .t-seg [aria-selected="true"], .tbtn[aria-pressed="true"] { background: var(--sl-text) !important; color: #FFFFFF !important; }

/* announcement bar */
.annb { background: var(--sl-info-bg) !important; border-bottom: 1px solid var(--sl-border) !important; color: var(--sl-info); }
.annb a, .annb .annl { color: var(--sl-info) !important; font-weight: 600; }
.annb .annx { color: var(--sl-info) !important; }
.annb .annx:hover { background: rgba(7, 95, 140, .08) !important; }

/* footer */
footer, .t-footer { background: var(--sl-bg) !important; border-top: 1px solid var(--sl-border) !important; color: var(--sl-muted); }
footer ul a, footer a { color: var(--sl-text-2); }
footer ul a:hover, footer a:hover { color: var(--sl-text) !important; }

/* charts drawn by design/terminal chart-kit.js and term.js: light grid, accent line */
.plot svg text, .t-chart text { fill: var(--sl-muted); }
.t-tip, .gc-tip { background: var(--sl-text) !important; color: #FFFFFF !important; border: 0 !important; border-radius: 6px !important; }
.t-tip *, .gc-tip * { color: #FFFFFF !important; }

/* toasts */
.toast, .t-toast { background: var(--sl-bg) !important; color: var(--sl-text) !important; border: 1px solid var(--sl-border) !important; border-left: 3px solid var(--sl-accent) !important; border-radius: var(--sl-r) !important; }

@media (prefers-reduced-motion: reduce) {
  .btn, .t-btn, .prod, .eco-card { transition: none !important; }
  .btn:hover, .t-btn:hover, .prod:hover, .eco-card:hover { transform: none !important; }
}
/* leftover caps labels from the kit */
.skv .sl, .tagl, .sl-label { letter-spacing: 0 !important; text-transform: none !important; font-family: var(--sl-font) !important; font-size: 12px !important; font-weight: 600 !important; color: var(--sl-muted) !important; }
a.sl-wm, .sl-wm { text-decoration: none !important; }
/* Gully products switcher (<details class="t-switch">): a secondary button, not a faint mono chip */
.t-switch > summary { height: 34px !important; padding: 0 10px !important; border: 1px solid var(--sl-border-strong) !important; border-radius: var(--sl-r-sm) !important; color: var(--sl-text) !important; font: 600 13px/1 var(--sl-font) !important; background: var(--sl-bg); }
.t-switch > summary:hover, .t-switch[open] > summary { background: var(--sl-hover); }