@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/familjen-grotesk-latin-var.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: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/familjen-grotesk-latin-ext-var.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root{--color-white: #ffffff;--color-black: #000000;--color-transparent: transparent;--color-current: currentColor;--color-inherit: inherit;--color-moosta-50: #eef3f9;--color-moosta-100: #dde7f3;--color-moosta-200: #bfd0e6;--color-moosta-300: #9db7d9;--color-moosta-400: #6f93c4;--color-moosta-500: #4a78b4;--color-moosta-600: #3a6aa8;--color-moosta-700: #2e5586;--color-moosta-800: #284a73;--color-moosta-900: #203a5c;--color-sage-50: #f0f5ec;--color-sage-100: #e0ebd9;--color-sage-200: #c8dcbf;--color-sage-300: #a5c49c;--color-sage-400: #7fa877;--color-sage-500: #61905f;--color-sage-600: #4b7a50;--color-sage-700: #3b6140;--color-sage-800: #314f35;--color-sage-900: #28412b;--color-amber-50: #fff5e8;--color-amber-100: #ffe8bd;--color-amber-200: #f8d289;--color-amber-300: #efbb58;--color-amber-400: #e7a72a;--color-amber-500: #d89515;--color-amber-600: #b7770b;--color-amber-700: #8f5d10;--color-amber-800: #6f480f;--color-amber-900: #573a10;--color-ink-50: #f8f4ec;--color-ink-100: #f0e9dd;--color-ink-200: #e4dacb;--color-ink-300: #cfc3b2;--color-ink-400: #a39785;--color-ink-500: #6e6559;--color-ink-600: #524a40;--color-ink-700: #3d362f;--color-ink-800: #2e2a25;--color-ink-900: #1f1c19;--color-coral-50: #fdf1f0;--color-coral-100: #fadedc;--color-coral-200: #f4c0bc;--color-coral-300: #e99a94;--color-coral-400: #d7655d;--color-coral-500: #c24c44;--color-coral-600: #a33a33;--color-coral-700: #7f2d28;--color-brand-fill: var(--color-moosta-600);--color-brand-fill-hover: var(--color-moosta-700);--color-success-fill: var(--color-sage-700);--color-success-fill-hover: var(--color-sage-800);--color-danger-fill: var(--color-coral-500);--color-danger-fill-hover: var(--color-coral-600);--color-on-fill: var(--color-white);--color-bg: #f3eee3;--color-surface: #fffcf6;--color-surface-muted: var(--color-ink-100);--color-border: var(--color-ink-200);--color-border-strong: var(--color-ink-300);--color-control-border: #7a736a;--color-fg: var(--color-ink-800);--color-fg-muted: var(--color-ink-500);--color-fg-subtle: #716759;--color-fg-inverse: var(--color-white);--color-success: var(--color-sage-500);--color-warning: var(--color-amber-400);--color-warning-soft: var(--color-amber-50);--color-danger: var(--color-coral-400);--color-danger-soft: var(--color-coral-50);--color-info: var(--color-moosta-600);--color-focus: var(--color-moosta-600);--color-hair: rgba(46, 42, 37, 0.1);--color-butter: #f6e4ad;--color-on-butter: var(--color-ink-800);--color-hay: #f7d64a;--color-on-hay: var(--color-ink-800);--color-person-1: #3a6aa8;--color-person-2: #3b6140;--color-person-3: #6b4a78;--color-person-4: #a8482e;--color-person-5: #2a6f73;--color-person-6: #2e2a25;--color-on-person: var(--color-white);--color-row-hover: rgba(46, 42, 37, 0.06);--color-hair-strong: rgba(46, 42, 37, 0.35);--color-tally-left: rgba(46, 42, 37, 0.28);--color-scrim: rgba(31, 28, 25, 0.4);color-scheme:light}
:root[data-theme='dark']{--color-scrim: rgba(0, 0, 0, 0.6);--color-moosta-50: #1f2a38;--color-moosta-100: #283647;--color-moosta-200: #34496a;--color-moosta-300: #4a6a96;--color-moosta-400: #7d9cc6;--color-moosta-500: #9cb8dc;--color-moosta-600: #9cb8dc;--color-moosta-700: #b4cae6;--color-moosta-800: #ccdcef;--color-moosta-900: #e2ebf5;--color-sage-50: #1f2a1d;--color-sage-100: #2a3626;--color-sage-200: #374a33;--color-sage-300: #557a4f;--color-sage-400: #8db584;--color-sage-500: #a7c79a;--color-sage-600: #a7c79a;--color-sage-700: #bcd6b1;--color-sage-800: #cfe2c6;--color-sage-900: #e0ebd9;--color-amber-50: #35290f;--color-amber-100: #4a3a14;--color-amber-200: #6b5219;--color-amber-300: #b88a2a;--color-amber-400: #e7a72a;--color-amber-500: #efbb58;--color-amber-600: #efbb58;--color-amber-700: #f3c97a;--color-amber-800: #f8d289;--color-amber-900: #ffe8bd;--color-ink-50: #221f1c;--color-ink-100: #2f2b26;--color-ink-200: #3c362f;--color-ink-300: #4d463d;--color-ink-400: #a39785;--color-ink-500: #bdb3a5;--color-ink-600: #cbc2b5;--color-ink-700: #dad2c6;--color-ink-800: #e8e1d6;--color-ink-900: #f0e9df;--color-coral-50: #3a1c1a;--color-coral-100: #4a2320;--color-coral-200: #6e3530;--color-coral-300: #a8554e;--color-coral-400: #d7655d;--color-coral-500: #e88a83;--color-coral-600: #e88a83;--color-coral-700: #f2aaa4;--color-brand-fill: #9cb8dc;--color-brand-fill-hover: #b4cae6;--color-success-fill: #a7c79a;--color-success-fill-hover: #bcd6b1;--color-danger-fill: #e88a83;--color-danger-fill-hover: #f2aaa4;--color-on-fill: #1c1a17;--color-bg: #1c1a17;--color-surface: #26231f;--color-surface-muted: #2f2b26;--color-border: #3c362f;--color-border-strong: #4d463d;--color-control-border: #a39785;--color-fg: #f0e9df;--color-fg-muted: #bdb3a5;--color-fg-subtle: #b0a698;--color-fg-inverse: #1c1a17;--color-success: #a7c79a;--color-warning: #efbb58;--color-warning-soft: #4a3a14;--color-danger: #e88a83;--color-danger-soft: #4a2320;--color-info: #9cb8dc;--color-focus: #f0e9df;--color-hair: rgba(240, 233, 223, 0.1);--color-butter: #4a3a14;--color-on-butter: #f0e9df;--color-hay: #e2c23a;--color-on-hay: #1c1a17;--color-person-1: #9cb8dc;--color-person-2: #a7c79a;--color-person-3: #b79bc4;--color-person-4: #e0907a;--color-person-5: #7fbdc0;--color-person-6: #dad2c6;--color-on-person: #1c1a17;--color-row-hover: rgba(240, 233, 223, 0.06);--color-hair-strong: rgba(240, 233, 223, 0.35);--color-tally-left: rgba(240, 233, 223, 0.28);color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme='light']){--color-scrim: rgba(0, 0, 0, 0.6);--color-moosta-50: #1f2a38;--color-moosta-100: #283647;--color-moosta-200: #34496a;--color-moosta-300: #4a6a96;--color-moosta-400: #7d9cc6;--color-moosta-500: #9cb8dc;--color-moosta-600: #9cb8dc;--color-moosta-700: #b4cae6;--color-moosta-800: #ccdcef;--color-moosta-900: #e2ebf5;--color-sage-50: #1f2a1d;--color-sage-100: #2a3626;--color-sage-200: #374a33;--color-sage-300: #557a4f;--color-sage-400: #8db584;--color-sage-500: #a7c79a;--color-sage-600: #a7c79a;--color-sage-700: #bcd6b1;--color-sage-800: #cfe2c6;--color-sage-900: #e0ebd9;--color-amber-50: #35290f;--color-amber-100: #4a3a14;--color-amber-200: #6b5219;--color-amber-300: #b88a2a;--color-amber-400: #e7a72a;--color-amber-500: #efbb58;--color-amber-600: #efbb58;--color-amber-700: #f3c97a;--color-amber-800: #f8d289;--color-amber-900: #ffe8bd;--color-ink-50: #221f1c;--color-ink-100: #2f2b26;--color-ink-200: #3c362f;--color-ink-300: #4d463d;--color-ink-400: #a39785;--color-ink-500: #bdb3a5;--color-ink-600: #cbc2b5;--color-ink-700: #dad2c6;--color-ink-800: #e8e1d6;--color-ink-900: #f0e9df;--color-coral-50: #3a1c1a;--color-coral-100: #4a2320;--color-coral-200: #6e3530;--color-coral-300: #a8554e;--color-coral-400: #d7655d;--color-coral-500: #e88a83;--color-coral-600: #e88a83;--color-coral-700: #f2aaa4;--color-brand-fill: #9cb8dc;--color-brand-fill-hover: #b4cae6;--color-success-fill: #a7c79a;--color-success-fill-hover: #bcd6b1;--color-danger-fill: #e88a83;--color-danger-fill-hover: #f2aaa4;--color-on-fill: #1c1a17;--color-bg: #1c1a17;--color-surface: #26231f;--color-surface-muted: #2f2b26;--color-border: #3c362f;--color-border-strong: #4d463d;--color-control-border: #a39785;--color-fg: #f0e9df;--color-fg-muted: #bdb3a5;--color-fg-subtle: #b0a698;--color-fg-inverse: #1c1a17;--color-success: #a7c79a;--color-warning: #efbb58;--color-warning-soft: #4a3a14;--color-danger: #e88a83;--color-danger-soft: #4a2320;--color-info: #9cb8dc;--color-focus: #f0e9df;--color-hair: rgba(240, 233, 223, 0.1);--color-butter: #4a3a14;--color-on-butter: #f0e9df;--color-hay: #e2c23a;--color-on-hay: #1c1a17;--color-person-1: #9cb8dc;--color-person-2: #a7c79a;--color-person-3: #b79bc4;--color-person-4: #e0907a;--color-person-5: #7fbdc0;--color-person-6: #dad2c6;--color-on-person: #1c1a17;--color-row-hover: rgba(240, 233, 223, 0.06);--color-hair-strong: rgba(240, 233, 223, 0.35);--color-tally-left: rgba(240, 233, 223, 0.28);color-scheme:dark}}

*{box-sizing:border-box}
body{margin:0;background:var(--color-bg);color:var(--color-fg);font:16px/1.5 'Familjen Grotesk','Segoe UI',system-ui,sans-serif}
a{color:var(--color-moosta-700)}
a:focus-visible,.button:focus-visible{outline:2px solid var(--color-moosta-600);outline-offset:2px}
.wrap{max-width:64rem;margin:0 auto;padding:16px}
header.site{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0 16px}
header.site a.home{display:inline-flex;align-items:center;min-height:44px;border-radius:6px}
header.site img{height:32px;width:auto}
.logo-dark{display:none}
:root[data-theme='dark'] .logo-light{display:none}
:root[data-theme='dark'] .logo-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme='light']) .logo-light{display:none}:root:not([data-theme='light']) .logo-dark{display:block}}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:1.5px solid var(--color-brand-fill);border-radius:6px;background:var(--color-brand-fill);color:var(--color-on-fill);font-size:15px;font-weight:600;line-height:1;text-decoration:none}
.button:hover{background:var(--color-brand-fill-hover);border-color:var(--color-brand-fill-hover)}
.sheet{background:var(--color-surface);border-radius:0;box-shadow:0 1px 0 var(--color-hair);padding:20px 16px;margin:0 -16px}
h1{font-weight:700;letter-spacing:-0.02em;font-size:30px;line-height:34px;margin:0}
h2{font-weight:700;letter-spacing:-0.01em;font-size:22px;line-height:26px;margin:0 0 12px}
.lede{color:var(--color-fg-muted);margin:8px 0 0}
.chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:12px 0 0}
.chips li{border:1px solid var(--color-control-border);border-radius:999px;padding:2px 10px;font-size:13px;line-height:18px;font-weight:500}
.grid{display:grid;gap:28px;margin-top:28px}
ul.ingredients{list-style:none;padding:0;margin:0}
ul.ingredients li{padding:8px 0;border-top:1px solid var(--color-hair)}
ul.ingredients li:first-child{border-top:0}
ol.steps{margin:0;padding-left:1.25rem}
ol.steps li{padding:8px 0;border-top:1px solid var(--color-hair)}
ol.steps li:first-child{border-top:0}
.tip{margin-top:28px}
.save{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.save p{margin:0;flex:1 1 16rem}
.index h2{margin-top:28px}
.index ul{list-style:none;padding:0;margin:0;display:grid;gap:16px}
.index li a{display:block;height:100%;text-decoration:none;color:inherit;border-radius:12px}
.index li .sheet{height:100%}
.index li strong{display:block;font-size:18px;line-height:22px;font-weight:700}
.index li span{color:var(--color-fg-muted);font-size:14px}
footer{color:var(--color-fg-muted);font-size:14px;margin:32px 0 16px}
@media (min-width:768px){.wrap{padding:32px}.sheet{border-radius:12px;padding:20px 22px;margin:0}.grid{grid-template-columns:minmax(0,22rem) 1fr}h1{font-size:40px;line-height:44px}.index ul{grid-template-columns:repeat(3,minmax(0,1fr))}}