@layer reset,base,components,responsive;@layer reset{*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body,h1,h2,h3,h4,p,dl,dd,ol,ul,fieldset,legend{margin:0}ul,ol{padding:0;list-style:none}fieldset{padding:0;border:0}button,input,select{font:inherit}button,summary{cursor:pointer}}@layer base{:root{color-scheme:light;font-family:Trebuchet MS,Verdana,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--page: #87969f;--page-dark: #667680;--stone-line: rgba(28, 43, 52, .18);--panel: #e7e1cb;--panel-raised: #f5f0dd;--panel-soft: #d7d1ba;--row-alt: #ece7d4;--ink: #1d292f;--ink-soft: #4b5a61;--muted: #68767c;--frame: #243641;--frame-mid: #3f5663;--frame-light: #8ca1ab;--frame-shadow: #132128;--header: #1c2d39;--header-2: #314c5d;--gold: #e8c95f;--gold-dark: #8a6813;--green: #426c4d;--green-bright: #75a46f;--blue: #3f6a82;--purple: #67587e;--danger: #a13c35;--focus: #ffd86d;--shadow: 0 5px 12px rgba(16, 29, 36, .28)}:root[data-theme=dark]{color-scheme:dark;--page: #111a21;--page-dark: #0b1217;--stone-line: rgba(155, 180, 192, .06);--panel: #202c34;--panel-raised: #2a3740;--panel-soft: #182229;--row-alt: #25323a;--ink: #edf2e8;--ink-soft: #c2cfcf;--muted: #94a5aa;--frame: #0b1217;--frame-mid: #39505e;--frame-light: #667c87;--frame-shadow: #05090c;--header: #0a1218;--header-2: #203541;--gold: #f0cf65;--gold-dark: #9e7a1c;--green: #496e50;--green-bright: #83ae78;--blue: #416d85;--purple: #6a5c83;--danger: #e17b70;--focus: #ffe081;--shadow: 0 6px 16px rgba(0, 0, 0, .42)}body{min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 12px 12px,rgba(255,255,255,.08) 0 1px,transparent 2px),linear-gradient(135deg,transparent 24%,var(--stone-line) 25%,transparent 26%) 0 0 / 42px 42px,linear-gradient(45deg,transparent 24%,var(--stone-line) 25%,transparent 26%) 0 0 / 42px 42px,linear-gradient(var(--page),var(--page-dark))}::selection{color:#10171b;background:var(--gold)}h1,h2,h3,h4{font-family:Georgia,Times New Roman,serif;line-height:1.12}button,input,select,summary{color:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}}@layer components{.hero{position:relative;color:#eff6f5;background:radial-gradient(circle at 6px 6px,rgba(255,255,255,.08) 0 1px,transparent 2px) 0 0 / 24px 24px,linear-gradient(115deg,var(--header),var(--header-2));border-bottom:3px solid var(--frame);box-shadow:inset 0 -2px 0 var(--frame-light),var(--shadow)}.hero:before,.effect-card:after,.filter-bar:after,.empty-state:after{position:absolute;inset:5px;pointer-events:none;content:"";background:radial-gradient(circle at 4px 4px,#b6c3c9 0 2px,#263640 2.5px 4px,transparent 4.5px),radial-gradient(circle at calc(100% - 4px) 4px,#b6c3c9 0 2px,#263640 2.5px 4px,transparent 4.5px),radial-gradient(circle at 4px calc(100% - 4px),#b6c3c9 0 2px,#263640 2.5px 4px,transparent 4.5px),radial-gradient(circle at calc(100% - 4px) calc(100% - 4px),#b6c3c9 0 2px,#263640 2.5px 4px,transparent 4.5px)}.masthead,.hero-content,main,footer{width:min(1180px,calc(100% - 34px));margin-inline:auto;padding:1rem}footer p{width:100%;margin:0;text-align:center}.masthead{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;min-height:58px;padding-block:7px;border-bottom:1px solid rgba(222,235,236,.16)}.brand{display:inline-flex;gap:10px;align-items:center;color:#f5f7ee;text-decoration:none}.brand-mark{display:grid;width:43px;height:43px;place-items:center;border:2px solid #101a20;background:linear-gradient(#3d5868,#233944);box-shadow:inset 0 0 0 2px #6e8792,inset 0 -5px 8px #00000047,0 2px #0b1216;transform:rotate(-2deg)}.brand-mark svg{width:32px;height:32px;fill:#eccb5933;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.brand>span:last-child{display:grid;gap:1px}.brand strong{color:var(--gold);font-family:Georgia,serif;font-size:1.18rem;text-shadow:0 2px 0 #0b1115}.brand small{color:#e8f2f0ad;font-size:.7rem}.theme-toggle{display:grid;width:38px;height:36px;place-items:center;border:2px solid #111c22;color:var(--gold);background:linear-gradient(#456070,#263d49);box-shadow:inset 0 0 0 1px #718893,0 2px #0a1115;font-size:1.1rem;font-weight:900}.theme-toggle:hover{filter:brightness(1.18)}.hero-content{position:relative;z-index:1;display:grid;grid-template-columns:minmax(330px,1.25fr) minmax(280px,.9fr);gap:18px;align-items:end;padding-block:12px 16px}.search-form{position:relative;display:flex;align-items:center;min-height:48px;border:2px solid #101a20;background:var(--panel-raised);box-shadow:inset 0 0 0 2px var(--frame-light),0 3px 0 var(--frame-shadow)}.search-symbol{position:relative;width:16px;height:16px;margin-left:15px;border:2px solid #40545d;border-radius:50%;flex:0 0 auto}.search-symbol:after{position:absolute;right:-6px;bottom:-4px;width:8px;height:2px;background:#40545d;content:"";transform:rotate(45deg)}.search-form input{width:100%;min-width:0;padding:11px 43px 11px 13px;border:0;outline:0;color:var(--ink);background:transparent;font-size:.94rem;font-weight:700}.search-form input::placeholder{color:var(--muted);font-weight:500}.search-form input::-webkit-search-cancel-button{display:none}.clear-search{position:absolute;right:8px;display:grid;width:30px;height:30px;place-items:center;border:0;color:var(--muted);background:transparent;font-size:1.35rem;line-height:1}.clear-search:hover{color:var(--danger)}.brewer-picker{display:grid;gap:5px;min-width:0}.brewer-picker>span,.select-field>span,.usage-field legend{color:var(--muted);font-size:.64rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.hero .brewer-picker>span{color:#ebf4f3a8}.brewer-buttons{display:flex;gap:5px;min-width:0;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}.brewer-buttons button{display:inline-flex;gap:7px;align-items:center;min-height:38px;padding:6px 9px;border:2px solid #111c22;color:#dbe7e7;background:linear-gradient(#3e5867,#273e4a);box-shadow:inset 0 0 0 1px #657c87,0 2px #0a1115;flex:0 0 auto;font-size:.76rem;font-weight:800}.brewer-buttons button small{padding-left:7px;border-left:1px solid rgba(232,241,240,.22);color:#e8f1f094;font-size:.62rem}.brewer-buttons button:hover{filter:brightness(1.12)}.brewer-buttons button.active{color:#141b1f;background:linear-gradient(#f4d975,#cda83b);box-shadow:inset 0 0 0 1px #fff0a7,0 2px #5d4309}.brewer-buttons button.active small{border-left-color:#1d262a40;color:#58470d}.control-skeleton{width:220px;height:38px;background:linear-gradient(90deg,#304854 20%,#526b77,#304854 80%);background-size:220% 100%;animation:shimmer 1.4s infinite}main{padding-block:14px 42px}.filter-bar,.effect-card,.empty-state{position:relative;border:2px solid var(--frame);background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame-light),0 3px 0 var(--frame-shadow),var(--shadow)}.filter-bar{padding:9px 12px 8px}.primary-filters{display:grid;grid-template-columns:minmax(130px,180px) minmax(230px,290px) minmax(145px,175px) max-content;gap:9px;align-items:end}.select-field,.usage-field{display:grid;gap:4px;min-width:0}.select-field select,.more-filters summary,.reset-button{min-height:34px;border:2px solid var(--frame);color:var(--ink);background:linear-gradient(var(--panel-raised),var(--panel-soft));box-shadow:inset 0 0 0 1px var(--frame-light),0 2px 0 var(--frame-shadow);font-size:.74rem;font-weight:800}.select-field select{width:100%;padding:5px 27px 5px 8px}:root[data-theme=dark] .select-field select{color-scheme:light}:root[data-theme=dark] .select-field select option,:root[data-theme=dark] .select-field select optgroup{color:#172027;background:#fff}.select-field select:hover,.select-field select:focus{border-color:var(--gold-dark)}.segmented-control{display:grid;grid-template-columns:repeat(3,1fr);min-height:34px;border:2px solid var(--frame);overflow:hidden;background:var(--panel-soft);box-shadow:inset 0 0 0 1px var(--frame-light),0 2px 0 var(--frame-shadow)}.segmented-control button{border:0;border-right:1px solid var(--frame-mid);color:var(--ink-soft);background:linear-gradient(var(--panel-raised),var(--panel-soft));font-size:.72rem;font-weight:900}.segmented-control button:last-child{border-right:0}.segmented-control button:hover{filter:brightness(1.08)}.segmented-control button.active{color:#eef8ed;background:linear-gradient(#5f8b65,#355a3e);text-shadow:0 1px #1d3925}.more-filters{position:relative}.more-filters summary{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;list-style:none}.more-filters summary::-webkit-details-marker{display:none}.more-filters[open] summary span{transform:rotate(180deg)}.advanced-filter-grid{position:absolute;z-index:20;top:calc(100% + 5px);right:0;display:grid;width:min(430px,calc(100vw - 34px));grid-template-columns:1fr 1fr;gap:10px;padding:10px;border:2px solid var(--frame);background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame-light),var(--shadow)}.reset-button{width:auto;padding:5px 10px;justify-self:start}.reset-button:hover:not(:disabled){color:#fff;background:linear-gradient(#ba5650,#7d302d)}.reset-button:disabled{cursor:default;opacity:.45}.active-filters{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:7px}.active-filters:empty{display:none}.active-filters>span{color:var(--muted);font-size:.61rem;font-weight:900;text-transform:uppercase}.active-filters button{padding:3px 6px;border:1px solid var(--frame-mid);color:var(--ink-soft);background:var(--panel-raised);font-size:.67rem;font-weight:800}.active-filters button:hover{color:var(--danger);border-color:var(--danger)}.results-panel{margin-top:14px}.results-heading{display:flex;align-items:baseline;justify-content:space-between;gap:14px;min-height:35px;padding:0 3px 7px}.results-heading h2{color:#edf3ef;font-size:1.15rem;text-shadow:0 2px 0 rgba(0,0,0,.35)}:root[data-theme=light] .results-heading h2{color:#17252d;text-shadow:0 1px rgba(255,255,255,.35)}.results-heading h2 span{color:var(--muted);font-family:Trebuchet MS,sans-serif;font-size:.75rem}.results-heading>p{color:var(--ink);font-size:.74rem;font-weight:800}.effect-list{display:grid;gap:11px}.effect-card{overflow:hidden}.effect-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:43px;padding:7px 11px;color:#f2f7f5;background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0 / 100% 9px,linear-gradient(90deg,#29495b,#315f68 58%,#294655);border-bottom:2px solid var(--frame);box-shadow:inset 0 -1px #77929b}.effect-heading h3{display:flex;gap:8px;align-items:center;color:#fff3b8;font-size:clamp(1rem,2vw,1.26rem);text-shadow:0 2px 0 #11242b}.effect-heading h3>span{display:grid;width:24px;height:24px;place-items:center;border:1px solid #10242c;color:var(--gold);background:radial-gradient(circle,#486f61,#24483f);box-shadow:inset 0 0 0 1px #79a08f,0 1px #0a171c;font-size:.72em;flex:0 0 auto}.effect-summary{display:flex;gap:5px;flex-wrap:wrap;justify-content:end}.effect-summary span{padding:3px 6px;border:1px solid rgba(221,235,235,.3);color:#eff7f5d1;background:#08121747;font-size:.62rem;font-weight:900}.usage-section{padding:9px 10px 10px}.usage-section+.usage-section{padding-top:0}.usage-heading{margin-bottom:4px}.usage-heading h4{display:inline-flex;gap:6px;align-items:center;padding:3px 8px;border:1px solid var(--frame);color:#f5f7ee;background:linear-gradient(#6b5f85,#4d4166);box-shadow:inset 0 0 0 1px #9485aa;font-family:Trebuchet MS,sans-serif;font-size:.68rem;font-weight:900;letter-spacing:.02em;text-transform:uppercase}.usage-triple .usage-heading h4{background:linear-gradient(#587e5c,#385d40);box-shadow:inset 0 0 0 1px #83a783}.usage-heading h4 span{font-size:.95rem;line-height:1}.recipe-column-head,.recipe-row{display:grid;grid-template-columns:58px minmax(125px,.65fr) minmax(260px,1.8fr);gap:9px;align-items:center}.recipe-column-head.with-brewer,.recipe-row.with-brewer{grid-template-columns:58px minmax(120px,.6fr) minmax(240px,1.55fr) minmax(90px,.55fr)}.recipe-column-head{padding:4px 8px;border:1px solid var(--frame-mid);border-bottom:0;color:var(--muted);background:var(--panel-soft);font-size:.58rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.recipe-rows{border:1px solid var(--frame-mid);background:var(--panel-raised)}.recipe-row{position:relative;min-height:42px;padding:6px 8px;border-bottom:1px solid color-mix(in srgb,var(--frame-mid) 43%,transparent)}.recipe-row:nth-child(2n){background:var(--row-alt)}.recipe-row:last-child{border-bottom:0}.recipe-row:hover{background:color-mix(in srgb,var(--gold) 16%,var(--panel-raised))}.recipe-level{color:var(--gold-dark);font-family:Georgia,serif;font-size:.96rem;font-weight:900;white-space:nowrap}:root[data-theme=dark] .recipe-level{color:var(--gold)}.recipe-level span{color:var(--muted);font-family:Trebuchet MS,sans-serif;font-size:.55rem;text-transform:uppercase}.recipe-drink{display:grid;grid-template-columns:21px minmax(0,1fr);gap:6px;align-items:center;min-width:0}.drink-icon{display:grid;width:20px;height:20px;place-items:center;border:1px solid color-mix(in srgb,var(--frame-mid) 72%,transparent);background:color-mix(in srgb,var(--panel-soft) 84%,transparent);font-size:.77rem;line-height:1}.drink-copy{display:grid;min-width:0}.recipe-drink strong{overflow:hidden;color:var(--ink);font-size:.8rem;text-overflow:ellipsis;white-space:nowrap}.recipe-drink small{color:var(--muted);font-size:.63rem}.recipe-ingredients{display:flex;flex-wrap:wrap;min-width:0;color:var(--ink-soft);font-size:.76rem;line-height:1.35}.recipe-ingredients span:not(:last-child):after{margin-inline:6px;color:var(--gold-dark);content:"◆";font-size:.48rem;vertical-align:middle}.recipe-brewers{display:flex;flex-wrap:wrap;gap:3px}.brewer-badge{padding:2px 5px;border:1px solid var(--frame-mid);color:var(--ink-soft);background:var(--panel-soft);font-size:.61rem;font-weight:900}.tentative{position:absolute;top:2px;right:3px;padding:1px 4px;border:1px solid var(--danger);color:var(--danger);background:var(--panel-raised);font-size:.5rem;font-weight:900;text-transform:uppercase}.empty-state{display:grid;justify-items:center;min-height:205px;padding:28px 20px;text-align:center}.empty-state h3{margin-top:5px;font-size:1.3rem}.empty-state>p{margin-top:6px;color:var(--muted);font-size:.8rem}.empty-mark{display:grid;width:54px;height:54px;place-items:center;border:2px solid var(--frame);background:linear-gradient(#506c7a,#2b4653);box-shadow:inset 0 0 0 2px var(--frame-light),0 2px 0 var(--frame-shadow);font-size:1.8rem}.empty-actions{display:flex;gap:6px;margin-top:13px}.empty-actions button,.primary-button{min-height:34px;padding:5px 10px;border:2px solid var(--frame);color:#f4f7ed;background:linear-gradient(#5f8b65,#355a3e);box-shadow:inset 0 0 0 1px #86ac85,0 2px 0 var(--frame-shadow);font-size:.72rem;font-weight:900}.empty-actions button:hover,.primary-button:hover{filter:brightness(1.12)}.no-match-symbol{display:grid;width:43px;height:43px;place-items:center;border:2px solid var(--frame);color:var(--gold);background:#304957;box-shadow:inset 0 0 0 1px var(--frame-light);font-family:Georgia,serif;font-size:1.35rem;font-weight:900}.no-matches .primary-button{margin-top:13px}.loading-list{display:grid;gap:10px}.loading-list span{display:block;height:112px;border:2px solid var(--frame);background:linear-gradient(90deg,var(--panel) 20%,var(--panel-raised) 50%,var(--panel) 80%);background-size:220% 100%;box-shadow:inset 0 0 0 2px var(--frame-light),0 3px 0 var(--frame-shadow);animation:shimmer 1.5s infinite}.load-more-wrap{display:grid;justify-items:center;gap:7px;margin-top:15px}.load-more-wrap p{color:var(--ink);font-size:.7rem;font-weight:800}.inline-error{color:#ffafa6;font-size:.75rem}footer{display:flex;justify-content:flex-end;padding-block:0 22px;color:color-mix(in srgb,var(--ink) 72%,transparent);font-size:.67rem;font-weight:700}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-20% 0}}}@layer responsive{@media(max-width:920px){.hero-content{grid-template-columns:1fr;gap:10px}.brewer-picker{grid-template-columns:auto 1fr;align-items:center;gap:9px}.primary-filters{grid-template-columns:minmax(130px,.75fr) minmax(220px,1.2fr) minmax(145px,.8fr) auto}.recipe-column-head,.recipe-row,.recipe-column-head.with-brewer,.recipe-row.with-brewer{grid-template-columns:55px minmax(120px,.65fr) minmax(200px,1.45fr)}.recipe-column-head.with-brewer span:last-child{display:none}.recipe-row.with-brewer .recipe-brewers{grid-column:2 / -1;margin-top:-2px}}@media(max-width:720px){.masthead,.hero-content,main,footer{width:min(100% - 20px,1180px)}.masthead{min-height:54px}.brand-mark{width:39px;height:39px}.brand-mark svg{width:29px;height:29px}.brand strong{font-size:1.05rem}.hero-content{padding-block:9px 13px}.search-form{min-height:44px}.brewer-picker{display:grid;grid-template-columns:1fr;gap:4px}main{padding-block:10px 34px}.filter-bar{padding:8px}.primary-filters{grid-template-columns:1fr 1.45fr;gap:7px}.more-filters{grid-column:1}.reset-button{grid-column:2}.advanced-filter-grid{right:auto;left:0;width:min(400px,calc(100vw - 36px))}.results-heading{min-height:31px}.results-heading h2{font-size:1.02rem}.effect-heading{align-items:flex-start;padding:7px 9px}.effect-heading h3{font-size:1rem}.effect-summary span{padding:2px 4px;font-size:.57rem}.usage-section{padding:8px}.recipe-column-head{display:none}.recipe-row,.recipe-row.with-brewer{grid-template-columns:49px 1fr;gap:3px 8px;align-items:start;padding:7px}.recipe-level{grid-row:1 / span 2;padding-top:1px}.recipe-drink,.recipe-ingredients,.recipe-row.with-brewer .recipe-brewers{grid-column:2}.recipe-row.with-brewer .recipe-brewers{margin-top:2px}.recipe-ingredients{font-size:.73rem}.empty-state{min-height:185px;padding:24px 16px}}@media(max-width:460px){.brand small{display:none}.theme-toggle{width:35px;height:34px}.primary-filters{grid-template-columns:1fr 1fr}.usage-field{grid-column:1 / -1;grid-row:1}.select-field{grid-column:1}.more-filters,.reset-button{grid-column:2}.advanced-filter-grid{position:fixed;inset:auto 10px 10px;width:auto;grid-template-columns:1fr}.results-heading>p{display:none}.effect-heading{display:grid;gap:5px}.effect-summary{justify-content:start}.usage-heading h4{font-size:.63rem}.recipe-row,.recipe-row.with-brewer{grid-template-columns:44px 1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}
