/* Good Bunny hub (app.goodbunny.co) global tokens. HUB-DIRECTION.md §3.
   The ONE token file for the hub. Igor lifts it as is to the hub Worker's static CSS.
   Colours = brand.md §2 light column. Spacing/sizes/motion = the plugin's admin-tokens.css scale where one exists.
   A new value goes here once, never into a component. Light only (no theme switch in Stage 1). */
:root {
  /* colour: brand.md §2 */
  --gb-h-canvas: #F0F3FF;        /* page ground */
  --gb-h-surface: #FFFFFF;       /* cards, tables, inputs */
  --gb-h-ink: #152347;           /* text; also primary button hover fill */
  --gb-h-muted: #505E7D;         /* meta, captions: 5.86 canvas / 6.48 white */
  --gb-h-action: #234AC7;        /* buttons, links, focus. 7.30 on white */
  --gb-h-on-action: #FFFFFF;
  --gb-h-tint: #E6ECFF;          /* "changed": a row that just became ready, selected radio card */
  --gb-h-line: #D5DCF0;          /* hairlines (decorative, meaning never rides on them) */
  --gb-h-line-input: #7A86A6;    /* NEW: input + quiet-button borders, 3.63 on white (WCAG 1.4.11) */
  --gb-h-success: #166F47;       /* = admin --gb-a-live */
  --gb-h-success-tint: #E7F4EE;  /* = admin --gb-a-live-tint */
  --gb-h-caution: #8A5A00;       /* = admin --gb-a-caution */
  --gb-h-caution-tint: #FCF3E0;  /* = admin --gb-a-caution-tint */
  --gb-h-error: #C62D12;         /* = admin --gb-a-danger. The only red */
  --gb-h-dot-ok: #1F9D62;        /* status DOT only, never text: the word beside it carries the meaning (hifi HIFI.md §3) */
  --gb-h-dot-warn: #E09A1F;      /* status DOT only, never text */
  --gb-h-error-tint: #FDECE8;    /* NEW (old admin ins-bg): error banner ground, error text 4.85 */

  /* hub shell (hifi HIFI.md §3, Tali 2026-10-26) */
  --gb-h-shell: #F7F8FB;         /* app ground + sidebar; row and table hover */
  --gb-h-fill: #ECEEF4;          /* active nav pill, segment track, holder chip */
  --gb-h-line-soft: #E5E8F0;     /* dividers, panel + card borders */
  --gb-h-scrim: rgba(21,35,71,.32); /* phone sheet backdrop */
  --gb-h-shadow-s: 0 1px 2px rgba(21,35,71,.06), 0 1px 1px rgba(21,35,71,.04); /* the raised (current) segment */
  --gb-h-shadow-pop: 0 16px 40px -12px rgba(21,35,71,.22), 0 2px 6px rgba(21,35,71,.06);
  /* identity hues: initials avatars + favicon tiles, picked by a hash class (.id-1..6). Ink text on all */
  --gb-h-id-1: #DFE6FB; --gb-h-id-2: #D9EFE5; --gb-h-id-3: #F5E8D3; --gb-h-id-4: #F4DFE8; --gb-h-id-5: #E5E0F6; --gb-h-id-6: #D8ECF1;

  /* the overlay's dark chrome. White-label preview, and (hifi) the bot avatar */
  --gb-h-chrome: #152347;
  --gb-h-chrome-3: #283863;
  --gb-h-chrome-text: #F0F3FF;
  --gb-h-chrome-text-2: #9AA8CC;
  --gb-h-chrome-action: #B5C7FF;
  --gb-h-pill-h: 56px;           /* = overlay --gb-pill-h */
  --gb-h-pill-logo: 20px;        /* agency logo max height on the pill */
  --gb-h-font-overlay: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Hebrew", Arial, sans-serif; /* = overlay --gb-font: the preview uses what clients really see */

  /* type: brand.md §3. Heebo = UI + body (Latin and Hebrew). Space Grotesk = H1, display, figures only */
  --gb-h-font: "Heebo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Hebrew", Arial, sans-serif;
  --gb-h-font-display: "Space Grotesk", var(--gb-h-font);
  --gb-h-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; /* keys, thumbprints, URLs */
  --gb-h-fs-meta: 13px;
  --gb-h-fs-ui: 14px;     /* tables, buttons, labels, tabs */
  --gb-h-fs-body: 16px;   /* paragraphs, inputs (16 stops iOS zoom) */
  --gb-h-fs-h2: 20px;
  --gb-h-fs-h1: 32px;     /* 28 under 600px */
  --gb-h-fs-display: 44px;/* connect host, slot figure. 30 under 600px */
  --gb-h-fs-display-s: 30px; /* the display size under 600px, named so a long Connect host can use it everywhere (CRITIQUE-PR36 M2) */
  --gb-h-fs-eyebrow: 12px;
  --gb-h-fs-micro: 11px;  /* pin number, phone badge, account-tile initials */
  --gb-h-lh: 1.5;
  --gb-h-lh-tight: 1.1;
  --gb-h-track-display: -0.03em; /* Latin only; :lang(he) resets to 0 */
  --gb-h-track-eyebrow: 0.08em;
  --gb-h-track-key: 0.04em;  /* site-key thumbprint, hub and wp-admin alike (CRITIQUE-PR36 M3) */

  /* space: admin scale (4 8 12 16 24) + three larger steps */
  --gb-h-sp-1: 4px;
  --gb-h-sp-2: 8px;
  --gb-h-sp-3: 12px;
  --gb-h-sp-4: 16px;
  --gb-h-sp-5: 24px;
  --gb-h-sp-6: 32px;
  --gb-h-sp-7: 48px;
  --gb-h-sp-8: 64px;

  /* shape + size */
  --gb-h-r-s: 4px;        /* = admin r-m: key box, tags */
  --gb-h-r-xs: 6px;       /* nav-pill inner, segment button, thumbnail, account tile */
  --gb-h-r-m: 8px;        /* cards, inputs, banners */
  --gb-h-r-l: 12px;       /* app panel, site cards, phone sheet */
  --gb-h-r-pill: 999px;   /* buttons (echoes the overlay pill) */
  --gb-h-hair: 1px;
  --gb-h-btn-h: 40px;     /* = admin btn-h */
  --gb-h-btn-h-l: 48px;   /* sign-in, connect, mobile primary */
  --gb-h-field-h: 44px;
  --gb-h-row-min: 56px;
  --gb-h-top-h: 64px;
  --gb-h-nav-h: 32px;     /* sidebar item height */
  --gb-h-side-w: 240px;
  --gb-h-av-xs: 20px; --gb-h-av-s: 24px; --gb-h-av-m: 32px;
  --gb-h-ctl-h: 36px;     /* toolbar controls: segments, site filter (btn-h 40 stays for forms) */
  --gb-h-icon: 16px;      /* the bunny glyph that replaces the dot on a row where Good Bunny is the actor (= overlay --gb-icon) */
  --gb-h-thumb-w: 96px;   /* note-row page thumbnail, 16:10 (72 on phone) */
  --gb-h-thumb-s: 64px;   /* Sites rows thumbnail */
  --gb-h-tile-l: 56px;    /* favicon tile on a card with no screenshot yet */
  --gb-h-pin: 18px;       /* note pin on a thumbnail */
  --gb-h-shot-ratio: 16 / 10; /* every page screenshot frame; the image is cropped to it (object-fit: cover, top) */
  --gb-h-col-site: 176px; /* inbox row columns: site chip, holder */
  --gb-h-col-holder: 112px;
  --gb-h-panel-w: 384px;     /* review side panel (= the on-page card's --gb-panel-w) */
  --gb-h-frame-desk: 1280px; /* the logical width the desktop frame renders at before it is scaled to its column */
  --gb-h-frame-phone: 390px; /* the phone frame width */
  --gb-h-bar-h: var(--gb-h-top-h); /* phone bottom bar */
  --gb-h-dot: 8px;
  --gb-h-wrap: 1120px;    /* account pages: content column inside the panel */
  --gb-h-narrow: 440px;   /* sign-in, connect, invite accept */
  --gb-h-logo-h: 24px;    /* lockup 154px wide, above the 120px minimum */
  --gb-h-ring: 2px;
  --gb-h-ring-offset: 2px;

  /* motion: brand.md §5 */
  --gb-h-t: 160ms;
  --gb-h-t-slow: 240ms;
  --gb-h-pulse: gb-pulse 1200ms var(--gb-h-ease) infinite alternate; /* waiting dot; keyframes in hub.css */
  --gb-h-ease: cubic-bezier(.2,.8,.2,1);

  /* auth + onboarding split (hub redesign 2026-10-28): the brand field and its layout */
  /* the brand field: the auth panel and the onboarding rail. The ONE place the action blue is a surface, not something to press.
     An alias, so the field and the buttons can never drift apart */
  --gb-h-field: var(--gb-h-action);
  --gb-h-on-field: var(--gb-h-on-action);       /* text + lockup on the field: 7.30 */
  --gb-h-on-field-2: rgba(255,255,255,.76);     /* secondary text on the field: 4.94 (AA) */
  --gb-h-line-field: rgba(255,255,255,.24);     /* hairline on the field, decorative only */

  /* layout */
  --gb-h-auth-cols: minmax(0, 7fr) minmax(0, 5fr); /* panel | form column, auth screens (= direction C split) */
  --gb-h-rail-w: 320px;                            /* onboarding: the narrow field rail that carries the steps */
  --gb-h-moment-w: 560px;                          /* panel 1: the client page in the product moment, max width */
  --gb-h-note-w: 288px;                            /* panel 1: the note card on the field (= 3/4 of the real --gb-h-panel-w) */
  --gb-h-band-1: 280px;                            /* panel 1 under 900: the band crops the page to this height */
}
:lang(he) { --gb-h-track-display: 0; --gb-h-track-eyebrow: 0; }
@media (max-width: 900px) { :root { --gb-h-moment-w: 100%; } }
@media (max-width: 600px) { :root { --gb-h-fs-h1: 28px; --gb-h-fs-display: var(--gb-h-fs-display-s); --gb-h-thumb-w: 72px; } }
@media (prefers-reduced-motion: reduce) { :root { --gb-h-t: 0ms; --gb-h-t-slow: 0ms; --gb-h-pulse: none; } }