/* Structure V2 tokens · brand kit r4 (2026-10-21): direction A "Quiet Instrument" + glass moments.
 * Generated by design/tokens/build_tokens.py. SELF-CONTAINED (since kit r2): every value resolves with no
 * other stylesheet. Structure palette roles, springs and the e3 glass shadow are restated here.
 * In the app, the protected themes.css may load first and swap palettes; nothing here depends on it.
 * Fonts: ./fonts/ (Inter 4 variable, Inter Display 400/500/600, JetBrains Mono variable; OFL 1.1; Latin-subset in kit r4). */
@font-face { font-family: 'InterV2'; src: url('fonts/InterVariable.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('fonts/InterDisplay-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('fonts/InterDisplay-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('fonts/InterDisplay-SemiBold.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('fonts/JetBrainsMono-Variable-latin.woff2') format('woff2'); font-weight: 400 600; font-display: swap; }

:root:not([data-theme]), :root[data-theme="structure"] {
  --theme-bg: #0b1222;
  --theme-sidebar: #080f1c;
  --theme-raised: #141f36;
  --theme-panel: #101a2d;
  --theme-hover: #1b2b47;
  --theme-line: #2b3a55;
  --theme-border-strong: #657b9e;
  --theme-text: #f2f6ff;
  --theme-secondary: #a3afc6;
  --theme-muted: #91a1bd;
  --theme-accent: #1767d2;
  --theme-accent-pressed: #1259b9;
  --theme-link: #b4cafa;
  --theme-accent-soft: #142b4c;
  --theme-on-accent: #f2f6ff;
  --theme-bubble: #1d3152;
  --theme-danger: #ff9d99;
  --theme-danger-soft: #35232c;
  --theme-danger-border: #85505b;
  --theme-success: #80d8b0;
  --theme-warning: #f4c477;
  --theme-info: #b4cafa;
  --theme-warning-soft: #30291e;
  --theme-code: #080f1c;
  --theme-overlay: #050a16b3;
  --theme-shadow: #03081366;
  --theme-shadow-soft: #03081326;
  --theme-focus-soft: #b4cafa66;
  --theme-halo: #1767d21a;
}
:root[data-theme="light"] {
  --theme-bg: #f7f9ff;
  --theme-sidebar: #edf2fa;
  --theme-raised: #ffffff;
  --theme-panel: #f8faff;
  --theme-hover: #dfe8f7;
  --theme-line: #d4deee;
  --theme-border-strong: #7488a6;
  --theme-text: #141f36;
  --theme-secondary: #505f78;
  --theme-muted: #536178;
  --theme-accent: #1767d2;
  --theme-accent-pressed: #0f56b5;
  --theme-link: #145cb8;
  --theme-accent-soft: #e9f0ff;
  --theme-on-accent: #ffffff;
  --theme-bubble: #e7effc;
  --theme-danger: #b5293a;
  --theme-danger-soft: #fff0f2;
  --theme-danger-border: #d4a0a9;
  --theme-success: #226c4b;
  --theme-warning: #745018;
  --theme-info: #145dbd;
  --theme-warning-soft: #fff3db;
  --theme-code: #edf2fa;
  --theme-overlay: #0b122266;
  --theme-shadow: #141f3622;
  --theme-shadow-soft: #141f3610;
  --theme-focus-soft: #1767d266;
  --theme-halo: #1767d218;
}

:root {
  /* color: semantic roles (all reference structure.json roles) */
  --v2-surface-canvas: var(--theme-bg); /* I1 */
  --v2-surface-sidebar: var(--theme-sidebar); /* I1 */
  --v2-surface-panel: var(--theme-panel); /* I1 */
  --v2-surface-raised: var(--theme-raised); /* I1,I10 */
  --v2-surface-hover: var(--theme-hover); /* I10 */
  --v2-surface-selected: var(--theme-accent-soft); /* I12 */
  --v2-surface-bubble-user: var(--theme-accent); /* D4 */
  --v2-surface-bubble-assistant: var(--theme-raised); /* D4; light below */
  --v2-surface-code: var(--theme-code); /* I9 */
  --v2-text-primary: var(--theme-text); /* I1 */
  --v2-text-secondary: var(--theme-secondary); /* I1,I15c */
  --v2-text-muted: var(--theme-muted); /* I1 */
  --v2-text-link: var(--theme-link); /* I1 */
  --v2-text-on-bubble-user: #ffffff; /* D4,I8 */
  --v2-text-on-accent: #ffffff; /* I8,K4 */
  --v2-border-subtle: var(--theme-line); /* I3 */
  --v2-border-control: var(--theme-border-strong); /* I8 */
  --v2-focus-ring: var(--theme-link); /* I6 */
  --v2-status-success: var(--theme-success); /* I15d */
  --v2-status-warning: var(--theme-warning); /* I2 */
  --v2-status-warning-soft: var(--theme-warning-soft); /* I2 */
  --v2-status-danger: var(--theme-danger); /* I2 */
  --v2-status-danger-soft: var(--theme-danger-soft); /* I2 */
  --v2-status-danger-border: var(--theme-danger-border); /* I2 */
  --v2-status-info: var(--theme-info); /* I2 */
  --v2-status-info-soft: var(--theme-accent-soft); /* I2,I15f */
  --v2-activity-spinner: var(--theme-accent); /* D8 */
  --v2-overlay-scrim: var(--theme-overlay); /* - */
  --v2-shadow-color: var(--theme-shadow); /* I2.5 */
  --v2-shadow-soft: var(--theme-shadow-soft); /* I2.5 */
  --v2-state-hover-overlay: color-mix(in srgb, var(--theme-text) 8%, transparent); /* I10 */
  --v2-state-press-overlay: color-mix(in srgb, var(--theme-text) 13%, transparent); /* I10 */
  --v2-state-history-selected: color-mix(in srgb, var(--theme-text) 8%, transparent); /* I12 */
  --v2-state-disabled-opacity: var(--v2-opacity-disabled); /* K4-r4 */
  /* space (4px base) I11 */
  --v2-space-0: 0px;
  --v2-space-hair: 2px;
  --v2-space-1: 4px;
  --v2-space-2: 8px;
  --v2-space-3: 12px;
  --v2-space-4: 16px;
  --v2-space-5: 20px;
  --v2-space-6: 24px;
  --v2-space-8: 32px;
  --v2-space-10: 40px;
  --v2-space-12: 48px;
  --v2-space-16: 64px;
  --v2-font-sans: 'InterV2', 'Inter', system-ui, sans-serif;
  --v2-font-body: var(--v2-font-sans); /* Inter: everything under 24px */
  --v2-font-display: 'Inter Display', 'InterV2', 'Inter', system-ui, sans-serif; /* 24px and up ONLY */
  --v2-font-mono: 'JetBrains Mono', ui-monospace, monospace;
  /* type ramp: size / line-height / weight / tracking  I4, I5 */
  --v2-type-micro: 500 11px/16px var(--v2-font-sans); --v2-track-micro: 0.005em;
  --v2-type-caption: 400 12px/16px var(--v2-font-sans); --v2-track-caption: 0.0em;
  --v2-type-ui: 400 13px/20px var(--v2-font-sans); --v2-track-ui: -0.003em;
  --v2-type-body: 400 14px/20px var(--v2-font-sans); --v2-track-body: -0.006em;
  --v2-type-transcript: 400 15px/24px var(--v2-font-sans); --v2-track-transcript: -0.009em;
  --v2-type-title: 600 17px/24px var(--v2-font-sans); --v2-track-title: -0.013em;
  --v2-type-page: 600 22px/28px var(--v2-font-sans); --v2-track-page: -0.018em;
  --v2-type-display: 600 30px/36px var(--v2-font-display); --v2-track-display: -0.021em;
  /* radius I3 */
  --v2-radius-small: 6px;
  --v2-radius-control: 12px;
  --v2-radius-outer: 18px;
  --v2-radius-pill: 999px;
  --v2-radius-living-card: 24px;
  /* elevation */
  --v2-shadow-e1: 0 1px 2px var(--theme-shadow-soft);
  --v2-shadow-e2: 0 1px 2px var(--theme-shadow-soft), 0 10px 28px -8px var(--theme-shadow);
  --v2-shadow-e3: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(0,0,0,.22), inset 0 10px 28px -14px color-mix(in srgb, var(--theme-link) 16%, transparent), 0 1px 2px var(--theme-shadow-soft), 0 10px 28px -8px var(--theme-shadow), 0 28px 64px -20px var(--theme-shadow); /* = protected --glass-shadow, restated */
  /* z-index I2.6 */
  --v2-z-base: 0;
  --v2-z-raised: 1;
  --v2-z-sticky: 10;
  --v2-z-rail: 20;
  --v2-z-header: 30;
  --v2-z-composer: 40;
  --v2-z-popover: 100;
  --v2-z-sheet: 200;
  --v2-z-overlay: 300;
  --v2-z-toast: 400;
  --v2-z-tooltip: 500;
  /* motion I7 (durations restate protected --dur-* plus send/status) */
  --v2-dur-press-down: 90ms;
  --v2-dur-quick: 140ms;
  --v2-dur-exit: 160ms;
  --v2-dur-base: 220ms;
  --v2-dur-page: 280ms;
  --v2-dur-send: 300ms;
  --v2-dur-sheet: 420ms;
  --v2-dur-press-up: 470ms;
  --v2-dur-status-min-dwell: 2400ms;
  --v2-dur-spinner-turn: 900ms;
  --v2-ease-out: cubic-bezier(.22,1,.36,1);
  --v2-ease-in: cubic-bezier(.4,0,1,1);
  --v2-ease-standard: cubic-bezier(.2,0,0,1);
  --v2-press: transform var(--v2-dur-press-down) var(--v2-ease-out); /* press down */
  --v2-spring-bouncy: linear(0, 0.022, 0.078, 0.157, 0.249, 0.347, 0.446, 0.54, 0.628, 0.708, 0.778, 0.838, 0.888, 0.93, 0.963, 0.988, 1.007, 1.021, 1.03, 1.036, 1.038, 1.038, 1.037, 1.034, 1.031, 1.027, 1.024, 1.02, 1.016, 1.013, 1.01, 1.008, 1);
  --v2-spring-snappy: linear(0, 0.012, 0.043, 0.089, 0.143, 0.204, 0.268, 0.332, 0.396, 0.458, 0.516, 0.572, 0.623, 0.67, 0.713, 0.752, 0.786, 0.818, 0.845, 0.869, 0.89, 0.909, 0.925, 0.938, 0.95, 0.96, 0.968, 0.976, 0.981, 0.986, 0.99, 0.993, 1);
  --v2-release: transform var(--v2-dur-press-up) var(--v2-spring-bouncy); /* release spring */
  --v2-hover: background-color var(--v2-dur-quick) var(--v2-ease-out), color var(--v2-dur-quick) var(--v2-ease-out);
  --v2-send: var(--v2-dur-send) var(--v2-ease-out);
  /* composer: FINAL = app composer as-is (68 min / r18); only the send button changes */
  --v2-composer-min-height: 68px; --v2-composer-radius: 18px; --v2-send-size: 44px; --v2-send-scale-in: 140ms;
  --v2-message-action: 28px; --v2-regen-previous-opacity: .6;
  --v2-presence-icon: 48px; --v2-presence-pill-h: 28px; --v2-presence-width-dur: 240ms; --v2-presence-fade: 180ms; --v2-presence-dwell: 2400ms; --v2-header-height-presence: 96px; --v2-header-avatar: 48px;
  --v2-rail-collapsed: 56px; --v2-badge-min: 16px; --v2-badge-ring: 2px; --v2-approval-timeout: 600000ms; --v2-approval-final: 60000ms; --v2-approval-collapse: 240ms;
  /* focus I6 */
  --v2-focus-width: 2px; --v2-focus-offset: 2px;
  /* icons I14: Tabler outline, 16/20 only */
  --v2-icon-sm: 16px; --v2-icon-md: 20px; --v2-icon-stroke: 1.6;
  /* action (buttons, Raycast pass), card glass, accent glow  (kit r2) */
  --v2-action-primary: rgba(255,255,255,.10);
  --v2-action-primary-hover: rgba(255,255,255,.18);
  --v2-action-primary-pressed: rgba(255,255,255,.24);
  --v2-action-primary-border-hover: color-mix(in srgb, var(--theme-link) 80%, transparent);
  --v2-action-primary-border: color-mix(in srgb, var(--theme-link) 55%, transparent);
  --v2-on-action-primary: var(--theme-text);
  --v2-action-secondary-border: rgba(255,255,255,.14);
  --v2-action-secondary-border-hover: rgba(255,255,255,.28);
  --v2-action-ghost-hover: rgba(255,255,255,.06);
  --v2-action-accent: var(--theme-accent);
  --v2-on-action-accent: #ffffff;
  --v2-accent-glow: color-mix(in srgb, var(--theme-accent) 24%, transparent);
  --v2-card-glass-fill: rgba(255,255,255,.04);
  --v2-card-glass-border: rgba(255,255,255,.08);
  --v2-card-glass-highlight: rgba(255,255,255,.06);
  --v2-card-glass-solid: #1d283e;
  --v2-hairline: rgba(255,255,255,.08);
  --v2-action-danger-fill: rgba(255,157,153,.16);
  --v2-action-danger-border: rgba(255,157,153,.60);
  --v2-card-radius: 12px; --v2-card-pad: 12px; --v2-card-gap: 8px; --v2-card-glass-blur: 24px; --v2-card-glass-saturate: 140%;
  /* kit r4: ONE disabled opacity; old names alias it */
  --v2-opacity-disabled: .40;
  --v2-btn-h: 32px; --v2-btn-h-sm: 28px; --v2-btn-radius: 8px; --v2-btn-pad: 0 12px; --v2-btn-pad-sm: 0 8px; --v2-keycap-h: 18px; --v2-keycap-radius: 4px; --v2-btn-disabled-opacity: var(--v2-opacity-disabled);
  /* kit r4: glass buttons (hover visibly distinct) + accent glass (the ONE marketing hero CTA) */
  --v2-btn-glass-fill: var(--v2-action-primary);
  --v2-btn-glass-fill-hover: var(--v2-action-primary-hover);
  --v2-btn-glass-fill-pressed: var(--v2-action-primary-pressed);
  --v2-btn-glass-border: var(--v2-action-secondary-border);
  --v2-btn-glass-border-hover: var(--v2-action-secondary-border-hover);
  --v2-btn-highlight: inset 0 1px 0 rgba(255,255,255,.08);
  --v2-btn-accent-glass-fill: color-mix(in srgb, var(--v2-action-accent) 16%, transparent);
  --v2-btn-accent-glass-fill-hover: color-mix(in srgb, var(--v2-action-accent) 28%, transparent);
  --v2-btn-accent-glass-fill-pressed: color-mix(in srgb, var(--v2-action-accent) 34%, transparent);
  --v2-btn-accent-glass-border: color-mix(in srgb, var(--theme-link) 70%, transparent);
  --v2-btn-accent-glass-border-hover: var(--theme-link);
  --v2-on-btn-accent-glass: #ffffff;
  /* kit r4: marketing button + matching input (44, 48 at <=640px) */
  --v2-btn-mkt-h: 44px; --v2-input-mkt-h: 44px; --v2-btn-mkt-pad: 0 20px; --v2-btn-mkt-radius: 10px; --v2-btn-mkt-label: 500 15px/20px var(--v2-font-body); --v2-btn-mkt-track: -0.009em;
  --v2-send-ready-fill: #f2f6ff; --v2-send-ready-ink: #0b1222; --v2-send-ready-hover: #d6dbe4; --v2-send-ready-pressed: #c4c8d3; --v2-send-b-ready-fill: var(--v2-send-ready-fill); --v2-send-b-ready-ink: var(--v2-send-ready-ink);
  --v2-keeper-header: 48px; --v2-keeper-fade: 240ms; --v2-keeper-dwell: 2400ms; --v2-keeper-blur-pause: 30000ms; --v2-keeper-menu: 64px; --v2-keeper-backdrop: #c4cfd9;
  /* marketing (landing, kit r2) */
  --v2-mkt-display-xl: 600 56px/64px var(--v2-font-display); --v2-mkt-track-display-xl: -0.022em;
  --v2-mkt-display-2xl: 600 64px/72px var(--v2-font-display); --v2-mkt-track-display-2xl: -0.022em;
  --v2-mkt-lede: 400 17px/28px var(--v2-font-body); --v2-mkt-track-lede: -0.013em;
  --v2-mkt-display-sm: 600 40px/48px var(--v2-font-display); --v2-mkt-track-display-sm: -0.02em; /* kit r4: <=640px hero */
  --v2-mkt-display-hero: var(--v2-mkt-display-xl); --v2-mkt-track-display-hero: -0.022em; /* kit r4: switches to display-sm at <=640px */
  --v2-mkt-section-pad: 128px; --v2-mkt-page-max: 1120px;
  /* layout */
  --v2-rail-width: 236px; --v2-header-height: 44px; --v2-column: 704px; --v2-gutter-time: 64px;
}
:root[data-theme="light"] {
  --v2-surface-bubble-assistant: var(--theme-hover);
  --v2-state-hover-overlay: color-mix(in srgb, var(--theme-text) 6%, transparent);
  --v2-state-press-overlay: color-mix(in srgb, var(--theme-text) 10%, transparent);
  --v2-state-history-selected: color-mix(in srgb, var(--theme-text) 6%, transparent);
  --v2-action-primary: rgba(0,0,0,.06);
  --v2-action-primary-hover: rgba(0,0,0,.15);
  --v2-action-primary-pressed: rgba(0,0,0,.20);
  --v2-action-primary-border-hover: var(--theme-link);
  --v2-action-primary-border: var(--theme-accent);
  --v2-action-secondary-border: rgba(0,0,0,.14);
  --v2-action-secondary-border-hover: rgba(0,0,0,.28);
  --v2-action-ghost-hover: rgba(0,0,0,.05);
  --v2-accent-glow: color-mix(in srgb, var(--theme-accent) 14%, transparent);
  --v2-card-glass-fill: rgba(255,255,255,.60);
  --v2-card-glass-border: rgba(0,0,0,.08);
  --v2-card-glass-highlight: rgba(255,255,255,.70);
  --v2-card-glass-solid: #f2f6fc;
  --v2-hairline: rgba(0,0,0,.08);
  --v2-action-danger-fill: rgba(181,41,58,.14);
  --v2-action-danger-border: rgba(181,41,58,.70);
  --v2-btn-highlight: inset 0 1px 0 rgba(255,255,255,.70);
  --v2-btn-accent-glass-fill-pressed: color-mix(in srgb, var(--v2-action-accent) 32%, transparent);
  --v2-btn-accent-glass-border: var(--v2-action-accent);
  --v2-on-btn-accent-glass: var(--theme-text);
  --v2-shadow-e3: inset 0 1px 0 rgba(255,255,255,.85), inset 0 -1px 0 rgba(0,0,0,.07), inset 0 10px 28px -14px color-mix(in srgb, var(--theme-link) 16%, transparent), 0 1px 2px var(--theme-shadow-soft), 0 10px 28px -8px var(--theme-shadow), 0 28px 64px -20px var(--theme-shadow);
  --v2-send-ready-fill: #141f36; --v2-send-ready-ink: #ffffff; --v2-send-ready-hover: #2f394e; --v2-send-ready-pressed: #414b5e;
}
@media (max-width: 640px) {
  :root { --v2-btn-mkt-h: 48px; --v2-input-mkt-h: 48px; --v2-mkt-display-hero: var(--v2-mkt-display-sm); --v2-mkt-track-display-hero: -0.02em; }
}
:focus-visible { outline: var(--v2-focus-width) solid var(--v2-focus-ring); outline-offset: var(--v2-focus-offset); }
.glass :focus-visible, .glass-thick :focus-visible { outline-color: var(--glass-focus-ink, var(--v2-focus-ring)); }