/* ==========================================================================
   ShortLink design tokens
   One source of truth for color, type, spacing, radius, elevation and motion.
   Brand colors (--brand*, --accent*, --focus) are overridden by /brand.css.
   ========================================================================== */
:root {
  /* Brand (defaults; replaced at runtime by /brand.css) */
  --brand: #2F5BEA;
  --brand-hover: #2549C4;
  --brand-soft: rgba(47, 91, 234, .11);
  --brand-contrast: #FFFFFF;
  --accent: #0E9F6E;
  --accent-soft: rgba(14, 159, 110, .12);
  --focus: 0 0 0 3px rgba(47, 91, 234, .35);

  /* Signature colors */
  --ink: #0B2350;          /* deep navy: navigation, hero bands */
  --ink-2: #12306A;
  --ink-text: #FFFFFF;
  --ink-muted: rgba(255, 255, 255, .72);
  --ink-line: rgba(255, 255, 255, .12);
  --highlight: #FFD66E;    /* warm marker used sparingly for emphasis */

  /* Surfaces & text */
  --canvas: #F4F6FB;
  --surface: #FFFFFF;
  --surface-2: #F0F3F9;
  --surface-3: #E7ECF5;
  --line: #E1E6EF;
  --line-strong: #C9D2E0;
  --text: #0E1A30;
  --text-2: #45526A;
  --text-3: #5F6B82;

  /* Semantic */
  --success: #11704F; --success-bg: #E5F5EE; --success-line: #B9E3D0;
  --warning: #8A5200; --warning-bg: #FFF3D9; --warning-line: #F5D79A;
  --danger: #B42318;  --danger-bg: #FDECEA;  --danger-line: #F6C3BE;
  --info: #1C58C7;    --info-bg: #E8F0FE;    --info-line: #BED3FA;
  --neutral: #3A475E; --neutral-bg: #EDF0F6; --neutral-line: #D5DBE6;

  /* Typography */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --fs-xs: .75rem;    /* 12 */
  --fs-sm: .8125rem;  /* 13 */
  --fs-md: .9375rem;  /* 15 base */
  --fs-lg: 1.0625rem; /* 17 */
  --fs-xl: 1.25rem;   /* 20 */
  --fs-2xl: 1.625rem; /* 26 */
  --fs-3xl: 2.125rem; /* 34 */
  --fs-display: clamp(2.25rem, 1.4rem + 3.4vw, 3.75rem);
  --lh-tight: 1.2;
  --lh: 1.55;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;

  /* Spacing (4px grid) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;

  /* Shape & elevation */
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(14, 26, 48, .05), 0 0 0 1px rgba(14, 26, 48, .02);
  --shadow-2: 0 6px 18px -6px rgba(14, 26, 48, .14);
  --shadow-3: 0 18px 44px -12px rgba(14, 26, 48, .28);

  /* Sizing */
  --control-h: 42px;
  --control-h-sm: 34px;
  --nav-w: 264px;
  --topbar-h: 64px;
  --content-max: 1240px;

  /* Motion */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-fast: 120ms;
  --t: 200ms;

  color-scheme: light;
}

/* Dark appearance: follows the device unless the user picked a theme. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme=light]) {
    --canvas: #0A1120; --surface: #111A2C; --surface-2: #16213A; --surface-3: #1D2A47;
    --line: #23314E; --line-strong: #33446A;
    --text: #EEF2FA; --text-2: #B9C4D8; --text-3: #94A1BA;
    --ink: #0B162C; --ink-2: #13213F;
    --success: #5DD3A2; --success-bg: rgba(93, 211, 162, .12); --success-line: rgba(93, 211, 162, .3);
    --warning: #F7C266; --warning-bg: rgba(247, 194, 102, .12); --warning-line: rgba(247, 194, 102, .3);
    --danger: #FF8A80;  --danger-bg: rgba(255, 138, 128, .12);  --danger-line: rgba(255, 138, 128, .3);
    --info: #8DB6FF;    --info-bg: rgba(141, 182, 255, .12);    --info-line: rgba(141, 182, 255, .3);
    --neutral: #CBD3E2; --neutral-bg: rgba(203, 211, 226, .1); --neutral-line: rgba(203, 211, 226, .22);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-2: 0 8px 20px -8px rgba(0, 0, 0, .6);
    --shadow-3: 0 20px 48px -12px rgba(0, 0, 0, .7);
    color-scheme: dark;
  }
}
html[data-theme=dark] {
  --canvas: #0A1120; --surface: #111A2C; --surface-2: #16213A; --surface-3: #1D2A47;
  --line: #23314E; --line-strong: #33446A;
  --text: #EEF2FA; --text-2: #B9C4D8; --text-3: #94A1BA;
  --ink: #0B162C; --ink-2: #13213F;
  --success: #5DD3A2; --success-bg: rgba(93, 211, 162, .12); --success-line: rgba(93, 211, 162, .3);
  --warning: #F7C266; --warning-bg: rgba(247, 194, 102, .12); --warning-line: rgba(247, 194, 102, .3);
  --danger: #FF8A80;  --danger-bg: rgba(255, 138, 128, .12);  --danger-line: rgba(255, 138, 128, .3);
  --info: #8DB6FF;    --info-bg: rgba(141, 182, 255, .12);    --info-line: rgba(141, 182, 255, .3);
  --neutral: #CBD3E2; --neutral-bg: rgba(203, 211, 226, .1); --neutral-line: rgba(203, 211, 226, .22);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-2: 0 8px 20px -8px rgba(0, 0, 0, .6);
  --shadow-3: 0 20px 48px -12px rgba(0, 0, 0, .7);
  color-scheme: dark;
}