:root{--ink:#f7eee5;--muted:#cbb8a6;--coffee:#3d2418;--coffee2:#6f432c;--gold:#c99a68;--panel:rgba(255,255,255,.065);--line:rgba(255,255,255,.10);--bg:#100b08}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Inter,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink)}
body{background:radial-gradient(circle at 75% -10%,#5b3825 0%,transparent 33%),radial-gradient(circle at -15% 75%,#3a2418 0%,transparent 34%),linear-gradient(180deg,#17100c 0%,#100b08 58%,#0b0806 100%)}
.screen{position:relative;width:100vw;height:100vh;overflow:hidden}.screen:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.025) 45%,transparent 75%);pointer-events:none}
.menu-layer,.campaign-layer{position:absolute;inset:0;transition:opacity .65s ease,transform .65s ease}.menu-layer{padding:2.5vh 2.8vw 2.2vh;display:flex;flex-direction:column;opacity:1;transform:translateY(0) scale(1)}
.menu-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:2vw;margin-bottom:1.55vh;padding:1.25vh 1.4vw;border:1px solid rgba(255,255,255,.07);border-radius:1.6vh;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:0 10px 35px rgba(0,0,0,.18)}
.brand-logo{width:8.1vw;min-width:112px;max-width:160px;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 8px 15px rgba(0,0,0,.25))}.brand-copy .kicker{font-size:min(1.25vw,1rem);letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:800}.brand-copy h1{margin:.25vh 0 0;font-size:min(2.9vw,2.25rem);line-height:.95;letter-spacing:-.03em}.screen-no{width:3.8vw;min-width:50px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(201,154,104,.45);color:var(--gold);font-weight:900;font-size:min(1.7vw,1.2rem);background:rgba(201,154,104,.08)}
.menu-grid{display:flex;flex-direction:column;gap:1.0vh;flex:0 0 auto;min-height:0}.category{position:relative;padding:.9vh 1vw .85vh;border-radius:1.4vh;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.075);box-shadow:0 10px 28px rgba(0,0,0,.12);overflow:hidden}.category:after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--gold),transparent)}
.cat-head{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.85vw;margin-bottom:.58vh}.cat-title{display:flex;align-items:center;gap:.72vw}.cat-index{color:var(--gold);font-weight:900;font-size:min(1.22vw,.98rem);letter-spacing:.08em}.cat-name{font-size:min(1.82vw,1.34rem);font-weight:900;letter-spacing:.055em}.size-pill{min-width:3.2vw;text-align:center;padding:.34vh .65vw;border-radius:999px;background:rgba(201,154,104,.13);border:1px solid rgba(201,154,104,.22);color:#f2cfaa;font-size:min(1.2vw,.92rem);font-weight:900}
.rows{display:grid;grid-template-columns:1fr auto auto;gap:.18vh .8vw}.item-name,.item-price{padding:.19vh 0 .31vh;border-bottom:1px solid var(--line);font-size:min(1.43vw,1rem);line-height:1.15}.item-name{color:#f6eee6}.item-price{text-align:right;color:#f3d1ad;font-weight:800}.menu-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:.75vh;color:#a98c76;font-size:min(1.03vw,.82rem);letter-spacing:.08em;text-transform:uppercase}.live-clock{color:#e3b581;font-weight:800}

.feature-strip{position:relative;flex:1;min-height:22vh;margin-top:1.15vh;border-radius:1.6vh;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:linear-gradient(120deg,rgba(201,154,104,.14),rgba(255,255,255,.035) 42%,rgba(255,255,255,.02));box-shadow:0 12px 32px rgba(0,0,0,.14)}
.feature-strip:before{content:"";position:absolute;width:34vw;height:34vw;border-radius:50%;right:-10vw;top:-11vw;background:radial-gradient(circle,rgba(201,154,104,.24),transparent 68%);filter:blur(6px)}
.feature-copy{position:absolute;left:2vw;top:50%;transform:translateY(-50%);z-index:2;max-width:42%}.feature-kicker{color:var(--gold);font-size:min(1.22vw,.95rem);font-weight:900;letter-spacing:.24em;text-transform:uppercase}.feature-title{margin:.65vh 0 .6vh;font-size:min(3.3vw,2.6rem);line-height:.96;letter-spacing:-.03em;font-weight:950}.feature-note{color:#c9b19d;font-size:min(1.28vw,.98rem);line-height:1.5}.feature-image{position:absolute;right:-2vw;bottom:-5.5vh;width:30vw;max-width:470px;max-height:29vh;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(0,0,0,.28))}.feature-glow{position:absolute;right:7vw;bottom:3vh;width:16vw;height:16vw;border-radius:50%;background:radial-gradient(circle,rgba(255,226,191,.20),transparent 70%);filter:blur(8px)}
.camp-badge:empty{display:none}

body.show-campaign .menu-layer{opacity:0;transform:translateY(-10px) scale(.987)}
.campaign-layer{opacity:0;pointer-events:none;transform:translateY(14px) scale(.992);background:linear-gradient(180deg,#f7eee5 0%,#ead7c4 100%);color:#4a2b1d}.campaign-layer .campaign-bg{position:absolute;inset:-2%;background-size:cover;background-position:center;filter:blur(14px) saturate(.82);opacity:.18;transform:scale(1.08)}body.show-campaign .campaign-layer{opacity:1;transform:translateY(0) scale(1)}
.campaign-inner{position:relative;z-index:2;width:100%;height:100%;padding:4.3vh 4vw;overflow:hidden}.camp-logo{position:absolute;top:3.2vh;right:3.4vw;width:9vw;min-width:125px;max-width:165px;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(75,42,22,.18))}.camp-copy{position:absolute;left:4vw;top:8.5vh;max-width:45vw;z-index:5}.camp-badge{display:inline-flex;padding:.65vh 1.05vw;border-radius:999px;background:#5a3420;color:#fff;font-weight:900;font-size:min(1.4vw,1.05rem);letter-spacing:.12em;text-transform:uppercase}.camp-eyebrow{margin-top:1.5vh;color:#9c6f4d;font-weight:900;letter-spacing:.16em;font-size:min(1.55vw,1.15rem)}.camp-title{margin:.5vh 0 0;font-size:min(5.6vw,4.2rem);line-height:.93;letter-spacing:-.045em;font-weight:950}.camp-subtitle{margin-top:1.2vh;font-size:min(2.3vw,1.75rem);font-weight:800;color:#6f4830}.camp-price{margin-top:.8vh;font-size:min(8.1vw,6.2rem);line-height:1;font-weight:950;color:#4b2918}.camp-note{margin-top:1.3vh;font-size:min(1.5vw,1.15rem);font-weight:700;color:#7b5943;max-width:34vw;line-height:1.45}
.drink-stage{position:absolute;right:-2.5vw;bottom:-1.5vh;width:58vw;height:76vh;display:flex;align-items:flex-end;justify-content:center;z-index:3}.drink-stage img.drink{max-width:95%;max-height:100%;object-fit:contain;filter:drop-shadow(0 28px 38px rgba(66,37,20,.25));transform-origin:center bottom}.beans{position:absolute;inset:0;z-index:4;pointer-events:none}.bean{position:absolute;width:2.7vw;max-width:34px;aspect-ratio:.72;border-radius:50%;background:linear-gradient(180deg,#8d5630,#3e2112);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 7px 18px rgba(54,30,17,.18)}.bean:after{content:"";position:absolute;left:47%;top:10%;width:7%;height:80%;background:rgba(239,213,184,.48);border-radius:999px}.b1{left:12%;top:52%}.b2{left:28%;top:20%}.b3{left:55%;top:12%}.b4{left:78%;top:24%}.b5{left:88%;top:53%}.b6{left:63%;top:72%}.b7{left:34%;top:77%}
.steam-wrap{position:absolute;right:18%;bottom:49%;width:21vw;height:25vh;z-index:5;pointer-events:none}.steam{position:absolute;bottom:0;width:24%;height:73%;border-radius:50%;border:8px solid rgba(197,160,127,.35);border-color:rgba(197,160,127,.35) transparent transparent transparent;opacity:0}.s1{left:12%}.s2{left:40%}.s3{left:68%}.bubbles{position:absolute;right:18%;bottom:14%;width:10vw;height:41vh;z-index:5;overflow:hidden;pointer-events:none}.bubble{position:absolute;bottom:-10%;border-radius:50%;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.8);opacity:0}.bubble:nth-child(1){left:12%;width:10px;height:10px}.bubble:nth-child(2){left:34%;width:7px;height:7px}.bubble:nth-child(3){left:56%;width:13px;height:13px}.bubble:nth-child(4){left:72%;width:8px;height:8px}.bubble:nth-child(5){left:46%;width:9px;height:9px}.bubble:nth-child(6){left:25%;width:12px;height:12px}
.ribbon{display:inline-flex;margin-top:1.25vh;height:4.4vw;max-height:60px;align-items:center;justify-content:center;background:linear-gradient(90deg,#6e432b,#4b2a1a);color:#fff;border-radius:999px;font-weight:950;font-size:min(2.25vw,1.65rem);letter-spacing:.08em;overflow:hidden;white-space:nowrap;width:0;padding:0}
/* Animations are applied ONLY when campaign becomes active so they restart every cycle */
.campaign-layer.is-animating .campaign-bg{animation:bgMove 7s ease-in-out both}.campaign-layer.is-animating .bean{animation:beanSpin 3.8s linear infinite}.campaign-layer.is-animating .drink{animation:drinkRise .75s cubic-bezier(.2,.85,.25,1) .15s both,drinkFloat 3.6s ease-in-out 1.05s infinite}.campaign-layer.is-animating .steam{animation:steamRise 2.4s ease-in-out infinite}.campaign-layer.is-animating .s2{animation-delay:.65s}.campaign-layer.is-animating .s3{animation-delay:1.2s}.campaign-layer.is-animating .bubble{animation:bubbleRise 2.4s linear infinite}.campaign-layer.is-animating .bubble:nth-child(2){animation-delay:.4s}.campaign-layer.is-animating .bubble:nth-child(3){animation-delay:.8s}.campaign-layer.is-animating .bubble:nth-child(4){animation-delay:1.2s}.campaign-layer.is-animating .bubble:nth-child(5){animation-delay:1.6s}.campaign-layer.is-animating .bubble:nth-child(6){animation-delay:2s}.campaign-layer.is-animating .camp-logo{animation:fadeDown .55s ease .05s both}.campaign-layer.is-animating .camp-badge{animation:popIn .45s ease .2s both}.campaign-layer.is-animating .camp-eyebrow{animation:slideDown .55s ease .05s both}.campaign-layer.is-animating .camp-title{animation:slideDown .62s cubic-bezier(.2,.85,.22,1) .1s both}.campaign-layer.is-animating .ribbon{animation:ribbonOpen .55s cubic-bezier(.2,.85,.22,1) .68s both}.campaign-layer.is-animating .camp-subtitle{animation:fadeUp .45s ease .9s both}.campaign-layer.is-animating .camp-price{animation:priceIn .5s cubic-bezier(.18,.9,.22,1) 1.15s both,pricePulse 1.65s ease-in-out 1.8s infinite}.campaign-layer.is-animating .camp-note{animation:fadeUp .45s ease 1.35s both}
@keyframes bgMove{0%{transform:scale(1.08) translate(0,0)}100%{transform:scale(1.13) translate(-1.5%,1%)}}@keyframes beanSpin{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-11px) rotate(180deg)}100%{transform:translateY(0) rotate(360deg)}}@keyframes drinkRise{0%{opacity:0;transform:translateY(110px) scale(.95)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes drinkFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes steamRise{0%{transform:translateY(16px) scale(.88) rotate(10deg);opacity:0}22%{opacity:.5}100%{transform:translateY(-48px) scale(1.1) rotate(12deg);opacity:0}}@keyframes bubbleRise{0%{transform:translateY(0) scale(.7);opacity:0}18%{opacity:.62}100%{transform:translateY(-245px) scale(1.15);opacity:0}}@keyframes slideDown{0%{opacity:0;transform:translateY(-32px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeDown{0%{opacity:0;transform:translateY(-16px)}100%{opacity:1;transform:translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.75)}100%{opacity:1;transform:scale(1)}}@keyframes ribbonOpen{0%{width:0;padding-left:0;padding-right:0;opacity:1}100%{width:19vw;padding-left:1.5vw;padding-right:1.5vw;opacity:1}}@keyframes priceIn{0%{opacity:0;transform:scale(.55)}100%{opacity:1;transform:scale(1)}}@keyframes pricePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@media(max-aspect-ratio:10/16){.brand-logo{width:10vw}.brand-copy .kicker{font-size:1.55vw}.brand-copy h1{font-size:3.45vw}.cat-name{font-size:min(2.15vw,1.28rem)}.item-name,.item-price{font-size:min(1.65vw,1rem)}.camp-copy{max-width:48vw}.camp-badge{font-size:1.65vw}.camp-eyebrow{font-size:1.85vw}.camp-title{font-size:min(6.4vw,4.1rem)}.camp-subtitle{font-size:2.7vw}.camp-note{font-size:1.8vw}.drink-stage{width:61vw;height:73vh}}