:root{--red:#b83227;--red-d:#8e2219;--yellow:#f6b93b;--green:#2e7d32;--cream:#fff8ef;--text:#2b1d16;--muted:#6f5a4c}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--cream);color:var(--text);line-height:1.5;padding-bottom:70px}
.wrap{width:min(1100px,92%);margin:auto}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
button{font:inherit;cursor:pointer}
.demo-ribbon{background:#2b1d16;color:#ffe9c7;text-align:center;font-size:.8rem;padding:.35rem 1rem}
.top{background:#fff;position:sticky;top:0;z-index:30;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.top-in{display:flex;justify-content:space-between;align-items:center;height:62px}
.logo{text-decoration:none;color:var(--red);font-size:1.15rem;font-family:Georgia,serif}
.top-act{display:flex;gap:.5rem;align-items:center}
.lang-toggle{border:2px solid var(--red);background:#fff;color:var(--red);font-weight:800;border-radius:999px;padding:.3rem .75rem;min-height:40px}
.cart-btn{position:relative;background:var(--red);color:#fff;border:0;border-radius:999px;padding:.5rem 1rem;font-size:1.05rem;min-height:40px}
.badge{display:inline-block;background:#fff;color:var(--red);border-radius:999px;font-size:.8rem;font-weight:800;min-width:22px;padding:0 .3rem;transition:transform .2s}
.badge.on{background:var(--yellow);color:#2b1d16}
.hero{background:radial-gradient(circle at 85% 20%,rgba(246,185,59,.45),transparent 40%),linear-gradient(135deg,var(--red-d),var(--red) 60%,#d35400);color:#fff;padding:3rem 0}
.kicker{text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;opacity:.9}
.hero h1{font-family:Georgia,serif;font-size:clamp(1.9rem,5vw,3rem);margin:.4rem 0}
.hero-info{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin:1rem 0 1.4rem;font-size:.92rem}
.btn{display:inline-block;background:var(--yellow);color:#2b1d16;border:0;border-radius:12px;padding:.8rem 1.3rem;font-weight:800;text-decoration:none;text-align:center}
.btn.block{display:block;width:100%;margin-top:1rem}
.btn.small{padding:.5rem .9rem;font-size:.88rem}
.btn.ghost{background:transparent;border:2px solid var(--red);color:var(--red)}
.cats{position:sticky;top:62px;z-index:20;background:var(--cream);border-bottom:1px solid #f0dfcb}
.cats .wrap{display:flex;gap:.5rem;overflow-x:auto;padding:.6rem 0;scrollbar-width:none}
.cats a{flex-shrink:0;text-decoration:none;color:var(--text);background:#fff;border:1px solid #f0dfcb;border-radius:999px;padding:.4rem .9rem;font-weight:600;font-size:.9rem}
.cats a:hover{border-color:var(--red);color:var(--red)}
.cat{padding-top:1.6rem;scroll-margin-top:120px}
.cat h2{font-family:Georgia,serif;color:var(--red-d);margin-bottom:.8rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.dish{display:flex;gap:1rem;background:#fff;border-radius:16px;padding:1rem;box-shadow:0 4px 14px rgba(120,60,20,.08)}
.dish-art{flex-shrink:0;width:84px;height:84px;border-radius:14px;background:linear-gradient(135deg,#ffe0b3,#ffc48a);display:grid;place-items:center;font-size:2.4rem}
.dish-info{flex:1;display:flex;flex-direction:column}
.dish h3{font-size:1rem}
.dish p{color:var(--muted);font-size:.88rem;flex:1}
.pop{background:var(--yellow);font-size:.68rem;padding:.1rem .4rem;border-radius:6px;vertical-align:middle}
.dish-foot{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem}
.add{background:var(--red);color:#fff;border:0;border-radius:10px;padding:.45rem .8rem;font-weight:700;min-height:40px}
.qty{display:flex;align-items:center;gap:.5rem}
.qty button{width:36px;height:36px;border-radius:50%;border:2px solid var(--red);background:#fff;color:var(--red);font-weight:800;font-size:1.1rem}
.qty span{min-width:1.2rem;text-align:center;font-weight:700}
.extras{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1rem;margin:2.5rem 0}
.box{background:#fff;border-radius:16px;padding:1.3rem;box-shadow:0 4px 14px rgba(120,60,20,.08)}
.box h2{font-size:1.1rem;margin-bottom:.7rem}
blockquote{border-left:4px solid var(--yellow);padding:.3rem .8rem;margin-bottom:.8rem}
blockquote footer{font-size:.82rem;color:#c28a00}
.meter{height:12px;background:#f3e6d6;border-radius:999px;overflow:hidden;margin:.8rem 0}
.meter div{height:100%;background:linear-gradient(90deg,var(--yellow),var(--red));width:0;transition:width .5s}
.qr svg{margin:.8rem auto 0;border:6px solid #fff;outline:1px solid #eee}
@media (max-width:860px){.extras{grid-template-columns:1fr}}
.foot{background:#2b1d16;color:#e9d7c3;padding:1.5rem 0;font-size:.9rem;text-align:center}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:40}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(420px,100%);background:#fff;z-index:50;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column;visibility:hidden}
.drawer.open{transform:none;visibility:visible}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;border-bottom:1px solid #eee}
.x{background:none;border:0;font-size:1.3rem;width:44px;height:44px}
.drawer-body{padding:1rem 1.2rem;overflow-y:auto;flex:1}
.lines{list-style:none}
.lines li{display:grid;grid-template-columns:1fr auto auto;gap:.6rem;align-items:center;padding:.6rem 0;border-bottom:1px dashed #eee;font-size:.92rem}
.sum{display:grid;grid-template-columns:1fr auto;gap:.3rem;margin-top:1rem;font-size:.95rem}
.sum dd{text-align:right}
.sum .tot{font-weight:800;font-size:1.1rem;border-top:1px solid #eee;padding-top:.4rem}
#checkout label{display:block;font-weight:600;font-size:.9rem;margin-bottom:.8rem}
#checkout input:not([type=radio]),#checkout select{display:block;width:100%;margin-top:.25rem;padding:.65rem;border:1.5px solid #ddd;border-radius:10px;font:inherit}
fieldset{border:1px solid #eee;border-radius:12px;padding:.8rem;margin-bottom:.5rem}
legend{font-weight:700;padding:0 .3rem}
#checkout .radio{font-weight:500;margin-bottom:.4rem}
.card-mock{background:linear-gradient(135deg,#34495e,#2c3e50);color:#fff;border-radius:12px;padding:.8rem;display:flex;flex-direction:column;gap:.2rem;font-family:monospace}
.err{color:#b3261e;font-weight:600;min-height:1.2em;margin-top:.5rem}
.link{background:none;border:0;color:var(--red);margin-top:.8rem;text-decoration:underline;width:100%}
.empty,.done{text-align:center;padding:2rem 0}
.done p{margin:.4rem 0}
.big{font-size:3rem}
.earn{color:var(--green);font-weight:800}
.sms{background:#e9f7ec;border-radius:14px;padding:.8rem;text-align:left;margin:1rem 0}
.sms p{background:#fff;border-radius:12px;padding:.6rem;margin-top:.3rem;font-size:.9rem}
.demo-note{font-size:.82rem;color:var(--muted)}
.ecg-badge{position:fixed;left:12px;bottom:12px;z-index:35;background:#0b2545;color:#fff;text-decoration:none;font-size:.78rem;font-weight:700;padding:.45rem .8rem;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.ecg-badge span[aria-hidden]{color:#ff8a3d}
.toast{position:fixed;left:50%;bottom:64px;transform:translate(-50%,20px);background:#2b1d16;color:#fff;padding:.6rem 1rem;border-radius:999px;opacity:0;transition:.25s;z-index:60;pointer-events:none;font-size:.9rem;max-width:90%}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.toast{top:76px;bottom:auto}
section{scroll-margin-top:64px}
