:root{color-scheme:light;--navy:#0B2D4F;--blue:#1E88FF;--teal:#00C2A8;--green:#7ED957;--orange:#FF9F43;--pink:#FF4D8D;--purple:#7B61FF;--ice:#EAF3FF;--ink:#102A43;--muted:#627D98;--line:#DCE7F0;--white:#fff;--soft:#fff7fb;--shadow:0 22px 65px rgba(11,45,79,.12);font-family:Poppins,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html{background:#f8fbfe;scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 8% -5%,rgba(255,77,141,.13),transparent 31rem),radial-gradient(circle at 96% 102%,rgba(123,97,255,.10),transparent 35rem),#f8fbfe}button,input,select{font:inherit}button{cursor:pointer}.cocktail-app{min-height:100vh}.cocktail-topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;padding:.72rem max(1rem,calc((100vw - 1500px)/2));padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));background:rgba(248,251,254,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(11,45,79,.08)}.brizi-back{display:flex;align-items:center;gap:.45rem;text-decoration:none;color:var(--navy);font-weight:800}.brizi-back img{width:35px;height:35px}.topbar-title{text-align:center}.eyebrow{color:var(--pink);font-size:.68rem;font-weight:800;letter-spacing:.13em}.topbar-title h1{font-size:1.05rem;margin:.08rem 0;color:var(--navy);letter-spacing:-.03em}.icon-button,.glass-button,.close-button{border:0}.icon-button{display:flex;align-items:center;gap:.45rem;min-height:42px;padding:.55rem .8rem;border-radius:999px;background:var(--navy);color:white;font-weight:800}.cocktail-layout{display:grid;grid-template-columns:355px minmax(0,1fr);gap:1rem;width:min(1500px,calc(100% - 2rem));margin:1rem auto 2rem}.cocktail-sidebar{position:sticky;top:76px;align-self:start;max-height:calc(100vh - 92px);overflow:auto;border:1px solid var(--line);background:rgba(255,255,255,.92);border-radius:28px;padding:1rem;box-shadow:var(--shadow);scrollbar-width:thin}.sidebar-brand{display:flex;align-items:center;gap:.8rem;padding-bottom:.9rem;border-bottom:1px solid var(--line)}.sidebar-brand img{width:58px;height:58px;border-radius:18px;box-shadow:0 10px 24px rgba(255,77,141,.2)}h2,h3,p{margin-top:0}.sidebar-brand h2{font-size:1.12rem;margin:.1rem 0;color:var(--navy);letter-spacing:-.03em}.search-wrap{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.45rem;margin:1rem 0 .75rem;padding:.25rem .7rem;border:1px solid var(--line);background:#f8fbfe;border-radius:15px}.search-wrap input{border:0;outline:0;background:transparent;min-height:42px;width:100%;color:var(--ink)}.filter-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.filter-row label{display:grid;gap:.25rem;color:var(--muted);font-size:.72rem;font-weight:700}.filter-row select,.servings-control select{min-height:40px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink);padding:.45rem .6rem}.makeable-toggle{display:flex;align-items:flex-start;gap:.55rem;margin:.75rem 0;padding:.75rem;border-radius:16px;background:#fff5f9;border:1px solid rgba(255,77,141,.18);cursor:pointer}.makeable-toggle input{margin-top:.2rem}.makeable-toggle span{display:grid}.makeable-toggle strong{font-size:.79rem;color:var(--navy)}.makeable-toggle small{font-size:.68rem;color:var(--muted)}.sidebar-section-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:.8rem 0 .55rem;font-size:.78rem}.text-button{border:0;background:transparent;color:#bd2d68;font-weight:800;padding:.25rem}.text-button.active{background:#fff0f6;border-radius:999px;padding:.3rem .55rem}.cocktail-list{display:grid;gap:.55rem}.cocktail-card{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:.65rem;width:100%;text-align:left;padding:.55rem;border:1px solid var(--line);border-radius:17px;background:white;color:var(--ink);box-shadow:none;transition:.16s ease}.cocktail-card:hover{transform:translateY(-1px);border-color:rgba(255,77,141,.35)}.cocktail-card.active{outline:3px solid rgba(255,77,141,.14);border-color:rgba(255,77,141,.48)}.mini-art{width:58px;height:58px;border-radius:14px;display:grid;place-items:center;overflow:hidden;color:white;font-size:1.8rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}.card-copy{min-width:0}.card-copy strong{display:block;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-copy small{display:block;color:var(--muted);font-size:.67rem;margin-top:.12rem}.make-status{font-size:.62rem;font-weight:800;padding:.25rem .4rem;border-radius:999px;background:#f1f5f9;color:#73879a;white-space:nowrap}.make-status.ready{background:#ecfdf5;color:#087765}.cocktail-content{min-width:0}.empty-state{min-height:620px;display:grid;place-items:center;align-content:center;text-align:center;padding:2rem;border:1px solid var(--line);border-radius:32px;background:rgba(255,255,255,.9);box-shadow:var(--shadow)}.empty-state img{width:108px;height:108px;margin-bottom:1rem}.empty-state h2{font-size:clamp(2rem,5vw,4.3rem);color:var(--navy);letter-spacing:-.055em;margin:.3rem 0}.empty-state p{max-width:600px;color:var(--muted);line-height:1.6}.empty-state button,.ingredient-actions button,.dialog-actions button{min-height:46px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--pink),#ef3f7e);color:white;font-weight:800;padding:.68rem 1rem;box-shadow:0 10px 25px rgba(255,77,141,.2)}.cocktail-detail{display:grid;gap:1rem}.drink-hero{position:relative;min-height:390px;border-radius:32px;overflow:hidden;isolation:isolate;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.7);background:#5d1641}.drink-art{position:absolute;inset:0;z-index:-3}.drink-art::before{content:"";position:absolute;left:50%;top:42%;width:160px;height:210px;transform:translate(-50%,-50%);border-radius:20% 20% 45% 45% / 10% 10% 35% 35%;background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.25));border:3px solid rgba(255,255,255,.75);box-shadow:0 25px 65px rgba(0,0,0,.22)}.drink-art::after{content:"";position:absolute;left:50%;top:49%;width:126px;height:110px;transform:translate(-50%,-50%);border-radius:0 0 42% 42%;background:rgba(255,218,104,.82);box-shadow:0 0 35px rgba(255,220,114,.22)}.hero-overlay{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(16,13,34,.78),rgba(16,13,34,.28) 60%,rgba(16,13,34,.08)),linear-gradient(0deg,rgba(16,13,34,.42),transparent 55%)}.hero-copy{position:absolute;left:clamp(1.2rem,4vw,2.7rem);bottom:clamp(1.3rem,4vw,2.5rem);max-width:720px;color:white}.hero-kicker{font-size:.75rem;font-weight:800;letter-spacing:.14em;color:#ffd2e4}.hero-copy h2{font-size:clamp(2.3rem,6vw,5.1rem);line-height:.94;letter-spacing:-.06em;margin:.35rem 0 .7rem}.hero-copy p{max-width:620px;color:rgba(255,255,255,.84);line-height:1.55;margin-bottom:.8rem}.hero-tags{display:flex;flex-wrap:wrap;gap:.4rem}.hero-tags span{padding:.34rem .55rem;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(255,255,255,.12);font-size:.72rem;font-weight:700;backdrop-filter:blur(8px)}.hero-actions{position:absolute;right:1rem;top:1rem;display:flex;gap:.45rem}.glass-button{min-height:42px;padding:.5rem .7rem;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);color:white;font-weight:800;backdrop-filter:blur(10px)}.glass-button.favorite{background:#fff;color:#bd2d68}.drink-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border-radius:22px;overflow:hidden;border:1px solid var(--line)}.stat{padding:.85rem 1rem;background:white}.stat span{display:block;color:var(--muted);font-size:.7rem}.stat strong{display:block;margin-top:.1rem;color:var(--navy);font-size:.93rem}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.panel{border:1px solid var(--line);border-radius:26px;background:rgba(255,255,255,.95);box-shadow:0 15px 45px rgba(11,45,79,.07);padding:1.15rem}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:.8rem}.panel-head h3{margin:.12rem 0;color:var(--navy);font-size:1.4rem;letter-spacing:-.035em}.servings-control{display:grid;gap:.2rem;color:var(--muted);font-size:.67rem;font-weight:800}.availability-banner{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.7rem .8rem;border:1px solid var(--line);border-radius:14px;background:#f8fbfe;margin-bottom:.75rem;color:var(--muted);font-size:.78rem}.availability-banner.ready{background:#ecfdf5;border-color:#bbf7d0;color:#087765}.availability-banner.missing{background:#fff7ed;border-color:#fed7aa;color:#9a3412}.ingredient-list{display:grid;gap:.45rem}.ingredient-row{display:grid;grid-template-columns:78px 1fr auto;gap:.65rem;align-items:center;padding:.7rem;border:1px solid var(--line);border-radius:14px}.ingredient-row .amount{font-weight:800;color:#bd2d68}.ingredient-row strong{display:block;font-size:.84rem}.ingredient-row small{display:block;color:var(--muted);font-size:.68rem;margin-top:.1rem}.stock-dot{width:10px;height:10px;border-radius:50%;background:#cbd5e1}.stock-dot.in{background:#22c55e}.ingredient-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.85rem}.ingredient-actions .secondary,.dialog-actions .secondary{background:white;color:var(--navy);border:1px solid var(--line);box-shadow:none}.method-badge{padding:.36rem .58rem;border-radius:999px;background:#fff0f6;color:#bd2d68;font-size:.72rem;font-weight:800}.method-list{display:grid;gap:.8rem;padding-left:1.6rem;margin:0}.method-list li{padding-left:.25rem;line-height:1.55;color:#334e68}.method-list li::marker{font-weight:800;color:var(--pink)}.serve-card{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:1rem}.serve-card>div{padding:.7rem;border:1px solid var(--line);border-radius:14px;background:#f8fbfe}.serve-card span{display:block;color:var(--muted);font-size:.67rem}.serve-card strong{display:block;color:var(--navy);font-size:.78rem;margin-top:.15rem}.pro-tip{margin-top:.75rem;padding:.8rem;border-radius:14px;background:#f5f3ff;border:1px solid #ddd6fe;color:#5b21b6;font-size:.78rem;line-height:1.45}.pro-tip::before{content:"Brizi tip · ";font-weight:800}.swap-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.swap-card{padding:.75rem;border:1px solid var(--line);border-radius:14px;background:#f8fbfe}.swap-card strong{display:block;color:var(--navy);font-size:.8rem}.swap-card span{display:block;color:var(--muted);font-size:.72rem;margin-top:.2rem;line-height:1.4}.bar-dialog{border:0;border-radius:28px;padding:0;width:min(880px,calc(100% - 1rem));max-height:90vh;box-shadow:0 35px 90px rgba(11,45,79,.24)}.bar-dialog::backdrop{background:rgba(7,30,48,.52);backdrop-filter:blur(6px)}.bar-dialog-inner{padding:clamp(1rem,3vw,1.6rem);overflow:auto;max-height:90vh}.bar-dialog-head{display:flex;justify-content:space-between;gap:1rem}.bar-dialog-head h2{font-size:2rem;color:var(--navy);margin:.15rem 0}.bar-dialog-head p{color:var(--muted);max-width:640px;line-height:1.5}.close-button{flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:#edf2f7;color:var(--navy);font-size:1.5rem}.bar-summary{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 1rem}.bar-summary span{padding:.36rem .55rem;border-radius:999px;background:#fff0f6;color:#bd2d68;font-size:.72rem;font-weight:800}.bar-categories{display:grid;gap:1rem}.bar-category{border-top:1px solid var(--line);padding-top:.8rem}.bar-category h3{color:var(--navy);font-size:1rem;margin-bottom:.55rem}.bar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.bar-item{display:flex;align-items:center;gap:.55rem;padding:.65rem;border:1px solid var(--line);border-radius:14px;background:#f8fbfe;cursor:pointer;font-size:.78rem}.bar-item:has(input:checked){background:#ecfdf5;border-color:#a7f3d0;color:#065f46}.bar-item input{accent-color:var(--teal)}.dialog-actions{display:flex;justify-content:flex-end;gap:.55rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}.toast{position:fixed;left:50%;bottom:24px;z-index:99;transform:translate(-50%,20px);padding:.7rem .9rem;border-radius:999px;background:var(--navy);color:white;font-size:.78rem;font-weight:700;box-shadow:0 14px 35px rgba(11,45,79,.25);opacity:0;pointer-events:none;transition:.2s ease}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:980px){.cocktail-layout{grid-template-columns:300px minmax(0,1fr)}.detail-grid{grid-template-columns:1fr}.drink-stats{grid-template-columns:repeat(3,1fr)}.bar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.cocktail-topbar{padding:.55rem .7rem}.desktop-label{display:none}.topbar-title h1{font-size:.92rem}.cocktail-layout{display:block;width:100%;margin:.55rem 0 1rem;padding:0 .55rem}.cocktail-sidebar{position:static;max-height:none;border-radius:22px;margin-bottom:.65rem;padding:.8rem}.sidebar-brand{display:none}.filter-row{grid-template-columns:1fr 1fr}.cocktail-list{display:flex;overflow:auto;padding-bottom:.2rem;scroll-snap-type:x proximity}.cocktail-card{flex:0 0 230px;scroll-snap-align:start}.makeable-toggle{margin-bottom:.55rem}.cocktail-content{width:100%}.drink-hero{min-height:360px;border-radius:24px}.hero-copy h2{font-size:2.75rem}.drink-stats{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:1fr}.panel{border-radius:22px}.swap-grid{grid-template-columns:1fr}.empty-state{min-height:460px;border-radius:24px}.bar-grid{grid-template-columns:1fr 1fr}.serve-card{grid-template-columns:1fr}.ingredient-row{grid-template-columns:70px 1fr auto}}
@media(max-width:430px){.brizi-back span{display:none}.filter-row{grid-template-columns:1fr}.cocktail-card{flex-basis:210px}.hero-actions{top:.65rem;right:.65rem}.hero-copy{left:1rem;bottom:1rem}.hero-copy h2{font-size:2.35rem}.hero-copy p{font-size:.83rem}.drink-stats{grid-template-columns:1fr 1fr}.bar-grid{grid-template-columns:1fr}.ingredient-actions,.dialog-actions{display:grid;grid-template-columns:1fr}.ingredient-actions button,.dialog-actions button{width:100%}}