:root{
  --sb-green:#00754a;
  --pumpkin:#e89a6a;
  --pumpkin-bright:#f3b17c;
  --pumpkin-hot:#e89763;
  --cinnamon:#8c5a3b;
  --brown:#3f2419;
  --brown-deep:#170e0a;
  --cream:#fff8f2;
  --glass:rgba(43,28,21,.64);
  --line:rgba(246,214,197,.40);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overscroll-behavior:none}
button,a{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.app{position:fixed;inset:0;width:100%;height:100%;height:100dvh;overflow:hidden;background:#000;isolation:isolate;touch-action:manipulation}
.xr-camera-video,.xr-canvas,.fallback-camera,.fallback-camera-bg,.fx-canvas,.camera-grade,.person-glow{position:absolute;left:0;right:0;top:calc(-1 * env(safe-area-inset-top));width:100%;height:calc(100% + env(safe-area-inset-top));}
.xr-camera-video{z-index:0;transform:scaleX(-1);background:#000;filter:brightness(1.02) contrast(.985) saturate(1.01) sepia(.01)}
.xr-canvas{z-index:1;display:block;background:transparent}
.fallback-camera-bg{left:-5%;right:-5%;top:calc(-1 * env(safe-area-inset-top) - 5%);width:110%;height:calc(110% + env(safe-area-inset-top));z-index:0;transform:scaleX(-1);filter:blur(20px) brightness(.56) saturate(1.02) sepia(.05);opacity:.9;pointer-events:none}
.fallback-camera{z-index:0;transform:scaleX(-1);background:transparent;filter:brightness(1.03) contrast(.98) saturate(1.02) sepia(.015)}
.fx-canvas{z-index:3;pointer-events:none}
.camera-grade{z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(10,8,8,.18) 0%,rgba(18,12,10,.04) 14%,transparent 30%,transparent 63%,rgba(20,14,12,.14) 74%,rgba(10,8,8,.64) 100%),radial-gradient(circle at 50% 42%,rgba(243,177,124,.032),rgba(20,13,11,.10) 78%)}
.camera-grade::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.035),transparent 34%),radial-gradient(circle at 50% 50%,rgba(243,201,191,.03),transparent 48%);mix-blend-mode:screen}

.campaign-header{position:absolute;z-index:10;top:max(14px,calc(env(safe-area-inset-top) + 8px));left:12px;right:12px;text-align:center;pointer-events:none;text-shadow:0 8px 30px rgba(0,0,0,.78)}
.campaign-header::before{content:"";position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:min(82vw,360px);height:158px;border-radius:0 0 36px 36px;background:linear-gradient(180deg,rgba(33,22,17,.30),rgba(33,22,17,0));filter:blur(2px);opacity:.95}
.campaign-logo{position:relative;display:block;width:150px;height:auto;object-fit:contain;margin:2px auto 8px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.42))}
.campaign-kicker{position:relative;font-weight:900;letter-spacing:.06em;font-size:clamp(18px,5.3vw,30px);line-height:1;color:#fff}
.campaign-header h1{position:relative;margin:2px 0 0;font-weight:950;font-size:clamp(56px,15.4vw,88px);line-height:.92;letter-spacing:-.05em;color:#fff}
.campaign-header p{position:relative;margin:6px 0 0;color:#fff5eb;font:italic 500 clamp(17px,4.8vw,26px)/1.05 Georgia,serif;letter-spacing:.01em}
.campaign-header em{font-style:italic;color:#fff6eb}

.asset{position:absolute;pointer-events:none;user-select:none;-webkit-user-drag:none}
.orbit{filter:drop-shadow(0 0 12px rgba(243,177,124,.74));mix-blend-mode:screen}
.orbit--face{z-index:5;left:50%;top:27%;width:min(84vw,500px);opacity:0;transform:translateX(-50%) rotate(-8deg)}

.hero-cup-stage{position:absolute;z-index:8;right:1.8%;top:37.8%;width:min(39vw,205px);height:min(34vh,270px);pointer-events:none;transform:translateZ(0)}
.hero-cup-stage::after{content:"";position:absolute;inset:8% 10%;border-radius:50%;background:radial-gradient(circle,rgba(255,245,236,.16) 0,rgba(243,177,124,.12) 26%,rgba(243,177,124,0) 70%);filter:blur(6px);opacity:0;transform:scale(.75);transition:.38s ease}
.hero-cup-stage .fallback-cup{z-index:2;left:50%;top:50%;width:80%;height:88%;max-height:none;object-fit:contain;opacity:0;filter:drop-shadow(0 20px 30px rgba(0,0,0,.46)) drop-shadow(0 0 16px rgba(243,177,124,.20));transform:translate(-50%,-50%) rotate(7deg);transition:filter .35s ease,opacity .25s ease,transform .35s ease}
.hero-cup-stage .smoke{z-index:4;right:20%;top:0;width:38%;opacity:0;mix-blend-mode:screen;animation:smokeDrift 5.2s ease-in-out infinite}
.hero-cup-stage .orbit--cup{z-index:1;left:-24%;top:18%;width:152%;opacity:0;transform:rotate(8deg);transition:opacity .35s ease,filter .35s ease}
.hero-cup-aura{position:absolute;z-index:0;left:50%;top:50%;width:130%;aspect-ratio:1/1;border-radius:50%;transform:translate(-50%,-50%) scale(.72);opacity:0;background:radial-gradient(circle,rgba(243,177,124,.24) 0 20%,rgba(243,201,191,.12) 37%,rgba(243,177,124,0) 68%);filter:blur(2px);transition:.38s ease}
.hero-cup-aura::before,.hero-cup-aura::after{content:"";position:absolute;inset:8%;border:2px solid rgba(255,160,72,.12);border-radius:50%;transform:rotate(-18deg) scaleY(.58);box-shadow:0 0 15px rgba(255,118,25,.08)}
.hero-cup-aura::after{inset:19%;transform:rotate(24deg) scaleY(.64)}
.scan-brackets{position:absolute;z-index:5;inset:7% 4% 12%;opacity:0;transition:.28s ease}
.scan-brackets i{position:absolute;width:25px;height:25px;border-color:#f3b17c;border-style:solid;filter:drop-shadow(0 0 7px rgba(243,177,124,.85))}
.scan-brackets i:nth-child(1){left:0;top:0;border-width:2px 0 0 2px;border-radius:10px 0 0 0}
.scan-brackets i:nth-child(2){right:0;top:0;border-width:2px 2px 0 0;border-radius:0 10px 0 0}
.scan-brackets i:nth-child(3){left:0;bottom:0;border-width:0 0 2px 2px;border-radius:0 0 0 10px}
.scan-brackets i:nth-child(4){right:0;bottom:0;border-width:0 2px 2px 0;border-radius:0 0 10px 0}
.cup-detected-badge,.cup-scan-hint{position:absolute;z-index:7;left:50%;bottom:1px;transform:translate(-50%,9px);white-space:nowrap;border-radius:999px;backdrop-filter:blur(12px);font-size:10px;line-height:1;padding:8px 11px;transition:.28s ease}
.cup-detected-badge{opacity:0;color:#fff3e7;border:1px solid rgba(243,177,124,.72);background:rgba(36,22,16,.82);box-shadow:0 0 15px rgba(243,177,124,.22)}
.cup-detected-badge b{display:inline-grid;place-items:center;width:14px;height:14px;margin-right:4px;border:1px solid #f3b17c;border-radius:50%;color:#f3b17c;font-size:9px}
.cup-scan-hint{opacity:.76;color:#fff4ea;border:1px solid rgba(255,240,228,.18);background:rgba(32,20,16,.42)}

@keyframes smokeDrift{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.025)}}
@keyframes cupFloat{0%,100%{transform:translate(-50%,-50%) translateY(0) rotate(7deg)}50%{transform:translate(-50%,-50%) translateY(-9px) rotate(9deg)}}
@keyframes orbitPulse{0%,100%{opacity:.42;filter:drop-shadow(0 0 9px rgba(255,144,50,.45))}50%{opacity:.72;filter:drop-shadow(0 0 18px rgba(255,144,50,.75))}}
@keyframes detectionPulse{0%,100%{transform:translate(-50%,-50%) scale(.82);opacity:.65}50%{transform:translate(-50%,-50%) scale(1.04);opacity:1}}
@keyframes bracketPulse{0%,100%{opacity:.62;transform:scale(.985)}50%{opacity:1;transform:scale(1.025)}}

.app.is-xr-mode .orbit--face,.app.is-xr-mode .hero-cup-stage .fallback-cup,.app.is-xr-mode .hero-cup-stage .smoke,.app.is-xr-mode .hero-cup-stage .orbit--cup{display:none}
.app.is-fallback-mode .orbit--face{display:block;opacity:.44;animation:orbitPulse 3.8s ease-in-out infinite}
.app.is-fallback-mode .hero-cup-stage .orbit--cup{opacity:.20;animation:orbitPulse 3.8s .8s ease-in-out infinite}
.app.is-fallback-mode .hero-cup-stage .smoke{opacity:.52}
.app.is-fallback-mode .hero-cup-stage .fallback-cup{opacity:.98;animation:cupFloat 3.2s ease-in-out infinite}

.app.cup-detected .hero-cup-aura{opacity:1;animation:detectionPulse 1.45s ease-in-out infinite}
.app.cup-detected .hero-cup-stage::after{opacity:1;transform:scale(1.03)}
.app.cup-detected .scan-brackets{opacity:1;animation:bracketPulse 1.2s ease-in-out infinite}
.app.cup-detected .cup-detected-badge{opacity:1;transform:translate(-50%,0)}
.app.cup-detected .cup-scan-hint{opacity:0;transform:translate(-50%,4px)}
.app.cup-detected.is-fallback-mode .hero-cup-stage .fallback-cup{filter:drop-shadow(0 17px 27px rgba(0,0,0,.40)) drop-shadow(0 0 10px rgba(255,240,206,.88)) drop-shadow(0 0 28px rgba(255,135,31,.95));transform:translate(-50%,-50%) scale(1.055) rotate(7deg)}
.app.cup-detected.is-fallback-mode .hero-cup-stage .orbit--cup{opacity:.92!important;filter:drop-shadow(0 0 28px rgba(255,128,28,.95))}

.cup-hit-area{position:absolute;z-index:14;right:0;top:35%;width:43vw;height:39vh;touch-action:none;cursor:grab}
.cup-hit-area:active{cursor:grabbing}
.face-guide{display:none!important}

.pumpkin-selector{position:absolute;z-index:15;left:10px;right:10px;bottom:112px;padding:12px 0 11px;border:1px solid rgba(255,235,223,.20);border-radius:30px;background:linear-gradient(180deg,rgba(50,33,27,.74),rgba(18,13,11,.90));backdrop-filter:blur(22px) saturate(1.14);box-shadow:0 26px 58px rgba(0,0,0,.40),inset 0 1px rgba(255,255,255,.06),0 0 0 1px rgba(243,177,124,.08)}
.selector-title{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 8px;color:#fff8f0;font-size:10px;letter-spacing:.24em;font-weight:760;white-space:nowrap}
.selector-title i{width:6px;height:6px;transform:rotate(45deg);background:var(--pumpkin-bright);box-shadow:0 0 12px rgba(243,177,124,.75)}
.carousel-shell{position:relative}
.carousel-viewport{position:relative;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:8px 0 10px;overscroll-behavior-x:contain;touch-action:pan-x}
.carousel-viewport::-webkit-scrollbar{display:none}
.carousel-track{display:flex;align-items:stretch;gap:10px;width:max-content;padding:0 calc(50vw - 88px)}
.product-card{position:relative;flex:0 0 clamp(120px,34vw,150px);height:180px;padding:8px 8px 10px;border:1px solid rgba(255,236,222,.16);border-radius:22px;color:#fff;background:linear-gradient(180deg,rgba(88,55,41,.18),rgba(28,18,14,.44));scroll-snap-align:center;scroll-snap-stop:always;display:flex;flex-direction:column;align-items:center;justify-content:space-between;overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,background .25s ease;box-shadow:inset 0 1px rgba(255,255,255,.05)}
.product-card::before{content:"";position:absolute;inset:-45% 12% auto;height:65%;background:radial-gradient(circle,rgba(243,177,124,.15),rgba(243,177,124,0) 68%);pointer-events:none}
.product-card.is-selected{z-index:2;border-color:#f8dbc4;background:linear-gradient(180deg,rgba(108,68,46,.42),rgba(46,28,20,.54));box-shadow:0 0 0 2px rgba(243,177,124,.92),0 0 28px rgba(243,177,124,.30),inset 0 1px rgba(255,255,255,.12);transform:translateY(-5px) scale(1.055)}
.product-card.is-selected::after{content:"";position:absolute;inset:1px;border-radius:20px;border:1px solid rgba(255,244,236,.18);pointer-events:none}
.product-card.is-selected .product-art img{transform:scale(1.06)}
.product-card:active{transform:scale(.985)}
.product-card.is-selected:active{transform:translateY(-2px) scale(1.015)}
.product-art{position:relative;display:grid;place-items:center;width:100%;height:132px;overflow:visible}
.product-art::after{content:"";position:absolute;left:50%;bottom:3px;width:72%;height:12px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.38),transparent 68%);filter:blur(3px)}
.product-art img{position:relative;z-index:1;display:block;max-width:104%;max-height:128px;object-fit:contain;filter:drop-shadow(0 9px 10px rgba(0,0,0,.34));user-select:none;-webkit-user-drag:none}
.product-name{display:block;min-height:33px;text-align:center;color:#fff8f1;font-size:10.4px;font-weight:680;line-height:1.14;text-shadow:0 2px 10px rgba(0,0,0,.58)}
.carousel-arrow{position:absolute;z-index:6;top:50%;width:38px;height:38px;margin-top:-19px;border:1px solid rgba(255,235,223,.44);border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(29,18,14,.86);backdrop-filter:blur(10px);box-shadow:0 7px 18px rgba(0,0,0,.32)}
.carousel-arrow--prev{left:-8px}.carousel-arrow--next{right:-8px}
.carousel-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.carousel-arrow:active{transform:scale(.92)}
.carousel-arrow:disabled{opacity:.30}

.capture-copy{position:absolute;z-index:16;left:50%;transform:translateX(-50%);bottom:84px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:max-content;padding:7px 16px;border-radius:999px;border:1px solid rgba(255,233,220,.16);background:rgba(25,16,13,.36);backdrop-filter:blur(8px);text-align:center;color:#f4c7a1;font:italic 500 15px/1 Georgia,serif;text-shadow:0 2px 10px rgba(0,0,0,.6);pointer-events:none}
.pumpkin-mark{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:6px;background:center/contain no-repeat url("../assets/overlays/pumpkin-corp.svg")}

.camera-actions{position:absolute;z-index:17;left:24px;right:24px;bottom:max(10px,env(safe-area-inset-bottom));height:72px;display:grid;grid-template-columns:56px 1fr 56px;align-items:center;gap:18px}
.round-action,.shutter{border:0;color:#fff;background:rgba(26,17,13,.52);backdrop-filter:blur(11px)}
.round-action{width:54px;height:54px;border:1px solid rgba(255,239,221,.48);border-radius:50%;display:grid;place-items:center;box-shadow:0 10px 22px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.05)}
.round-action--share{color:#f3c08d}
.round-action svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.round-action:disabled{opacity:.34}
.round-action:not(:disabled):active,.shutter:not(:disabled):active{transform:scale(.96)}
.shutter{justify-self:center;width:76px;height:76px;border:3px solid #fff;border-radius:50%;padding:5px;box-shadow:0 0 0 3px rgba(243,177,124,.95),0 0 24px rgba(243,177,124,.32)}
.shutter span{display:block;width:100%;height:100%;border-radius:50%;background:#fff}
.shutter:active span{transform:scale(.92)}
.shutter:disabled{opacity:.48}

.intro{position:absolute;z-index:30;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 50% 18%,rgba(243,177,124,.18),transparent 30%),radial-gradient(circle at 16% 45%,rgba(243,201,191,.08),transparent 24%),linear-gradient(155deg,#5a392d 0%,#2d1d17 48%,#170f0c 100%)}
.intro::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 25%,rgba(243,177,124,.10),transparent 19%),radial-gradient(circle at 80% 72%,rgba(243,201,191,.10),transparent 22%)}
.intro-card{position:relative;width:min(94vw,390px);padding:22px 21px 21px;border:1px solid rgba(255,221,185,.40);border-radius:30px;text-align:center;background:linear-gradient(155deg,rgba(66,40,30,.92),rgba(28,18,14,.92));box-shadow:0 30px 90px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.06)}
.intro-logo{display:block;width:70px;height:70px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 5px 12px rgba(0,0,0,.35))}
.intro-card>span{display:block;color:#f6b977;font-size:10px;letter-spacing:.24em;font-weight:700}
.intro-card h2{margin:10px 0 0;font-size:25px;line-height:1;font-weight:900}
.intro-card h3{margin:0;color:#fff;font-size:clamp(58px,16vw,78px);line-height:.92;font-weight:950;letter-spacing:-.04em}
.intro-tagline{margin:10px 0 17px;color:#fff5e9;font:italic 500 21px Georgia,serif}
.intro-tagline em{font-style:italic}
.intro-copy{margin:0 auto 19px;max-width:315px;color:#f5e7d8;font-size:12.5px;line-height:1.48}
.intro-card button{width:100%;min-height:53px;border:1px solid #ffc48b;border-radius:999px;background:linear-gradient(180deg,#eab07a,#d8874f);color:#fff;font-weight:800;font-size:16px;box-shadow:0 11px 28px rgba(0,0,0,.25)}
.intro-card small{display:block;margin-top:13px;color:#dbcabc;font-size:9px}

.loading{position:absolute;z-index:40;inset:0;display:grid;place-content:center;text-align:center;background:rgba(30,20,16,.93);backdrop-filter:blur(11px)}
.steam-loader{display:flex;justify-content:center;gap:8px;height:50px}
.steam-loader i{width:3px;height:46px;border-radius:50%;background:linear-gradient(transparent,#fff4df,transparent);animation:steam 1.45s ease-in-out infinite}.steam-loader i:nth-child(2){animation-delay:.2s}.steam-loader i:nth-child(3){animation-delay:.4s}
@keyframes steam{0%,100%{transform:translateY(8px) scaleY(.6);opacity:.2}50%{transform:translateY(-7px);opacity:1}}
.loading strong,.loading span{display:block}.loading strong{margin-top:12px;color:#fff;font-size:15px}.loading span{margin-top:5px;max-width:300px;color:#f5ddc8;font-size:11px;line-height:1.42}

.preview{position:absolute;z-index:50;inset:0;display:flex;flex-direction:column;gap:10px;padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom));background:#211008}
.preview img{position:relative;width:100%;height:auto;flex:1 1 auto;min-height:0;object-fit:contain;border-radius:20px;background:#1d0e08}
.preview-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:0 0 auto}
.preview-btn{min-height:54px;display:grid;place-items:center;border:1px solid rgba(255,222,190,.42);border-radius:17px;font-size:13px;font-weight:750;text-decoration:none}.preview-btn--ghost{color:#fff;background:rgba(67,30,14,.90)}.preview-btn--gold{color:#44200d;background:#f0c087}.preview-btn--orange{color:#fff;background:#df6f21}
.mode-badge{position:absolute;z-index:21;top:138px;left:50%;transform:translateX(-50%);padding:8px 12px;border-radius:999px;background:rgba(54,33,25,.88);border:1px solid rgba(255,228,205,.16);font-size:10px;white-space:nowrap}
.toast{position:absolute;z-index:70;left:50%;bottom:194px;transform:translate(-50%,15px);max-width:88%;padding:10px 15px;border-radius:999px;border:1px solid rgba(255,228,205,.16);background:rgba(17,11,9,.88);font-size:11px;text-align:center;opacity:0;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}

.desktop-gate{position:absolute;inset:0;z-index:100;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 50% 18%,rgba(239,125,37,.20),transparent 32%),linear-gradient(145deg,#5a2812,#211008 78%)}
.desktop-gate[hidden]{display:none!important}.desktop-gate__card{width:min(440px,100%);padding:30px 30px 26px;text-align:center;border:1px solid rgba(255,219,180,.38);border-radius:28px;background:rgba(65,29,13,.85);box-shadow:0 24px 70px rgba(0,0,0,.38)}.desktop-gate__logo{display:block;width:76px;height:76px;object-fit:contain;margin:0 auto 12px}.desktop-gate__card>span{display:block;color:#f4b472;font-size:10px;letter-spacing:.24em;font-weight:700}.desktop-gate__card h1{margin:8px 0 10px;color:#fff2e5;font:600 34px/1.08 Georgia,serif}.desktop-gate__card p{max-width:340px;margin:0 auto 20px;color:#f4e6da;font-size:14px;line-height:1.5}.desktop-gate__qr{display:block;width:190px;height:190px;margin:0 auto 16px;padding:10px;border-radius:18px;background:#fff}.desktop-gate__card small{color:#d8c7b8;font-size:10px}


@media(max-width:390px){
  .campaign-header::before{width:min(88vw,320px);height:145px}
  .campaign-logo{width:100px;height: auto}.campaign-kicker{font-size:18px}.campaign-header h1{font-size:52px}.campaign-header p{font-size:17px}
  .hero-cup-stage{right:0;top:38.5%;width:min(40vw,156px)}
  .pumpkin-selector{left:8px;right:8px;bottom:108px;border-radius:26px}.selector-title{font-size:9px;letter-spacing:.17em}.carousel-track{gap:7px;padding:0 calc(50vw - 79px)}.product-card{flex-basis:126px;height:168px;border-radius:20px}.product-art{height:120px}.product-art img{max-height:116px}.product-name{font-size:9.6px}.carousel-arrow{width:34px;height:34px}.carousel-arrow--prev{left:-5px}.carousel-arrow--next{right:-5px}
  .camera-actions{left:18px;right:18px;grid-template-columns:48px 1fr 48px;gap:12px}.round-action{width:46px;height:46px}.shutter{width:68px;height:68px}.capture-copy{bottom:82px;font-size:14px;padding:6px 12px}
}
@media(max-height:740px){
  .campaign-header{transform:scale(.82);transform-origin:top center}
  .hero-cup-stage{top:36.9%;width:min(34vw,148px);height:27vh}.cup-detected-badge,.cup-scan-hint{font-size:8px;padding:6px 8px}
  .pumpkin-selector{bottom:99px;padding-top:9px;padding-bottom:8px}.selector-title{margin-bottom:4px}.product-card{height:150px;flex-basis:114px}.product-art{height:104px}.product-art img{max-height:100px}.product-name{font-size:9px;min-height:27px}.carousel-viewport{padding-top:5px;padding-bottom:6px}
  .capture-copy{bottom:75px;font-size:13px}.camera-actions{height:58px;bottom:max(7px,env(safe-area-inset-bottom))}.shutter{width:62px;height:62px}.round-action{width:44px;height:44px}
}
@media(min-height:900px){
  .pumpkin-selector{bottom:126px}.capture-copy{bottom:96px}.camera-actions{bottom:max(16px,env(safe-area-inset-bottom))}.product-card{height:188px}.product-art{height:138px}.product-art img{max-height:134px}
}

/* ===== V6.1 RESPONSIVE STABILITY + PREMIUM MOTION ===== */
html,body{
  width:100vw!important;
  min-width:100vw!important;
  max-width:100vw!important;
  height:100%!important;
  overflow:hidden!important;
}
body{position:fixed;inset:0}
.app{
  left:0!important;right:auto!important;top:0!important;bottom:auto!important;
  width:var(--app-w,100vw)!important;
  min-width:var(--app-w,100vw)!important;
  max-width:var(--app-w,100vw)!important;
  height:var(--app-h,100dvh)!important;
  max-height:var(--app-h,100dvh)!important;
  overflow:hidden!important;
  contain:layout paint size;
}
.xr-camera-video,.xr-canvas,.fallback-camera,.fallback-camera-bg,.fx-canvas,.camera-grade{
  left:0!important;top:0!important;
  width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;
}
.xr-camera-video,.fallback-camera,.fallback-camera-bg{object-fit:cover!important;object-position:center center!important}

.campaign-header{
  left:0!important;right:0!important;
  width:100%!important;
  padding:0 14px;
  transform:none!important;
}
.campaign-header::before{width:min(84vw,370px)}
.campaign-logo{width:150px;height: auto}
.campaign-kicker{font-size:clamp(18px,5vw,27px);letter-spacing:.055em}
.campaign-header h1{font-size:clamp(54px,14.8vw,82px)}
.campaign-header p{font-size:clamp(17px,4.7vw,25px)}

/* Vector motion remains inside safe horizontal bounds. */
.orbit--face{left:50%;width:min(90vw,520px)}
.hero-cup-stage{right:2%;width:min(38vw,190px);max-width:38vw}
.cup-detect-vector{
  z-index:1;left:50%;top:50%;width:154%;height:154%;
  transform:translate(-50%,-50%) rotate(-8deg) scale(.72);
  opacity:0;filter:drop-shadow(0 0 13px rgba(243,177,124,.42));
  transition:opacity .3s ease,transform .42s cubic-bezier(.2,.75,.2,1);
  mix-blend-mode:screen;
}
.app.cup-detected .cup-detect-vector{
  opacity:.98;transform:translate(-50%,-50%) rotate(7deg) scale(1);
  animation:vectorDetectionOrbit 5.6s linear infinite;
}
@keyframes vectorDetectionOrbit{
  0%{transform:translate(-50%,-50%) rotate(7deg) scale(1)}
  50%{transform:translate(-50%,-50%) rotate(187deg) scale(1.035)}
  100%{transform:translate(-50%,-50%) rotate(367deg) scale(1)}
}
.app.cup-detected .hero-cup-aura{opacity:.9}
.app.cup-detected .scan-brackets{opacity:.75}
.app.cup-detected .cup-detected-badge{box-shadow:0 0 22px rgba(243,177,124,.30)}

.pumpkin-selector{
  left:10px!important;right:10px!important;
  width:auto!important;max-width:none!important;
  overflow:hidden!important;
}
.selector-title{gap:7px}
.selector-title img{display:block;width:16px;height:16px;object-fit:contain;flex:0 0 16px}
.selector-title i{display:none!important}
.carousel-shell,.carousel-viewport{width:100%!important;max-width:100%!important}
.carousel-viewport{overflow-x:auto!important;overflow-y:hidden!important}
.carousel-track{
  gap:9px!important;
  padding-left:calc(50% - 72px)!important;
  padding-right:calc(50% - 72px)!important;
}
.product-card{
  flex:0 0 clamp(116px,33vw,142px)!important;
  transform:scale(.90);
  opacity:.72;
  transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .3s ease,box-shadow .3s ease,border-color .3s ease!important;
}
.product-card.is-selected{
  transform:translateY(-3px) scale(1.04)!important;
  opacity:1;
  box-shadow:0 0 0 2px rgba(243,177,124,.90),0 0 26px rgba(243,177,124,.28),0 18px 34px rgba(0,0,0,.28)!important;
}
.product-card.is-selected .product-art img{transform:scale(1.04)}
.carousel-arrow{z-index:8}
.carousel-arrow--prev{left:0!important}.carousel-arrow--next{right:0!important}

.capture-copy{max-width:calc(100% - 28px);white-space:nowrap}
.camera-actions{
  left:20px!important;right:20px!important;
  width:auto!important;max-width:none!important;
}

@media(max-width:390px){
  .campaign-header{padding:0 10px}
  .campaign-logo{width:100px;height:auto}
  .campaign-header h1{font-size:50px}
  .hero-cup-stage{right:1%;width:min(38vw,148px);max-width:38vw}
  .pumpkin-selector{left:7px!important;right:7px!important}
  .carousel-track{padding-left:calc(50% - 64px)!important;padding-right:calc(50% - 64px)!important}
  .product-card{flex-basis:122px!important}
  .product-card.is-selected{transform:translateY(-2px) scale(1.035)!important}
  .selector-title img{width:14px;height:14px;flex-basis:14px}
}

/* ===== V7 PRODUCTION UX / FUNCTIONALITY ===== */
:root{--det-x:78%;--det-y:48%}
.app.is-rear-camera .fallback-camera,.app.is-rear-camera .fallback-camera-bg{transform:none!important}.app.is-rear-camera .xr-camera-video{transform:none!important}
.person-glow{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at var(--det-x) var(--det-y),rgba(255,188,111,.26) 0 7%,rgba(243,158,83,.14) 14%,rgba(243,158,83,0) 30%),radial-gradient(circle at 50% 47%,rgba(255,195,130,.13),rgba(255,169,90,.055) 25%,rgba(255,169,90,0) 48%);mix-blend-mode:screen;transition:opacity .42s ease}.app.cup-detected .person-glow{opacity:1;animation:personGlowPulse 2.5s ease-in-out infinite}@keyframes personGlowPulse{0%,100%{filter:brightness(.98)}50%{filter:brightness(1.16)}}
.sticker-stage{position:absolute;z-index:11;top:24%;right:3%;width:min(31vw,145px);pointer-events:none;transform:rotate(3deg);filter:drop-shadow(0 7px 14px rgba(0,0,0,.24));transition:opacity .28s ease,transform .32s cubic-bezier(.2,.7,.2,1)}.sticker-stage img{display:block;width:100%;height:auto}.sticker-stage.is-changing{opacity:.15;transform:rotate(-3deg) scale(.88)}
.detected-cup-fx{position:absolute;z-index:13;left:var(--det-x);top:var(--det-y);width:min(37vw,180px);aspect-ratio:1/1;transform:translate(-50%,-50%) scale(.72);opacity:0;pointer-events:none;transition:opacity .28s ease,transform .38s cubic-bezier(.2,.75,.2,1)}.detected-cup-fx>img{position:absolute;inset:-24%;width:148%;height:148%;object-fit:contain;filter:drop-shadow(0 0 13px rgba(243,177,124,.58));mix-blend-mode:screen;animation:detectedVectorSpin 7s linear infinite}.detected-cup-fx .cup-detected-badge{left:50%;bottom:-16px;opacity:1;transform:translateX(-50%);font-size:9px;padding:7px 10px;background:rgba(28,19,15,.78);border-color:rgba(243,193,149,.55);box-shadow:0 7px 22px rgba(0,0,0,.26);white-space:nowrap}.app.cup-detected .detected-cup-fx{opacity:1;transform:translate(-50%,-50%) scale(1)}@keyframes detectedVectorSpin{to{transform:rotate(360deg)}}
.app.cup-detected.is-fallback-mode .hero-cup-stage{opacity:.18;transition:opacity .28s ease}.app:not(.cup-detected).is-fallback-mode .hero-cup-stage{opacity:.78;transition:opacity .28s ease}
.campaign-header{top:max(9px,env(safe-area-inset-top))!important}.campaign-logo{width:56px!important;height:56px!important;margin-bottom:5px!important}.campaign-kicker{font-size:clamp(18px,4.8vw,26px)!important}.campaign-header h1{font-size:clamp(52px,14vw,78px)!important}.campaign-header p{font-size:clamp(17px,4.55vw,24px)!important;margin-top:5px!important}
.pumpkin-selector{left:12px!important;right:12px!important;bottom:112px!important;padding:9px 0 9px!important;border-radius:26px!important;border:1px solid rgba(255,239,228,.24)!important;background:linear-gradient(180deg,rgba(55,34,27,.48),rgba(20,14,12,.66))!important;backdrop-filter:blur(16px) saturate(1.08)!important;box-shadow:0 14px 36px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.055)!important}.selector-title{margin-bottom:4px!important;font-size:9px!important;letter-spacing:.22em!important;color:#fff8f0!important}.selector-title img{width:14px!important;height:14px!important}.carousel-viewport{padding:5px 0 6px!important}.carousel-track{gap:8px!important;padding-left:calc(50% - 68px)!important;padding-right:calc(50% - 68px)!important}.product-card{flex:0 0 clamp(108px,31vw,132px)!important;height:158px!important;padding:6px 7px 8px!important;border-radius:19px!important;border:1px solid rgba(255,235,220,.16)!important;background:rgba(57,36,29,.20)!important;opacity:.76!important;transform:scale(.94)!important;box-shadow:none!important}.product-card::before{opacity:.35!important}.product-card.is-selected{opacity:1!important;transform:translateY(-2px) scale(1.015)!important;border-color:rgba(255,225,202,.58)!important;background:linear-gradient(180deg,rgba(100,64,46,.26),rgba(50,31,24,.28))!important;box-shadow:0 0 0 1px rgba(243,177,124,.32),0 8px 20px rgba(0,0,0,.18)!important}.product-art{height:104px!important}.product-art img{max-height:101px!important;max-width:96%!important;transition:transform .26s ease,filter .26s ease}.product-card.is-selected .product-art img{transform:scale(1.035)!important;filter:drop-shadow(0 8px 12px rgba(0,0,0,.34)) drop-shadow(0 0 7px rgba(243,177,124,.20))!important}.mood-name{display:block;font:italic 600 13px/1 Georgia,serif;color:#fff7ef;text-align:center;margin-top:-2px}.product-name{min-height:auto!important;font-size:8.2px!important;line-height:1.08!important;color:rgba(255,244,234,.72)!important;font-weight:560!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.app.cup-detected .product-card.is-selected{border-color:rgba(255,222,193,.88)!important;box-shadow:0 0 0 1px rgba(243,177,124,.55),0 0 18px rgba(243,177,124,.22),0 8px 20px rgba(0,0,0,.18)!important}.carousel-arrow{width:34px!important;height:34px!important;margin-top:-17px!important;background:rgba(28,18,14,.64)!important;border-color:rgba(255,236,223,.32)!important}.carousel-arrow--prev{left:-4px!important}.carousel-arrow--next{right:-4px!important}
.capture-copy{bottom:83px!important;padding:5px 12px!important;background:rgba(26,17,13,.25)!important;border-color:rgba(255,238,227,.10)!important;font-size:14px!important;color:#f4c8a5!important}.camera-actions{left:24px!important;right:24px!important;grid-template-columns:54px 1fr 54px!important;height:70px!important}.round-action{width:52px!important;height:52px!important;background:rgba(23,15,12,.45)!important;border-color:rgba(255,241,231,.42)!important}.round-action--sticker{color:#f5c49a!important}.round-action svg{width:25px;height:25px}.shutter{width:72px!important;height:72px!important;box-shadow:0 0 0 2px rgba(243,177,124,.92),0 0 18px rgba(243,177,124,.24)!important}
.preview{background:#17100d!important}.preview-actions{grid-template-columns:1fr 1fr!important;gap:9px!important}.preview-btn{min-height:52px!important}.preview-btn--ghost{background:rgba(54,36,28,.82)!important}.preview-btn--orange{background:#00754a!important}.toast{bottom:200px!important;max-width:76%!important;font-size:10px!important;padding:7px 11px!important}
@media(max-width:390px){.sticker-stage{top:23.5%;right:2.5%;width:min(30vw,118px)}.detected-cup-fx{width:min(36vw,150px)}.pumpkin-selector{left:7px!important;right:7px!important;bottom:108px!important}.carousel-track{padding-left:calc(50% - 61px)!important;padding-right:calc(50% - 61px)!important}.product-card{flex-basis:116px!important;height:150px!important}.product-art{height:98px!important}.product-art img{max-height:95px!important}.mood-name{font-size:11px}.product-name{font-size:7.8px!important}.capture-copy{bottom:80px!important;font-size:13px!important}}
@media(max-height:740px){.sticker-stage{top:22%;width:min(27vw,105px)}.campaign-header{transform:scale(.82)!important;transform-origin:top center!important}.pumpkin-selector{bottom:94px!important;padding-top:6px!important;padding-bottom:6px!important}.product-card{height:137px!important;flex-basis:108px!important}.product-art{height:88px!important}.product-art img{max-height:86px!important}.mood-name{font-size:11px}.product-name{font-size:7.4px!important}.capture-copy{bottom:69px!important;font-size:12px!important}.camera-actions{height:56px!important}.round-action{width:43px!important;height:43px!important}.shutter{width:60px!important;height:60px!important}}

/* ================================================================
   V8 FINAL POLISH — preserve V7 functionality, refine visuals only
   ================================================================ */

/* No synthetic drink replaces the selfie. The real cup stays in camera. */
.hero-cup-stage,
.cup-hit-area{display:none!important}

/* Remove any rectangular/square treatment behind campaign typography. */
.campaign-header{
  background:transparent!important;
  box-shadow:none!important;
  filter:none!important;
  text-shadow:0 2px 10px rgba(0,0,0,.38)!important;
}
.campaign-header::before,
.campaign-header::after{display:none!important;content:none!important}
.campaign-header h1,
.campaign-kicker,
.campaign-header p,
.campaign-header em,
.campaign-logo{
  background:transparent!important;
  box-shadow:none!important;
}

/* Stickers are now transparent PNG cutouts; keep only a contour-like shadow. */
.sticker-stage{
  width:min(27vw,126px)!important;
  top:24.5%!important;
  right:3.5%!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.18))!important;
}
.sticker-stage img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
}

/* Actual-cup recognition effect: only glow/filter is placed over camera feed. */
.person-glow{
  background:
    radial-gradient(circle at var(--det-x) var(--det-y),rgba(255,225,190,.34) 0 5%,rgba(247,177,105,.22) 11%,rgba(243,153,76,.10) 21%,rgba(243,153,76,0) 35%),
    radial-gradient(circle at 50% 45%,rgba(255,199,142,.11),rgba(255,177,104,.045) 29%,rgba(255,177,104,0) 52%)!important;
  mix-blend-mode:screen!important;
}
.detected-cup-fx{
  width:min(34vw,164px)!important;
  filter:none!important;
}
.detected-cup-fx>img{
  inset:-18%!important;
  width:136%!important;
  height:136%!important;
  opacity:.86!important;
  filter:drop-shadow(0 0 10px rgba(255,205,158,.62)) drop-shadow(0 0 22px rgba(243,159,82,.32))!important;
}
.detected-cup-fx::before,
.detected-cup-fx::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-50%) scale(.72);
  transition:opacity .28s ease,transform .38s ease;
}
.detected-cup-fx::before{
  width:88%;height:60%;
  border:1.5px solid rgba(255,225,199,.68);
  box-shadow:0 0 12px rgba(255,195,137,.36),inset 0 0 10px rgba(255,211,171,.12);
}
.detected-cup-fx::after{
  width:112%;height:78%;
  border:1px solid rgba(243,177,124,.35);
  box-shadow:0 0 22px rgba(243,159,82,.24);
}
.app.cup-detected .detected-cup-fx::before,
.app.cup-detected .detected-cup-fx::after{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.app.cup-detected .detected-cup-fx::before{animation:v8CupPulse 1.9s ease-in-out infinite}
.app.cup-detected .detected-cup-fx::after{animation:v8CupPulse 2.5s .25s ease-in-out infinite reverse}
@keyframes v8CupPulse{
  0%,100%{filter:brightness(.96);transform:translate(-50%,-50%) scale(.96)}
  50%{filter:brightness(1.15);transform:translate(-50%,-50%) scale(1.05)}
}
.detected-cup-fx .cup-detected-badge{
  bottom:-12px!important;
  font-size:8.5px!important;
  padding:6px 9px!important;
  background:rgba(25,16,12,.72)!important;
  border-color:rgba(255,220,190,.42)!important;
  box-shadow:0 5px 15px rgba(0,0,0,.18)!important;
}

/* Face orbit/vector remains almost invisible until a real cup is detected. */
.app.is-fallback-mode .orbit--face{opacity:.035!important;animation:none!important}
.app.cup-detected.is-fallback-mode .orbit--face{opacity:.13!important;animation:orbitPulse 4.8s ease-in-out infinite!important}

/* Smaller, lighter carousel — same swipe/click/auto-highlight behavior. */
.pumpkin-selector{
  left:22px!important;
  right:22px!important;
  bottom:112px!important;
  padding:6px 0 6px!important;
  border-radius:22px!important;
  border:1px solid rgba(255,239,228,.16)!important;
  background:linear-gradient(180deg,rgba(51,33,27,.37),rgba(21,14,12,.52))!important;
  backdrop-filter:blur(13px) saturate(1.04)!important;
  box-shadow:0 10px 25px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.035)!important;
}
.selector-title{
  margin:0 0 3px!important;
  font-size:8px!important;
  letter-spacing:.21em!important;
  opacity:.88!important;
}
.selector-title img{width:12px!important;height:12px!important;flex-basis:12px!important}
.carousel-viewport{padding:3px 0 4px!important}
.carousel-track{
  gap:5px!important;
  padding-left:calc(50% - 50px)!important;
  padding-right:calc(50% - 50px)!important;
}
.product-card{
  flex:0 0 clamp(88px,25vw,102px)!important;
  height:120px!important;
  padding:4px 5px 6px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,238,225,.11)!important;
  background:rgba(51,33,27,.13)!important;
  opacity:.68!important;
  transform:scale(.96)!important;
  box-shadow:none!important;
}
.product-card.is-selected{
  opacity:1!important;
  transform:translateY(-1px) scale(1.01)!important;
  border-color:rgba(255,225,202,.46)!important;
  background:linear-gradient(180deg,rgba(99,64,47,.20),rgba(48,30,24,.18))!important;
  box-shadow:0 0 0 1px rgba(243,177,124,.20),0 6px 14px rgba(0,0,0,.13)!important;
}
.app.cup-detected .product-card.is-selected{
  border-color:rgba(255,222,193,.66)!important;
  box-shadow:0 0 0 1px rgba(243,177,124,.34),0 0 13px rgba(243,177,124,.15),0 6px 14px rgba(0,0,0,.13)!important;
}
.product-art{height:70px!important}
.product-art img{max-height:68px!important;max-width:91%!important;filter:drop-shadow(0 4px 5px rgba(0,0,0,.22))!important}
.product-card.is-selected .product-art img{transform:scale(1.025)!important;filter:drop-shadow(0 5px 7px rgba(0,0,0,.26)) drop-shadow(0 0 5px rgba(243,177,124,.14))!important}
.mood-name{font-size:11px!important;line-height:1!important;margin-top:0!important}
.product-name{font-size:6.6px!important;line-height:1.04!important;opacity:.76!important;max-width:96%!important}
.carousel-arrow{width:28px!important;height:28px!important;margin-top:-14px!important;background:rgba(24,16,13,.52)!important;border-color:rgba(255,237,225,.23)!important}
.carousel-arrow svg{width:16px!important;height:16px!important}
.carousel-arrow--prev{left:-3px!important}.carousel-arrow--next{right:-3px!important}

.capture-copy{
  bottom:80px!important;
  font-size:12px!important;
  padding:4px 10px!important;
  background:rgba(25,16,13,.20)!important;
  border-color:rgba(255,238,227,.07)!important;
}
.camera-actions{left:24px!important;right:24px!important;height:66px!important;grid-template-columns:50px 1fr 50px!important}
.round-action{width:46px!important;height:46px!important;background:rgba(22,15,12,.38)!important;border-color:rgba(255,241,231,.34)!important}
.round-action svg{width:23px!important;height:23px!important}
.shutter{width:67px!important;height:67px!important}

/* Compact phones: preserve tap targets and prevent Safari clipping. */
@media(max-width:390px){
  .sticker-stage{top:23.8%!important;right:2.5%!important;width:min(25vw,98px)!important}
  .pumpkin-selector{left:14px!important;right:14px!important;bottom:106px!important}
  .carousel-track{padding-left:calc(50% - 47px)!important;padding-right:calc(50% - 47px)!important}
  .product-card{flex-basis:94px!important;height:118px!important}
  .product-art{height:67px!important}.product-art img{max-height:65px!important}
  .mood-name{font-size:11.6px!important}.product-name{font-size:6.4px!important}
  .capture-copy{bottom:78px!important;font-size:12px!important}
  .camera-actions{left:20px!important;right:20px!important}
}
@media(max-height:740px){
  .pumpkin-selector{bottom:91px!important;padding-top:5px!important;padding-bottom:5px!important}
  .product-card{height:112px!important;flex-basis:94px!important}
  .product-art{height:64px!important}.product-art img{max-height:62px!important}
  .mood-name{font-size:11.5px!important}.product-name{font-size:6.4px!important}
  .capture-copy{bottom:67px!important;font-size:11.5px!important}
  .camera-actions{height:54px!important}.round-action{width:42px!important;height:42px!important}.shutter{width:59px!important;height:59px!important}
}

/* ================================================================
   V10 — INTRO / DESKTOP VISUAL SYSTEM
   Matches approved dark Pumpkin direction without touching AR logic.
   ================================================================ */

.intro{
  position:absolute!important;
  inset:0!important;
  z-index:35!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  padding:calc(env(safe-area-inset-top) + 10px) 14px calc(env(safe-area-inset-bottom) + 10px)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 10%,rgba(113,47,23,.34),transparent 27%),
    radial-gradient(circle at 14% 72%,rgba(183,87,39,.11),transparent 28%),
    radial-gradient(circle at 88% 58%,rgba(203,96,42,.10),transparent 26%),
    linear-gradient(180deg,#160a07 0%,#24110b 52%,#130806 100%)!important;
}
.intro::before,
.intro::after{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
  border-radius:50%!important;
  filter:blur(32px)!important;
  opacity:.30!important;
}
.intro::before{width:42vw!important;height:42vw!important;left:-16vw!important;bottom:-12vw!important;background:rgba(179,82,32,.18)!important}
.intro::after{width:34vw!important;height:34vw!important;right:-12vw!important;top:7vh!important;background:rgba(214,109,53,.12)!important}

.intro-brand{
  position:relative!important;
  z-index:3!important;
  flex:0 0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  margin-bottom:2px!important;
}
.intro-brand img{width:58px!important;height:58px!important;object-fit:contain!important;filter:drop-shadow(0 5px 14px rgba(0,0,0,.24))!important}
.intro-brand strong{font-size:12px!important;letter-spacing:.14em!important;font-weight:900!important;color:#fff!important}

.intro-card{
  position:relative!important;
  z-index:2!important;
  width:min(91vw,410px)!important;
  max-height:calc(var(--app-h,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 92px)!important;
  min-height:0!important;
  padding:18px 20px 16px!important;
  border:1px solid rgba(221,132,70,.58)!important;
  border-radius:30px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  background:
    radial-gradient(circle at 50% 18%,rgba(122,55,27,.20),transparent 34%),
    linear-gradient(180deg,rgba(50,22,14,.92),rgba(27,12,8,.96))!important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
  backdrop-filter:blur(6px)!important;
}
.intro-card > :not(.intro-vector-layer){position:relative!important;z-index:2!important}

.intro-vector-layer{position:absolute!important;inset:0!important;z-index:1!important;pointer-events:none!important;overflow:hidden!important;border-radius:inherit!important}
.intro-swirl{position:absolute!important;width:210px!important;height:auto!important;opacity:.28!important;mix-blend-mode:screen!important;filter:drop-shadow(0 0 8px rgba(242,137,60,.18))!important}
.intro-swirl--left{left:-118px!important;top:33%!important;transform:rotate(10deg)!important}
.intro-swirl--right{right:-124px!important;top:42%!important;transform:scaleX(-1) rotate(-12deg)!important}
.intro-pumpkin{position:absolute!important;width:28px!important;height:28px!important;object-fit:contain!important;opacity:.88!important;filter:drop-shadow(0 0 7px rgba(242,146,75,.22))!important}
.intro-pumpkin--left{left:13px!important;top:23%!important}
.intro-pumpkin--right{right:14px!important;top:48%!important}

.intro-eyebrow{display:block!important;margin:0 0 5px!important;color:#e79054!important;font-size:10px!important;letter-spacing:.23em!important;font-weight:800!important}
.intro-card h2{margin:0!important;color:#fff!important;font-size:clamp(22px,6vw,28px)!important;line-height:1!important;font-weight:900!important;letter-spacing:.03em!important}
.intro-card h3{margin:3px 0 0!important;color:#fff!important;font-size:clamp(60px,17vw,82px)!important;line-height:.90!important;font-weight:950!important;letter-spacing:-.05em!important;text-shadow:0 3px 16px rgba(0,0,0,.24)!important}
.intro-tagline{margin:8px 0 5px!important;color:#e9945c!important;font:italic 500 clamp(21px,6vw,28px)/1.04 Georgia,serif!important;white-space:nowrap!important}
.intro-tagline em{font-style:italic!important;color:inherit!important}

.intro-ornament{display:flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;margin:4px 0 7px!important;width:100%!important}
.intro-ornament i{display:block!important;width:min(23vw,92px)!important;height:1px!important;background:linear-gradient(90deg,transparent,rgba(226,126,60,.70))!important}
.intro-ornament i:last-child{background:linear-gradient(90deg,rgba(226,126,60,.70),transparent)!important}
.intro-ornament img{width:24px!important;height:24px!important;object-fit:contain!important;filter:drop-shadow(0 0 6px rgba(239,140,71,.20))!important}

.intro-copy{margin:0 auto 5px!important;max-width:318px!important;color:rgba(255,246,239,.90)!important;font-size:12.2px!important;line-height:1.40!important;font-weight:500!important}
.intro-copy strong{color:#e99055!important;font-weight:800!important}

.intro-hero{
  position:relative!important;
  width:calc(100% + 20px)!important;
  margin:0 -10px 5px!important;
  min-height:0!important;
  flex:1 1 auto!important;
  display:grid!important;
  place-items:end center!important;
  overflow:visible!important;
}
.intro-hero::after{
  content:""!important;
  position:absolute!important;
  left:8%!important;right:8%!important;bottom:3%!important;height:20%!important;
  border-radius:50%!important;
  background:radial-gradient(ellipse,rgba(0,0,0,.36),transparent 70%)!important;
  filter:blur(5px)!important;
  z-index:0!important;
}
.intro-hero img{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  width:min(100%,385px)!important;
  max-height:205px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:drop-shadow(0 12px 20px rgba(0,0,0,.24))!important;
}

.intro-card button{
  position:relative!important;
  z-index:3!important;
  flex:0 0 auto!important;
  width:100%!important;
  min-height:55px!important;
  padding:0 20px!important;
  border:1px solid rgba(255,188,127,.74)!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  background:linear-gradient(180deg,#f7a260 0%,#ef7d34 100%)!important;
  color:#fff!important;
  font-weight:850!important;
  font-size:16px!important;
  box-shadow:0 10px 25px rgba(148,62,18,.26),inset 0 1px 0 rgba(255,255,255,.28)!important;
}
.intro-card button strong{font-size:25px!important;font-weight:500!important;line-height:1!important;transform:translateY(-1px)!important}
.intro-card button:active{transform:scale(.985)!important}
.intro-card small{display:block!important;flex:0 0 auto!important;margin-top:10px!important;color:rgba(255,238,225,.76)!important;font-size:9px!important;line-height:1.2!important}
.intro-card small span{margin-right:4px!important;color:#e99a63!important}

/* Desktop: simple, campaign-led QR gate. No heavy web navigation. */
.desktop-gate{
  position:absolute!important;inset:0!important;z-index:100!important;
  display:grid!important;place-items:center!important;
  padding:40px!important;
  background:
    radial-gradient(circle at 74% 30%,rgba(160,66,24,.18),transparent 27%),
    radial-gradient(circle at 16% 76%,rgba(131,51,20,.14),transparent 25%),
    linear-gradient(135deg,#130806 0%,#261008 52%,#100705 100%)!important;
}
.desktop-gate__shell{
  position:relative!important;
  width:min(1080px,94vw)!important;
  min-height:600px!important;
  display:grid!important;
  grid-template-columns:minmax(390px,.9fr) minmax(430px,1.1fr)!important;
  align-items:center!important;
  gap:36px!important;
  padding:54px!important;
  border:1px solid rgba(215,118,56,.50)!important;
  border-radius:34px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,rgba(49,21,13,.90),rgba(24,10,7,.94))!important;
  box-shadow:0 34px 100px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.desktop-gate__copy{position:relative!important;z-index:2!important;text-align:left!important}
.desktop-gate__logo{display:block!important;width:76px!important;height:76px!important;object-fit:contain!important;margin:0 0 16px!important}
.desktop-gate__eyebrow{display:block!important;color:#e98e51!important;font-size:11px!important;letter-spacing:.22em!important;font-weight:800!important;margin-bottom:10px!important}
.desktop-gate__copy h1{margin:0 0 14px!important;color:#fff!important;font:850 clamp(42px,4.1vw,62px)/.98 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;letter-spacing:-.035em!important}
.desktop-gate__copy h1 em{display:block!important;margin-top:8px!important;color:#e8965e!important;font:italic 500 .72em/1 Georgia,serif!important}
.desktop-gate__copy p{margin:0!important;max-width:430px!important;color:rgba(255,243,234,.82)!important;font-size:16px!important;line-height:1.5!important}
.desktop-gate__ornament{display:flex!important;align-items:center!important;gap:12px!important;margin:20px 0!important}
.desktop-gate__ornament i{width:78px!important;height:1px!important;background:rgba(218,121,62,.46)!important}
.desktop-gate__ornament img{width:24px!important;height:24px!important}
.desktop-gate__qr-card{display:flex!important;align-items:center!important;gap:18px!important;width:max-content!important;max-width:100%!important;padding:12px 18px 12px 12px!important;border:1px solid rgba(255,235,219,.16)!important;border-radius:22px!important;background:rgba(255,255,255,.055)!important;backdrop-filter:blur(10px)!important}
.desktop-gate__qr{width:152px!important;height:152px!important;margin:0!important;padding:8px!important;border-radius:16px!important;background:#fff!important;box-shadow:0 12px 28px rgba(0,0,0,.22)!important}
.desktop-gate__qr-card strong{display:block!important;color:#fff!important;font-size:18px!important;margin-bottom:5px!important}
.desktop-gate__qr-card small{display:block!important;max-width:190px!important;color:rgba(255,237,224,.66)!important;font-size:12px!important;line-height:1.35!important}
.desktop-gate__visual{position:relative!important;z-index:1!important;min-height:500px!important;display:grid!important;place-items:end center!important}
.desktop-gate__hero{position:relative!important;z-index:2!important;width:min(100%,580px)!important;max-height:410px!important;object-fit:contain!important;filter:drop-shadow(0 26px 34px rgba(0,0,0,.30))!important}
.desktop-gate__swirl{position:absolute!important;z-index:1!important;width:430px!important;opacity:.28!important;mix-blend-mode:screen!important;filter:drop-shadow(0 0 12px rgba(236,127,54,.16))!important}
.desktop-gate__swirl--one{left:-36px!important;top:36px!important;transform:rotate(14deg)!important}.desktop-gate__swirl--two{right:-76px!important;bottom:25px!important;transform:scaleX(-1) rotate(-18deg)!important}
.desktop-gate__pumpkin{position:absolute!important;z-index:3!important;width:42px!important;height:42px!important;opacity:.90!important}.desktop-gate__pumpkin--one{left:4%!important;bottom:18%!important}.desktop-gate__pumpkin--two{right:4%!important;top:18%!important;width:34px!important;height:34px!important}

/* Mobile fit controls. */
@media(max-width:420px){
  .intro{gap:7px!important;padding-left:12px!important;padding-right:12px!important}
  .intro-brand img{width:52px!important;height:52px!important}.intro-brand strong{font-size:11px!important}
  .intro-card{width:min(93vw,390px)!important;padding:16px 16px 14px!important;border-radius:27px!important}
  .intro-eyebrow{font-size:9px!important;margin-bottom:4px!important}
  .intro-card h2{font-size:clamp(21px,5.8vw,25px)!important}.intro-card h3{font-size:clamp(57px,16.2vw,74px)!important}
  .intro-tagline{font-size:clamp(19px,5.3vw,24px)!important;margin-top:7px!important}
  .intro-ornament{margin:3px 0 6px!important}.intro-ornament img{width:21px!important;height:21px!important}
  .intro-copy{font-size:11.5px!important;line-height:1.36!important}
  .intro-hero img{max-height:188px!important;width:min(100%,360px)!important}
  .intro-card button{min-height:53px!important;font-size:15px!important}
}
@media(max-height:760px){
  .intro{justify-content:flex-start!important;gap:5px!important;padding-top:calc(env(safe-area-inset-top) + 6px)!important}
  .intro-brand img{width:46px!important;height:46px!important}.intro-brand strong{font-size:10px!important}
  .intro-card{max-height:calc(var(--app-h,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 64px)!important;padding:13px 15px 12px!important}
  .intro-card h2{font-size:21px!important}.intro-card h3{font-size:58px!important}.intro-tagline{font-size:19px!important;margin:5px 0 3px!important}
  .intro-eyebrow{margin-bottom:3px!important}.intro-ornament{margin:2px 0 4px!important}.intro-copy{font-size:10.8px!important;line-height:1.32!important;margin-bottom:2px!important}
  .intro-hero img{max-height:155px!important}.intro-hero{margin-bottom:3px!important}
  .intro-card button{min-height:48px!important;font-size:14px!important}.intro-card small{margin-top:7px!important;font-size:8.3px!important}
}


/* ===== V10.2 VISUAL-ONLY FIX =====
   Important: V10 introduced display:flex!important on .intro, which overrode
   the global [hidden] rule. This made the intro reappear after starting.
   Keep AR/camera logic untouched and restore native hidden behavior here. */
.intro[hidden]{display:none!important}

/* Move the approved intro composition slightly lower without changing layout logic. */
.intro-brand,
.intro-card{transform:translateY(18px)!important}

@media(max-height:760px){
  .intro-brand,
  .intro-card{transform:translateY(10px)!important}
}


/* ===== V10.3 visual-only compact carousel ===== */
.pumpkin-selector{
  left:28px!important;
  right:28px!important;
  bottom:108px!important;
  padding:5px 0 5px!important;
  border-radius:20px!important;
  box-shadow:0 8px 18px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.03)!important;
}
.selector-title{
  margin:0 0 2px!important;
  font-size:7.5px!important;
  letter-spacing:.20em!important;
}
.selector-title img{width:11px!important;height:11px!important;flex-basis:11px!important}
.carousel-viewport{padding:2px 0 3px!important}
.carousel-track{
  gap:4px!important;
  padding-left:calc(50% - 46px)!important;
  padding-right:calc(50% - 46px)!important;
}
.product-card{
  flex:0 0 clamp(82px,23vw,94px)!important;
  height:108px!important;
  padding:4px 4px 5px!important;
  border-radius:14px!important;
  opacity:.66!important;
}
.product-card.is-selected{
  transform:translateY(-1px) scale(1.008)!important;
}
.product-art{height:60px!important}
.product-art img{max-height:58px!important;max-width:89%!important}
.mood-name{font-size:11px!important}
.product-name{font-size:6px!important;line-height:1.02!important;max-width:92%!important}
.carousel-arrow{width:26px!important;height:26px!important;margin-top:-13px!important}
.carousel-arrow svg{width:14px!important;height:14px!important}
.carousel-arrow--prev{left:-2px!important}.carousel-arrow--next{right:-2px!important}
.capture-copy{
  bottom:76px!important;
  font-size:11.5px!important;
  padding:4px 9px!important;
}
.camera-actions{left:26px!important;right:26px!important;height:64px!important;grid-template-columns:48px 1fr 48px!important}
.round-action{width:44px!important;height:44px!important}
.shutter{width:64px!important;height:64px!important}

@media(max-width:390px){
  .pumpkin-selector{left:20px!important;right:20px!important;bottom:104px!important}
  .carousel-track{padding-left:calc(50% - 44px)!important;padding-right:calc(50% - 44px)!important}
  .product-card{flex-basis:88px!important;height:104px!important}
  .product-art{height:56px!important}.product-art img{max-height:54px!important}
  .mood-name{font-size:10.6px!important}.product-name{font-size:5.8px!important}
  .capture-copy{bottom:74px!important;font-size:11px!important}
  .camera-actions{left:22px!important;right:22px!important}
}
@media(max-height:740px){
  .pumpkin-selector{bottom:88px!important;padding-top:4px!important;padding-bottom:4px!important}
  .product-card{height:100px!important;flex-basis:86px!important}
  .product-art{height:52px!important}.product-art img{max-height:50px!important}
  .mood-name{font-size:10px!important}.product-name{font-size:5.7px!important}
  .capture-copy{bottom:63px!important;font-size:10.8px!important}
  .camera-actions{height:52px!important}.round-action{width:40px!important;height:40px!important}.shutter{width:57px!important;height:57px!important}
}


/* ===== V10.4 visual-only: more camera space ===== */
/* Remove secondary lines to free vertical space */
.capture-copy{display:none!important}
.product-name{display:none!important}

/* Make the drink selector shorter and lighter without touching behavior */
.pumpkin-selector{
  left:30px!important;
  right:30px!important;
  bottom:92px!important;
  padding:4px 0 4px!important;
  border-radius:18px!important;
}
.selector-title{
  margin:0 0 1px!important;
  font-size:7.2px!important;
  letter-spacing:.19em!important;
}
.selector-title img{width:10px!important;height:10px!important;flex-basis:10px!important}
.carousel-viewport{padding:2px 0!important}
.carousel-track{
  gap:4px!important;
  padding-left:calc(50% - 43px)!important;
  padding-right:calc(50% - 43px)!important;
}
.product-card{
  flex:0 0 clamp(80px,22vw,92px)!important;
  height:92px!important;
  padding:4px 4px 4px!important;
  border-radius:13px!important;
  justify-content:flex-start!important;
}
.product-card.is-selected{transform:translateY(-1px) scale(1.006)!important}
.product-art{height:58px!important;margin-top:2px!important}
.product-art img{max-height:56px!important;max-width:88%!important}
.mood-name{font-size:10.8px!important;line-height:1!important;margin-top:4px!important}
.carousel-arrow{width:24px!important;height:24px!important;margin-top:-12px!important}
.carousel-arrow svg{width:13px!important;height:13px!important}
.carousel-arrow--prev{left:-2px!important}.carousel-arrow--next{right:-2px!important}
.camera-actions{left:26px!important;right:26px!important;bottom:max(14px,env(safe-area-inset-bottom))!important;height:62px!important;grid-template-columns:46px 1fr 46px!important}
.round-action{width:42px!important;height:42px!important}
.shutter{width:62px!important;height:62px!important}

/* Slightly wider framing on fallback front camera to reduce the zoomed-in feel */

@media(max-width:390px){
  .pumpkin-selector{left:22px!important;right:22px!important;bottom:90px!important}
  .carousel-track{padding-left:calc(50% - 42px)!important;padding-right:calc(50% - 42px)!important}
  .product-card{flex-basis:84px!important;height:90px!important}
  .product-art{height:54px!important}.product-art img{max-height:52px!important}
  .mood-name{font-size:10.4px!important}
  .camera-actions{left:22px!important;right:22px!important}
}
@media(max-height:740px){
  .pumpkin-selector{bottom:78px!important;padding-top:3px!important;padding-bottom:3px!important}
  .product-card{height:86px!important;flex-basis:82px!important}
  .product-art{height:50px!important}.product-art img{max-height:48px!important}
  .mood-name{font-size:9.8px!important}
  .camera-actions{height:50px!important}.round-action{width:38px!important;height:38px!important}.shutter{width:54px!important;height:54px!important}
}


/* =========================================================
   V14 STAGE 1 — Ajustes oficiales: acceso + intro.
   Base funcional: V10.4 estable. Sin cambios al motor de cámara.
   ========================================================= */
.desktop-gate__hero{
  width:min(100%,620px)!important;
  max-height:430px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:drop-shadow(0 28px 36px rgba(0,0,0,.32))!important;
}
.desktop-gate__eyebrow{letter-spacing:.24em!important}

/* El logo debe leerse siempre verde + blanco, no verde sobre fondo oscuro. */
.intro-brand img,
.campaign-logo,
.desktop-gate__logo{
  background:#fff!important;
  border-radius:50%!important;
  padding:4px!important;
  object-fit:contain!important;
  box-shadow:0 5px 18px rgba(0,0,0,.20)!important;
}

/* Texto aprobado para la intro: STARBUCKS, sin PUMPKIN en el eyebrow. */
.intro-eyebrow{
  color:#f2b07e!important;
  letter-spacing:.24em!important;
}

/* Hero aprobado en escritorio: conserva la fotografía completa sin recortarla. */
.desktop-gate__visual{
  align-items:end!important;
  overflow:visible!important;
}

@media(max-width:900px){
  .desktop-gate__hero{max-height:350px!important}
}

/* =========================================================
   V15 — INTRO REFINADA CON ASSETS OFICIALES DEL USUARIO
   Solo afecta pantalla desktop QR + intro móvil.
   No modifica cámara, carrusel, captura ni AR.
   ========================================================= */
:root{
  --v15-ink:#170806;
  --v15-card:#3a160f;
  --v15-card-2:#4a2015;
  --v15-wood:#9e6851;
  --v15-cream:#f8dda5;
  --v15-peach:#f5b06c;
  --v15-orange:#ff7a3d;
  --v15-gold:#e99a00;
  --v15-line:rgba(245,176,108,.42);
}

.seasonal-canvas{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
}
.brand-lockup{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.brand-lockup strong,.intro-brand strong{font-size:11px!important;font-weight:900!important;letter-spacing:.18em!important;color:#fff!important}
.brand-mark{
  position:relative;
  display:grid!important;
  place-items:center!important;
  width:66px!important;
  height:66px!important;
  flex:0 0 66px!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 10px 26px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.16)!important;
  overflow:hidden!important;
}
.brand-mark img{display:block!important;width:92%!important;height:92%!important;object-fit:contain!important}

/* ---------- DESKTOP / QR ---------- */
.desktop-gate--v15{
  position:absolute!important;
  inset:0!important;
  z-index:100!important;
  display:grid!important;
  place-items:center!important;
  padding:clamp(24px,4vw,64px)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 72% 50%,rgba(245,176,108,.13),transparent 32%),
    radial-gradient(circle at 12% 82%,rgba(255,122,61,.10),transparent 26%),
    linear-gradient(180deg,#090504 0%,#160906 34%,#2f130d 66%,#472318 100%)!important;
}
.desktop-gate--v15[hidden]{display:none!important}
.desktop-gate--v15::after{
  content:"";position:absolute;z-index:0;left:0;right:0;bottom:0;height:42%;pointer-events:none;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.16) 52%,rgba(105,57,39,.34));
}
.desktop-gate--v15 .desktop-gate__shell{
  position:relative!important;
  z-index:2!important;
  width:min(1180px,91vw)!important;
  min-height:min(650px,80vh)!important;
  display:grid!important;
  grid-template-columns:minmax(390px,.88fr) minmax(500px,1.12fr)!important;
  align-items:center!important;
  gap:clamp(28px,4vw,64px)!important;
  padding:clamp(40px,4vw,64px)!important;
  border:1px solid rgba(245,176,108,.38)!important;
  border-radius:32px!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(67,28,18,.74),rgba(41,17,12,.78)),
    radial-gradient(circle at 70% 42%,rgba(245,176,108,.11),transparent 36%)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.44),inset 0 1px rgba(255,255,255,.035)!important;
  backdrop-filter:blur(3px)!important;
}
.desktop-gate--v15 .desktop-gate__shell::after{
  content:"";position:absolute;z-index:0;left:38%;right:-8%;bottom:-2%;height:43%;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.20) 38%,rgba(158,104,81,.34));
  filter:blur(20px);pointer-events:none;
}
.desktop-gate--v15 .desktop-gate__copy{position:relative!important;z-index:3!important;align-self:center!important;text-align:left!important}
.desktop-gate--v15 .brand-lockup--desktop{margin-bottom:20px!important}
.desktop-gate--v15 .brand-mark{width:70px!important;height:70px!important;flex-basis:70px!important}
.desktop-gate--v15 .desktop-gate__eyebrow{
  display:block!important;margin:0 0 8px!important;color:var(--v15-peach)!important;
  font-size:10px!important;letter-spacing:.25em!important;font-weight:900!important;
}
.desktop-gate--v15 .desktop-gate__copy h1{
  max-width:500px!important;margin:0 0 14px!important;color:#fff!important;
  font:900 clamp(42px,4vw,64px)/.97 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  letter-spacing:-.042em!important;
}
.desktop-gate--v15 .desktop-gate__copy h1 em{
  display:block!important;margin:4px 0 5px!important;color:var(--v15-peach)!important;
  font:italic 500 .72em/1.02 Georgia,"Times New Roman",serif!important;letter-spacing:-.015em!important;
}
.desktop-gate--v15 .desktop-gate__copy p{
  max-width:450px!important;margin:0 0 22px!important;color:rgba(255,247,240,.88)!important;
  font-size:15px!important;line-height:1.55!important;font-weight:500!important;
}
.desktop-gate--v15 .desktop-gate__qr-card{
  position:relative!important;display:grid!important;grid-template-columns:136px minmax(180px,1fr) 56px!important;
  align-items:center!important;gap:17px!important;width:min(440px,100%)!important;padding:12px 14px 12px 12px!important;
  border:1px solid rgba(245,176,108,.34)!important;border-radius:22px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(68,28,17,.52))!important;
  box-shadow:0 15px 36px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.04)!important;
  backdrop-filter:blur(14px)!important;
}
.desktop-gate--v15 .desktop-gate__qr{width:136px!important;height:136px!important;margin:0!important;padding:8px!important;border-radius:15px!important;background:#fff!important;box-shadow:0 8px 22px rgba(0,0,0,.24)!important}
.desktop-gate--v15 .desktop-gate__qr-copy strong{display:block!important;color:#fff!important;font-size:17px!important;line-height:1.12!important;margin:0 0 5px!important}
.desktop-gate--v15 .desktop-gate__qr-copy span{display:block!important;color:var(--v15-cream)!important;font-size:12px!important;line-height:1.35!important;margin-bottom:5px!important}
.desktop-gate--v15 .desktop-gate__qr-copy small{display:block!important;color:rgba(255,242,232,.62)!important;font-size:10px!important;line-height:1.35!important}
.desktop-gate--v15 .desktop-gate__qr-cup{display:block!important;width:50px!important;max-height:88px!important;object-fit:contain!important;opacity:.88!important;filter:drop-shadow(0 5px 11px rgba(0,0,0,.18))!important}
.desktop-gate--v15 .desktop-gate__visual{
  position:relative!important;z-index:2!important;min-height:520px!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;
}
.desktop-gate--v15 .desktop-gate__visual-glow{
  position:absolute!important;z-index:0!important;left:8%!important;right:4%!important;bottom:13%!important;height:58%!important;
  background:radial-gradient(ellipse at 52% 58%,rgba(245,176,108,.26),rgba(255,122,61,.08) 45%,transparent 72%)!important;
  filter:blur(20px)!important;
}
.desktop-gate--v15 .desktop-gate__hero{
  position:relative!important;z-index:2!important;display:block!important;width:min(680px,100%)!important;max-height:none!important;object-fit:contain!important;
  transform:translateY(20px)!important;filter:drop-shadow(0 26px 36px rgba(0,0,0,.30))!important;
}

/* ---------- MOBILE INTRO ---------- */
.intro--v15{
  position:absolute!important;inset:0!important;z-index:30!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
  gap:9px!important;padding:calc(env(safe-area-inset-top) + 12px) 12px max(14px,env(safe-area-inset-bottom))!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 36%,rgba(245,176,108,.13),transparent 30%),
    linear-gradient(180deg,#100604 0%,#2f110b 46%,#552919 76%,#1a0906 100%)!important;
}
.intro--v15[hidden]{display:none!important}
.intro--v15::after{
  content:"";position:absolute;z-index:0;left:-10%;right:-10%;bottom:-6%;height:48%;pointer-events:none;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.18) 42%,rgba(111,61,42,.28));filter:blur(18px);
}
.intro--v15 .intro-brand{
  position:relative!important;z-index:3!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:5px!important;
  transform:none!important;margin:0!important;flex:0 0 auto!important;
}
.intro--v15 .intro-brand .brand-mark{width:54px!important;height:54px!important;flex-basis:54px!important;box-shadow:0 7px 18px rgba(0,0,0,.20)!important}
.intro--v15 .intro-brand strong{font-size:10px!important;letter-spacing:.18em!important}
.intro--v15 .intro-card{
  position:relative!important;z-index:2!important;transform:none!important;width:min(94vw,410px)!important;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 92px)!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
  padding:18px 18px 14px!important;border:1px solid rgba(245,176,108,.42)!important;border-radius:29px!important;overflow:hidden!important;text-align:center!important;
  background:
    linear-gradient(180deg,rgba(68,27,18,.96) 0%,rgba(55,21,15,.96) 43%,rgba(93,47,31,.92) 68%,rgba(126,78,59,.80) 82%,rgba(52,24,16,.96) 100%)!important;
  box-shadow:0 26px 68px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.04)!important;
}
.intro--v15 .intro-card::before{
  content:"";position:absolute;z-index:0;left:-8%;right:-8%;top:47%;height:41%;pointer-events:none;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.22) 31%,rgba(158,104,81,.44) 75%,rgba(94,48,31,.12));filter:blur(10px);
}
.intro--v15 .intro-card > *{position:relative!important;z-index:2!important}
.intro--v15 .intro-card__glow{position:absolute!important;z-index:1!important;left:12%!important;right:12%!important;top:43%!important;height:38%!important;background:radial-gradient(ellipse,rgba(245,176,108,.17),transparent 68%)!important;filter:blur(15px)!important;pointer-events:none!important}
.intro--v15 .intro-card h2{margin:0!important;color:#fff!important;font:900 clamp(21px,5.8vw,27px)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;letter-spacing:.025em!important}
.intro--v15 .intro-card h3{margin:4px 0 0!important;color:#fff!important;font:950 clamp(58px,16vw,78px)/.90 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;letter-spacing:-.055em!important;text-shadow:0 3px 14px rgba(0,0,0,.23)!important}
.intro--v15 .intro-tagline{margin:9px 0 2px!important;color:var(--v15-peach)!important;font:italic 500 clamp(19px,5.5vw,25px)/1.04 Georgia,"Times New Roman",serif!important;white-space:nowrap!important}
.intro--v15 .intro-ornament{display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;margin:5px 0 7px!important;width:100%!important}
.intro--v15 .intro-ornament i{display:block!important;width:min(22vw,86px)!important;height:1px!important;background:linear-gradient(90deg,transparent,rgba(245,176,108,.72))!important}
.intro--v15 .intro-ornament i:last-child{background:linear-gradient(90deg,rgba(245,176,108,.72),transparent)!important}
.intro--v15 .intro-ornament img{width:21px!important;height:21px!important;object-fit:contain!important;filter:none!important}
.intro--v15 .intro-copy{margin:0 auto 5px!important;max-width:330px!important;color:rgba(255,248,242,.92)!important;font-size:11.8px!important;line-height:1.38!important;font-weight:520!important}
.intro--v15 .intro-copy strong{color:var(--v15-peach)!important;font-weight:850!important}
.intro--v15 .intro-hero{
  position:relative!important;width:calc(100% + 24px)!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0 -12px 4px!important;display:grid!important;place-items:center!important;overflow:visible!important;flex:1 1 auto!important;
}
.intro--v15 .intro-hero::after{
  content:"";position:absolute!important;z-index:0!important;left:4%!important;right:4%!important;bottom:2%!important;height:35%!important;background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.25) 30%,rgba(158,104,81,.46))!important;filter:blur(12px)!important;pointer-events:none!important;
}
.intro--v15 .intro-hero img{
  position:relative!important;z-index:2!important;display:block!important;width:100%!important;max-width:390px!important;height:auto!important;max-height:230px!important;object-fit:contain!important;object-position:center bottom!important;
  filter:drop-shadow(0 13px 20px rgba(0,0,0,.22))!important;
}
.intro--v15 .intro-card button{
  position:relative!important;z-index:4!important;width:100%!important;min-height:58px!important;flex:0 0 auto!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:16px!important;
  margin:2px 0 0!important;padding:0 24px!important;border:1px solid rgba(248,221,165,.92)!important;border-radius:999px!important;
  background:linear-gradient(180deg,#f8ad70,#ff8a45 62%,#f17a38)!important;color:#fff!important;font-size:16px!important;font-weight:850!important;
  box-shadow:0 10px 26px rgba(104,40,13,.30),0 0 0 2px rgba(245,176,108,.13),inset 0 1px rgba(255,255,255,.26)!important;
}
.intro--v15 .intro-card button::before{content:"";position:absolute;left:12%;right:12%;top:0;height:42%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent);pointer-events:none}
.intro--v15 .intro-card button strong{font-size:26px!important;font-weight:500!important}
.intro--v15 .intro-card small{display:block!important;margin-top:9px!important;color:rgba(255,240,229,.76)!important;font-size:8.7px!important;line-height:1.2!important;flex:0 0 auto!important}
.intro--v15 .intro-card small span{color:var(--v15-peach)!important;margin-right:5px!important}

@media(max-height:760px){
  .intro--v15{gap:5px!important;padding-top:calc(env(safe-area-inset-top) + 5px)!important}
  .intro--v15 .intro-brand .brand-mark{width:44px!important;height:44px!important;flex-basis:44px!important}
  .intro--v15 .intro-brand strong{font-size:8.5px!important}
  .intro--v15 .intro-card{padding:12px 14px 10px!important;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 62px)!important}
  .intro--v15 .intro-card h2{font-size:20px!important}.intro--v15 .intro-card h3{font-size:56px!important}.intro--v15 .intro-tagline{font-size:18px!important;margin-top:5px!important}
  .intro--v15 .intro-ornament{margin:3px 0 4px!important}.intro--v15 .intro-copy{font-size:10.5px!important;line-height:1.3!important;margin-bottom:1px!important}
  .intro--v15 .intro-hero img{max-height:166px!important}.intro--v15 .intro-card button{min-height:48px!important;font-size:14px!important}.intro--v15 .intro-card small{margin-top:6px!important;font-size:7.8px!important}
}
@media(max-width:360px){
  .intro--v15 .intro-card{width:95vw!important;padding-left:12px!important;padding-right:12px!important}
  .intro--v15 .intro-tagline{font-size:18px!important}.intro--v15 .intro-copy{font-size:10.8px!important}
  .intro--v15 .intro-hero{width:calc(100% + 18px)!important;margin-left:-9px!important;margin-right:-9px!important}
}
@media(max-width:1040px) and (min-width:700px){
  .desktop-gate--v15 .desktop-gate__shell{grid-template-columns:1fr 1fr!important;gap:28px!important;padding:36px!important}
  .desktop-gate--v15 .desktop-gate__copy h1{font-size:44px!important}.desktop-gate--v15 .desktop-gate__hero{width:100%!important}
  .desktop-gate--v15 .desktop-gate__qr-card{grid-template-columns:116px 1fr!important}.desktop-gate--v15 .desktop-gate__qr{width:116px!important;height:116px!important}.desktop-gate--v15 .desktop-gate__qr-cup{display:none!important}
}

/* =========================================================
   V15.1 — INTRO BLEND + MOBILE FULLSCREEN
   UX/UI refinement only. No camera/AR behavior changes.
   - Banner asset stays untouched; edges are blended via CSS.
   - Mobile intro occupies the full visual viewport.
   ========================================================= */

/* ---------- DESKTOP: integrate banner into background ---------- */
.desktop-gate--v15 .desktop-gate__visual{
  isolation:isolate!important;
  overflow:visible!important;
  border-radius:28px!important;
  background:
    radial-gradient(ellipse at 55% 48%,rgba(245,176,108,.17) 0%,rgba(190,94,47,.07) 42%,transparent 70%),
    linear-gradient(180deg,transparent 0 43%,rgba(154,99,77,.08) 55%,rgba(154,99,77,.42) 84%,rgba(101,52,36,.10) 100%)!important;
}
.desktop-gate--v15 .desktop-gate__visual::before{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  pointer-events:none!important;
  border-radius:28px!important;
  background:
    linear-gradient(90deg,rgba(47,19,13,.96) 0%,rgba(47,19,13,.55) 4%,transparent 14%,transparent 88%,rgba(47,19,13,.25) 96%,rgba(47,19,13,.72) 100%),
    linear-gradient(180deg,transparent 0 67%,rgba(83,41,29,.03) 74%,rgba(83,41,29,.36) 94%,rgba(61,28,20,.72) 100%)!important;
}
.desktop-gate--v15 .desktop-gate__hero{
  width:min(720px,112%)!important;
  max-width:112%!important;
  transform:translateY(30px)!important;
  filter:drop-shadow(0 24px 34px rgba(0,0,0,.22))!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,#000 0%,#000 76%,transparent 100%)!important;
  -webkit-mask-composite:source-in!important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,#000 0%,#000 76%,transparent 100%)!important;
  mask-composite:intersect!important;
}
.desktop-gate--v15 .desktop-gate__visual-glow{
  left:0!important;right:0!important;bottom:6%!important;height:72%!important;
  background:radial-gradient(ellipse at 52% 57%,rgba(245,176,108,.22),rgba(205,111,67,.08) 48%,transparent 73%)!important;
  filter:blur(24px)!important;
}

/* ---------- MOBILE: full-screen immersive intro ---------- */
.intro--v15{
  width:100%!important;
  height:100%!important;
  min-height:100dvh!important;
  padding:0!important;
  gap:0!important;
  justify-content:stretch!important;
  background:
    radial-gradient(circle at 50% 40%,rgba(245,176,108,.13),transparent 31%),
    linear-gradient(180deg,#100604 0%,#2f110b 45%,#653520 73%,#1a0906 100%)!important;
}
.intro--v15 .intro-brand{
  position:absolute!important;
  z-index:5!important;
  top:calc(env(safe-area-inset-top) + 11px)!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  margin:0!important;
  gap:4px!important;
}
.intro--v15 .intro-brand .brand-mark{
  width:52px!important;height:52px!important;flex-basis:52px!important;
}
.intro--v15 .intro-brand strong{font-size:9px!important;letter-spacing:.20em!important}
.intro--v15 .intro-card{
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:100dvh!important;
  max-height:none!important;
  margin:0!important;
  padding:calc(env(safe-area-inset-top) + 88px) 20px calc(env(safe-area-inset-bottom) + 14px)!important;
  border:0!important;
  border-radius:0!important;
  justify-content:flex-start!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(63,23,16,.94) 0%,rgba(63,23,16,.96) 34%,rgba(84,38,25,.93) 49%,rgba(137,86,64,.70) 67%,rgba(88,44,29,.82) 82%,rgba(32,13,9,.98) 100%)!important;
  box-shadow:none!important;
}
.intro--v15 .intro-card::after{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  inset:12px!important;
  border:1px solid rgba(245,176,108,.34)!important;
  border-radius:28px!important;
  pointer-events:none!important;
}
.intro--v15 .intro-card::before{
  left:-12%!important;right:-12%!important;top:43%!important;height:47%!important;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.19) 27%,rgba(158,104,81,.42) 68%,rgba(86,40,27,.09))!important;
  filter:blur(13px)!important;
}
.intro--v15 .intro-card h2{flex:0 0 auto!important}
.intro--v15 .intro-card h3{flex:0 0 auto!important}
.intro--v15 .intro-tagline{flex:0 0 auto!important}
.intro--v15 .intro-ornament{flex:0 0 auto!important}
.intro--v15 .intro-copy{flex:0 0 auto!important}

/* Banner gets more presence and fades into the wooden gradient instead of
   reading as a rectangular image block. The PNG itself is never modified. */
.intro--v15 .intro-hero{
  isolation:isolate!important;
  flex:1 1 auto!important;
  width:calc(100% + 40px)!important;
  min-height:170px!important;
  max-height:310px!important;
  margin:2px -20px 5px!important;
  overflow:hidden!important;
  align-items:end!important;
  background:
    radial-gradient(ellipse at 50% 58%,rgba(245,176,108,.14),transparent 65%),
    linear-gradient(180deg,transparent 0 48%,rgba(158,104,81,.16) 66%,rgba(143,89,68,.38) 91%,rgba(78,36,24,.18) 100%)!important;
}
.intro--v15 .intro-hero::before{
  content:""!important;
  position:absolute!important;
  z-index:3!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(72,30,20,.88) 0%,rgba(72,30,20,.20) 8%,transparent 18%,transparent 82%,rgba(72,30,20,.20) 92%,rgba(72,30,20,.88) 100%),
    linear-gradient(180deg,transparent 0 69%,rgba(94,49,34,.04) 76%,rgba(81,38,26,.58) 100%)!important;
}
.intro--v15 .intro-hero::after{
  left:0!important;right:0!important;bottom:-3%!important;height:38%!important;
  background:linear-gradient(180deg,rgba(158,104,81,0),rgba(158,104,81,.20) 28%,rgba(106,55,38,.56) 88%,rgba(62,27,19,.75))!important;
  filter:blur(11px)!important;
  z-index:1!important;
}
.intro--v15 .intro-hero img{
  z-index:2!important;
  width:min(560px,100%)!important;
  max-width:none!important;
  max-height:300px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:drop-shadow(0 11px 18px rgba(0,0,0,.18))!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 7%,#000 93%,transparent 100%),linear-gradient(180deg,#000 0%,#000 80%,transparent 100%)!important;
  -webkit-mask-composite:source-in!important;
  mask-image:linear-gradient(90deg,transparent 0%,#000 7%,#000 93%,transparent 100%),linear-gradient(180deg,#000 0%,#000 80%,transparent 100%)!important;
  mask-composite:intersect!important;
}
.intro--v15 .intro-card button{
  flex:0 0 58px!important;
  min-height:58px!important;
  margin:0!important;
}
.intro--v15 .intro-card small{
  flex:0 0 auto!important;
  margin:9px 0 0!important;
  padding-bottom:1px!important;
}

/* Compact iPhones: preserve the full-screen layout without losing CTA. */
@media(max-height:760px){
  .intro--v15{padding:0!important;gap:0!important}
  .intro--v15 .intro-brand{top:calc(env(safe-area-inset-top) + 7px)!important}
  .intro--v15 .intro-brand .brand-mark{width:42px!important;height:42px!important;flex-basis:42px!important}
  .intro--v15 .intro-brand strong{font-size:7.8px!important}
  .intro--v15 .intro-card{
    height:100%!important;min-height:100dvh!important;max-height:none!important;
    padding:calc(env(safe-area-inset-top) + 67px) 15px calc(env(safe-area-inset-bottom) + 9px)!important;
  }
  .intro--v15 .intro-card h2{font-size:19px!important}
  .intro--v15 .intro-card h3{font-size:52px!important}
  .intro--v15 .intro-tagline{font-size:17px!important;margin-top:5px!important}
  .intro--v15 .intro-ornament{margin:2px 0 3px!important}
  .intro--v15 .intro-copy{font-size:10.2px!important;line-height:1.27!important;margin-bottom:0!important}
  .intro--v15 .intro-hero{min-height:120px!important;max-height:205px!important;margin:0 -15px 3px!important;width:calc(100% + 30px)!important}
  .intro--v15 .intro-hero img{max-height:205px!important}
  .intro--v15 .intro-card button{min-height:48px!important;flex-basis:48px!important;font-size:14px!important}
  .intro--v15 .intro-card small{margin-top:5px!important;font-size:7.6px!important}
}
@media(max-width:360px){
  .intro--v15 .intro-card{width:100%!important;padding-left:14px!important;padding-right:14px!important}
  .intro--v15 .intro-hero{width:calc(100% + 28px)!important;margin-left:-14px!important;margin-right:-14px!important}
}

/* Never show the desktop gate as a floating card on phones. */
@media(max-width:699px){
  .desktop-gate--v15{display:none!important}
}

/* =========================================================
   V15.2 — MOBILE HERO FULL-WIDTH + CTA SOBRE MADERA
   Ajuste UX/UI solicitado. No cambia cámara/AR ni assets.
   ========================================================= */
@media(max-width:699px){
  .intro--v15{
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:hidden!important;
  }

  .intro--v15 .intro-card{
    position:relative!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:none!important;
    padding:calc(env(safe-area-inset-top) + 82px) 18px calc(env(safe-area-inset-bottom) + 12px)!important;
    overflow:hidden!important;
    background:
      linear-gradient(180deg,
        #431b13 0%,
        #4b1f15 35%,
        #61301f 50%,
        #8f5a43 65%,
        #a56d53 77%,
        #7b4633 90%,
        #30150f 100%)!important;
  }

  /* El contenido superior conserva la composición aprobada. */
  .intro--v15 .intro-card h2,
  .intro--v15 .intro-card h3,
  .intro--v15 .intro-tagline,
  .intro--v15 .intro-ornament,
  .intro--v15 .intro-copy{
    flex:0 0 auto!important;
  }

  /* El banner usa todo el ancho real del viewport. Se elimina el fade lateral
     que lo hacía parecer una tarjeta/rectángulo dentro del fondo. */
  .intro--v15 .intro-hero{
    position:relative!important;
    z-index:2!important;
    flex:1 1 auto!important;
    width:100vw!important;
    min-width:100vw!important;
    max-width:none!important;
    min-height:0!important;
    max-height:none!important;
    margin:auto calc(50% - 50vw) 0!important;
    display:flex!important;
    align-items:flex-end!important;
    justify-content:center!important;
    overflow:visible!important;
    background:transparent!important;
  }
  .intro--v15 .intro-hero::before{
    content:""!important;
    position:absolute!important;
    z-index:1!important;
    left:0!important;right:0!important;top:0!important;height:29%!important;
    background:linear-gradient(180deg,#61301f 0%,rgba(97,48,31,.64) 36%,rgba(97,48,31,0) 100%)!important;
    pointer-events:none!important;
  }
  .intro--v15 .intro-hero::after{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    left:0!important;right:0!important;bottom:0!important;height:12%!important;
    background:linear-gradient(180deg,rgba(139,84,62,0),rgba(91,47,34,.18))!important;
    filter:none!important;
    pointer-events:none!important;
  }
  .intro--v15 .intro-hero img{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:100vw!important;
    min-width:100vw!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center bottom!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  /* CTA montado directamente sobre la zona de madera del banner. */
  .intro--v15 .intro-card button{
    position:relative!important;
    z-index:6!important;
    width:calc(100% - 18px)!important;
    min-height:58px!important;
    flex:0 0 58px!important;
    margin:-132px 9px 0!important;
    box-shadow:0 11px 30px rgba(72,27,12,.38),0 0 0 2px rgba(245,176,108,.17),inset 0 1px rgba(255,255,255,.28)!important;
  }
  .intro--v15 .intro-card small{
    position:relative!important;
    z-index:6!important;
    margin:9px 0 0!important;
    padding:0 6px!important;
    color:rgba(255,244,234,.84)!important;
    text-shadow:0 2px 8px rgba(49,19,11,.46)!important;
  }

  /* La línea interior sigue marcando el marco, pero deja respirar la imagen. */
  .intro--v15 .intro-card::after{
    z-index:8!important;
    pointer-events:none!important;
  }
}

/* iPhones más bajos: mantén el banner grande y el CTA dentro de la madera. */
@media(max-width:699px) and (max-height:760px){
  .intro--v15 .intro-card{
    padding:calc(env(safe-area-inset-top) + 65px) 14px calc(env(safe-area-inset-bottom) + 8px)!important;
  }
  .intro--v15 .intro-hero{
    width:100vw!important;
    min-width:100vw!important;
    margin:auto calc(50% - 50vw) 0!important;
    max-height:none!important;
  }
  .intro--v15 .intro-hero img{
    width:100vw!important;
    min-width:100vw!important;
    max-height:none!important;
  }
  .intro--v15 .intro-card button{
    margin:-108px 7px 0!important;
    min-height:50px!important;
    flex-basis:50px!important;
  }
  .intro--v15 .intro-card small{margin-top:5px!important}
}

/* =========================================================
   V15.3 — MOBILE LAYOUT FIX
   Fix real del espacio muerto: el PNG banner tiene 534px
   transparentes en la parte superior (2048x1700). En móvil
   recortamos SOLO esa zona transparente con CSS, sin tocar
   el asset original. El hero deja de crecer con flex:1.
   ========================================================= */
@media (max-width:699px){
  .intro--v15{
    min-height:100dvh!important;
    height:auto!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    align-items:stretch!important;
  }

  .intro--v15 .intro-card{
    min-height:100dvh!important;
    height:auto!important;
    max-height:none!important;
    padding:calc(env(safe-area-inset-top) + 82px) 18px calc(env(safe-area-inset-bottom) + 14px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }

  /* Nada del contenido superior se estira. */
  .intro--v15 .intro-card h2,
  .intro--v15 .intro-card h3,
  .intro--v15 .intro-tagline,
  .intro--v15 .intro-ornament,
  .intro--v15 .intro-copy{
    flex:0 0 auto!important;
  }

  /*
     banner_starbucks.png = 2048x1700.
     Alpha visible comienza en y=534, por lo que el área útil
     es 2048x1166. El wrapper usa esa proporción y la imagen
     completa se desplaza -534/1700 = -31.4118% de su altura.
  */
  .intro--v15 .intro-hero{
    position:relative!important;
    z-index:2!important;
    flex:0 0 auto!important;
    width:100vw!important;
    min-width:100vw!important;
    height:auto!important;
    aspect-ratio:2048 / 1166!important;
    min-height:0!important;
    max-height:none!important;
    margin:14px calc(50% - 50vw) 0!important;
    overflow:hidden!important;
    display:block!important;
    background:transparent!important;
  }

  .intro--v15 .intro-hero::before{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    inset:0!important;
    height:auto!important;
    pointer-events:none!important;
    background:
      linear-gradient(180deg,rgba(97,48,31,.34) 0%,rgba(97,48,31,.08) 13%,transparent 29%),
      linear-gradient(90deg,rgba(67,27,19,.20),transparent 8%,transparent 92%,rgba(67,27,19,.20))!important;
  }

  .intro--v15 .intro-hero::after{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    left:0!important;right:0!important;bottom:0!important;
    height:16%!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,transparent,rgba(70,32,22,.12))!important;
    filter:none!important;
  }

  .intro--v15 .intro-hero img{
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    top:0!important;
    display:block!important;
    width:100vw!important;
    min-width:100vw!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    object-fit:initial!important;
    object-position:initial!important;
    transform:translateY(-31.4118%)!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  /* Botón sobre la madera del banner, sin crear un bloque adicional. */
  .intro--v15 .intro-card button{
    position:relative!important;
    z-index:6!important;
    flex:0 0 58px!important;
    width:calc(100% - 20px)!important;
    min-height:58px!important;
    margin:-82px 10px 0!important;
  }

  .intro--v15 .intro-card small{
    position:relative!important;
    z-index:6!important;
    flex:0 0 auto!important;
    margin:9px 0 0!important;
  }

  /* El marco termina con el contenido y no genera una columna vacía. */
  .intro--v15 .intro-card::after{
    bottom:calc(env(safe-area-inset-bottom) + 4px)!important;
  }
}

@media (max-width:699px) and (max-height:760px){
  .intro--v15 .intro-card{
    padding:calc(env(safe-area-inset-top) + 64px) 14px calc(env(safe-area-inset-bottom) + 10px)!important;
  }
  .intro--v15 .intro-hero{
    margin-top:8px!important;
    aspect-ratio:2048 / 1166!important;
  }
  .intro--v15 .intro-card button{
    flex-basis:50px!important;
    min-height:50px!important;
    margin:-70px 8px 0!important;
  }
}


/* =========================================================
   V15.4 — MOBILE UX BALANCED
   Corrección visual validada sobre viewport móvil real:
   - más respiración superior para marca/título
   - flujo normal, sin flex que cree huecos intermedios
   - banner full-width pegado al contenido
   - CTA sobre la madera
   ========================================================= */
@media (max-width:699px){
  .intro--v15{
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:hidden!important;
    display:block!important;
    padding:0!important;
    background:
      radial-gradient(circle at 50% 38%,rgba(245,176,108,.12),transparent 31%),
      linear-gradient(180deg,#170805 0%,#3e1810 42%,#8f5b45 74%,#30140e 100%)!important;
  }

  /* Marca con aire real respecto al browser/status bar. */
  .intro--v15 .intro-brand{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    transform:none!important;
    width:max-content!important;
    margin:calc(env(safe-area-inset-top) + 28px) auto 18px!important;
    gap:5px!important;
  }
  .intro--v15 .intro-brand .brand-mark{
    width:50px!important;
    height:50px!important;
    flex-basis:50px!important;
  }
  .intro--v15 .intro-brand strong{
    font-size:9px!important;
    letter-spacing:.20em!important;
  }

  /* El card deja de ser el layout manager: flujo vertical normal. */
  .intro--v15 .intro-card{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    padding:18px 18px calc(env(safe-area-inset-bottom) + 12px)!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .intro--v15 .intro-card::before{display:none!important}
  .intro--v15 .intro-card::after{
    content:""!important;
    position:absolute!important;
    z-index:1!important;
    left:12px!important;
    right:12px!important;
    top:0!important;
    bottom:8px!important;
    border:1px solid rgba(245,176,108,.34)!important;
    border-radius:28px!important;
    pointer-events:none!important;
  }
  .intro--v15 .intro-card__glow{
    top:38%!important;
    height:36%!important;
    opacity:.72!important;
  }

  .intro--v15 .intro-card h2{
    margin:2px 0 0!important;
    font-size:clamp(22px,6vw,27px)!important;
  }
  .intro--v15 .intro-card h3{
    margin:5px 0 0!important;
    font-size:clamp(60px,16.4vw,76px)!important;
  }
  .intro--v15 .intro-tagline{
    margin:10px 0 4px!important;
    font-size:clamp(19px,5.45vw,24px)!important;
  }
  .intro--v15 .intro-ornament{
    margin:7px 0 9px!important;
  }
  .intro--v15 .intro-copy{
    max-width:340px!important;
    margin:0 auto 10px!important;
    font-size:clamp(11px,3vw,12.2px)!important;
    line-height:1.36!important;
  }

  /*
    Banner original 2048×1700; contenido visible desde y=534.
    Altura visible = 1166. El recorte se calcula en píxeles CSS
    respecto al ancho del viewport, evitando cualquier flex/stretch.
  */
  .intro--v15 .intro-hero{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:100vw!important;
    height:calc(100vw * 1166 / 2048)!important;
    aspect-ratio:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:8px calc(50% - 50vw) 0!important;
    overflow:hidden!important;
    background:transparent!important;
  }
  .intro--v15 .intro-hero::before{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    inset:0!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,rgba(73,29,19,.22) 0%,transparent 17%,transparent 82%,rgba(91,49,35,.14) 100%)!important;
  }
  .intro--v15 .intro-hero::after{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:18%!important;
    background:linear-gradient(180deg,transparent,rgba(81,43,31,.15))!important;
    filter:none!important;
    pointer-events:none!important;
  }
  .intro--v15 .intro-hero img{
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    top:calc(-100vw * 534 / 2048)!important;
    width:100vw!important;
    min-width:100vw!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    transform:none!important;
    object-fit:initial!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  /* CTA integrado a la madera, no en un bloque independiente. */
  .intro--v15 .intro-card button{
    position:relative!important;
    z-index:6!important;
    display:flex!important;
    width:calc(100% - 20px)!important;
    min-height:58px!important;
    margin:-72px 10px 0!important;
  }
  .intro--v15 .intro-card small{
    position:relative!important;
    z-index:6!important;
    display:block!important;
    margin:9px 0 0!important;
    padding:0 10px!important;
  }
}

/* Alturas reducidas: compacta tipografía, nunca empuja marca hacia arriba. */
@media (max-width:699px) and (max-height:760px){
  .intro--v15 .intro-brand{
    margin-top:calc(env(safe-area-inset-top) + 20px)!important;
    margin-bottom:12px!important;
  }
  .intro--v15 .intro-brand .brand-mark{width:44px!important;height:44px!important;flex-basis:44px!important}
  .intro--v15 .intro-card{padding-top:12px!important}
  .intro--v15 .intro-card h2{font-size:20px!important}
  .intro--v15 .intro-card h3{font-size:54px!important}
  .intro--v15 .intro-tagline{font-size:17.5px!important;margin-top:6px!important}
  .intro--v15 .intro-ornament{margin:4px 0 5px!important}
  .intro--v15 .intro-copy{font-size:10.3px!important;margin-bottom:5px!important}
  .intro--v15 .intro-hero{margin-top:4px!important}
  .intro--v15 .intro-card button{min-height:50px!important;margin-top:-62px!important}
  .intro--v15 .intro-card small{margin-top:5px!important;font-size:7.7px!important}
}


/* =========================================================
   V16.2 — LOGO INTERNO: usar el PNG de brand TAL CUAL.
   El círculo blanco anterior era CSS heredado, no el asset.
   ========================================================= */
.campaign-header .campaign-logo{
  background:transparent!important;
  border-radius:0!important;
  padding:0!important;
  box-shadow:none!important;
  object-fit:contain!important;
}

/* =========================================================
   V16.4 — SELFIE / CAROUSEL VISUAL FIXES
   - Center selected product correctly, including edge cards
   - Use cleaner product-art alignment
   ========================================================= */
.carousel-shell{overflow:visible!important}
.carousel-viewport{
  overflow-x:auto!important;
  scroll-padding-inline:var(--edge-pad,42px)!important;
  -webkit-overflow-scrolling:touch!important;
}
.carousel-track{
  align-items:stretch!important;
}
.product-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
.product-card.is-selected{
  z-index:2!important;
}
.product-art{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  width:100%!important;
  margin-top:2px!important;
}
.product-art img{
  display:block!important;
  width:auto!important;
  height:100%!important;
  max-width:92%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
.product-card.is-selected .product-art img{
  transform:translateY(-1px) scale(1.03)!important;
}

/* =========================================================
   V16.5 — FINAL CAROUSEL / IMMERSIVE FX TUNE
   - selected card stays visually centered
   - remove oversized scale that made selection look off
   - improve spacing near arrows and card clipping
   ========================================================= */
:root{--selector-card-w:108px}
.pumpkin-selector{overflow:visible!important}
.carousel-shell{padding-inline:2px!important;overflow:visible!important}
.carousel-viewport{
  overflow-x:auto!important;
  overflow-y:visible!important;
  scroll-snap-type:x mandatory!important;
  scroll-padding-inline:var(--edge-pad,42px)!important;
}
.carousel-track{
  gap:10px!important;
  padding-left:var(--edge-pad,42px)!important;
  padding-right:var(--edge-pad,42px)!important;
  align-items:stretch!important;
}
.product-card{
  flex:0 0 var(--selector-card-w)!important;
  width:var(--selector-card-w)!important;
  transform:translateY(0) scale(1)!important;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease,opacity .22s ease!important;
}
.product-card.is-selected{
  transform:translateY(-2px) scale(1)!important;
  border-color:rgba(255,229,206,.88)!important;
  box-shadow:0 0 0 1px rgba(243,177,124,.55),0 10px 22px rgba(0,0,0,.20),0 0 18px rgba(243,177,124,.14)!important;
}
.product-card::after{pointer-events:none!important}
.product-art{height:98px!important;display:flex!important;align-items:flex-end!important;justify-content:center!important}
.product-art img{
  max-width:88%!important;
  max-height:92px!important;
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  transform:none!important;
}
.product-card.is-selected .product-art img{
  transform:translateY(-1px)!important;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.28)) drop-shadow(0 0 5px rgba(243,177,124,.14))!important;
}
.carousel-arrow{
  width:36px!important;
  height:36px!important;
  margin-top:-18px!important;
  background:rgba(26,18,15,.72)!important;
  border:1px solid rgba(255,234,218,.34)!important;
  box-shadow:0 6px 14px rgba(0,0,0,.14)!important;
}
.carousel-arrow--prev{left:-2px!important}
.carousel-arrow--next{right:-2px!important}
@media(min-width:391px){:root{--selector-card-w:114px}.product-card{height:154px!important}.product-art{height:104px!important}.product-art img{max-height:98px!important}}
@media(max-width:390px){:root{--selector-card-w:102px}.product-card{height:144px!important}.product-art{height:92px!important}.product-art img{max-height:86px!important}.carousel-track{gap:8px!important}}
@media(max-height:740px){.product-card{height:132px!important}.product-art{height:82px!important}.product-art img{max-height:78px!important}}

/* =========================================================
   V16.5.1 — SELECTOR RADIUS FIX
   The active card had conflicting inherited radii:
   outer card 13px vs selected inner ring 20px.
   Keep one radius system so the selected outline fits exactly.
   ========================================================= */
:root{
  --product-card-radius:18px;
  --product-card-inner-radius:15px;
}
.pumpkin-selector{
  border-radius:24px!important;
}
.product-card{
  border-radius:var(--product-card-radius)!important;
  overflow:hidden!important;
}
.product-card.is-selected{
  border-radius:var(--product-card-radius)!important;
}
.product-card.is-selected::after{
  content:""!important;
  position:absolute!important;
  inset:3px!important;
  border-radius:var(--product-card-inner-radius)!important;
  border:1px solid rgba(255,244,236,.20)!important;
  pointer-events:none!important;
  box-sizing:border-box!important;
}
.product-card::before{
  border-radius:inherit!important;
}
@media(max-width:390px){
  :root{--product-card-radius:17px;--product-card-inner-radius:14px}
}


/* =========================================================
   V16.6 — COMPACT SELECTOR + SLOWER FLOATING FX + CUP BRAND GLOW
   ========================================================= */
:root{
  --selector-card-w:98px;
  --selector-card-h:124px;
  --selector-card-radius-compact:17px;
  --selector-card-inner-radius-compact:14px;
}
.pumpkin-selector{
  left:16px!important;
  right:16px!important;
  bottom:106px!important;
  padding:7px 0 7px!important;
  border-radius:24px!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.05)!important;
}
.selector-title{
  margin-bottom:3px!important;
  font-size:8.5px!important;
  letter-spacing:.21em!important;
}
.carousel-viewport{padding:4px 0 4px!important}
.carousel-track{
  gap:8px!important;
  padding-left:calc(50% - 58px)!important;
  padding-right:calc(50% - 58px)!important;
}
.product-card{
  flex:0 0 var(--selector-card-w)!important;
  height:var(--selector-card-h)!important;
  padding:5px 6px 7px!important;
  border-radius:var(--selector-card-radius-compact)!important;
  transform:scale(.93)!important;
}
.product-card.is-selected{
  border-radius:var(--selector-card-radius-compact)!important;
  transform:translateY(-1px) scale(1.008)!important;
}
.product-card.is-selected::after{
  inset:3px!important;
  border-radius:var(--selector-card-inner-radius-compact)!important;
}
.product-art{height:78px!important}
.product-art img{max-height:74px!important;max-width:94%!important}
.mood-name{font:italic 600 9.2px/1 Georgia,serif!important;margin-top:-1px!important;white-space:normal!important;overflow:visible!important;max-height:none!important}
.product-name{
  font-size:7px!important;
  line-height:1.03!important;
  max-width:94%!important;
}
.carousel-arrow{
  width:30px!important;
  height:30px!important;
  margin-top:-15px!important;
}
.carousel-arrow svg{width:14px!important;height:14px!important}
.carousel-arrow--prev{left:-1px!important}
.carousel-arrow--next{right:-1px!important}

.detected-cup-fx{
  width:min(35vw,176px)!important;
}
.detected-cup-brand{
  position:absolute;
  left:50%;
  top:49%;
  width:55%;
  aspect-ratio:1/1;
  transform:translate(-50%,-54%) perspective(720px) rotateX(18deg) rotateZ(-7deg) scale(.56);
  transform-style:preserve-3d;
  opacity:0;
  pointer-events:none;
  transition:opacity .28s ease,transform .38s cubic-bezier(.2,.75,.2,1);
}
.detected-cup-brand__glow,
.detected-cup-brand__ring,
.detected-cup-brand__logo{position:absolute;inset:0}
.detected-cup-brand__glow{
  inset:-20%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,245,232,.48) 0,rgba(255,220,190,.28) 24%,rgba(243,177,124,.16) 46%,rgba(243,177,124,0) 72%);
  filter:blur(8px);
}
.detected-cup-brand__ring{
  left:50%;top:56%;right:auto;bottom:auto;
  width:132%;height:56%;
  transform:translate(-50%,-50%) rotate(-9deg) translateZ(-8px);
  border-radius:50%;
  border:1.5px solid rgba(255,229,206,.76);
  box-shadow:0 0 14px rgba(243,177,124,.34), inset 0 0 10px rgba(255,236,218,.08);
}
.detected-cup-brand__logo{
  inset:8%;
  width:84%;
  height:84%;
  object-fit:contain;
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.22)) drop-shadow(0 0 10px rgba(255,214,168,.24));
}
.app.cup-detected .detected-cup-brand{
  opacity:1;
  transform:translate(-50%,-54%) perspective(720px) rotateX(16deg) rotateZ(-6deg) scale(1);
  animation:cupBrandFloat 2.7s ease-in-out infinite;
}
.app.cup-detected .detected-cup-brand__ring{animation:cupBrandPulse 2.2s ease-in-out infinite}
.app.cup-detected .detected-cup-brand__logo{animation:cupBrandLogoPulse 2.2s ease-in-out infinite}
.app.cup-detected .person-glow{
  opacity:1!important;
  background:
    radial-gradient(circle at var(--det-x) var(--det-y),rgba(255,236,206,.34) 0 5%,rgba(247,177,105,.24) 12%,rgba(243,153,76,.12) 22%,rgba(243,153,76,0) 35%),
    radial-gradient(circle at 50% 46%,rgba(255,199,142,.12),rgba(255,177,104,.05) 30%,rgba(255,177,104,0) 54%)!important;
}
@keyframes cupBrandFloat{0%,100%{transform:translate(-50%,-54%) perspective(720px) rotateX(16deg) rotateZ(-6deg) scale(1)}50%{transform:translate(-50%,-58%) perspective(720px) rotateX(13deg) rotateZ(-4deg) scale(1.03)}}
@keyframes cupBrandPulse{0%,100%{opacity:.82;transform:translate(-50%,-50%) rotate(-9deg) scale(.98)}50%{opacity:1;transform:translate(-50%,-50%) rotate(-9deg) scale(1.05)}}
@keyframes cupBrandLogoPulse{0%,100%{filter:drop-shadow(0 8px 12px rgba(0,0,0,.22)) drop-shadow(0 0 10px rgba(255,214,168,.24))}50%{filter:drop-shadow(0 8px 12px rgba(0,0,0,.22)) drop-shadow(0 0 18px rgba(255,214,168,.46))}}

@media(max-width:390px){
  :root{
    --selector-card-w:90px;
    --selector-card-h:116px;
    --selector-card-radius-compact:16px;
    --selector-card-inner-radius-compact:13px;
  }
  .pumpkin-selector{left:12px!important;right:12px!important;bottom:102px!important;padding-top:6px!important;padding-bottom:6px!important}
  .carousel-track{padding-left:calc(50% - 54px)!important;padding-right:calc(50% - 54px)!important}
  .product-art{height:72px!important}
  .product-art img{max-height:68px!important}
  .mood-name{font-size:8.8px!important;line-height:1!important}
  .product-name{font-size:6.8px!important}
  .detected-cup-fx{width:min(34vw,156px)!important}
}
@media(max-height:740px){
  :root{--selector-card-h:110px}
  .pumpkin-selector{bottom:88px!important;padding-top:5px!important;padding-bottom:5px!important}
  .product-art{height:66px!important}
  .product-art img{max-height:62px!important}
  .mood-name{font-size:8.4px!important;line-height:1!important}
  .product-name{font-size:6.6px!important}
}


/* Botón de stickers oculto; se conserva en DOM para no romper JS */
#stickerButton{display:none!important}


/* === v1720 · Beauty selfie suave + detección SOLO BRILLO === */
/* Ningún vector/aro debe reaparecer al alternar frontal/trasera. */
.orbit--face,
.hero-cup-stage .orbit--cup{
  display:none!important;
  opacity:0!important;
  animation:none!important;
}

/* Se elimina por completo logo, vector, anillos y badge de detección. */
.detected-cup-fx>img,
.detected-cup-brand,
.detected-cup-fx .cup-detected-badge{
  display:none!important;
}

.detected-cup-fx{
  width:min(31vw,146px)!important;
  aspect-ratio:1/1!important;
  filter:none!important;
  background:transparent!important;
}
.detected-cup-fx::after{display:none!important}
.detected-cup-fx::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:154%!important;
  height:154%!important;
  border:0!important;
  border-radius:50%!important;
  box-shadow:none!important;
  background:radial-gradient(circle,
    rgba(255,246,230,.36) 0%,
    rgba(255,220,184,.28) 18%,
    rgba(247,178,108,.18) 42%,
    rgba(243,153,76,.07) 66%,
    rgba(243,153,76,0) 76%)!important;
  filter:blur(8px)!important;
  opacity:0!important;
  transform:translate(-50%,-50%) scale(.88)!important;
  transition:opacity .25s ease,transform .35s ease!important;
  pointer-events:none!important;
}
.app.cup-detected .detected-cup-fx::before{
  opacity:.92!important;
  animation:v1720CupGlow 1.9s ease-in-out infinite!important;
}
@keyframes v1720CupGlow{
  0%,100%{transform:translate(-50%,-50%) scale(.92);opacity:.72}
  50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}
}

/* El halo global también queda reducido al punto detectado: sin líneas. */
.person-glow,
.app.cup-detected .person-glow{
  background:radial-gradient(circle at var(--det-x) var(--det-y),
    rgba(255,238,214,.25) 0 5%,
    rgba(248,188,124,.16) 12%,
    rgba(243,153,76,.07) 23%,
    rgba(243,153,76,0) 37%)!important;
}

/* Beauty "social camera" ligero: ilumina y suaviza contraste sin perder detalle. */
.app:not(.is-rear-camera) .xr-camera-video,
.app:not(.is-rear-camera) .fallback-camera{
  -webkit-filter:brightness(1.06) contrast(.935) saturate(1.035) sepia(.018)!important;
  filter:brightness(1.06) contrast(.935) saturate(1.035) sepia(.018)!important;
}