/* Orq OS design tokens — mirrored from frontend/app/globals.css.
   Space-separated RGB triplets consumed as rgb(var(--c-x) / alpha). */

:root {
  /* Light — "Stitch Editorial Intelligence" (default) */
  --c-bg: 250 249 245;
  --c-shell: 226 227 218;
  --c-surface: 244 244 240;
  --c-surface-high: 233 232 228;
  --c-surface-raised: 223 225 215;
  --c-border: 197 199 191;
  --c-text: 27 28 26;
  --c-muted: 92 95 88;          /* "subtle" text */
  --c-faint: 117 120 113;       /* "muted" text */
  --c-accent: 60 68 55;
  --c-accent-light: 89 97 83;
  --c-accent-strong: 83 91 77;
  --c-accent-fg: 255 255 255;
  --c-success: 58 122 74;
  --c-warning: 138 106 32;
  --c-danger: 186 26 26;
  --c-elevated: 255 255 255;
  --ghost-border: rgba(69, 72, 65, 0.12);
  --ghost-border-strong: rgba(69, 72, 65, 0.22);
  --composer-shadow: 0 2px 10px rgba(27, 28, 26, 0.06);
  --hex-border: #c5c7bf;
  /* provider brand inks that flip per theme */
  --brand-codex: 17 17 17;
  --brand-gemini: 201 138 27;
  --brand-cursor: 17 17 17;
}

html.dark {
  --c-bg: 18 20 19;
  --c-shell: 13 15 14;
  --c-surface: 30 32 31;
  --c-surface-high: 40 42 41;
  --c-surface-raised: 51 53 52;
  --c-border: 60 74 70;
  --c-text: 226 227 224;
  --c-muted: 186 202 197;
  --c-faint: 133 148 144;
  --c-accent: 87 241 219;
  --c-accent-light: 167 255 241;
  --c-accent-strong: 45 212 191;
  --c-accent-fg: 0 55 49;
  --c-success: 78 222 163;
  --c-warning: 255 210 159;
  --c-danger: 255 180 171;
  --c-elevated: 30 32 31;
  --ghost-border: rgba(133, 148, 144, 0.18);
  --ghost-border-strong: rgba(133, 148, 144, 0.35);
  --composer-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
  --hex-border: #3c4a46;
  --brand-codex: 105 240 174;
  --brand-gemini: 255 227 147;
  --brand-cursor: 192 132 252;
}

html.dark.obsidian {
  --c-bg: 14 14 19;
  --c-shell: 10 10 15;
  --c-surface: 25 25 31;
  --c-surface-high: 37 37 45;
  --c-surface-raised: 48 47 53;
  --c-border: 72 71 77;
  --c-text: 249 245 253;
  --c-muted: 172 170 177;
  --c-faint: 85 84 91;
  --c-accent: 255 209 111;
  --c-accent-light: 255 227 147;
  --c-accent-strong: 238 178 0;
  --c-accent-fg: 61 43 0;
  --c-success: 105 240 175;
  --c-warning: 255 211 58;
  --c-danger: 255 113 81;
  --c-elevated: 25 25 31;
  --ghost-border: rgba(255, 209, 111, 0.08);
  --ghost-border-strong: rgba(255, 209, 111, 0.18);
  --hex-border: #48474d;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { height: 100%; }

body {
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  background: rgb(var(--c-bg));
  color: rgb(var(--c-text));
  font-size: 14px;
  overflow: hidden;
}

.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-variant-numeric: tabular-nums;
}

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-thumb { background: var(--hex-border); border-radius: 3px; }
::-webkit-scrollbar-track { background: transparent; }
* { scrollbar-width: thin; scrollbar-color: var(--hex-border) transparent; }

button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
input, select { font: inherit; color: inherit; }
input:focus, select:focus { outline: none; }

.ghost-b { border: 1px solid var(--ghost-border); }
.ghost-b-strong { border: 1px solid var(--ghost-border-strong); }

.glass-strong { background: rgb(var(--c-bg) / 0.94); backdrop-filter: blur(32px); }

.gradient-btn {
  background: rgb(var(--c-accent));
  color: rgb(var(--c-accent-fg));
  font-weight: 600;
  transition: all 0.2s ease;
}
.gradient-btn:hover { opacity: 0.9; box-shadow: 0 0 12px rgb(var(--c-accent) / 0.15); }

.shadow-glow { box-shadow: 0 0 12px rgb(var(--c-accent) / 0.08); }
.shadow-glow-lg { box-shadow: 0 0 24px rgb(var(--c-accent) / 0.12); }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes dialogScaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
@keyframes pingRing { 75%, 100% { transform: scale(2); opacity: 0; } }
.anim-fade { animation: fadeIn 0.15s ease; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}