:root{font-family:Arial Black,Impact,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--color-primary);background:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}.app{position:relative;width:100%;height:100%;min-width:320px;background:radial-gradient(circle at 50% 8%,color-mix(in srgb,var(--color-accent) 28%,transparent),transparent 28%),linear-gradient(180deg,color-mix(in srgb,var(--color-bg) 84%,#22190f),var(--color-bg));color:var(--color-primary);touch-action:none;-webkit-user-select:none;user-select:none}.stage{position:relative;isolation:isolate;width:100%;height:100%;min-height:100dvh;overflow:hidden;padding:clamp(28px,4vh,72px) clamp(28px,5vw,88px)}.ambient-grid{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-3;opacity:.25;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:linear-gradient(to bottom,#000,transparent 72%);mask-image:linear-gradient(to bottom,#000,transparent 72%)}.attract-video,.attract-fallback{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-5;width:100%;height:100%;object-fit:cover}.attract-video{opacity:.46;filter:saturate(.9) contrast(1.12) brightness(.72)}.attract-fallback{background:radial-gradient(circle at 22% 16%,rgba(229,173,85,.22),transparent 22%),radial-gradient(circle at 76% 32%,rgba(255,238,178,.14),transparent 18%),linear-gradient(160deg,rgba(255,255,255,.05),transparent 44%)}.brand-lockup{position:absolute;top:clamp(44px,6vh,86px);left:clamp(34px,5vw,88px);z-index:4;display:flex;align-items:center;gap:clamp(14px,1.8vw,22px);max-width:min(740px,78vw)}.brand-lockup img{width:clamp(72px,8vw,118px);height:auto;max-height:clamp(48px,6vh,82px);object-fit:contain}.brand-mark{display:grid;width:72px;height:72px;place-items:center;border:2px solid color-mix(in srgb,var(--color-accent) 65%,#fff);border-radius:50%;color:var(--color-accent);font-size:34px;font-weight:900}.brand-name{font-size:clamp(24px,3.45vw,48px);font-weight:900;line-height:.96;text-transform:uppercase;text-wrap:balance}.brand-subline{margin-top:9px;color:color-mix(in srgb,var(--color-primary) 72%,transparent);font-size:clamp(10px,1.12vw,15px);font-weight:800;letter-spacing:.2em;text-transform:uppercase}.copy-zone{position:absolute;top:clamp(300px,29vh,500px);left:clamp(34px,5vw,88px);z-index:6;display:grid;max-width:min(610px,58vw);gap:clamp(10px,.9vh,16px)}.copy-zone h1{max-width:8.1ch;margin:0;font-size:clamp(44px,6.9vw,92px);font-weight:950;line-height:.86;text-transform:uppercase;text-wrap:balance;text-shadow:0 8px 26px rgba(0,0,0,.38)}.copy-zone p{max-width:19ch;margin:0;color:color-mix(in srgb,var(--color-primary) 82%,transparent);font-size:clamp(18px,2vw,28px);font-weight:850;line-height:.98;text-transform:uppercase;text-shadow:0 6px 18px rgba(0,0,0,.44)}.phase-pouring .copy-zone{max-width:min(620px,54vw)}.phase-pouring .copy-zone h1{max-width:10ch;font-size:clamp(42px,5.7vw,72px);line-height:.94}.phase-pouring .copy-zone p{display:none}.target-line{position:absolute;left:clamp(18px,5vw,82px);right:clamp(18px,5vw,82px);z-index:4;display:grid;grid-template-columns:minmax(560px,58%) auto 1fr;align-items:center;gap:14px;transform:translateY(50%);pointer-events:none}.target-rule{display:block;height:3px;border-top:3px dashed rgba(255,255,255,.68);filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}.target-rule:first-child{opacity:0}.target-pill{display:inline-flex;align-items:center;justify-content:center;min-width:92px;min-height:52px;padding:0 24px;border:2px solid rgba(255,255,255,.78);border-radius:999px;background:#0807066b;color:#fff;white-space:nowrap;text-align:center;font-size:clamp(14px,2vw,24px);font-weight:900;line-height:1;text-transform:uppercase}.beer-fill{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(circle at 26% 22%,rgba(255,255,255,.34),transparent 4%),linear-gradient(180deg,var(--color-liquid-top),var(--color-liquid-bottom) 78%);box-shadow:inset 0 28px 60px #ffeeaa2e;transition:transform 90ms linear;will-change:transform;transform:translate3d(0,100%,0);backface-visibility:hidden;contain:layout paint style}.phase-pouring .beer-fill{transition:none}.pour-reference-line{position:absolute;top:0;right:0;left:0;z-index:4;height:4px;background:#fff;box-shadow:0 0 0 1px #0003,0 0 18px #ffffff9e}.beer-texture{position:absolute;top:0;right:0;bottom:0;left:0}.beer-texture{opacity:.28;background-image:radial-gradient(circle,rgba(255,255,255,.42) 0 1px,transparent 2px),radial-gradient(circle,rgba(90,29,4,.26) 0 1px,transparent 3px);background-position:0 0,16px 24px;background-size:34px 42px,54px 64px;animation:textureDrift 7s linear infinite}.bubble-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.bubble-layer span{position:absolute;bottom:-30px;display:block;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:#ffffff1f;animation-name:bubbleRise;animation-timing-function:linear;animation-iteration-count:infinite}.foam-line{position:absolute;right:0;bottom:calc(100% - 22px);left:0;height:clamp(50px,7vh,112px);background:radial-gradient(ellipse at 6% 42%,var(--color-foam) 0 22px,transparent 24px),radial-gradient(ellipse at 18% 56%,var(--color-foam) 0 32px,transparent 34px),radial-gradient(ellipse at 31% 38%,var(--color-foam) 0 25px,transparent 27px),radial-gradient(ellipse at 46% 53%,var(--color-foam) 0 34px,transparent 36px),radial-gradient(ellipse at 61% 40%,var(--color-foam) 0 27px,transparent 29px),radial-gradient(ellipse at 76% 55%,var(--color-foam) 0 35px,transparent 37px),radial-gradient(ellipse at 91% 44%,var(--color-foam) 0 28px,transparent 30px),linear-gradient(180deg,var(--color-foam),rgba(255,248,231,.82));animation:foamWobble 2.8s ease-in-out infinite}.bottom-status{position:absolute;right:clamp(22px,5vw,88px);bottom:clamp(28px,6vh,92px);left:clamp(22px,5vw,88px);z-index:7;display:flex;justify-content:center}.tap-cta,.live-meter{min-width:min(520px,86vw);min-height:76px;border:2px solid color-mix(in srgb,var(--color-accent) 80%,#fff);border-radius:999px;background:#0908069e;color:var(--color-primary);box-shadow:0 18px 80px #00000057,inset 0 0 0 1px #ffffff14}.tap-cta{display:flex;align-items:center;justify-content:center;gap:18px;padding:0 30px;text-transform:uppercase}.tap-cta span{font-size:clamp(18px,2.8vw,34px);font-weight:900}.tap-cta strong{display:inline-flex;min-width:98px;min-height:42px;align-items:center;justify-content:center;border-radius:999px;background:var(--color-accent);color:#130d05;font-size:clamp(13px,1.7vw,20px);font-weight:950}.live-meter{display:grid;align-items:center;justify-items:center;padding:12px 28px}.live-meter strong{font-size:clamp(28px,4.4vw,58px);font-weight:950;line-height:1;text-transform:uppercase}.result-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:grid;place-items:center;padding:clamp(22px,5vw,90px);background:#0807065c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:resultIn .32s ease-out both}.result-perfect{animation:resultIn .26s ease-out both,perfectShake .52s cubic-bezier(.36,.07,.19,.97) .12s both}.perfect-celebration{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.perfect-celebration span{position:absolute;top:-24px;width:12px;height:20px;border-radius:2px;background:var(--color-accent);box-shadow:0 0 16px #ffffff52;transform:rotate(var(--confetti-rotate));animation-name:confettiFall;animation-timing-function:cubic-bezier(.15,.78,.34,1);animation-fill-mode:both}.perfect-celebration span:nth-child(3n+1){background:#fff8e7}.perfect-celebration span:nth-child(3n+2){background:#ff2c25}.result-shell{display:grid;width:min(860px,92vw);justify-items:center;gap:clamp(18px,3vh,34px);padding:clamp(28px,5vw,64px);border:2px solid rgba(255,255,255,.16);border-radius:8px;background:linear-gradient(180deg,#ffffff14,#ffffff08),#0b0907d1;box-shadow:0 34px 110px #00000073;position:relative;z-index:1}.result-perfect .result-shell{border-color:color-mix(in srgb,var(--color-accent) 70%,#fff);box-shadow:0 34px 110px #00000080,0 0 90px color-mix(in srgb,var(--color-accent) 34%,transparent)}.result-title{color:#fff;font-size:clamp(38px,7.8vw,108px);font-weight:950;line-height:.92;text-align:center;text-transform:uppercase}.result-score{display:grid;width:clamp(142px,20vw,212px);height:clamp(142px,20vw,212px);place-items:center;border:4px solid color-mix(in srgb,var(--color-accent) 78%,#fff);border-radius:50%;background:radial-gradient(circle at 45% 34%,rgba(255,255,255,.22),transparent 28%),#00000038;color:var(--color-accent);font-size:clamp(50px,8.2vw,94px);font-weight:950;line-height:1;letter-spacing:0;padding-bottom:4px;font-variant-numeric:tabular-nums}.result-perfect .result-score{animation:scorePop .78s cubic-bezier(.18,.89,.32,1.28) .16s both}.result-grid{display:grid;width:100%;grid-template-columns:repeat(3,1fr);gap:12px}.metric{display:grid;min-height:98px;align-content:center;gap:8px;padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#ffffff0f;text-align:center}.metric span{color:color-mix(in srgb,var(--color-primary) 70%,transparent);font-size:13px;font-weight:900;text-transform:uppercase}.metric strong{color:#fff;font-size:clamp(16px,2vw,24px);font-weight:900}.prize-banner{min-height:48px;padding:13px 22px;border-radius:999px;background:var(--color-accent);color:#130d05;font-size:clamp(15px,2vw,24px);font-weight:950;text-transform:uppercase}.result-perfect .prize-banner{animation:prizePulse .82s ease-out .26s both;box-shadow:0 0 36px color-mix(in srgb,var(--color-accent) 42%,transparent)}.operator-button{position:absolute;top:18px;right:18px;z-index:30;display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:#0000002e;color:#ffffff9e;font-size:18px}.operator-button:hover{color:#fff;background:#0006}.debug-panel{position:absolute;bottom:14px;left:14px;z-index:35;display:grid;gap:3px;width:220px;padding:12px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:#000000b8;color:#baf7c9;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}.settings-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;padding:24px;background:#000000a8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.settings-panel{display:grid;width:min(1120px,96vw);max-height:min(920px,92vh);grid-template-rows:auto 1fr auto;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:#12100d;box-shadow:0 28px 120px #0000008a}.settings-header,.settings-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid rgba(255,255,255,.1)}.settings-actions{border-top:1px solid rgba(255,255,255,.1);border-bottom:0}.settings-header h2,.settings-body h3{margin:0;color:#fff;font-weight:950;text-transform:uppercase}.settings-header h2{font-size:24px}.settings-header p{margin:5px 0 0;color:#ffffff9e;font-size:14px}.settings-body{display:grid;gap:24px;overflow:auto;padding:24px}.settings-body section{display:grid;gap:14px}.settings-body h3{font-size:16px}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field{display:grid;gap:7px}.field span{color:#ffffffb8;font-size:12px;font-weight:900;text-transform:uppercase}.field input,.field select{width:100%;min-height:46px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:#ffffff12;color:#fff;padding:0 12px;outline:none}.field select option{color:#111}.field input:focus,.field select:focus{border-color:var(--color-accent)}.color-field input{padding:4px}.checkbox-field{display:flex;min-height:46px;align-items:center;gap:10px}.checkbox-field input{width:22px;min-height:22px}.small-button{min-height:42px;border:0;border-radius:999px;background:var(--color-accent);color:#130d05;padding:0 18px;font-size:13px;font-weight:950;text-transform:uppercase}.small-button.ghost{border:1px solid rgba(255,255,255,.14);background:transparent;color:#fff}@keyframes attractBreath{0%,to{opacity:.78;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}}@keyframes textureDrift{to{background-position:34px -42px,-54px -64px}}@keyframes bubbleRise{0%{transform:translateY(0) translate(0) scale(.72);opacity:0}14%,82%{opacity:.58}to{transform:translateY(-105vh) translate(14px) scale(1.18);opacity:0}}@keyframes foamWobble{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}@keyframes resultIn{0%{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}@keyframes perfectShake{0%,to{transform:translateZ(0) scale(1)}12%{transform:translate3d(-9px,5px,0) scale(1.006)}24%{transform:translate3d(8px,-4px,0) scale(1.004)}36%{transform:translate3d(-6px,-3px,0) scale(1.003)}48%{transform:translate3d(5px,3px,0) scale(1.002)}64%{transform:translate3d(-3px,2px,0)}82%{transform:translate3d(2px,-1px,0)}}@keyframes scorePop{0%{opacity:0;transform:scale(.42)}58%{opacity:1;transform:scale(1.12)}to{opacity:1;transform:scale(1)}}@keyframes prizePulse{0%{transform:scale(.78)}60%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes confettiFall{0%{opacity:0;transform:translate3d(0,-24px,0) rotate(var(--confetti-rotate))}12%{opacity:1}to{opacity:0;transform:translate3d(var(--confetti-drift),112vh,0) rotate(calc(var(--confetti-rotate) + 540deg))}}@media(max-width:720px),(max-height:860px){.stage{padding:22px}.brand-lockup{gap:12px}.brand-mark,.brand-lockup img{width:54px;height:54px}.copy-zone{top:128px;max-width:74vw}.copy-zone p{display:none}.result-grid,.field-grid{grid-template-columns:1fr}.target-line{grid-template-columns:minmax(280px,54%) auto 1fr;gap:8px}.target-pill{min-height:48px;padding:6px 14px}}@media(orientation:portrait)and (min-height:900px){.copy-zone{top:clamp(230px,14.8vh,300px);max-width:min(610px,64vw)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}