/*
* zbase.css — zbifrost-client structural baseline
*
* Always injected by bifrost_core.js on startup. Provides only what the
* rendering runtime NEEDS to function: reset, grid, flex, tabs, nav-pills,
* spacing helpers, and spinners. No colors. No typography scale. No component
* aesthetics — those are the app's responsibility.
*
* Sections:
* 0. Base color tokens (SSOT — --color-*)
* 1. Reset
* 2. Grid (zRow / zCol / zCol-auto — minimal, used by zDash)
* 3. Gutters (zG-0 only)
* 4. Flex utilities
* 5. Display helpers (.zD-flex, .zD-block, etc.)
* 6. Spacing helpers (.zm-*, .zp-*, .zme-*, .zms-*)
* 7. Tabs (.zTab-content / .zTab-pane / .zActive)
* 8. Nav (.zNav / .zNav-pills / .zFlex-column)
* 9. Spinner (.zSpinner-border / .zSpinner-border-sm)
* 10. Misc runtime helpers (.zVisually-hidden, .zContainer-fluid)
*/
/* ─── 0. Base color tokens — SSOT ──────────────────────────────────────────── */
/* The canonical zCLI palette, mirrored from zSys/formatting/colors.py. Every
* var(--color-*) reference below (zText-*, zBtn-*, fields, blockquote, links)
* resolves here so Bifrost output matches the terminal. Apps re-skin by
* redefining any of these in a later stylesheet (zCanvas / zBrush). */
:root {
--color-primary: #A2D46E; /* Intention — the heart of zCLI */
--color-secondary: #9370DB; /* Validation — structure & elegance */
--color-info: #5CA9FF; /* Perception — clarity & understanding */
--color-success: #52B788; /* Manifestation — organic & vibrant */
--color-warning: #FFB347; /* Caution — warm & approachable */
--color-error: #E63946; /* Decisive — clear & strong */
/* Light hues — pastel fills derived once from the base palette. Reuse anywhere
* a soft tint of a brand colour is needed (signals, badges, highlights) rather
* than re-mixing per component. SSOT: change the base above, these follow. */
--color-primary-light: color-mix(in srgb, var(--color-primary) 14%, #fff);
--color-secondary-light: color-mix(in srgb, var(--color-secondary) 14%, #fff);
--color-info-light: color-mix(in srgb, var(--color-info) 14%, #fff);
--color-success-light: color-mix(in srgb, var(--color-success) 14%, #fff);
--color-warning-light: color-mix(in srgb, var(--color-warning) 14%, #fff);
--color-error-light: color-mix(in srgb, var(--color-error) 14%, #fff);
/* Default document/body text — page-level ink for bare zText,
, headings
* (zH0–zH6), and ul/ol/dl items that carry NO zOS color property. Soft
* near-black (never pure #000) so it reads deliberately on light doc pages.
* Dark CARDS (zTable/zTerminal) set their own --ink; a dark theme re-skins by
* redefining --text once. SSOT for "the default text colour". */
--text: #1d2230;
/* Opaque page background — SSOT for "what colour is the page behind the
* chrome". A FLOATING bar (sticky global navbar, dropdowns) mixes its own
* frosted surface from THIS, never from currentColor — currentColor is the
* page ink, so a transparent bar would let dark cards / dark sections bleed
* straight through and the links vanish. Dark theme / apps re-skin once. */
--page-bg: #ffffff;
/* Neutral foundation — surfaces, ink & lines on the dark zOS canvas.
* SSOT for every NON-accent value so no component carries raw rgba/hex.
* Apps re-skin the whole chrome by redefining these once. */
--ink: #f9fafb; /* primary text on dark */
--ink-muted: rgba(255, 255, 255, 0.65); /* secondary / captions */
--ink-faint: rgba(255, 255, 255, 0.45); /* placeholders / hints */
--surface-1: rgba(255, 255, 255, 0.04); /* raised panel */
--surface-2: rgba(255, 255, 255, 0.08); /* input / hover fill */
--border: rgba(255, 255, 255, 0.12); /* hairline divider */
--border-strong: rgba(255, 255, 255, 0.18); /* field / control outline*/
--shadow: rgba(0, 0, 0, 0.20); /* ambient drop shadow */
--surface-base: #1e1e2e; /* opaque dark CARD base — event cards
(zTable, zTerminal…) read identically
on a light OR dark page, not page-tied */
--surface-field: #26263a; /* opaque FIELD surface — inputs read as a
dark island on light pages AND stay
distinct (a touch lighter) inside dark
cards. Same balance as --surface-base. */
--surface-field-focus: #2d2d46; /* field surface on focus (slightly lifted) */
/* Canonical spacing scale — SSOT for every margin/padding rhythm across
* events. Mirrors the zCLI step scale. Events consume these vars directly;
* nothing hand-applies a utility class. Apps re-rhythm by redefining once. */
--space-0: 0;
--space-1: 0.25rem; /* 4px */
--space-2: 0.5rem; /* 8px */
--space-3: 0.75rem; /* 12px */
--space-4: 1rem; /* 16px */
--space-5: 1.5rem; /* 24px */
/* Heading type scale — SSOT for the zH0–zH6 sizes (zCLI parity). */
--h0-size: clamp(2.5rem, 5vw, 4rem);
--h1-size: 2.5rem;
--h2-size: 2rem;
--h3-size: 1.75rem;
--h4-size: 1.5rem;
--h5-size: 1.25rem;
--h6-size: 1rem;
}
/* ─── 1. Reset ─────────────────────────────────────────────────────────────── */
*,
*::before,
*::after { box-sizing: border-box; }
html {
font-family: sans-serif;
line-height: 1.15;
}
body {
margin: 0;
padding: 0;
min-height: 100vh;
overflow-x: hidden;
font-size: 1rem;
line-height: 1.5;
/* Default text colour (SSOT) — bare zText/