@layer reset, tokens, base, components, utilities;

@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/instrument-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/instrument-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/jetbrains-mono-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/jetbrains-mono-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("/fonts/archivo-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("/fonts/archivo-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@layer reset {
  *, ::before, ::after {
    box-sizing: border-box;
    border: 0 solid var(--border-subtle);
  }

  html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
  }

  body {
    line-height: inherit;
  }

  h1, h2, h3, h4, h5, h6, p, figure, pre, blockquote, dl, dd, hr {
    margin: 0;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  ul, ol, menu {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  button, input, select, textarea, optgroup {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
  }

  button, [role="button"] {
    cursor: pointer;
    text-align: inherit;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  :disabled {
    cursor: default;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  table {
    border-collapse: collapse;
    border-color: inherit;
    text-indent: 0;
  }

  textarea {
    resize: vertical;
  }

  summary {
    display: list-item;
    list-style: none;
  }

  summary::-webkit-details-marker {
    display: none;
  }

  dialog {
    margin: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
  }

  dialog:not([open]) {
    display: none;
  }

  code, kbd, samp, pre {
    font-size: 1em;
  }

  small {
    font-size: max(80%, 0.75rem);
  }

  abbr:where([title]) {
    text-decoration: underline dotted;
  }

  ::placeholder {
    opacity: 1;
    color: color-mix(in srgb, currentColor 50%, transparent);
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}

@layer tokens {
:root {
  color-scheme: light dark;

  --font-display: 'Archivo', 'Instrument Sans', system-ui, sans-serif;
  --font-display-stretch: 112%;
  --font-sans: 'Instrument Sans', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace;
  --text-display-xl: clamp(3rem, 1.9rem + 4.6vw, 5.5rem); --lh-display-xl: 0.98; --ls-display-xl: -0.035em;
  --text-display: clamp(2.5rem, 1.7rem + 3.2vw, 4rem); --lh-display: 1.02; --ls-display: -0.03em;
  --text-h1: clamp(2.25rem, 1.8rem + 1.6vw, 3rem); --lh-h1: 1.06; --ls-h1: -0.025em;
  --text-h2: clamp(1.75rem, 1.45rem + 1.1vw, 2.25rem); --lh-h2: 1.12; --ls-h2: -0.02em;
  --text-h3: 1.5rem; --lh-h3: 1.25; --ls-h3: -0.01em;
  --text-body-l: 1.25rem; --lh-body-l: 1.55;
  --text-body: 1.0625rem; --lh-body: 1.6;
  --text-ui: 0.9375rem;
  --text-small: 0.875rem; --lh-small: 1.5;
  --text-xs: 0.8125rem;
  --text-label: 0.75rem; --lh-label: 1.4; --ls-label: 0.08em;
  --weight-display: 650; --weight-heading: 600; --weight-body: 400; --weight-strong: 600; --weight-label: 500;
  --measure: 62ch;

  --surface-base: light-dark(#f5f6f7, #0b0c0e);
  --surface-sunken: light-dark(#eceef0, #070809);
  --surface-raised: light-dark(#fbfbfc, #101215);
  --surface-card: light-dark(#ffffff, #13161a);
  --surface-overlay: light-dark(#ffffff, #191c21);
  --surface-input: light-dark(#ffffff, #0e1013);
  --surface-chamber: #050607;
  --surface-chamber-raised: #0f1114;
  --chamber-line-faint: rgb(255 255 255 / .07);
  --chamber-line-subtle: rgb(255 255 255 / .1);
  --chamber-line-medium: rgb(255 255 255 / .12);
  --chamber-line-strong: rgb(255 255 255 / .22);
  --backdrop: light-dark(rgb(13 16 19 / .42), rgb(2 3 4 / .72));

  --text-primary: light-dark(#0d1013, #f1f3f5);
  --text-secondary: light-dark(#454c55, #b3b9c1);
  --text-tertiary: light-dark(#5f6772, #868d97);
  --text-on-accent: light-dark(#ffffff, #021317);

  --border-subtle: light-dark(#e3e6e9, #1c1f24);
  --border-medium: light-dark(#cfd4d9, #2a2f36);
  --border-strong: light-dark(#7e858e, #626a74);

  --ion-100: #cdf6fd; --ion-200: #95eaf8; --ion-300: #4fd6f0; --ion-400: #19bcdc;
  --ion-500: #0898b8; --ion-600: #087691; --ion-700: #0b5a6e;
  --accent: light-dark(#087691, #4fd6f0);
  --accent-hover: light-dark(#0b5a6e, #95eaf8);
  --accent-tint: light-dark(rgb(8 118 145 / .08), rgb(79 214 240 / .10));
  --accent-line: light-dark(rgb(8 118 145 / .35), rgb(79 214 240 / .45));
  --accent-ink: light-dark(var(--ion-700), var(--ion-300));

  --glow-from: light-dark(#14b4d6, #4fd6f0);
  --glow-to: light-dark(#3a4fe6, #5b6dff);
  --glow-color: light-dark(rgb(8 152 184 / .22), rgb(79 214 240 / .38));
  --glow-rim: light-dark(rgb(8 118 145 / .30), rgb(79 214 240 / .32));
  --brand-gradient: linear-gradient(115deg, var(--glow-from) 0%, var(--glow-to) 100%);
  --glow-ion: 0 0 0 1px var(--glow-rim), 0 14px 48px -12px var(--glow-color);
  --ion-line: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%);

  --agent: light-dark(#3346d8, #8796ff);
  --agent-tint: light-dark(rgb(51 70 216 / .08), rgb(135 150 255 / .12));
  --agent-line: light-dark(rgb(51 70 216 / .45), rgb(135 150 255 / .55));

  --proof-light: #f4f1ea;
  --proof-glow: 0 0 0 1px rgb(244 241 234 / .5), 0 0 32px 4px rgb(244 241 234 / .28);

  --sev-critical: light-dark(#c4262e, #ff6369);
  --sev-high: light-dark(#b5440b, #ff9d4d);
  --sev-medium: light-dark(#855800, #efc24c);
  --sev-low: light-dark(#3a6186, #8fb4d8);
  --sev-info: light-dark(#5d6670, #a6adb6);
  --stage-possible: light-dark(#6a6257, #bdb3a2);
  --stage-confirmed: light-dark(#127a3c, #4cd27e);
  --stage-exploited: light-dark(#a8166f, #ff66c0);
  --stage-refuted: light-dark(#686e78, #7d848e);
  --semantic-tint: 12%;
  --success: var(--stage-confirmed);
  --danger: var(--sev-critical);
  --warning: var(--sev-medium);
  --success-surface: color-mix(in srgb, var(--success) var(--semantic-tint), transparent);
  --danger-surface: color-mix(in srgb, var(--danger) var(--semantic-tint), transparent);
  --warning-surface: color-mix(in srgb, var(--warning) var(--semantic-tint), transparent);

  --focus-color: light-dark(#087691, #6fe0f4);

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px; --space-11: 160px;
  --section-y: clamp(80px, 10vw, 160px);
  --gutter: clamp(16px, 4vw, 32px);
  --container: 1240px;
  --container-wide: 1400px;

  --radius-xs: 4px; --radius-sm: 8px; --radius-md: 12px; --radius-lg: 18px;
  --radius-chamber: 20px; --radius-xl: 28px; --radius-pill: 999px;

  --shadow-color: light-dark(rgb(16 24 32 / .08), rgb(0 0 0 / .55));
  --shadow-strong: light-dark(rgb(16 24 32 / .16), rgb(0 0 0 / .70));
  --elev-1: 0 1px 2px var(--shadow-color);
  --elev-2: 0 1px 2px var(--shadow-color), 0 8px 24px -6px var(--shadow-color);
  --elev-3: 0 2px 4px var(--shadow-color), 0 28px 72px -16px var(--shadow-strong);

  --edge-top: light-dark(#e6e9ec, rgb(255 255 255 / .13));
  --edge-bottom: light-dark(#d2d7dc, rgb(255 255 255 / .03));
  --edge-inset: inset 0 1px 0 light-dark(#ffffff, rgb(255 255 255 / .06));
  --edge-light: linear-gradient(180deg, var(--edge-top), var(--edge-bottom));

  --glass-fill: light-dark(rgb(255 255 255 / .66), rgb(16 18 21 / .58));
  --glass-border: light-dark(rgb(13 16 19 / .08), rgb(255 255 255 / .08));
  --glass-blur: 18px;
  --glass-saturate: 150%;

  --graticule-size: 48px;
  --graticule-color: rgb(255 255 255 / .035);
  --tick-color: rgb(79 214 240 / .55);

  --dur-instant: 90ms; --dur-fast: 160ms; --dur-base: 240ms; --dur-slow: 420ms;
  --dur-scene: 720ms; --dur-sweep: 4.8s; --dur-loop: 8s; --stagger: 70ms;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-standard: cubic-bezier(.2, 0, 0, 1);
  --ease-gate: cubic-bezier(.7, 0, .2, 1);
  --ease-spring: linear(0, .25 6%, .68 14%, 1.03 24%, 1.08 32%, 1.01 46%, .99 60%, 1);

  --surface-sidebar: color-mix(in srgb, var(--surface-sunken) 50%, var(--surface-base));
  --autofill-surface: var(--surface-input);
  --chart-series-1: var(--accent);
  --chart-series-2: var(--agent);
  --chart-scale-1: light-dark(var(--ion-400), var(--ion-700));
  --chart-scale-2: light-dark(var(--ion-500), var(--ion-600));
  --chart-scale-3: light-dark(var(--ion-600), var(--ion-400));
  --chart-scale-4: light-dark(var(--ion-700), var(--ion-200));
  --chart-land: color-mix(in srgb, var(--text-primary) 9%, var(--surface-card));
  --shell-nav-width: 15rem;
  --scroll-spy-offset: 112px;
  --topbar-height: 56px;
}

@media (min-width: 1024px) {
  :root {
    --topbar-height: 64px;
  }
}

:root[data-nav="mini"] {
  --shell-nav-width: 4rem;
}

:root[data-theme="light"] {
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
}

.ssec-chamber {
  color-scheme: dark;
}
}

@layer base {
  body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    font-family: var(--font-sans);
    font-size: 1rem;
    color: var(--text-primary);
    background-color: var(--surface-base);
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  code, pre, kbd, samp {
    font-family: var(--font-mono);
    font-synthesis-weight: auto;
  }

  p, li, dd, dt, h1, h2, h3, h4, h5, h6, figcaption, th, td {
    overflow-wrap: break-word;
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  ::selection {
    background-color: color-mix(in srgb, var(--accent) 22%, transparent);
  }

  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-track {
    background: var(--surface-base);
  }

  ::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 4px;
  }

  ::-webkit-scrollbar-thumb:hover {
    background: var(--text-tertiary);
  }

  html {
    scrollbar-color: var(--border-medium) var(--surface-base);
    scrollbar-width: thin;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--topbar-height) + 16px);
  }

  :focus-visible {
    outline: 2px solid var(--focus-color);
    outline-offset: 2px;
    border-radius: var(--radius-xs);
  }

  main:focus-visible {
    outline: none;
  }
}

@keyframes reveal-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@layer base {
  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }

    [data-reveal] {
      opacity: 1 !important;
      transform: none !important;
    }
  }

  @media print {
    :root {
      color-scheme: light;
    }

    body {
      background: #ffffff;
      color: #111111;
    }

    [data-reveal] {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }

    footer {
      display: none !important;
    }

    main {
      color: #111111;
    }
  }
}