:root{--color-primary: #144c7b;--color-primary-strong: #0e3659;--color-primary-soft: #e8f0f8;--color-sidebar: #0e3659;--color-sidebar-strong: #0a2843;--color-sidebar-text: #dfe7ef;--color-sidebar-muted: #7ea3c4;--color-sidebar-faint: #5a7a99;--color-sidebar-border: #1d4670;--color-bg: #f7f2f2;--color-surface: #ffffff;--color-surface-alt: #f0eaea;--color-text: #1c1c1e;--color-text-muted: #6b6b72;--color-text-faint: #a0a0a8;--color-border: #ddd8d8;--color-border-strong: #bfbbbb;--font-body: "DM Sans", system-ui, sans-serif;--font-mono: "DM Mono", "Courier New", monospace;--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;--radius-sm: 4px;--radius-md: 6px;--sidebar-width: 240px;--content-pad-x: var(--space-8);--content-pad-x-lg: 56px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}a{color:inherit;text-decoration:none}button{font-family:var(--font-body);cursor:pointer}ul,ol{list-style:none}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-main{flex:1;display:flex;flex-direction:column;min-width:0}@media(min-width:900px){.app-shell{flex-direction:row}.app-main{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}}.content{flex:1;padding:var(--space-8) var(--content-pad-x) var(--space-16);width:100%;max-width:1080px}@media(min-width:900px){.content{padding:var(--space-10) var(--content-pad-x-lg) var(--space-20)}}.site-sidebar{display:none}@media(min-width:900px){.site-sidebar{display:flex;flex-direction:column;gap:var(--space-8);position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-width);background:var(--color-sidebar);color:var(--color-sidebar-text);padding:var(--space-8) var(--space-6);z-index:50}}.site-sidebar__brand{display:flex;flex-direction:column;gap:2px}.site-sidebar__brand-row{display:flex;align-items:center;gap:var(--space-2);font-size:1rem;font-weight:700;letter-spacing:-.01em;color:#fff}.site-sidebar__brand-dot{width:8px;height:8px;border-radius:50%;background:#5a8fc0;flex-shrink:0}.site-sidebar__brand-tag{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.08em;text-transform:uppercase;color:var(--color-sidebar-muted);margin-left:16px}.site-sidebar__group{display:flex;flex-direction:column;gap:var(--space-2)}.site-sidebar__group-label{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-sidebar-muted);margin-bottom:var(--space-1)}.site-sidebar__link{display:flex;align-items:baseline;justify-content:space-between;padding:var(--space-2) var(--space-2) var(--space-2) var(--space-3);margin-left:calc(-1 * var(--space-3));border-left:2px solid transparent;color:#bfd1e2;font-size:.875rem;font-weight:500;transition:color .16s ease,border-left-color .16s ease,background-color .16s ease}.site-sidebar__link:hover,.site-sidebar__link:focus-visible{color:#fff;outline:none;background:var(--color-sidebar-strong)}.site-sidebar__link[aria-current=page]{color:#fff;font-weight:600;border-left-color:#fff}.site-sidebar__link-count{font-family:var(--font-mono);font-size:.6875rem;color:var(--color-sidebar-muted)}.site-sidebar__footer{margin-top:auto;border-top:1px solid var(--color-sidebar-border);padding-top:var(--space-4);font-size:.75rem;color:var(--color-sidebar-muted);line-height:1.5}.site-sidebar__footer-label{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.08em;text-transform:uppercase}.site-sidebar__footer-value{color:var(--color-sidebar-text);margin-top:2px}.site-sidebar__footer-link{display:block;margin-top:var(--space-2);font-size:.75rem;color:var(--color-sidebar-muted);transition:color .16s ease}.site-sidebar__footer-link:hover{color:#fff}.site-topbar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 var(--space-6);background:var(--color-sidebar);color:#fff;position:sticky;top:0;z-index:100}@media(min-width:900px){.site-topbar{display:none}}.site-topbar__brand{display:flex;align-items:center;gap:var(--space-2);font-weight:700;letter-spacing:-.01em;color:#fff;font-size:.9375rem}.site-topbar__brand-dot{width:8px;height:8px;border-radius:50%;background:#5a8fc0;flex-shrink:0}.site-topbar__toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:none;padding:var(--space-2)}.site-topbar__toggle-bar{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform .2s ease,opacity .2s ease}.site-topbar__toggle[aria-expanded=true] .site-topbar__toggle-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}.site-topbar__toggle[aria-expanded=true] .site-topbar__toggle-bar:nth-child(2){opacity:0}.site-topbar__toggle[aria-expanded=true] .site-topbar__toggle-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.site-mobile-nav{display:none;position:fixed;top:56px;left:0;right:0;z-index:99;background:var(--color-sidebar);color:var(--color-sidebar-text);padding:var(--space-3) var(--space-6) var(--space-5);border-top:1px solid var(--color-sidebar-border);box-shadow:0 6px 20px #00000038}.site-mobile-nav.is-open{display:block}@media(min-width:900px){.site-mobile-nav{display:none!important}}.site-mobile-nav__link{display:flex;align-items:baseline;justify-content:space-between;padding:var(--space-3) 0;font-size:1rem;font-weight:500;color:#bfd1e2;border-bottom:1px solid var(--color-sidebar-border)}.site-mobile-nav__link:last-child{border-bottom:none}.site-mobile-nav__link[aria-current=page]{color:#fff}.site-mobile-nav__link-count{font-family:var(--font-mono);font-size:.75rem;color:var(--color-sidebar-muted)}.site-footer{border-top:1px solid var(--color-border);padding:var(--space-6) var(--content-pad-x) var(--space-4);margin-top:var(--space-16);font-size:.75rem;color:var(--color-text-faint)}@media(min-width:900px){.site-footer{padding-left:var(--content-pad-x-lg);padding-right:var(--content-pad-x-lg)}}.site-footer__inner{display:flex;flex-direction:column;gap:var(--space-2)}@media(min-width:768px){.site-footer__inner{flex-direction:row;justify-content:space-between;align-items:baseline}}.site-footer__copy{font-family:var(--font-mono);letter-spacing:.04em}.site-footer__links{display:flex;gap:var(--space-5)}.site-footer__link{font-family:var(--font-mono);color:var(--color-text-muted);transition:color .16s ease}.site-footer__link:hover,.site-footer__link:focus-visible{color:var(--color-primary);outline:none}.page-key{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-primary);font-weight:500;margin-bottom:var(--space-2)}.page-title{font-size:clamp(1.75rem,3vw,2.25rem);font-weight:700;letter-spacing:-.025em;color:var(--color-text);line-height:1.1;margin-bottom:var(--space-2)}.page-desc{font-size:.9375rem;color:var(--color-text-muted);max-width:56ch;margin-bottom:var(--space-8)}.page-header-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}.page-header-row__meta{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-faint)}.brew-row{display:block;padding:var(--space-5) var(--space-3) var(--space-5) var(--space-3);border-bottom:1px solid var(--color-border);border-left:2px solid transparent;margin-left:calc(-1 * var(--space-3));margin-right:calc(-1 * var(--space-3));transition:background-color .16s ease,border-left-color .16s ease;cursor:pointer;color:inherit;text-decoration:none}.brew-row:hover,.brew-row:focus-visible{background-color:var(--color-surface-alt);border-left-color:var(--color-primary);outline:none}.brew-row[data-hidden=true]{display:none}.brew-row__name-block{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-1)}.brew-row__name{font-size:1rem;font-weight:600;letter-spacing:-.01em;color:var(--color-text);line-height:1.3}.brew-row__style-code{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary);font-weight:500}.brew-row__style-name{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.02em;color:var(--color-text-faint);margin-bottom:var(--space-2);display:block}.brew-row__note{font-size:.8125rem;color:var(--color-text-muted);font-style:italic;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:60ch}.brew-row__meta{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);margin-top:var(--space-2);font-family:var(--font-mono);font-size:.8125rem;color:var(--color-text-muted)}.brew-row__meta-label{color:var(--color-text-faint);margin-right:var(--space-1);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase}.brew-row__ingredients,.brew-row__stats,.brew-row__date-col{display:none}@media(min-width:900px){.brew-row{display:grid;grid-template-columns:1fr 200px 200px 110px;gap:var(--space-6);align-items:start}.brew-row__ingredients{display:flex;flex-direction:column;gap:2px;font-size:.8125rem;color:var(--color-text-muted);line-height:1.55;padding-top:2px}.brew-row__yeast{color:var(--color-text-faint);font-style:italic;font-size:.75rem}.brew-row__stats{display:flex;flex-direction:column;gap:2px;text-align:right;font-family:var(--font-mono);font-size:.8125rem;color:var(--color-text-muted);padding-top:2px}.brew-row__stat-label{color:var(--color-text-faint);margin-right:var(--space-1);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase}.brew-row__stat-abv{color:var(--color-text)}.brew-row__date-col{display:block;text-align:right;font-family:var(--font-mono);font-size:.8125rem;color:var(--color-text-muted);padding-top:2px}.brew-row__meta{display:none}}.brew-row-header{display:none;padding:var(--space-2) var(--space-3) var(--space-2) var(--space-3);margin-left:calc(-1 * var(--space-3));margin-right:calc(-1 * var(--space-3));font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-faint);font-weight:500;border-bottom:1px solid var(--color-border)}@media(min-width:900px){.brew-row-header{display:grid;grid-template-columns:1fr 200px 200px 110px;gap:var(--space-6)}.brew-row-header__right{text-align:right}}.brew-filter{margin-bottom:var(--space-6)}.brew-filter__inner{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}@media(min-width:600px){.brew-filter__inner{grid-template-columns:repeat(4,minmax(130px,1fr))}}@media(min-width:900px){.brew-filter__inner{grid-template-columns:repeat(4,minmax(130px,1fr))}}.brew-filter__search,.brew-filter__select{font-family:var(--font-body);font-size:.875rem;padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);outline:none;box-shadow:0 1px 3px #0000000f;transition:border-color .16s ease,box-shadow .16s ease;width:100%}.brew-filter__search{grid-column:1 / -1}.brew-filter__search:hover,.brew-filter__select:hover{border-color:var(--color-border-strong)}.brew-filter__search:focus,.brew-filter__select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #144c7b1f}.brew-filter__select{appearance:none;cursor:pointer;padding-right:var(--space-8);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a0a0a8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center}.brew-listing__empty{padding:var(--space-10) 0;color:var(--color-text-muted);font-size:.875rem}.ingredient-list{border-top:1px solid var(--color-border);margin-bottom:var(--space-16)}.ingredient-item{border-bottom:1px solid var(--color-border)}.ingredient-link{display:flex;align-items:baseline;justify-content:space-between;padding:var(--space-3) var(--space-3);margin-left:calc(-1 * var(--space-3));margin-right:calc(-1 * var(--space-3));border-left:2px solid transparent;transition:background-color .16s ease,border-left-color .16s ease}.ingredient-link:hover,.ingredient-link:focus-visible{background-color:var(--color-surface-alt);border-left-color:var(--color-primary);outline:none}.ingredient-name{font-size:.9375rem;font-weight:500;color:var(--color-text)}.ingredient-count{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-faint)}.content a:not([class]){color:var(--color-primary);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--color-primary) 45%,transparent);text-underline-offset:2px;transition:text-decoration-color .16s ease}.content a:not([class]):hover,.content a:not([class]):focus-visible{text-decoration-color:var(--color-primary);outline:none}.skip-link{position:absolute;top:-100%;left:var(--space-3);z-index:9999;padding:var(--space-2) var(--space-4);background:var(--color-primary);color:#fff;font-family:var(--font-mono);font-size:.8125rem;border-radius:var(--radius-sm);text-decoration:none;transition:top .1s ease}.skip-link:focus{top:var(--space-2);outline:2px solid #fff;outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}