/* Shared base of the customer splash and the Admin preview. */
.gonut-intro[hidden]{display:none!important}
.gonut-intro{position:fixed;inset:0;z-index:300;display:grid;place-items:center;align-content:center;overflow:hidden;background:radial-gradient(circle at 50% 42%,#68844c 0,#365f2f 28%,#173d20 65%,#102817 100%);color:#fff;isolation:isolate;transition:opacity .62s ease,filter .62s ease,transform .62s cubic-bezier(.2,.8,.2,1)}
.gonut-intro:before{content:"";position:absolute;inset:-22%;background:conic-gradient(from 180deg at 50% 50%,transparent,#e9f8c620,transparent 26%,#fff3c82b 43%,transparent 62%,#9cce7b22 78%,transparent);animation:introSpin 4.8s linear infinite;filter:blur(2px)}
.gonut-intro:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,transparent 0 18%,rgba(255,255,255,.08) 19% 19.5%,transparent 20% 34%,rgba(255,255,255,.05) 35% 35.5%,transparent 36%);mix-blend-mode:screen;animation:introPulse 1.8s ease-in-out infinite}
.gonut-intro.leave{opacity:0;filter:blur(12px) saturate(1.3);transform:scale(1.08);pointer-events:none}
.intro-aurora{position:absolute;width:75vmin;height:75vmin;border-radius:50%;background:radial-gradient(circle,#fffbdc55 0,#cce9a622 35%,transparent 69%);filter:blur(18px);animation:introAurora 1.7s ease-in-out infinite alternate}
.intro-logo{position:relative;z-index:5;display:grid;justify-items:center;text-align:center;filter:drop-shadow(0 12px 35px rgba(0,0,0,.24));animation:introLogoIn 1.25s cubic-bezier(.16,.85,.23,1) both}
.intro-logo img{width:min(66vw,280px);max-height:150px;object-fit:contain;filter:drop-shadow(0 11px 22px rgba(0,0,0,.2))}
.intro-logo strong{font-family:var(--sans);font-size:clamp(44px,16vw,88px);font-weight:900;letter-spacing:-.065em;line-height:.9;background:linear-gradient(180deg,#fffef0,#e8f1cb 58%,#bad18c);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 45px rgba(235,255,199,.2)}
.intro-logo small{margin-top:13px;font-size:clamp(8px,2.5vw,11px);font-weight:800;letter-spacing:.32em;color:#edf4d5;margin-left:.32em}
.intro-leaf{position:absolute;left:-4px;top:-19px;font-size:16px;color:#d9eaa8;transform:rotate(45deg);animation:introLeaf 1.4s ease-in-out infinite alternate}
.intro-line{z-index:5;width:min(56vw,220px);height:1px;margin:25px auto 10px;background:linear-gradient(90deg,transparent,#edf4d7,transparent);transform-origin:center;animation:introLine 1.25s .28s both}
.gonut-intro>p{z-index:5;margin:0;font-family:var(--serif);font-style:italic;font-size:12px;letter-spacing:.06em;color:#f6eedb;animation:introText 1s .4s both}
.intro-orbit{position:absolute;border:1px solid rgba(239,249,211,.16);border-radius:50%;transform:rotateX(66deg);box-shadow:0 0 44px rgba(195,226,145,.08)}.orbit-a{width:72vmin;height:72vmin;animation:introOrbit 4s linear infinite}.orbit-b{width:48vmin;height:48vmin;animation:introOrbit 2.8s linear reverse infinite}.intro-seed{position:absolute;z-index:3;color:#e8f5c3;text-shadow:0 0 18px #dbf4a6;font-size:17px}.seed-a{left:20%;top:24%;animation:seedFloat 2.1s ease-in-out infinite}.seed-b{right:18%;top:32%;font-size:8px;animation:seedFloat 1.7s -.6s ease-in-out infinite}.seed-c{left:29%;bottom:25%;animation:seedFloat 2.4s -1.1s ease-in-out infinite}
@keyframes introLogoIn{0%{opacity:0;transform:scale(.55) translateY(26px);filter:blur(18px)}55%{opacity:1;transform:scale(1.08) translateY(-3px);filter:blur(0)}100%{transform:scale(1)}}@keyframes introSpin{to{transform:rotate(360deg)}}@keyframes introPulse{50%{opacity:.55;transform:scale(1.06)}}@keyframes introAurora{to{transform:scale(1.13);opacity:.72}}@keyframes introOrbit{to{transform:rotateX(66deg) rotateZ(360deg)}}@keyframes introLeaf{to{transform:rotate(62deg) translateY(-4px);filter:brightness(1.25)}}@keyframes introLine{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:scaleX(1)}}@keyframes introText{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes seedFloat{50%{transform:translate3d(8px,-18px,0) rotate(20deg);opacity:.55}}


.intro-ingredients{position:absolute;inset:0;overflow:hidden;z-index:2;pointer-events:none}
.intro-ingredient{position:absolute;width:clamp(96px,32vw,225px);height:auto;object-fit:contain;opacity:0;filter:drop-shadow(0 18px 21px rgba(7,23,8,.26));animation:introIngredientIn .9s .18s ease-out both,introIngredientDrift 3.2s 1s ease-in-out infinite alternate;will-change:transform}
.intro-ingredient-a{left:-7%;top:9%;--spin:-16deg;--shift:9px;animation-delay:.12s,1s}
.intro-ingredient-b{right:-10%;top:16%;--spin:12deg;--shift:-9px;animation-delay:.29s,1.22s}
.intro-ingredient-c{left:-12%;bottom:8%;--spin:-11deg;--shift:11px;animation-delay:.42s,1.28s}
.intro-ingredient-d{right:-8%;bottom:7%;--spin:17deg;--shift:-8px;animation-delay:.35s,1.12s}
@keyframes introIngredientIn{from{opacity:0;transform:translateY(30px) scale(.72) rotate(var(--spin))}to{opacity:.95;transform:translateY(0) scale(1) rotate(var(--spin))}}
@keyframes introIngredientDrift{from{transform:translateY(0) rotate(var(--spin))}to{transform:translateY(var(--shift)) rotate(calc(var(--spin) + 5deg))}}
.gonut-intro .intro-logo{z-index:7}
@media(prefers-reduced-motion:reduce){.intro-ingredient{animation:none;opacity:.7;will-change:auto}}


/* GONUT Intro themes V6.7.41. Pure CSS; no external media or blocking video. */
.gonut-intro[hidden]{display:none!important}
.gonut-intro .intro-skip{position:absolute;z-index:15;bottom:max(28px,env(safe-area-inset-bottom));right:clamp(18px,5vw,54px);appearance:none;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.30);color:inherit;border-radius:999px;padding:10px 19px;font:600 12px var(--sans, sans-serif);cursor:pointer;min-height:40px;backdrop-filter:blur(8px)}
.gonut-intro .intro-skip:focus-visible{outline:3px solid #ffdc94;outline-offset:4px}
.gonut-intro .intro-tagline{position:relative;z-index:9;letter-spacing:.16em;margin-top:2px;font:italic 13px var(--serif,serif);opacity:.86;animation:introText 1s .45s both}
/* 1. Olive Aurora – original cinematic GONUT */
.gonut-intro[data-theme="aurora"]{background:radial-gradient(circle at 50% 42%,#68844c 0,#365f2f 28%,#173d20 65%,#102817 100%)}
/* 2. Golden Harvest – fine champagne/golden halo */
.gonut-intro[data-theme="golden"]{background:radial-gradient(ellipse at 49% 44%,#b99b5e 0,#75602e 30%,#3d3e26 68%,#161e17 100%)}
.gonut-intro[data-theme="golden"] .intro-aurora{background:radial-gradient(circle,#ffefad88,transparent 65%);filter:blur(32px)}
.gonut-intro[data-theme="golden"] .intro-orbit{border-color:#f7df9760;box-shadow:0 0 46px #fae19d30}
.gonut-intro[data-theme="golden"] .intro-line{background:linear-gradient(90deg,transparent,#ffe3a0,transparent)}
.gonut-intro[data-theme="golden"] .intro-logo strong{background:linear-gradient(160deg,#fff8de,#ffdda0 52%,#c89c43);-webkit-background-clip:text;background-clip:text}
/* 3. Cream Garden – calm white/olive premium */
.gonut-intro[data-theme="cream"]{background:radial-gradient(circle at 50% 36%,#fffaf0 0,#f7efda 40%,#e5e7cd 82%,#d2ddbd 100%);color:#305339}
.gonut-intro[data-theme="cream"]:before{opacity:.10}
.gonut-intro[data-theme="cream"]:after{opacity:.24;mix-blend-mode:multiply}
.gonut-intro[data-theme="cream"] .intro-aurora{background:radial-gradient(circle,#cadfaa99,transparent 70%);filter:blur(12px)}
.gonut-intro[data-theme="cream"] .intro-logo strong{background:linear-gradient(#365a32,#78904f);-webkit-background-clip:text;background-clip:text;text-shadow:none}
.gonut-intro[data-theme="cream"] .intro-logo small,.gonut-intro[data-theme="cream"] .intro-leaf{color:#607445}
.gonut-intro[data-theme="cream"] .intro-orbit{border-color:#57774429}
.gonut-intro[data-theme="cream"] .intro-line{background:linear-gradient(90deg,transparent,#73934a,transparent)}
.gonut-intro[data-theme="cream"] .intro-skip{background:#e4ecdccc;border-color:#9eae88;color:#385c37}
/* 4. Milk Silk – liquid-like cream light with floating ingredients */
.gonut-intro[data-theme="pour"]{background:radial-gradient(ellipse at 49% 10%,#607b53,#1e4636 55%,#102b26 100%)}
.gonut-intro[data-theme="pour"]:after{mix-blend-mode:normal;background:radial-gradient(ellipse 63% 24% at 50% 110%,#f6f1df 65%,#d6dfc3 79%,transparent 82%);animation:milkSilkRise 3.2s ease-in-out infinite alternate;opacity:.8}
.gonut-intro[data-theme="pour"] .intro-orbit{width:66vmin;height:66vmin;border:1px solid #ffffff23;transform:none;animation:introPulse 3s ease-in-out infinite}
.gonut-intro[data-theme="pour"] .intro-logo{animation:milkLogoIn 1.2s ease-out both}
.gonut-intro[data-theme="pour"] .intro-ingredient{width:clamp(125px,38vw,265px)}
@keyframes milkSilkRise{from{transform:translateY(4%) scaleX(.94)}to{transform:translateY(-8%) scaleX(1.1)}}
@keyframes milkLogoIn{from{opacity:0;transform:translateY(28px) scale(.93)}to{opacity:1;transform:none}}
/* 5. Signature Minimal – luxury quiet reveal */
.gonut-intro[data-theme="minimal"]{background:linear-gradient(145deg,#f8f3e7,#e5e4d6 62%,#d4dfcd);color:#32553a}
.gonut-intro[data-theme="minimal"]:before,.gonut-intro[data-theme="minimal"]:after,.gonut-intro[data-theme="minimal"] .intro-aurora,.gonut-intro[data-theme="minimal"] .intro-ingredients,.gonut-intro[data-theme="minimal"] .intro-orbit{display:none!important}
.gonut-intro[data-theme="minimal"] .intro-logo{animation:minimalReveal 1.1s ease-out both;filter:none}
.gonut-intro[data-theme="minimal"] .intro-logo strong{background:none;-webkit-background-clip:initial;background-clip:initial;color:#2d4f34;text-shadow:none;letter-spacing:-.03em;font-weight:800}
.gonut-intro[data-theme="minimal"] .intro-logo small,.gonut-intro[data-theme="minimal"] .intro-leaf{color:#829264}
.gonut-intro[data-theme="minimal"] .intro-line{height:2px;background:#839864;width:100px}
.gonut-intro[data-theme="minimal"] .intro-skip{background:#f5f1e4;border-color:#c2ccb3;color:#365637}
@keyframes minimalReveal{from{opacity:0;transform:translateY(14px);filter:blur(7px)}to{opacity:1;transform:none;filter:blur(0)}}
/* Admin preview reuses exact end-user theme elements, without blocking Admin. */
.gonut-intro.admin-intro-preview{animation:none!important;position:relative;inset:auto;z-index:auto;height:310px;min-height:310px;border-radius:20px;max-width:100%;box-shadow:inset 0 0 0 1px #ffffff25;overflow:hidden;pointer-events:none}
.admin-intro-preview .intro-ingredient{width:clamp(65px,18vw,115px)}
.admin-intro-preview .intro-logo strong{font-size:clamp(42px,8vw,67px)}
.admin-intro-preview .intro-logo small{font-size:9px}
.admin-intro-preview .intro-logo img{max-height:100px;width:min(45vw,180px)}
.admin-intro-preview .intro-line{margin:16px auto 8px}
.admin-intro-preview .intro-skip{display:none}
.admin-intro-preview .intro-ingredient-a{left:0}.admin-intro-preview .intro-ingredient-b{right:0}
.admin-intro-preview .intro-ingredient-c{left:-3%}.admin-intro-preview .intro-ingredient-d{right:-3%}
/* Avoid trapping mobile customers in visual effects or high CPU animations. */
@media(max-width:480px){.gonut-intro .intro-ingredient{width:clamp(82px,27vw,156px)}.gonut-intro .intro-skip{bottom:max(18px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.gonut-intro[data-theme] *,.gonut-intro[data-theme]:before,.gonut-intro[data-theme]:after{animation:none!important;transition:none!important}}

.gonut-intro[data-theme="cream"] .intro-tagline,.gonut-intro[data-theme="minimal"] .intro-tagline{color:#607c54}