@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/static/fonts/inter-v20-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/static/fonts/inter-v20-greek.woff2") format("woff2");
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/static/fonts/inter-v20-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: Inter;
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/static/fonts/inter-v20-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: "Fira Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-400-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-400-greek.woff2") format("woff2");
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-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: "Fira Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-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: "Fira Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-500-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-500-greek.woff2") format("woff2");
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-500-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: "Fira Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-500-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: "Fira Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-700-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-700-greek.woff2") format("woff2");
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: "Fira Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-700-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: "Fira Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/firamono-v16-700-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;
}
:root, [data-theme="ink"] {
  color-scheme: dark;
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%2398a896' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
  --tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%230b1a09' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 5.2 4.2 7.4 8 3'/%3E%3C/svg%3E");
  --ground: #0c0f0c;
  --surface: #151814;
  --surface-raised: #1d221d;
  --surface-float: #191d18;
  --ink: #dfefdd;
  --ink-muted: #bdcfba;
  --ink-faint: #98a896;
  --ink-dim: #839181;
  --border: #384037;
  --border-strong: #515c4f;
  --accent: #93de8b;
  --accent-fill: #93de8b;
  --accent-hover: #a6e99f;
  --on-accent: #0b1a09;
  --accent-wash: #192c17;
  --accent-mark: #1f3a1c;
  --danger: #e37e6a;
  --danger-wash: #351c18;
  --on-danger: #1d0c09;
  --caution: #ecc980;
  --caution-wash: #2e2511;
  --code-bg: #111311;
  --code-ink: #d4d4d4;
  --code-keyword: #569cd6;
  --code-modifier: #c586c0;
  --code-type: #4ec9b0;
  --code-func: #dcdcaa;
  --code-var: #9cdcfe;
  --code-string: #ce9178;
  --code-number: #b5cea8;
  --code-comment: #6a9955;
  --code-gutter: #4c554b;
  --code-gutter-active: #d4d4d4;
  --code-line: #1a1d19;
  --focus: #93de8b;
  --overlay: #0c0f0ccc;
  --shadow-overlay: 0 16px 48px #00000099;
  --shadow-glow: 0 0 0 1px #93de8b40;
  --picker-filter: invert(0.85) sepia(0.2) hue-rotate(60deg);
  --board-ink: #dfefdd;
  --board-accent: #93de8b;
  --board-blue: #8fb8ec;
  --board-amber: #ecc980;
  --board-rose: #eba0ac;
  --host-wash: #cfdccd;
  --board-dots: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAXklEQVR42u3VsQkAIQxA0VRpBfdf7XCEW0ELD1zAItwrfp8HCYnxPlG5AAAAAAAAAAAAAAAAAAAAuFLuSgLaqu9aNUAew38lgBX62RH7AwAAAAAAAAAAAAAAAAAAF5vcmAWtJKOyiwAAAABJRU5ErkJggg==");
}
[data-theme="mint"] {
  color-scheme: light;
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23485347' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
  --tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%230b1a09' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 5.2 4.2 7.4 8 3'/%3E%3C/svg%3E");
  --ground: #eaf3e8;
  --surface: #f9fcf8;
  --surface-raised: #eff6ee;
  --surface-float: #fafdfa;
  --ink: #141a14;
  --ink-muted: #323b30;
  --ink-faint: #485347;
  --ink-dim: #5c675b;
  --border: #cbd9ca;
  --border-strong: #7b8c78;
  --accent: #356d2f;
  --accent-fill: #93de8b;
  --accent-hover: #a6e99f;
  --on-accent: #0b1a09;
  --accent-wash: #d4edd1;
  --accent-mark: #bde2b5;
  --danger: #ac3225;
  --danger-wash: #ffe4df;
  --on-danger: #fff8f6;
  --caution: #8a5f18;
  --caution-wash: #f9edd5;
  --code-bg: #f4f8f3;
  --code-ink: #1a1f19;
  --code-keyword: #1849a9;
  --code-modifier: #8f2fa3;
  --code-type: #0f766e;
  --code-func: #6f42c1;
  --code-var: #0b5b8a;
  --code-string: #a31515;
  --code-number: #0e6a5e;
  --code-comment: #3f7d33;
  --code-gutter: #9bb096;
  --code-gutter-active: #1a1f19;
  --code-line: #e7f0e6;
  --focus: #356d2f;
  --overlay: #141a14a6;
  --shadow-overlay: 0 16px 48px #141a1426;
  --shadow-glow: 0 0 0 1px #356d2f40;
  --picker-filter: none;
  --board-ink: #141a14;
  --board-accent: #356d2f;
  --board-blue: #2c5d9c;
  --board-amber: #8a5f18;
  --board-rose: #a3384d;
  --host-wash: #f9fcf8;
  --board-dots: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAXElEQVR42u3VMQoAIQwAwVRpBbHy/w89CwU/YBFuiu0zkJAYc0TlAgAAAAAAAAAAAAAAAAAA4Em5Kwloq75r1QB5DX9KACv0syP2BwAAAAAAAAAAAAAAAAAAHvYBWPRTY3v+704AAAAASUVORK5CYII=");
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;
  --host-line: #10200e;
  --host-a: #93de8b;
  --host-a-deep: #5cb954;
  --host-b: #ecc980;
  --host-b-deep: #cfa452;
  --host-white: #f9fcf8;
  --host-cheek: #eba0ac;
  --host-mouth: #4a2a24;
  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-slow: 600ms;
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-inout: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-settle: cubic-bezier(0.16, 1, 0.3, 1);
  --measure-prose: 760px;
  --measure-lesson: 840px;
  --measure-wide: 880px;
  --rail: 260px;
  --rail-narrow: 200px;
  --topbar: 56px;
  --gutter: var(--space-8);
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --control-sm-pad: 12px;
  --control-md-pad: 16px;
  --control-lg-pad: 24px;
  --control-sm-text: 13px;
  --control-md-text: 14px;
  --control-lg-text: 15px;
  --control-sm-glyph: 14px;
  --control-md-glyph: 16px;
  --control-lg-glyph: 18px;
  --editor-min: 520px;
  --font-display: Inter, "Helvetica Neue", Arial, sans-serif;
  --font-sans: Inter, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-mono: "Fira Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (pointer: coarse) {
  :root { --control-sm: 44px; --control-md: 44px; --control-sm-pad: var(--control-md-pad); }
}
@media (max-width: 639px) {
  :root { --gutter: var(--space-4); }
}
.display-1 {
  font-family: var(--font-display);
  font-size: 64px;
  line-height: 64px;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.display-2 {
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 44px;
  font-weight: 500;
  letter-spacing: -0.015em;
}
.display-3 {
  font-family: var(--font-display);
  font-size: 30px;
  line-height: 36px;
  font-weight: 500;
  letter-spacing: -0.012em;
}
.display-4 {
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.lede {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 30px;
  font-weight: 400;
  letter-spacing: -0.018em;
}
.body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  letter-spacing: -0.011em;
}
.body-mobile {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 27px;
  font-weight: 400;
  letter-spacing: -0.011em;
}
.ui-lg {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 22px;
  font-weight: 500;
  letter-spacing: -0.016em;
}
.ui {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: -0.026em;
}
.ui-medium {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: -0.026em;
}
.ui-sm {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: -0.014em;
}
.eyebrow { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 500; }
.code { font-family: var(--font-mono); font-size: 14px; line-height: 24px; font-weight: 400; }
.code-sm { font-family: var(--font-mono); font-size: 12.5px; line-height: 20px; font-weight: 400; }
.code-lg { font-family: var(--font-mono); font-size: 16px; line-height: 28px; font-weight: 400; }