@font-face{font-family:'Sofia Sans Extra Condensed';
src:url('../assets/fonts/sofiasansextracondensed-SofiaSansExtraCondensed[wght].ttf') format('truetype');
font-weight:100 1000;
font-style:normal;
font-display:swap}

@font-face{font-family:'Inter Tight';
src:url('../assets/fonts/intertight-InterTight[wght].ttf') format('truetype');
font-weight:100 900;
font-style:normal;
font-display:swap}

@font-face{font-family:'JetBrains Mono';
src:url('../assets/fonts/jetbrainsmono-JetBrainsMono[wght].ttf') format('truetype');
font-weight:100 800;
font-style:normal;
font-display:swap}

:root{--bg:#faf6ef;
--ink:#1f242c;
--muted:#555c64;
--peach:#e89b6f;
--mint:#8ecfb8;
--lavender:#a89fe0;
--peach-ink:#a34c23;
--mint-ink:#326c61;
--lavender-ink:#71519c;
--line:#dedad2;
--display:'Sofia Sans Extra Condensed',sans-serif;
--body:'Inter Tight',sans-serif;
--mono:'JetBrains Mono',monospace;
--radius:24px;
--focus:#71519c;
--shadow:0 12px 28px rgba(66,49,30,.07)}

*{box-sizing:border-box}
::selection{background:#dcd3ed;
color:var(--ink)}
:focus-visible{outline:3px solid var(--focus);
outline-offset:5px}
a{text-underline-offset:.22em}
html{scrollbar-color:#a89f96 var(--bg)}

.color-rule{height:2px;
background:linear-gradient(90deg,var(--peach),var(--lavender),var(--mint));
position:relative;
border:0}

.color-rule:before,.color-rule:after{content:'';
position:absolute;
top:-3px;
width:8px;
height:8px;
border-radius:50%;
background:var(--peach)}
.color-rule:after{right:0;
background:var(--mint)}