@font-face {
  font-family:"Stack Sans Text";
  src:url("../fonts/StackSansText-VariableFont_wght.ttf") format("truetype");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
@font-face {
  font-family:"Stack Sans Headline";
  src:url("../fonts/StackSansHeadline-VariableFont_wght.ttf") format("truetype");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
@font-face {
  font-family:"Geist Mono";
  src:url("../fonts/GeistMono-VariableFont_wght.ttf") format("truetype");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}

:root {
  --site-max:1600px;
  --site-gutter:32px;
  --site-width:min(var(--site-max), calc(100% - 2 * var(--site-gutter)));
  color-scheme: dark;
  --bg: #101110;
  --bg-raised: #151615;
  --panel: #191a19;
  --panel-hover: #1f201f;
  --panel-strong: #242524;
  --input: #202120;
  --chrome:#121312;
  --surface-hover:#181918;
  --control:#282a27;
  --progress:#a7aaa3;
  --topbar-bg:rgba(16,17,16,.92);
  --modal:#1a1b1a;
  --menu:#202120;
  --menu-hover:#2a2b2a;
  --code-bg:#111211;
  --code-text:#b8bbb4;
  --code-strong:#eef0ea;
  --code-accent:#c9a86a;
  --scrim:rgba(0,0,0,.56);
  --line: rgba(255, 255, 255, 0.075);
  --line-strong: rgba(255, 255, 255, 0.13);
  --text: #f2f2ef;
  --text-soft: #bebfba;
  --muted: #7d7f7a;
  --faint: #5a5c58;
  --success: #8eae86;
  --warning: #c19b5b;
  --danger: #cf716a;
  --info: #849cc3;
  --focus: rgba(255, 255, 255, 0.72);
  --radius-sm: 7px;
  --radius-md: 11px;
  --radius-lg: 15px;
  --shadow-menu: 0 22px 65px rgba(0, 0, 0, 0.48), 0 1px 0 rgba(255, 255, 255, 0.04) inset;
  /* Shared interface glyphs; tint via background-color on a mask. */
  --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --check-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 6'/%3E%3C/svg%3E");
  --arrow-down-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14m-6-6 6 6 6-6'/%3E%3C/svg%3E");
  --sans:"Stack Sans Text", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --headline:"Stack Sans Headline", "Stack Sans Text", ui-sans-serif, sans-serif;
  --mono:"Geist Mono", "SFMono-Regular", Consolas, monospace;
  --topbar: 58px;
  --rail: 58px;
  --sidebar: 246px;
  --inspector: 316px;
}

:root[data-theme="light"] {
  color-scheme:light;
  --bg:#f6f6f4;
  --bg-raised:#ffffff;
  --panel:#eeeeeb;
  --panel-hover:#e8e8e5;
  --panel-strong:#e1e1dd;
  --input:#ffffff;
  --chrome:#f0f0ed;
  --surface-hover:#fafaf8;
  --control:#e4e4e0;
  --progress:#5f625d;
  --topbar-bg:rgba(246,246,244,.92);
  --modal:#ffffff;
  --menu:#ffffff;
  --menu-hover:#f0f0ed;
  --code-bg:#181916;
  --code-text:#d4d7d0;
  --scrim:rgba(20,21,19,.28);
  --line:rgba(19,20,18,.09);
  --line-strong:rgba(19,20,18,.16);
  --text:#191a18;
  --text-soft:#4b4d49;
  --muted:#767973;
  --faint:#a0a29c;
  --success:#5e8158;
  --warning:#916f34;
  --danger:#b95049;
  --info:#58739e;
  --focus:rgba(19,20,18,.62);
  --shadow-menu:0 22px 65px rgba(21,22,20,.14),0 1px 0 rgba(255,255,255,.8) inset;
}

@media (max-width:600px) { :root { --site-gutter:20px; } }