/* Fogbreak design system — Carmel Stone (light) / Monterey Shale (dark), Central-Coast:
   cold marine-layer fog + warm light breaking through.
   :root (default) = Monterey Shale (dark); :root[data-theme="carmel-stone"] = Carmel Stone (light).
   Color VALUES ported VERBATIM from apps/cozy-os-mock/index.html (do not re-author by eye). */
/* Fogbreak Sans — the brand font (lifted from the old repo, weights 200-600). Mono pair: JetBrains Mono. */
@font-face{font-family:'Fogbreak Sans';src:url('/fonts/FogbreakSans-200.woff2') format('woff2');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Fogbreak Sans';src:url('/fonts/FogbreakSans-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Fogbreak Sans';src:url('/fonts/FogbreakSans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fogbreak Sans';src:url('/fonts/FogbreakSans-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Fogbreak Sans';src:url('/fonts/FogbreakSans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
:root{
  --font-fogbreak:'Fogbreak Sans',ui-rounded,"SF Pro Rounded",system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','IBM Plex Mono',Menlo,monospace;
  --fog-void:#171C21; --fog-surface:#1F262C; --fog-raised:#28313A; --fog-line:#3A4650; --fog-text:#ECE7DD; --fog-muted:#8A97A0;
  --glacial:#8B93A6; --gate-hold:#D9A84E; --clay-red:#C56A55; --break-gold:#E0B35E; --break-ember:#D98C5A; --council-violet:#B7A6E8; --kelp:#7E9B6A;
  /* Harbor: cold (uncleared / in-transit) = slate-violet; warm (cleared / certain) = amber-gold. NO cyan. */
  --vessel:#9AA0B4; --vessel-warm:#E0B35E; --leash-notch:#E0B35E; --amber-edge:#E0B35E; --amber-fill:#33281B; --fog-confusion:rgba(20,25,30,0.66);
  --topbar-h:56px; --marine-h:170px; --pier-w:302px; --radius:22px; --radius-sm:14px; --radius-xs:10px;
  --shadow-lg:0 24px 60px rgba(0,0,0,.34), 0 4px 14px rgba(0,0,0,.20);
  --shadow-md:0 12px 30px rgba(0,0,0,.26), 0 2px 8px rgba(0,0,0,.16);
  --shadow-sm:0 4px 12px rgba(0,0,0,.18);
  --shadow-warm:0 18px 48px rgba(216,140,90,.10), 0 4px 14px rgba(0,0,0,.20);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 0.96 0 0 0 0 0.86 0 0 0 0.05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --warmth:radial-gradient(circle at 18% 8%,rgba(224,179,94,.055),transparent 30%),radial-gradient(circle at 84% 16%,rgba(216,140,90,.05),transparent 32%),radial-gradient(circle at 50% 96%,rgba(139,147,166,.045),transparent 42%);
}
:root[data-theme="carmel-stone"]{
  --fog-void:#EDE7DA; --fog-surface:#F5F0E6; --fog-raised:#FBF7EF; --fog-line:#D9CFBC; --fog-text:#2C2A25; --fog-muted:#7C7567;
  --shadow-lg:0 24px 60px rgba(92,70,35,.16), 0 4px 14px rgba(92,70,35,.10);
  --shadow-md:0 12px 30px rgba(92,70,35,.13), 0 2px 8px rgba(92,70,35,.08);
  --shadow-sm:0 4px 12px rgba(92,70,35,.10);
  --shadow-warm:0 18px 48px rgba(216,140,90,.14), 0 4px 14px rgba(92,70,35,.08);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.36 0 0 0 0 0.30 0 0 0 0 0.22 0 0 0 0.045 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --warmth:radial-gradient(circle at 18% 8%,rgba(224,179,94,.08),transparent 30%),radial-gradient(circle at 84% 16%,rgba(216,140,90,.07),transparent 32%),radial-gradient(circle at 50% 96%,rgba(139,147,166,.06),transparent 42%);
}
*{box-sizing:border-box}
html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}
body{
  font-family:var(--font-fogbreak);
  color:var(--fog-text); background:var(--fog-void);
  -webkit-font-smoothing:antialiased;
}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--fog-line);border-radius:8px}
