*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:#211524;color:#fbe9cc;font-family:Trebuchet MS,Segoe UI,Arial,sans-serif;-webkit-font-smoothing:antialiased}#app{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden;isolation:isolate;touch-action:none;user-select:none;-webkit-user-select:none}#world,#world canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#world{z-index:0}.screen-shading{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 51% 49%,transparent 22%,rgba(15,8,22,.18) 64%,rgba(10,5,16,.68) 118%),linear-gradient(180deg,rgba(19,12,25,.32),transparent 29%,transparent 67%,rgba(15,9,19,.25));box-shadow:inset 0 0 155px 35px rgba(16,7,19,.2)}.screen-shading:after{content:"";position:absolute;inset:0;opacity:.11;pointer-events:none;background-image:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(255,222,169,.11) 4px,transparent 5px);mix-blend-mode:soft-light}#flash{position:absolute;inset:0;z-index:9;pointer-events:none;background:#ff6c73;opacity:0;mix-blend-mode:screen}.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.hud{position:absolute;z-index:20;top:calc(25px + env(safe-area-inset-top));left:clamp(22px,4.3vw,82px);right:clamp(22px,4.3vw,82px);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;gap:15px;pointer-events:none;transition:opacity .25s}.hud-eyebrow,.drink-label,.route-ends,.hud-route,.timer-label,.grip-head,.threat-kicker,.threat-copy strong,.combo span{font-size:10px;font-weight:900;letter-spacing:.17em}.hud-eyebrow{display:block;color:#f5c680;text-shadow:0 1px 8px #311a23;white-space:nowrap}.timer-line{display:flex;align-items:center;gap:11px;margin-top:1px}#clock{font-family:Georgia,Times New Roman,serif;font-weight:700;font-size:clamp(37px,4vw,55px);line-height:1;color:#fff4db;letter-spacing:-.08em;font-variant-numeric:tabular-nums;text-shadow:0 3px 16px #201021}.timer-label{line-height:1.24;color:#f1b870;font-size:9px}.hud-route{align-self:center;width:min(100%,280px);margin:16px auto 0;color:#f3ca90}.route-ends{display:flex;justify-content:space-between;margin-bottom:8px;white-space:nowrap;color:#fee5bb;font-size:9px}.route-ends span:last-child{color:#80ead2}.route-track{height:4px;position:relative;border-radius:20px;background:rgba(255,226,182,.28);box-shadow:0 1px 8px #190d1d}.route-track:before,.route-track:after{content:"";position:absolute;top:-4px;width:11px;height:11px;z-index:2;border-radius:50%;background:#f8d596;border:2px solid #432d33}.route-track:before{left:-3px}.route-track:after{right:-3px;background:#75e6cd}#route-fill{display:block;width:0;height:100%;border-radius:20px;background:linear-gradient(90deg,#f3ad72,#f8d483,#88e6d0);box-shadow:0 0 11px #f9b580}#route-marker{position:absolute;left:0;top:-10px;font-size:18px;line-height:19px;color:#fff2d5;text-shadow:0 0 9px #e9ba76;transform:translateX(-50%)}.hud-drinks{justify-self:end;text-align:right}.drink-label{display:block;color:#f6c884;white-space:nowrap;font-size:9px}.mini-drinks{display:flex;justify-content:flex-end;gap:9px;margin-top:8px}.mini-cup{height:29px;width:21px;position:relative;overflow:hidden;border:2px solid rgba(255,236,207,.86);border-top:3px solid #fff3d8;border-bottom-left-radius:6px;border-bottom-right-radius:6px;border-top-left-radius:3px;border-top-right-radius:3px;background:rgba(24,13,29,.38);box-shadow:inset 0 0 5px rgba(255,255,255,.16),0 2px 9px #221020}.mini-cup:after{content:"";position:absolute;left:3px;top:2px;width:3px;height:12px;background:rgba(255,255,255,.22);border-radius:3px}.mini-cup.berry{width:24px;border-bottom-left-radius:11px;border-bottom-right-radius:11px}.mini-cup.mint{width:18px;height:31px}.mini-liquid{position:absolute;left:2px;right:2px;bottom:2px;height:90%;border-radius:1px 1px 3px 3px;transition:height .12s}.amber .mini-liquid{background:linear-gradient(#ffe4a0,#ffa445);box-shadow:0 0 10px #faad4b}.berry .mini-liquid{background:linear-gradient(#f7a8df,#d753ad);box-shadow:0 0 10px #eb71ca}.mint .mini-liquid{background:linear-gradient(#aaffdd,#51cdb8);box-shadow:0 0 10px #4ddcc5}
.threat{position:absolute;z-index:21;top:26%;left:7vw;display:flex;gap:13px;align-items:center;min-width:190px;padding:10px 15px 12px 10px;border:1px solid rgba(255,226,181,.31);border-left:3px solid #ffc073;border-radius:6px;background:linear-gradient(95deg,rgba(43,25,40,.88),rgba(36,24,40,.71));box-shadow:0 8px 29px rgba(23,10,27,.32),inset 0 1px rgba(255,244,215,.08);backdrop-filter:blur(9px);transition:opacity .18s,transform .18s}.threat.right{left:auto;right:7vw;flex-direction:row-reverse;text-align:right;border-left:1px solid rgba(255,226,181,.31);border-right:3px solid #75ead1}.threat-arrow{font-family:Georgia,serif;font-size:43px;line-height:.8;color:#ffd184;text-shadow:0 0 18px #ffa05d;animation:nudge .52s ease-in-out infinite alternate}.threat.right .threat-arrow{color:#83f2dd;text-shadow:0 0 18px #5cf2d1}.threat-copy{min-width:147px}.threat-kicker{display:block;color:#ffca84;font-size:9px;margin-bottom:3px}.threat-copy strong{font-size:12px;line-height:1.2;color:#fff4dc;white-space:nowrap}.threat-track{height:3px;background:rgba(255,255,255,.16);margin-top:8px;overflow:hidden;border-radius:3px}.threat-track span{display:block;width:100%;height:100%;background:#ffcb7c;transform:scaleX(0);transform-origin:left}.threat.right .threat-track span{background:#80f5dd;transform-origin:right}@keyframes nudge{from{transform:translateX(0)}to{transform:translateX(-6px)}}.threat.right .threat-arrow{animation-name:nudgeRight}@keyframes nudgeRight{from{transform:translateX(0)}to{transform:translateX(6px)}}
.callout{position:absolute;z-index:22;left:50%;top:37%;width:max-content;max-width:88vw;text-align:center;pointer-events:none;opacity:0;transform:translate(-50%,18px) scale(.84);filter:drop-shadow(0 4px 14px #241328)}.callout.show{animation:calloutPop 1.35s cubic-bezier(.18,.82,.27,1) forwards}.callout strong{display:block;font:italic 700 clamp(27px,3.35vw,53px)/1 Georgia,Times New Roman,serif;letter-spacing:-.045em;color:#8effda;-webkit-text-stroke:.4px #fff4dc;text-shadow:2px 3px 0 #3b3840,0 0 26px #3cecc1;white-space:nowrap}.callout span{display:inline-block;margin-top:10px;padding:5px 13px;border-radius:2px;background:#352637;color:#fff1d2;font-size:10px;font-weight:900;letter-spacing:.18em}.callout.steady strong{color:#ffe5a1;text-shadow:2px 3px 0 #542d36,0 0 23px #ffb251}.callout.bad strong{color:#ffad9f;text-shadow:2px 3px 0 #562438,0 0 23px #ff697a}@keyframes calloutPop{0%{opacity:0;transform:translate(-50%,18px) scale(.78)}13%{opacity:1;transform:translate(-50%,-4px) scale(1.1)}26%,71%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-19px) scale(.96)}}
.bottom-hud{position:absolute;z-index:20;left:clamp(22px,4.3vw,82px);bottom:calc(35px + env(safe-area-inset-bottom));width:min(276px,32vw);pointer-events:none;transition:opacity .2s}.grip-head{display:flex;gap:6px;align-items:center;color:#fff0ca;text-shadow:0 2px 8px #241225;font-size:10px}.grip-icon{font-size:17px;line-height:0;color:#f9c16d;margin-right:1px}.grip-head #grip-status{margin-left:auto;color:#d9b392;font-size:8px;letter-spacing:.09em}.grip-bar{height:13px;margin-top:9px;background:rgba(30,17,30,.75);border:1px solid rgba(255,233,195,.54);border-radius:20px;padding:2px;box-shadow:inset 0 2px 6px #201421,0 4px 14px #221223;position:relative;overflow:hidden}#grip-fill{height:100%;width:100%;border-radius:20px;background:linear-gradient(90deg,#e56e82 0%,#f9ad66 33%,#ffe1a3 70%,#88efd4 100%);box-shadow:0 0 10px #ffd2a1;transition:width .08s linear}.grip-bar.low{animation:lowPulse .6s ease-in-out infinite alternate;border-color:#ff8d83}@keyframes lowPulse{to{box-shadow:0 0 15px #e87278,inset 0 2px 6px #201421}}.grip-ticks{position:absolute;inset:2px;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(48,25,37,.56) calc(25% - 1px),rgba(48,25,37,.56) 25%);border-radius:20px}.play-hint{position:absolute;z-index:19;bottom:calc(37px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);white-space:nowrap;color:#fff1d0;text-shadow:0 2px 9px #201020;font-size:10px;font-weight:900;letter-spacing:.15em;transition:opacity .45s}.play-hint span{color:#f4a468;margin:0 10px}.combo{position:absolute;z-index:20;right:clamp(22px,4.3vw,82px);bottom:calc(31px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:8px;text-shadow:0 2px 11px #1d1020}.combo span{color:#f8d599}.combo strong{font:italic 700 42px/.8 Georgia,serif;color:#89f7d9;text-shadow:0 0 19px #54dabe}
.overlay{position:absolute;z-index:30;inset:0;display:flex;align-items:center;overflow-y:auto;overflow-x:hidden;transition:opacity .36s,visibility 0s .36s;background:linear-gradient(90deg,rgba(23,15,29,.98) 0%,rgba(27,17,33,.96) 27%,rgba(33,20,36,.78) 43%,rgba(31,20,35,.28) 71%,rgba(31,20,35,.04) 100%),linear-gradient(180deg,rgba(28,17,31,.3),transparent 35%,rgba(25,15,29,.35));box-shadow:inset 0 0 150px rgba(15,7,21,.49)}.overlay:before{content:"";position:absolute;left:clamp(23px,4.2vw,82px);top:7%;bottom:7%;width:1px;background:linear-gradient(transparent,rgba(244,190,113,.51) 16%,rgba(244,190,113,.51) 84%,transparent)}.overlay:after{content:"✥";position:absolute;left:calc(clamp(23px,4.2vw,82px) - 9px);top:calc(7% - 8px);color:#efbb77;font-size:20px}.overlay-content{position:relative;width:min(620px,51vw);margin-left:clamp(50px,7.25vw,144px);padding:28px 0 32px;max-height:100%;display:flex;flex-direction:column;justify-content:center}.tavern-stamp{align-self:flex-start;border:1px solid rgba(244,205,141,.5);border-radius:2px;padding:8px 13px 7px;color:#f5cb88;font-size:10px;font-weight:900;letter-spacing:.24em;white-space:nowrap;background:rgba(88,57,61,.21)}.stamp-star{color:#89e9cf;padding:0 7px;font-size:11px}.overline{color:#8df1d5;font-size:11px;font-weight:900;letter-spacing:.29em;margin:24px 0 10px}.overlay h1,.overlay h2{font-family:Georgia,Times New Roman,serif;font-weight:700;letter-spacing:-.075em;text-shadow:0 4px 20px #120b1c}.overlay h1{position:relative;font-size:clamp(66px,7.7vw,116px);line-height:.86;margin:0 0 26px;color:#fff0d4;white-space:nowrap}.overlay h1 em{font-weight:400;color:#f4b47f;font-size:.7em;letter-spacing:-.11em}.title-spark{font-family:Georgia,serif;display:inline-block;color:#86e7d0;font-size:.38em;vertical-align:top;position:relative;top:.08em;left:.17em;transform:rotate(-20deg);animation:twinkle 3s ease-in-out infinite}@keyframes twinkle{50%{transform:rotate(25deg) scale(1.25);opacity:.7}}.lead{font:19px/1.45 Georgia,serif;color:#f6dbba;margin:0 0 24px;max-width:580px}.how-to{display:grid;grid-template-columns:1fr 1fr;gap:19px;margin:1px 0 23px}.how-to>div{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-top:1px solid rgba(250,216,175,.4);border-bottom:1px solid rgba(250,216,175,.18)}.how-symbol{display:inline-grid;flex:none;place-items:center;width:29px;height:29px;border:1px solid #f2be7e;color:#ffc58c;border-radius:50%;font-size:17px;line-height:1}.how-to p{margin:0;font-size:11px;line-height:1.6;color:#d8c2b2}.how-to strong{font-size:10px;color:#ffe9c2;letter-spacing:.07em}.start-cta{display:flex;align-items:center;gap:12px;min-height:57px;width:max-content;max-width:100%;padding:0 19px 0 14px;background:linear-gradient(110deg,#fbd996,#f4ab69);color:#281a29;box-shadow:4px 5px 0 #754a4d,0 9px 27px rgba(9,4,13,.35);font-size:12px;font-weight:900;letter-spacing:.13em;white-space:nowrap;border-radius:3px;animation:ctaBreath 2.3s ease-in-out infinite;cursor:pointer}.cta-diamond{font-size:17px}.cta-arrow{font-size:23px;line-height:1;margin-left:14px}@keyframes ctaBreath{50%{box-shadow:4px 5px 0 #754a4d,0 9px 32px rgba(255,181,104,.35);transform:translateY(-2px)}}.fine-print{color:#c19b91;font-size:9px;font-weight:800;line-height:1.6;letter-spacing:.13em;margin:18px 0 0}.intro-corner{position:absolute;right:clamp(22px,4.3vw,82px);bottom:calc(23px + env(safe-area-inset-bottom));color:rgba(255,222,174,.74);font-size:9px;font-weight:800;letter-spacing:.16em;text-align:right;text-shadow:0 2px 9px #1b1020}.intro-corner span{color:#94ead5;margin:0 5px}.ending{background:linear-gradient(90deg,rgba(23,15,29,.98) 0%,rgba(27,17,33,.96) 27%,rgba(33,20,36,.78) 43%,rgba(31,20,35,.28) 71%,rgba(31,20,35,.04) 100%),linear-gradient(180deg,rgba(28,17,31,.3),transparent 35%,rgba(25,15,29,.35))}.ending .overline{margin-top:26px}.overlay h2{font-size:clamp(48px,5vw,77px);line-height:.98;color:#ffe9c7;max-width:650px;margin:0 0 14px}.result-line{display:flex;align-items:center;gap:22px}.result-line strong{font:700 clamp(94px,11vw,156px)/.89 Georgia,serif;letter-spacing:-.095em;color:#85ecd0;text-shadow:0 2px 27px rgba(62,226,183,.3)}.result-line strong span{font-size:.41em;vertical-align:24px;margin-left:6px;letter-spacing:-.07em}.result-caption{font-size:11px;line-height:1.55;letter-spacing:.16em;font-weight:900;color:#ffdfac}.result-rule{width:100%;height:1px;background:linear-gradient(90deg,#ebb77e,rgba(235,183,126,0));margin:18px 0}.end-description{font:18px/1.4 Georgia,serif;color:#f6dfc1;margin:0 0 10px}.end-stats{display:flex;align-items:center;gap:15px;font-size:10px;letter-spacing:.13em;font-weight:900;color:#f0bf87;margin:0 0 24px}.end-stat-separator{color:#7fe7cf}.ending .fine-print{margin-top:19px}.fallback{position:absolute;inset:0;z-index:99;display:grid;place-items:center;text-align:center;padding:30px;background:#211524;color:#fff1d6;font:24px/1.5 Georgia,serif}
@media(max-width:900px){.overlay-content{width:min(550px,65vw)}.overlay h1{font-size:clamp(62px,8.5vw,93px)}.lead{font-size:17px}.how-to{gap:13px}.how-to p{font-size:10px}.hud-route{width:180px}.route-ends{font-size:8px}.drink-label{font-size:8px}.play-hint{font-size:9px}}
@media(max-width:650px){.overlay{align-items:flex-start;background:linear-gradient(180deg,rgba(25,16,32,.99) 0%,rgba(28,17,34,.98) 26%,rgba(28,17,34,.83) 52%,rgba(28,17,34,.17) 85%,rgba(28,17,34,.07) 100%),radial-gradient(ellipse at 40% 24%,rgba(89,53,66,.3),transparent 70%)}.overlay:before{left:20px;top:24px;bottom:auto;height:58%;opacity:.55}.overlay:after{left:11px;top:15px}.overlay-content{width:calc(100% - 54px);max-width:510px;margin:0 27px;padding:calc(31px + env(safe-area-inset-top)) 0 38px;justify-content:flex-start;max-height:none}.tavern-stamp{font-size:8px;padding:6px 8px;letter-spacing:.16em}.stamp-star{padding:0 4px}.overline{font-size:9px;margin:19px 0 10px}.overlay h1{font-size:clamp(56px,13.7vw,80px);line-height:.85;margin-bottom:17px}.lead{font-size:15px;line-height:1.4;margin-bottom:17px}.lead br{display:none}.how-to{gap:12px;margin-bottom:17px}.how-to>div{gap:6px;padding:9px 0}.how-to p{font-size:9px;line-height:1.48}.how-to strong{font-size:8px}.how-symbol{width:23px;height:23px;font-size:13px}.start-cta{min-height:49px;padding:0 10px;gap:8px;font-size:10px;letter-spacing:.06em}.cta-arrow{font-size:18px;margin-left:1px}.cta-diamond{font-size:13px}.fine-print{font-size:8px;margin-top:14px;line-height:1.45}.intro-corner{bottom:calc(15px + env(safe-area-inset-bottom));right:20px;left:20px;font-size:8px}.ending .overlay-content{padding-top:calc(42px + env(safe-area-inset-top))}.ending .overline{margin-top:25px}.overlay h2{font-size:clamp(48px,10vw,67px);line-height:1;margin-bottom:13px}.result-line{gap:15px}.result-line strong{font-size:clamp(83px,20vw,120px)}.result-line strong span{vertical-align:16px}.result-caption{font-size:9px}.result-rule{margin:10px 0}.end-description{font-size:15px}.end-stats{font-size:9px;gap:9px;margin-bottom:20px}.hud{top:calc(15px + env(safe-area-inset-top));left:19px;right:19px;grid-template-columns:1fr 1fr}.hud-eyebrow{font-size:8px}.timer-line{gap:7px}#clock{font-size:39px}.timer-label{font-size:8px}.hud-drinks{grid-column:2;grid-row:1}.drink-label{font-size:8px}.mini-drinks{margin-top:6px}.hud-route{position:absolute;top:73px;left:0;width:100%;margin:0}.route-ends{font-size:8px;margin-bottom:6px}.route-track{height:3px}.threat{top:24%;left:20px;min-width:0;max-width:72vw;gap:7px;padding:7px 9px}.threat.right{right:20px}.threat-arrow{font-size:34px}.threat-copy{min-width:118px}.threat-copy strong{font-size:10px}.threat-kicker{font-size:8px}.callout{top:38%}.callout strong{font-size:clamp(25px,8vw,42px)}.callout span{font-size:8px;margin-top:7px}.bottom-hud{left:50%;transform:translateX(-50%);bottom:calc(22px + env(safe-area-inset-bottom));width:min(310px,76vw)}.play-hint{bottom:calc(72px + env(safe-area-inset-bottom));font-size:8px;letter-spacing:.09em}.play-hint span{margin:0 4px}.combo{right:17px;bottom:calc(64px + env(safe-area-inset-bottom))}.combo span{font-size:8px}.combo strong{font-size:29px}}
@media(max-height:700px) and (min-width:651px){.overlay-content{transform:scale(.84);transform-origin:left center;width:min(735px,62vw)}.overlay h1{margin-bottom:17px}.overlay .overline{margin-top:12px}.lead{margin-bottom:12px}.how-to{margin-bottom:14px}.ending .result-rule{margin:10px 0}.ending .end-stats{margin-bottom:14px}}
@media(max-height:710px) and (max-width:650px){.overlay-content{padding-top:calc(16px + env(safe-area-inset-top))}.overlay h1{font-size:clamp(47px,11.8vw,69px);margin-bottom:12px}.overline{margin:12px 0 7px}.lead{font-size:13px;margin-bottom:10px}.how-to{margin-bottom:12px}.how-to>div{padding:5px 0}.fine-print{margin-top:9px}.ending .overlay-content{padding-top:calc(20px + env(safe-area-inset-top))}.ending .overline{margin-top:12px}.overlay h2{font-size:clamp(42px,9vw,59px)}.result-line strong{font-size:clamp(72px,17vw,97px)}.ending .end-stats{margin-bottom:13px}}
@media(prefers-reduced-motion:reduce){.start-cta,.title-spark,.threat-arrow,.grip-bar.low{animation:none}.callout.show{animation-duration:1.35s}}

.fallback[hidden]{display:none}

.hud.urgent #clock{color:#ffc591;animation:clockPulse .75s ease-in-out infinite alternate}.hud.urgent .timer-label{color:#ff9ca0}.hud.urgent #route-marker{color:#ffad99;text-shadow:0 0 15px #ff7969}@keyframes clockPulse{to{text-shadow:0 0 27px #f77c73,0 3px 16px #201021}}
