/* ThinkTable source tokens. Distribute with scripts/sync-thinktable-brand.cjs. */
:root {
  --thinktable-primary: #051F17;
  --thinktable-accent: #DE6B2A;
  --thinktable-background: #FDFCF8;
  --thinktable-secondary: #535D61;
  --thinktable-surface: #FFFFFF;
  --color-bg: var(--thinktable-background);
  --color-surface: var(--thinktable-surface);
  --color-surface-elevated: var(--thinktable-surface);
  --color-surface-muted: #F0F3EE;
  --color-text-primary: var(--thinktable-primary);
  --color-text-secondary: var(--thinktable-secondary);
  --color-text-muted: #65706A;
  --color-border: #CED6CE;
  --color-border-subtle: #E5E9E2;
  --color-primary: var(--thinktable-primary);
  --color-primary-hover: #143D2F;
  --color-primary-active: #02140E;
  --color-on-primary: #FFFFFF;
  --color-accent: var(--thinktable-accent);
  --color-accent-ink: #9C4216;
  --color-accent-soft: #FCEDE2;
  --color-selected: #E4EDE5;
  --color-success: #17633C;
  --color-success-bg: #E4F2E7;
  --color-warning: #805000;
  --color-warning-bg: #FFF1CD;
  --color-danger: #B4232D;
  --color-danger-bg: #FCE8E8;
  --color-info: #235F85;
  --color-info-bg: #E7F1F8;
  --color-dark-bg: #081B14;
  --color-dark-surface: #102B20;
  --color-dark-muted-surface: #1A382C;
  --color-dark-border: #416052;
  --color-dark-text: #FDFCF8;
  --color-dark-muted: #BACCC0;
  --font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px; --space-8: 32px;
  --radius-control: 6px; --radius-panel: 10px;
  --shadow-overlay: 0 12px 40px #051F1724;
  --motion-fast: 160ms;
}
body { font-family: var(--font-ui); color: var(--color-text-primary); background: var(--color-bg); }
button, input, select, textarea { font: inherit; }
:where(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid var(--color-accent-ink) !important; outline-offset: 3px; }
:where(button, input, select, summary) { min-height: 44px; }
:where(input[type=checkbox], input[type=radio], input[type=range]) { min-height: auto; accent-color: var(--color-primary); }
:where(button, a, summary) { touch-action: manipulation; }
:where(button, a) { transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast); }
:where(button:disabled) { cursor: not-allowed; opacity: .55; }
:where(table, time, input[type=number]) { font-variant-numeric: tabular-nums; }
:where(h1, h2, h3) { text-wrap: balance; }
.tt-brand { display: grid; justify-items: start; gap: 6px; max-width: 100%; }
.tt-brand img, .tt-logo { display: block; height: auto; max-width: 100%; object-fit: contain; border-radius: 4px; }
.tt-brand small { font-size: 11px; font-weight: 650; letter-spacing: .06em; }
.tt-button { min-height: 44px; padding: 10px 16px; border: 1px solid var(--color-border); border-radius: var(--radius-control); color: var(--color-text-primary); background: var(--color-surface); cursor: pointer; font-weight: 650; }
.tt-button--primary { color: var(--color-on-primary); background: var(--color-primary); border-color: var(--color-primary); }
.tt-button--primary:hover { background: var(--color-primary-hover); }
.tt-eyebrow { color: var(--color-text-secondary); font-size: 11px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.tt-error { padding: 12px 16px; border-left: 3px solid var(--color-danger); background: var(--color-danger-bg); color: var(--color-danger); line-height: 1.5; }
.tt-loading { min-height: 320px; display: grid; place-content: center; justify-items: center; gap: 16px; padding: 24px; color: var(--color-text-primary); background: var(--color-bg); text-align: center; }
.tt-loading p { margin: 0; color: var(--color-text-secondary); }
.tt-loading progress { width: 180px; height: 5px; accent-color: var(--color-primary); }
.tt-auth { min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .85fr); background: var(--color-bg); }
.tt-auth-intro { padding: clamp(24px, 6vw, 88px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; border-right: 1px solid var(--color-border); }
.tt-auth-intro h1 { margin: 0; max-width: 620px; font-size: clamp(30px, 3.7vw, 54px); line-height: 1.08; letter-spacing: -.04em; font-weight: 650; }
.tt-auth-intro p { max-width: 470px; color: var(--color-text-secondary); line-height: 1.65; margin: 0; }
.tt-auth-intro ul { display: flex; flex-wrap: wrap; list-style: none; gap: 10px 24px; padding: 24px 0 0; margin: 0; border-top: 1px solid var(--color-border); font-size: 13px; }
.tt-auth-form-side { display: grid; align-content: center; padding: clamp(24px, 4vw, 64px); background: var(--color-surface); }
.tt-auth-form-side > * { width: min(400px, 100%); margin-inline: auto; }
.tt-auth-form-side h2 { margin: 8px 0; font-size: 28px; letter-spacing: -.03em; }
.tt-auth-form-side p { color: var(--color-text-secondary); line-height: 1.5; font-size: 14px; }
.tt-auth-form { display: grid; gap: 20px; margin-top: 24px; }
.tt-auth-form label { display: grid; gap: 8px; font-weight: 600; font-size: 14px; }
.tt-auth-form input { width: 100%; min-width: 0; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-bg); color: var(--color-text-primary); }
.tt-password { display: flex; gap: 8px; }
.tt-password input { flex: 1; }
.tt-auth-link { display: inline-block; margin-top: 24px; color: var(--color-primary); text-underline-offset: 4px; }
.tt-skip { position: fixed; top: -80px; left: 16px; z-index: 1000; background: var(--color-primary); color: white; padding: 12px; }
.tt-skip:focus { top: 12px; }
@media(max-width:760px) { .tt-auth { grid-template-columns: 1fr; } .tt-auth-intro { padding: 24px; gap: 16px; border-right: 0; border-bottom: 1px solid var(--color-border); } .tt-auth-intro h1 { font-size: 30px; } .tt-auth-intro ul { padding-top: 16px; } .tt-auth-form-side { padding: 28px 24px 48px; } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }