:root{--ink:#3d2017;--muted:#73645d;--accent:#a94727;--canvas:#f7f1e8;--surface:#fffdf9;--surface-muted:#efe3d4;--border:#d9c8b9;--ready-bg:#deeee2;--ready-ink:#356249;--missing-bg:#f6e5bd;--missing-ink:#785012}*{box-sizing:border-box}html{background:var(--canvas)}body{color:var(--ink);background:var(--canvas);margin:0;font-family:DM Sans,system-ui,sans-serif}button,a{font:inherit}button{cursor:pointer}.app-shell{width:min(100%,540px);min-height:100dvh;margin:0 auto;padding:20px 16px 108px}.topbar,.card-heading{justify-content:space-between;align-items:center;display:flex}.topbar{min-height:44px}.eyebrow,.overline,.category{letter-spacing:.12em;margin:0;font-size:11px;font-weight:700}.eyebrow,.overline{color:var(--accent)}.avatar{border:1px solid var(--border);background:var(--surface);width:44px;height:44px;color:var(--ink);border-radius:50%;font-size:12px;font-weight:700}.intro{padding:30px 4px 24px}h1,h2{font-family:Fraunces,Georgia,serif}h1{letter-spacing:-.04em;margin:7px 0 12px;font-size:clamp(38px,11vw,52px);line-height:.98}.availability-summary{color:var(--muted);margin:0;font-size:15px}.availability-summary strong{color:var(--ink)}.filters{scrollbar-width:none;gap:8px;padding:0 0 18px;display:flex;overflow-x:auto}.filters::-webkit-scrollbar{display:none}.filter{border:1px solid var(--border);min-height:44px;color:var(--ink);background:0 0;border-radius:16px;flex:none;padding:0 15px;font-size:14px}.filter-active{border-color:var(--ink);background:var(--ink);color:#fff}.cocktail-list{gap:18px;display:grid}.cocktail-card{border:1px solid var(--border);background:var(--surface);border-radius:24px;overflow:hidden;box-shadow:0 2px 6px #3d20170a,0 8px 22px #3d20170f}.visual{isolation:isolate;color:#3d2017a8;place-items:center;min-height:202px;display:grid;position:relative;overflow:hidden}.visual:before,.visual:after{content:"";z-index:-1;border-radius:50%;position:absolute}.visual:before{background:#ffffff5e;width:210px;height:210px;transform:translate(-42px,48px)}.visual:after{border:24px solid #ffffff3d;width:158px;height:158px;transform:translate(88px,-67px)}.visual span{text-align:center;letter-spacing:.11em;background:#fffdf978;border:1px solid #3d201729;border-radius:10px;padding:12px 14px;font-size:10px;font-weight:700;line-height:1.5}.visual-citrus{background:#d9dfaa}.visual-ruby{background:#e6ad94}.visual-amber{background:#deb478}.card-content{padding:17px 18px 19px}.category{color:var(--muted)}h2{letter-spacing:-.035em;margin:4px 0 0;font-size:26px;line-height:1}.favorite{width:44px;height:44px;color:var(--ink);background:0 0;border:0;font-size:29px;line-height:1}.description{color:var(--muted);margin:10px 0 14px;font-size:14px}.status{border-radius:10px;margin:0;padding:7px 10px;font-size:13px;font-weight:700;display:inline-block}.status-ready{color:var(--ready-ink);background:var(--ready-bg)}.status-missing{color:var(--missing-ink);background:var(--missing-bg)}.login-page{padding-top:64px}.login-form{gap:10px;margin-top:32px;display:grid}.login-form label{font-size:14px;font-weight:700}.login-form input{border:1px solid var(--border);background:var(--surface);min-height:48px;color:var(--ink);border-radius:12px;padding:0 14px}.login-form input:focus{border-color:var(--accent);outline:3px solid #a9472740}.login-form [role=alert]{color:var(--danger);margin:4px 0;font-size:14px}.login-submit{background:var(--accent);color:#fff;border:0;border-radius:16px;min-height:52px;margin-top:10px;font-weight:700}.bottom-nav{width:min(100%,540px);padding:12px 8px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:#fffdf9f5;grid-template-columns:repeat(4,1fr);margin:auto;display:grid;position:fixed;bottom:0;left:0;right:0}.bottom-nav a{min-height:44px;color:var(--muted);place-items:center;font-size:12px;font-weight:700;text-decoration:none;display:grid}.bottom-nav .nav-active{color:var(--accent)}@media (min-width:541px){.app-shell{padding-top:32px}.bottom-nav{border-right:1px solid var(--border);border-left:1px solid var(--border);border-radius:20px 20px 0 0}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
