/* galleria-tokens.css · v2 — the ONE token sheet for the admin console, the Studio/runtime chrome and the meshsmith webui.
 * Ratified by Shaun 2026-09-16 (ASK-135, DECISION-072). This copy in coord is the REFERENCE; Content publishes the
 * canonical file from forge-templates, sha-addressed on the CDN, and every consumer imports it by pinned URL.
 * A hard-coded brand colour outside this sheet is a gate red. Values are desaturated for dark and contrast-checked
 * on --gg-surface-ground and --gg-surface-raised (accent 7.6:1 · body 15.8:1 · tertiary 5.0:1 · buy text 10.4:1). */
:root {
	--gg-tokens-version: "2";
	color-scheme: dark;

	/* surfaces — depth by layer, never by shadow */
	--gg-surface-ground: #0f0f12;
	--gg-surface-raised: #17171b;
	--gg-surface-raised-2: #202024;
	--gg-surface-overlay: rgba(23, 23, 27, 0.92);      /* Studio in-world panels — the scene shows through */
	--gg-hairline: rgba(255, 255, 255, 0.10);
	--gg-hairline-strong: rgba(255, 255, 255, 0.14);
	--gg-hairline-hover: rgba(255, 255, 255, 0.24);

	/* text */
	--gg-text-body: #e8e6e1;
	--gg-text-secondary: #a3a29c;
	--gg-text-tertiary: #8a8983;
	--gg-text-on-accent: #0f0f12;
	--gg-text-on-buy: #1a1208;

	/* accent — INTERACTIVE: active nav, selection, focus, links, and every tool's primary action (filled) */
	--gg-accent: #45a8f0;
	--gg-accent-bright: #86c8fa;                        /* hover text, selected text */
	--gg-accent-pressed: #2f8fd8;
	--gg-accent-fill: rgba(69, 168, 240, 0.14);         /* selection fill · pressed secondary */
	--gg-accent-fill-strong: rgba(69, 168, 240, 0.20);
	--gg-accent-border: rgba(69, 168, 240, 0.65);       /* selection border · focused input */
	--gg-accent-ring: rgba(69, 168, 240, 0.25);         /* selection ring (2px) */
	--gg-focus-ring: 0 0 0 1px var(--gg-surface-raised), 0 0 0 3px rgba(69, 168, 240, 0.60);   /* keyboard :focus-visible only */

	/* buy — CUSTOMER RUNTIME ONLY: Buy / Add to basket. Never in the tools, never for attention. */
	--gg-buy: #ffb347;
	--gg-buy-hover: #ffc266;
	--gg-buy-pressed: #f2a233;

	/* semantic states */
	--gg-state-success-text: #9fe6b6;
	--gg-state-success-fill: rgba(95, 215, 130, 0.18);
	--gg-state-attention-text: #f2d16b;                  /* TOOLS ONLY — the customer runtime draws attention with the accent */
	--gg-state-attention-fill: rgba(242, 209, 107, 0.14);
	--gg-state-attention-border: rgba(242, 209, 107, 0.50);
	--gg-state-error-text: #ffa8a3;
	--gg-state-error-fill: rgba(229, 72, 77, 0.16);
	--gg-state-error-border: rgba(229, 72, 77, 0.50);
	--gg-logo-halo: rgba(200, 80, 200, 0.30);            /* the logo's magenta drop-shadow — the logo alone */

	/* type — sans READS, mono is READ */
	--gg-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--gg-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
	--gg-size-heading: 20px;   --gg-weight-heading: 600;
	--gg-size-body: 14px;      --gg-lh-body: 1.5;
	--gg-size-panel: 12px;     --gg-lh-panel: 1.4;
	--gg-size-label: 11px;     --gg-weight-label: 500;        /* sentence case */
	--gg-size-button: 12px;    --gg-weight-button: 600;       /* sentence case */
	--gg-size-section: 11px;   --gg-weight-section: 600;  --gg-tracking-section: 0.08em;   /* the ONE tracked-caps style */
	--gg-size-mono-readout: 12px;
	--gg-size-mono-tag: 11px;  --gg-tracking-mono-tag: 0.04em;
	--gg-size-floor: 11px;                                /* nothing a person reads is smaller */

	/* radius · controls · density */
	--gg-radius-control: 4px;
	--gg-radius-row: 6px;
	--gg-radius-card: 8px;
	--gg-control-h-panel: 28px;      /* editing panels */
	--gg-control-h-form: 32px;       /* console forms */
	--gg-control-h-touch: 44px;      /* anything a customer touches */
	--gg-panel-w: 300px;

	/* motion */
	--gg-motion-fast: 120ms;         /* hover · pressed · focus · toggles */
	--gg-motion-base: 200ms;         /* folds · panels · tooltips · selection */
	--gg-motion-slow: 320ms;         /* dialogs · toasts in · page-level */
	--gg-ease-in: cubic-bezier(0.4, 0, 1, 1);      /* things leaving */
	--gg-ease-out: cubic-bezier(0, 0, 0.2, 1);     /* things arriving */

	/* states */
	--gg-disabled-opacity: 0.4;
	--gg-skeleton: rgba(255, 255, 255, 0.06);
	--gg-drag-ghost-opacity: 0.6;
	--gg-tooltip-delay: 400ms;
	--gg-toast-duration: 4000ms;

	/* icons */
	--gg-icon-stroke: 1.5px;
	--gg-icon-size-panel: 16px;
	--gg-icon-size-header: 20px;
}
@media (prefers-reduced-motion: reduce) {
	:root { --gg-motion-fast: 0ms; --gg-motion-base: 0ms; --gg-motion-slow: 0ms; }
}