@layer reset{*,:before,:after{box-sizing:border-box}*{margin:0}html{background:var(--paper);min-height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{min-height:100%}img,svg{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}}@layer base{:root{--paper:oklch(92.5% .027 302);--paper-quiet:oklch(95.5% .016 302);--surface:oklch(89.5% .034 302);--surface-strong:oklch(83.5% .052 301);--ink:oklch(24.5% .052 299);--ink-light:oklch(44.5% .05 300);--muted:oklch(55% .047 300);--rule:oklch(76.5% .058 300);--highlight:oklch(73% .083 298);--honey:oklch(78% .148 75);--white:oklch(100% 0 0);--font-display:"Cormorant Garamond", Georgia, serif;--font-mono:"Space Mono", "SFMono-Regular", Consolas, monospace;--font-body:var(--font-mono);--shell:min(1120px, calc(100vw - 32px));--ease-out:cubic-bezier(.22, 1, .36, 1);--radius:10px;--focus:0 0 0 3px oklch(78% .148 75/.45)}body{background:radial-gradient(circle at 85% 18%, oklch(73% .083 298/.32), transparent 13rem), linear-gradient(180deg, var(--paper-quiet), var(--paper));color:var(--ink);font-family:var(--font-body);line-height:1.5;overflow-x:hidden}::selection{background:var(--highlight);color:var(--ink)}:focus-visible{box-shadow:var(--focus);outline-offset:3px;border-radius:6px;outline:2px solid #0000}.texture-overlay{z-index:5;pointer-events:none;opacity:.36;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.08'/%3E%3C/svg%3E");position:fixed;inset:0}.site-shell{z-index:10;width:var(--shell);margin:0 auto;padding:32px 0 56px;position:relative}}@layer layout{.site-header{color:var(--ink-light);font-family:var(--font-mono);justify-content:flex-end;align-items:flex-start;padding-bottom:clamp(48px,8vw,92px);font-size:.75rem;display:flex}.site-nav{flex-direction:column;align-items:flex-end;gap:.25rem;display:flex}.site-nav a{transition:color .18s var(--ease-out)}.lang-switch{align-items:center;gap:1px;display:inline-flex}.lang-opt.active{color:var(--ink)}.lang-sep{color:var(--rule);user-select:none}.site-nav a:hover,.brand-mark:hover{color:var(--ink)}.home-hero,.listing-layout,.recipe-detail{grid-template-columns:minmax(0,1fr);gap:clamp(40px,7vw,84px);display:grid}.home-hero{grid-template-columns:minmax(0,1fr) minmax(300px,460px);align-items:center;min-height:46vh}.filter-bar{view-transition-name:filter-bar;grid-column:1/-1;gap:12px;padding-top:14px;display:grid}.filter-row{flex-wrap:wrap;align-items:baseline;gap:12px;display:flex}.empty-state{text-align:center;padding-block:clamp(60px,12vw,100px)}.empty-state.filtered-out{display:none}.empty-heading{font-family:var(--font-display);color:var(--ink-light);margin:0 0 12px;font-size:clamp(1.8rem,4vw,2.6rem);font-style:italic}.empty-hint{font-family:var(--font-mono);color:var(--muted);max-width:42ch;margin:0 auto;font-size:.82rem}.filter-section-title{font-family:var(--font-display);color:var(--ink-light);user-select:none;flex-shrink:0;width:8.5em;padding-top:6px;font-size:1rem;font-style:italic}.filter-pills{flex-wrap:wrap;gap:8px;display:flex}.home-hero.compact{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;min-height:auto;padding-bottom:clamp(28px,5vw,56px)}.home-hero.compact .lede,.home-hero.compact .intro-link{display:none}.home-hero.compact .filter-bar{grid-column:auto;gap:8px;padding-top:0}.home-hero.compact .page-title{transition:font-size .4s var(--ease-out);font-size:clamp(2rem,5vw,3.2rem)}.intro-panel,.listing-intro,.recipe-header{gap:24px;display:grid}.page-title{max-width:11ch;font-family:var(--font-display);letter-spacing:-.02em;text-wrap:balance;text-shadow:0 0 2px oklch(73% .083 298/.2);font-size:clamp(4rem,10vw,6rem);font-weight:400;line-height:.93}.lede,.recipe-intro{max-width:66ch;color:var(--ink);text-wrap:pretty;font-size:.95rem}.intro-link{width:fit-content;color:var(--ink-light);font-family:var(--font-mono);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.25em;transition:color .18s var(--ease-out), transform .2s var(--ease-out);font-size:.78rem}.intro-link:hover{color:var(--ink);transform:translate(4px)}.system-line,.label,.brewer-count,.group-heading span{color:var(--ink-light);font-family:var(--font-mono);font-size:.78rem}.label{font-family:var(--font-display);margin-bottom:.25rem;font-size:1rem;font-style:italic;display:block}.archive-summary,.spec-grid,.source-panel{border:1px solid var(--rule);border-radius:var(--radius);background:oklch(100% 0 0/.2)}.brewer-index,.phase-section{gap:22px;padding-top:clamp(44px,8vw,88px);display:grid}.recipe-groups{display:grid}.section-heading{border-top:1px solid var(--rule);grid-template-columns:minmax(180px,.38fr) minmax(0,1fr);align-items:baseline;gap:24px;padding-top:18px;display:grid}.section-heading.compact{grid-template-columns:1fr;gap:8px}.section-heading h2,.group-heading h2,.phase-copy h3{font-family:var(--font-display);text-wrap:balance;font-weight:400;line-height:1.05}.section-heading h2,.group-heading h2{letter-spacing:-.015em;font-size:clamp(2.6rem,6.5vw,4.2rem)}.group-heading h2{color:var(--ink)}.section-heading p{max-width:62ch;color:var(--ink-light);font-size:.85rem}.brewer-list,.recipe-list,.phase-list{display:grid}}@layer components{.cursor{background:var(--highlight);vertical-align:-.08em;width:.22em;height:.78em;margin-left:.08em;animation:1.2s infinite blink;display:inline-block}.filter-toggle{border:1px solid var(--rule);min-height:36px;color:var(--ink);cursor:pointer;font-family:var(--font-mono);transition:border-color .18s var(--ease-out), background-color .18s var(--ease-out), color .18s var(--ease-out), transform .18s var(--ease-out);background:0 0;border-radius:999px;align-items:center;gap:8px;padding:6px 15px;font-size:.78rem;display:inline-flex}.filter-toggle:hover{border-color:var(--ink-light);background:oklch(100% 0 0/.22);transform:translateY(-1px)}.filter-toggle:active{transform:scale(.96)}.filter-toggle[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:700}.filter-toggle[aria-pressed=true]:hover{background:var(--ink-light);color:var(--paper);border-color:var(--ink-light)}body .lang-zh,body.lang-zh .lang-en{display:none}body.lang-zh .lang-zh{display:revert}.recipe-version{display:none}body.lang-en .recipe-version.lang-en,body:not([class*=lang-]) .recipe-version.lang-en,body.lang-zh .recipe-version.lang-zh{display:contents}.brewer-row,.recipe-row,.phase-row{border-top:1px solid var(--rule);transition:background-color .18s var(--ease-out), color .18s var(--ease-out);gap:18px;display:grid}.brewer-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:22px 0}.brewer-row:hover,.recipe-row:hover{color:var(--ink-light);background:oklch(100% 0 0/.16)}.brewer-name{font-family:var(--font-display);font-size:clamp(2.2rem,6vw,4.5rem);line-height:.95}.listing-intro{max-width:760px}.detail-nav a,.source-panel a,.phase-guide-link{color:var(--ink);transition:color .18s var(--ease-out), transform .2s var(--ease-out);align-items:center;gap:6px;text-decoration:none;display:inline-flex}.detail-nav a:hover,.source-panel a:hover,.phase-guide-link:hover{color:var(--ink-light);transform:translate(-4px)}.recipe-group{grid-template-columns:minmax(140px,.26fr) minmax(0,1fr);align-items:start;gap:clamp(28px,5vw,56px);padding-top:clamp(44px,8vw,88px);scroll-margin-top:24px;display:grid}.recipe-group:first-child{padding-top:clamp(24px,5vw,52px)}.group-heading{gap:4px;display:grid}.group-count{color:var(--ink-light);font-family:var(--font-mono);font-size:.78rem}.variant-filters{flex-wrap:wrap;gap:16px;margin-top:10px;display:flex}.variant-pill{color:var(--ink-light);font-family:var(--font-mono);cursor:pointer;transition:color .18s var(--ease-out);text-underline-offset:4px;background:0 0;border:none;padding:0;font-size:.72rem}.variant-pill:hover{color:var(--ink)}.variant-pill.active{color:var(--ink);text-decoration:underline}.recipe-row.filtered-out{display:none}.recipe-row{transition:background-color .18s var(--ease-out), color .18s var(--ease-out), transform .2s var(--ease-out);grid-template-columns:minmax(0,1fr) minmax(240px,.52fr);padding:20px 0}.recipe-row:hover{transform:translate(4px)}.recipe-main{gap:8px;min-width:0;display:grid}.recipe-name{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.8rem);line-height:1}.recipe-description{max-width:68ch;color:var(--ink-light);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.82rem;display:-webkit-box;overflow:hidden}.recipe-stats{flex-wrap:wrap;place-content:start flex-end;gap:8px;display:flex}.recipe-stats>span{color:var(--ink-light);font-size:.72rem}.recipe-stats>span:not(:last-child):after{content:"·";color:var(--rule);margin:0 7px}.tag-list li{border:1px solid var(--rule);background:var(--surface);min-height:26px;color:var(--ink-light);border-radius:999px;align-items:center;padding:3px 10px;font-size:.7rem;display:inline-flex}.detail-nav{border-top:1px solid var(--rule);color:var(--ink-light);font-family:var(--font-mono);margin-top:clamp(28px,5vw,54px);padding-top:18px;font-size:.78rem}.recipe-article{gap:clamp(28px,5vw,54px);display:grid}.recipe-header{grid-template-columns:minmax(0,1fr) minmax(180px,240px);align-items:start}.recipe-header .page-title{max-width:13ch;font-size:clamp(2rem,4.5vw,3rem)}.recipe-intro{font-family:var(--font-mono);font-size:.95rem;line-height:1.5}.spec-grid{grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.spec-grid div{border-right:1px solid var(--rule);min-width:0;padding:16px}.spec-grid div:last-child{border-right:0}.spec-grid strong,.source-panel strong{overflow-wrap:anywhere;font-size:.94rem;font-weight:400;display:block}.phase-list{grid-template-columns:58px minmax(0,1fr) minmax(88px,auto);column-gap:18px;padding:0;list-style:none;display:grid}.phase-row{grid-column:1/-1;grid-template-columns:subgrid;align-items:start;padding:18px 0;display:grid}.phase-index,.phase-values{color:var(--ink-light);font-size:.78rem}.phase-copy{gap:6px;display:grid}.phase-copy h3{font-size:clamp(1.5rem,3vw,2.1rem)}.phase-copy p{max-width:62ch;color:var(--ink-light);font-size:.82rem}.pour-styles{flex-wrap:wrap;align-items:center;gap:8px 18px;margin:2px 0 4px;padding:0;list-style:none;display:flex}.pour-styles li{align-items:center;gap:8px;display:inline-flex}.pour-styles li span{font-family:var(--font-display);color:var(--ink-light);font-size:1rem;font-style:italic;line-height:1}.pour-glyph{width:22px;height:22px;color:var(--ink);flex:none;overflow:visible}.phase-values{white-space:nowrap;justify-items:end;gap:2px;display:grid}.phase-guide-link{width:fit-content;color:var(--ink-light);font-family:var(--font-mono);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.25em;font-size:.78rem}.source-panel{justify-content:space-between;align-items:center;gap:20px;padding:18px;display:flex}.source-panel div{gap:2px;display:grid}.source-panel span:not(.label){color:var(--ink-light);font-size:.78rem}.tag-list{flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none;display:flex}.ascii-ambient{z-index:0;opacity:.07;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}.ascii-hero{aspect-ratio:1;opacity:.9;view-transition-name:hero-visual;place-self:center end;width:min(100%,460px);height:auto}.home-hero.compact .ascii-hero{display:none}.ascii-pour{justify-self:end;width:88px;max-width:100%;height:auto;margin-bottom:6px;display:block}.ascii-pour-guide{aspect-ratio:1;justify-self:start;width:min(100%,260px);height:auto;margin:0}.pour-guide{gap:clamp(36px,6vw,68px);display:grid}.pour-guide-header{gap:20px;max-width:760px;display:grid}.pour-guide-list{padding:0;list-style:none;display:grid}.pour-guide-row{border-top:1px solid var(--rule);grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,56px);padding:clamp(24px,4vw,40px) 0;display:grid}.pour-guide-demo{justify-items:start;display:grid}.pour-guide-copy{gap:12px;display:grid}.pour-guide-title{font-family:var(--font-display);letter-spacing:-.015em;align-items:center;gap:12px;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400;line-height:1;display:flex}.pour-guide-copy p{max-width:68ch;color:var(--ink-light);font-size:.88rem}}@layer motion{@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes slide-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.recipe-group.filtered-out{display:none}.recipe-group.entering{animation:.4s cubic-bezier(.22,1,.36,1) both slide-up}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}}@media (width<=820px){:root{--shell:min(100vw - 24px, 720px)}.site-shell{padding-top:20px}.site-header{padding-bottom:44px}.home-hero,.recipe-header,.recipe-row,.section-heading,.recipe-group,.pour-guide-row{grid-template-columns:1fr}.ascii-hero{justify-self:start;width:min(100%,360px)}.page-title{max-width:9ch;font-size:clamp(3.4rem,18vw,5rem)}.recipe-stats{justify-content:flex-start}.spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spec-grid div{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}.spec-grid div:nth-child(2n){border-right:0}.spec-grid div:nth-last-child(-n+2){border-bottom:0}.recipe-detail{gap:28px}.recipe-header .page-title{max-width:10ch;font-size:clamp(1.8rem,8vw,2.6rem);line-height:.96}.recipe-intro{font-size:.92rem}}@media (width<=700px){.ascii-ambient,.ascii-hero,.ascii-pour{display:none!important}.pour-guide-page .ascii-pour-guide{width:min(100%,220px);display:block!important}}@media (width<=560px){.site-header,.detail-nav,.source-panel,.brewer-row{flex-direction:column;align-items:flex-start}.site-nav{align-items:flex-start}.brewer-row{gap:8px;display:flex}.phase-list{grid-template-columns:42px minmax(0,1fr)}.phase-values{grid-column:2;justify-items:start}.recipe-description{-webkit-line-clamp:3}}