/*
 * bewetfor.me — Phase 2 interface system
 * Final cascade layer: unifies legacy page families without changing behavior.
 */
:root {
  color-scheme: dark;
  --p2-page: #080809;
  --p2-page-soft: #0b0b0d;
  --p2-surface-1: #101012;
  --p2-surface-2: #141416;
  --p2-surface-3: #18181b;
  --p2-hover: #1d1d21;
  --p2-active: #222226;
  --p2-line: rgba(255, 255, 255, .065);
  --p2-line-default: rgba(255, 255, 255, .10);
  --p2-line-strong: rgba(255, 255, 255, .17);
  --p2-text: #f4f4f5;
  --p2-copy: #b3b3ba;
  --p2-muted: #797981;
  --p2-faint: #55555c;
  --p2-positive: #3ecf8e;
  --p2-warning: #f5a524;
  --p2-danger: #f25f72;
  --p2-info: #78a9ff;
  --p2-radius-sm: 6px;
  --p2-radius: 9px;
  --p2-radius-lg: 13px;
  --p2-fast: 120ms;
  --p2-default: 160ms;
  --p2-slow: 220ms;
  --p2-ease: cubic-bezier(.2, .8, .2, 1);
  --p2-shadow-float: 0 20px 60px rgba(0, 0, 0, .42), 0 0 0 1px rgba(255, 255, 255, .025);
  --p2-content: 1280px;
  --p2-reading: 800px;
  --p2-gutter: clamp(16px, 3vw, 38px);

  /* bridge legacy tokens */
  --background: var(--p2-page);
  --background-secondary: var(--p2-page-soft);
  --surface: var(--p2-surface-1);
  --surface-elevated: var(--p2-surface-2);
  --surface-hover: var(--p2-hover);
  --border: var(--p2-line);
  --border-strong: var(--p2-line-strong);
  --text-primary: var(--p2-text);
  --text-secondary: var(--p2-copy);
  --text-muted: var(--p2-muted);
  --primary: var(--p2-text);
  --primary-foreground: var(--p2-page);
  --bg: var(--p2-page) !important;
  --surface-2: var(--p2-surface-2) !important;
  --surface-3: var(--p2-surface-3) !important;
  --border-hi: var(--p2-line-strong) !important;
  --text: var(--p2-text) !important;
  --text-2: var(--p2-copy) !important;
  --text-3: var(--p2-muted) !important;
  --r: var(--p2-radius);
  --r-xl: var(--p2-radius-lg);
  --ease: var(--p2-ease);
}

*, *::before, *::after { box-sizing: border-box; }
html {
  min-width: 320px;
  background: var(--p2-page);
  color-scheme: dark !important;
  scrollbar-color: #303036 var(--p2-page);
}
html[data-theme="light"] { color-scheme: dark !important; }
body {
  min-height: 100vh;
  overflow-x: clip;
  background:
    linear-gradient(var(--p2-line), var(--p2-line)) max(16px, calc((100vw - var(--p2-content)) / 2)) 0 / 1px 100% no-repeat,
    var(--p2-page) !important;
  color: var(--p2-text) !important;
  font-family: "Space Grotesk", Inter, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  font-size: 14px;
  line-height: 1.55;
  letter-spacing: -.008em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body::before, body::after, .bg-blobs { display: none !important; }
::selection { background: #dedee2; color: #09090a; }
a { text-underline-offset: 3px; }
img, svg, video { max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea {
  transition: color var(--p2-default) var(--p2-ease),
    background-color var(--p2-default) var(--p2-ease),
    border-color var(--p2-default) var(--p2-ease),
    opacity var(--p2-default) var(--p2-ease),
    transform var(--p2-fast) var(--p2-ease),
    box-shadow var(--p2-default) var(--p2-ease);
}
:focus-visible {
  outline: 2px solid #f4f4f5 !important;
  outline-offset: 3px !important;
}
@supports selector(:focus-visible) {
  :focus:not(:focus-visible) { outline: 0 !important; }
}

.wrap {
  width: min(var(--p2-content), calc(100% - 2 * var(--p2-gutter))) !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
h1, h2, h3, h4, .product-title, .files-title {
  margin-top: 0;
  color: var(--p2-text) !important;
  font-family: "Space Grotesk", Inter, system-ui, sans-serif !important;
  font-weight: 580 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance;
}
p, li { text-wrap: pretty; }
.muted, .product-copy, .lead, .auth-sub, .auth-hint, .auth-legal {
  color: var(--p2-copy) !important;
}
small, time, code, pre, .meta, .legal-meta, .file-meta, .stat-label {
  font-family: "Geist Mono", "SFMono-Regular", Consolas, monospace !important;
  letter-spacing: -.02em;
}

