*,*::before,*::after{box-sizing:border-box}
*{margin:0}
:root{
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
  --void:#05030c;--navy:#080c24;--indigo:#141a52;--violet:#7a5cff;--purple:#9b6bff;--cyan:#5ddcff;--turq:#3fe3cf;--lav:#bdb8ff;--white:#f1f5ff;
  --muted:#9aa3cf;--line:rgba(150,170,255,.16);--stitch:rgba(190,215,255,.34);
  --serif:'Cinzel','Trajan Pro','Optima',Georgia,serif;
  --sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --safe-t:env(safe-area-inset-top,0px);
  --a:#7a7cff;--b:#8fe6ff;--bg1:#171c66;--bg2:#06061a;
  color-scheme:dark;
}
[data-col=midnight]{--a:#7a7cff;--b:#8fe6ff;--bg1:#171c66;--bg2:#06061a}
[data-col=hollow]{--a:#52e0c0;--b:#a58bff;--bg1:#0d2a2c;--bg2:#04080b}
[data-col=celestial]{--a:#6fe6ff;--b:#ffffff;--bg1:#0e3a63;--bg2:#050c1e}
[data-col=royal]{--a:#e8c77f;--b:#b48cff;--bg1:#2a1260;--bg2:#09041a}
[data-col=arcane]{--a:#c56bff;--b:#3fe3cf;--bg1:#2a0f58;--bg2:#07031a}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px)}
body{background:var(--void);color:#dfe6ff;font:400 16px/1.6 var(--sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:.02em;line-height:1.12;color:#fff}
h2{font-size:clamp(30px,4.2vw,58px)}
h3{font-size:clamp(17px,1.5vw,22px)}
p{color:var(--muted)}
.wrap{width:min(1280px,100% - 48px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}

/* ---------- logo (original artwork with a true transparent background) ---------- */
.logo{display:block;aspect-ratio:1/1;background:url("assets/gwen_logo-transparent-optimized.webp") center/contain no-repeat}

/* ---------- global thread ---------- */
#threadCv{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:90}
#stitchRail{position:fixed;left:16px;top:120px;bottom:48px;width:2px;z-index:40;background:repeating-linear-gradient(180deg,rgba(160,180,255,.28) 0 6px,transparent 6px 13px)}
#stitchRail b{position:absolute;left:0;top:0;width:100%;height:calc(var(--p,0)*100%);background:linear-gradient(var(--cyan),var(--violet));box-shadow:0 0 12px var(--cyan)}
#stitchRail i{position:absolute;left:-4px;top:calc(var(--p,0)*100% - 5px);width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 14px 3px var(--cyan)}
@media(max-width:1180px){#stitchRail{display:none}}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:15px 28px;border-radius:999px;border:1px solid rgba(180,200,255,.3);background:rgba(20,26,82,.55);color:#fff;font:700 12.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .25s,box-shadow .3s,background .3s,border-color .3s}
.btn::before{content:"";position:absolute;inset:4px;border-radius:inherit;border:1px dashed transparent;transition:border-color .3s;z-index:-1}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.32) 50%,transparent 70%);transform:translateX(-125%);transition:transform .75s;z-index:-1}
.btn:hover,.btn.is-hover{border-color:rgba(190,230,255,.7);transform:translateY(-2px)}
.btn:hover::before,.btn.is-hover::before{border-color:rgba(255,255,255,.55)}
.btn:hover::after,.btn.is-hover::after{transform:translateX(125%)}
.btn:active,.btn.is-down{transform:translateY(1px) scale(.97)}
.btn.primary{background:linear-gradient(135deg,#6fe3ff,#7a5cff);color:#05030c;border-color:transparent;box-shadow:0 10px 40px -12px rgba(93,220,255,.6)}
.btn.primary:hover,.btn.primary.is-hover{box-shadow:0 18px 50px -10px rgba(122,92,255,.75),0 0 0 6px rgba(93,220,255,.12)}
.btn.primary:hover::before,.btn.primary.is-hover::before{border-color:rgba(5,3,12,.5)}
.btn.ghost{background:transparent}
.btn.sm{padding:11px 18px;font-size:11px}
.btn.lg{padding:20px 40px;font-size:14px}
.btn.is-added{background:linear-gradient(135deg,#3fe3cf,#5ddcff);color:#05030c;border-color:transparent}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:60;padding-top:var(--safe-t);background:linear-gradient(180deg,rgba(5,3,12,.94),rgba(5,3,12,.6) 72%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hdr-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:68px}
.nav{display:flex;gap:30px;align-items:center}
.nav-r{justify-content:flex-end}
.rt{display:flex;gap:10px;margin-left:8px}
.nav a{font-size:14px;font-weight:600;color:#cfd8ff;text-decoration:none;position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;border-top:1.5px dashed var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.nav a:hover::after{transform:scaleX(1)}
.hdr-sp{display:block;width:104px;height:1px}
.hdr-logo{position:fixed;top:calc(var(--safe-t) + 4px);left:50%;margin-left:-52px;width:104px;z-index:61}
.cart-btn{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(20,26,82,.5);cursor:pointer;transition:border-color .3s,transform .25s}
.cart-btn:hover{border-color:var(--cyan);transform:translateY(-1px)}
.cart-btn svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cart-btn span{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--cyan);color:#05030c;font:700 11px/18px var(--sans);text-align:center;transform:scale(0);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.cart-btn span.on{transform:scale(1)}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(20,26,82,.5);cursor:pointer}
.burger i{display:block;width:18px;height:1.5px;background:#fff;margin:5px auto}
.mnav{position:fixed;inset:0;z-index:70;background:rgba(5,3,12,.96);display:none;flex-direction:column;justify-content:center;align-items:center;gap:22px;padding:24px}
.mnav.on{display:flex}
.mnav a{font:600 26px var(--serif);text-decoration:none;color:#fff}
.mnav button{position:absolute;top:calc(var(--safe-t) + 14px);right:18px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:none;font-size:22px;cursor:pointer}

/* ---------- section shells ---------- */
.sec{position:relative;padding:130px 0 40px}
.sec-h{display:flex;gap:40px;justify-content:space-between;align-items:flex-end;margin-bottom:44px;flex-wrap:wrap}
.sec-h>div:first-child{max-width:640px}
.sec-h p{margin-top:14px;font-size:17px;max-width:56ch}
.stitch-u{display:block;height:0;border-top:2px dashed var(--cyan);width:120px;margin-top:18px;transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.8,.2,1);opacity:.8}
.stitch-u.in{transform:scaleX(1)}
.note{display:inline-flex;gap:12px;align-items:center;padding:12px 18px;border-radius:16px 16px 16px 4px;border:1.5px dashed var(--stitch);background:rgba(20,26,82,.4);font-size:14px;color:#dfe6ff;max-width:300px}
.gw svg{overflow:visible;filter:drop-shadow(0 0 16px rgba(93,220,255,.26)) drop-shadow(0 26px 30px rgba(0,0,0,.55))}

/* ---------- hero ---------- */
.hero{position:relative;min-height:max(100svh,800px);padding:calc(var(--safe-t) + 92px) 0 96px;overflow:hidden;isolation:isolate;
  background:radial-gradient(60% 55% at 70% 42%,#171d62 0,transparent 70%),radial-gradient(55% 45% at 6% 100%,#220f5e 0,transparent 70%),var(--void)}
.dust{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-win{position:absolute;left:40%;right:-6%;top:-4%;bottom:12%;opacity:.55}
.beam{position:absolute;top:-10%;width:16%;height:120%;background:linear-gradient(180deg,rgba(140,175,255,.22),transparent 72%);filter:blur(16px);mix-blend-mode:screen;transform:rotate(16deg);animation:beam 9s ease-in-out infinite}
.beam:nth-of-type(2){left:52%;opacity:.7;animation-delay:-3s}
.beam:nth-of-type(3){left:68%;width:11%;opacity:.5;animation-delay:-6s}
@keyframes beam{50%{opacity:.35;transform:rotate(13deg) translateX(14px)}}
.spool{position:absolute;top:0;width:1px;height:var(--h);background:linear-gradient(var(--stitch),rgba(190,215,255,.6));transform-origin:top;animation:sway var(--d) ease-in-out infinite alternate}
.spool::after{content:"";position:absolute;left:-7px;bottom:-14px;width:15px;height:15px;border-radius:5px;background:linear-gradient(135deg,var(--lav),var(--violet));box-shadow:0 0 16px rgba(155,107,255,.6)}
@keyframes sway{from{transform:rotate(-2.2deg)}to{transform:rotate(2.2deg)}}
.floor{position:absolute;left:-10%;right:-10%;bottom:0;height:34%;background:radial-gradient(60% 100% at 62% 100%,rgba(93,220,255,.2),transparent 70%)}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:20px;align-items:center;min-height:calc(max(100svh,800px) - 190px)}
.hero-copy{position:relative;z-index:3}
.hero h1{font-size:clamp(40px,4.9vw,80px);line-height:1.04;letter-spacing:.015em;text-shadow:0 0 50px rgba(93,220,255,.25)}
.hero .lede{margin-top:26px;font-size:clamp(17px,1.4vw,20px);color:#c5cdf5;max-width:46ch}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}
.hero-proof{list-style:none;display:flex;gap:22px;flex-wrap:wrap;margin-top:34px;padding:0}
.hero-proof li{display:flex;gap:9px;align-items:center;font-size:14px;color:#aab4e6}
.hero-proof li::before{content:"";width:16px;border-top:2px dashed var(--cyan)}
.hero-stage{position:relative;height:clamp(580px,80vh,780px)}
.sign{position:absolute;left:50%;top:-6%;width:38%;transform:translateX(-50%);transform-origin:50% -80%;animation:signSway 6.5s ease-in-out infinite alternate;z-index:2}
.thr{position:absolute;top:-400px;height:calc(400px - 3%);width:0;border-left:1.5px solid rgba(190,215,255,.5);z-index:2}
.glow{position:absolute;z-index:1;border-radius:50%;background:radial-gradient(closest-side,rgba(93,220,255,.3),rgba(122,92,255,.12) 60%,transparent);filter:blur(8px);pointer-events:none}
@keyframes signSway{from{transform:translateX(-50%) rotate(-1.4deg)}to{transform:translateX(-50%) rotate(1.4deg)}}
.hero-gwen{position:absolute;left:50%;bottom:0;height:78%;transform:translateX(-50%);z-index:3}
.hero-gwen svg{height:100%;width:auto}
.hero-gwen .shadow{position:absolute;left:50%;bottom:-2%;width:120%;height:8%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(93,220,255,.35),transparent);filter:blur(6px)}
.hero-thread{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible}
.hero-thread path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.hero-thread .t1{stroke:url(#thrGrad);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 3.2s .3s cubic-bezier(.5,0,.2,1) forwards;filter:drop-shadow(0 0 8px rgba(93,220,255,.7))}
.hero-thread .t2{stroke:#fff;stroke-width:1;stroke-dasharray:6 26;opacity:.75;animation:flow 3s linear infinite}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes flow{to{stroke-dashoffset:-64}}
.hello{position:absolute;left:21%;top:47%;z-index:2;max-width:170px}
.fa{position:absolute;z-index:4;animation:bob 7s ease-in-out infinite;filter:drop-shadow(0 22px 28px rgba(0,0,0,.55))}
@keyframes bob{50%{transform:translateY(-12px)}}
.fa .aa{border-radius:12px;box-shadow:0 0 0 1px rgba(170,190,255,.3),0 0 46px -8px var(--a)}
.fa-follow{left:0;top:30%;width:23%;transform:rotate(-5deg);animation-delay:-1s}
.fa-follow{padding:8px;border-radius:8px;background:repeating-linear-gradient(45deg,#1c2270 0 3px,#10154a 3px 6px)}
.fa-follow .aa{outline:1.5px dashed rgba(190,230,255,.75);outline-offset:-5px;border-radius:4px;box-shadow:none}
.fa-sub{left:3%;top:62%;width:19%;animation-delay:-3s}
.fa-sub .aa{aspect-ratio:1/1;border-radius:50%;box-shadow:0 0 0 5px rgba(122,124,255,.25),0 0 0 6px rgba(190,215,255,.4),0 0 70px var(--a)}
.fa-sub .aa-tx{bottom:17%;font-size:5.2cqw}
.fa-raid{left:70%;top:5%;width:25%;animation-delay:-2s}
.fa-raid::before,.fa-raid::after{content:"";position:absolute;bottom:92%;height:60vh;border-left:1.5px solid rgba(190,215,255,.45)}
.fa-raid::before{left:18%}.fa-raid::after{right:18%}
.fa-donation{left:75%;top:38%;width:24%;transform:perspective(800px) rotateY(-16deg) rotateZ(2deg);animation-delay:-4s}
.fa-donation .aa{background:linear-gradient(135deg,rgba(255,255,255,.16),transparent 40%),radial-gradient(90% 80% at 50% 110%,var(--bg1),var(--bg2) 75%)}
.fa-donation .aa::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(255,255,255,.05) 0 1px,transparent 1px 4px);mix-blend-mode:screen;pointer-events:none}
.fa-cheer{left:66%;top:68%;width:22%;transform:rotate(4deg);animation-delay:-5s}
.ticker{position:absolute;left:0;right:0;bottom:0;z-index:4;overflow:hidden;border-top:1.5px dashed var(--stitch);background:rgba(5,3,12,.7);backdrop-filter:blur(6px)}
.ticker div{display:flex;width:max-content;animation:marq 36s linear infinite}
.ticker span{padding:15px 26px;font:600 13px var(--serif);letter-spacing:.3em;color:#b8c3f5;white-space:nowrap}
.ticker span::after{content:"✦";margin-left:52px;color:var(--cyan)}
@keyframes marq{to{transform:translateX(-50%)}}
.hero-copy>*{animation:rise .9s cubic-bezier(.2,.8,.2,1) backwards}
.hero-copy h1{animation-delay:.1s}.hero-copy .lede{animation-delay:.25s}.hero-copy .cta-row{animation-delay:.4s}.hero-copy .hero-proof{animation-delay:.55s}
@keyframes rise{from{opacity:0;transform:translateY(24px)}}

/* ---------- alert artifact (animated preview) ---------- */
.aa{--delay:-2.6s;--play:paused;--iter:infinite;position:relative;container-type:inline-size;aspect-ratio:16/10;overflow:hidden;isolation:isolate;background:radial-gradient(90% 80% at 50% 112%,var(--bg1),var(--bg2) 75%)}
.aa.bare{background:none}
.aa.live{--delay:var(--off,0s);--play:running}
.aa.once{--iter:1;--delay:0s;--play:running}
.card:hover .aa,.wall-card:hover .aa,.pp-stage .aa,.arch.is-previewing .aa{--delay:0s;--play:running}
.card.force-hover .aa{--delay:-1.9s;--play:paused}
.aa.frozen{--play:paused;--delay:var(--t)}
.aa>*{position:absolute;animation-duration:4s;animation-timing-function:cubic-bezier(.3,.7,.2,1);animation-fill-mode:both;animation-play-state:var(--play);animation-delay:var(--delay);animation-iteration-count:var(--iter)}
.aa-glow{inset:0;background:radial-gradient(55% 62% at 50% 46%,color-mix(in srgb,var(--a) 44%,transparent),transparent 72%);animation-name:aaGlow}
.aa-ring{left:50%;top:46%;width:62%;aspect-ratio:1;border-radius:50%;border:.5cqw solid var(--a);box-shadow:0 0 3cqw var(--a),inset 0 0 3cqw var(--a);animation-name:aaRing}
.aa-ring.r2{width:44%;border-width:.3cqw;animation-delay:calc(var(--delay) + .28s)}
.aa-thread{inset:0;width:100%;height:100%;animation:none;overflow:visible}
.aa-thread path{fill:none;stroke:var(--a);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:300;stroke-dashoffset:300;filter:drop-shadow(0 0 4px var(--a));animation:aaThread 4s var(--delay) var(--iter) both;animation-play-state:var(--play)}
.aa-emb{left:50%;top:43%;width:33%;transform:translate(-50%,-50%);color:var(--b);filter:drop-shadow(0 0 1.6cqw var(--a));animation-name:aaPop;overflow:visible}
.aa[data-m=spin] .aa-emb{animation-name:aaSpin}
.aa[data-m=rush] .aa-emb{animation-name:aaRush}
.aa-emb path,.aa-emb circle,.aa-emb rect{stroke:currentColor;stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:7 4;fill:none;animation:aaMarch 1.2s linear infinite;animation-play-state:var(--play)}
.aa-emb .f{fill:color-mix(in srgb,var(--a) 30%,transparent)}
.aa-tx{left:0;right:0;bottom:11%;text-align:center;font:700 6.2cqw/1.1 var(--serif);letter-spacing:.2em;color:#fff;text-shadow:0 0 2.4cqw var(--a),0 .4cqw 1cqw rgba(0,0,0,.6);animation-name:aaText;padding:0 3cqw}
.aa-tx small{display:block;margin-top:1.4cqw;font:600 3.6cqw var(--sans);letter-spacing:.06em;color:var(--b);text-shadow:0 .3cqw .8cqw rgba(0,0,0,.7)}
.aa-sp{left:var(--x);bottom:20%;width:1.4cqw;height:1.4cqw;border-radius:50%;background:var(--b);box-shadow:0 0 2cqw var(--a);animation-name:aaSpark;animation-delay:calc(var(--delay) + var(--d,0s))}
@keyframes aaGlow{0%{opacity:0}12%{opacity:1}80%{opacity:.9}100%{opacity:0}}
@keyframes aaRing{0%{transform:translate(-50%,-50%) scale(.1);opacity:0}8%{opacity:.9}46%,100%{transform:translate(-50%,-50%) scale(1.5);opacity:0}}
@keyframes aaPop{0%,4%{transform:translate(-50%,-56%) scale(.2) rotate(-18deg);opacity:0}16%{transform:translate(-50%,-50%) scale(1.16) rotate(3deg);opacity:1}24%,84%{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}100%{transform:translate(-50%,-50%) scale(.9);opacity:0}}
@keyframes aaSpin{0%,4%{transform:translate(-50%,-50%) rotateY(0) scale(.2);opacity:0}16%{transform:translate(-50%,-50%) rotateY(360deg) scale(1.12);opacity:1}26%,84%{transform:translate(-50%,-50%) rotateY(720deg) scale(1);opacity:1}100%{transform:translate(-50%,-50%) rotateY(720deg) scale(.9);opacity:0}}
@keyframes aaRush{0%,4%{transform:translate(-190%,-50%) skewX(-20deg);opacity:0}18%{transform:translate(-44%,-50%) skewX(6deg);opacity:1}26%,84%{transform:translate(-50%,-50%) skewX(0);opacity:1}100%{transform:translate(40%,-50%) skewX(10deg);opacity:0}}
@keyframes aaText{0%,26%{opacity:0;letter-spacing:.7em;filter:blur(6px)}38%,84%{opacity:1;letter-spacing:.2em;filter:blur(0)}100%{opacity:0;letter-spacing:.2em}}
@keyframes aaThread{0%{stroke-dashoffset:300;opacity:1}30%,84%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-300;opacity:0}}
@keyframes aaSpark{0%,18%{opacity:0;transform:translateY(0) scale(.4)}30%{opacity:1}80%{opacity:0;transform:translateY(-26cqw) scale(1)}100%{opacity:0}}
@keyframes aaMarch{to{stroke-dashoffset:-22}}

/* ---------- collections ---------- */
.col-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;align-items:end}
.col-host{position:relative;align-self:end}
.col-host .gw svg{width:100%;height:auto}
.col-host .note{position:absolute;left:6%;top:-70px;z-index:2}
.arches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;align-items:end;margin-top:46px}
.arch{position:relative;width:100%;aspect-ratio:3/4.5;min-height:360px;min-width:0;border-radius:50% 50% 14px 14px/34% 34% 14px 14px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--a) 50%,transparent);background:radial-gradient(100% 70% at 50% 0,var(--bg1),var(--bg2) 80%);text-align:center;color:#fff;transition:transform .45s cubic-bezier(.2,.9,.2,1),box-shadow .45s;isolation:isolate}
.arch:nth-child(2){margin-bottom:34px}.arch:nth-child(4){margin-bottom:22px}.arch:nth-child(3){margin-bottom:-10px}
.arch::before{content:"";position:absolute;inset:0;z-index:-2;opacity:.9;transition:transform 1.2s;pointer-events:none}
.arch::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 28%,rgba(5,3,12,.25) 45%,rgba(5,3,12,.87) 68%,rgba(5,3,12,.97));pointer-events:none}
.arch[data-col=midnight]::before{background:radial-gradient(circle at 50% 24%,#e8efff 0 5%,rgba(190,200,255,.4) 6%,transparent 22%),radial-gradient(1.4px 1.4px at 20% 30%,#fff,transparent),radial-gradient(1.4px 1.4px at 74% 18%,#fff,transparent),radial-gradient(1.4px 1.4px at 62% 42%,#fff,transparent),radial-gradient(1.4px 1.4px at 30% 56%,#fff,transparent)}
.arch[data-col=hollow]::before{background:radial-gradient(60% 40% at 30% 60%,rgba(82,224,192,.28),transparent),radial-gradient(70% 40% at 76% 38%,rgba(165,139,255,.22),transparent),radial-gradient(80% 30% at 50% 92%,rgba(82,224,192,.3),transparent);filter:blur(5px)}
.arch[data-col=celestial]::before{background:radial-gradient(1.6px 1.6px at 18% 22%,#fff,transparent),radial-gradient(1.6px 1.6px at 70% 14%,#fff,transparent),radial-gradient(2px 2px at 48% 36%,#fff,transparent),radial-gradient(1.6px 1.6px at 82% 50%,#fff,transparent),radial-gradient(1.6px 1.6px at 26% 62%,#fff,transparent),radial-gradient(70% 50% at 50% 70%,rgba(111,230,255,.28),transparent)}
.arch[data-col=royal]::before{background:repeating-conic-gradient(from 0deg at 50% 38%,rgba(232,199,127,.16) 0 6deg,transparent 6deg 18deg),radial-gradient(60% 50% at 50% 40%,rgba(180,140,255,.3),transparent)}
.arch[data-col=arcane]::before{background:conic-gradient(from 0deg at 50% 40%,transparent,rgba(197,107,255,.35),transparent 30%,rgba(63,227,207,.3) 55%,transparent 80%);animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.arch:is(:hover,:focus-within,.is-previewing){transform:translateY(-8px);box-shadow:0 32px 64px -28px var(--a),0 0 0 3px color-mix(in srgb,var(--a) 15%,transparent)}
.arch-stitches,.arch-threadwork{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.arch-stitches{opacity:.25;color:var(--b)}
.arch-stitches path{fill:none;stroke:currentColor;stroke-width:1;stroke-dasharray:3 6;vector-effect:non-scaling-stroke}
.arch-threadwork{color:var(--a);opacity:.42;transition:opacity .3s}
.arch-threadwork path{fill:none;stroke:currentColor;stroke-width:1.4;stroke-dasharray:4 5;stroke-linecap:round;stroke-linejoin:round}
.arch-scissors{position:absolute;left:16%;top:16%;width:27px;transform:rotate(-24deg);opacity:.7;pointer-events:none;transition:opacity .25s}
.arch .arch-scissors .scis{width:100%;filter:drop-shadow(0 0 5px var(--a))}
.arch-preview-trigger{position:absolute;inset:0 0 auto;width:100%;height:50%;border:0;background:none;padding:0;color:inherit;cursor:pointer}
.arch-preview-trigger:focus-visible{outline:2px solid var(--b);outline-offset:-6px;border-radius:50% 50% 12px 12px/68% 68% 12px 12px}
.arch-kicker{position:absolute;top:18%;left:10%;right:10%;font:600 9px/1.4 var(--sans);letter-spacing:.17em;text-transform:uppercase;color:#d8def5}
.arch svg.ae{position:absolute;left:50%;top:60%;width:38%;transform:translate(-50%,-50%);color:var(--b);filter:drop-shadow(0 0 14px var(--a));transition:opacity .25s,transform .35s}
.arch svg.ae *{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:6 4}
.arch-preview-art{position:absolute;top:25%;left:10%;right:10%;opacity:0;transform:translateY(5px);transition:opacity .3s,transform .3s;pointer-events:none}
.arch-preview-art .aa{width:100%;border-radius:12px;border:1px solid color-mix(in srgb,var(--a) 42%,transparent);box-shadow:0 10px 30px rgba(0,0,0,.4)}
.arch-preview-hint{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:5px;font:600 11px/1.5 var(--sans);color:#e3e8ff}
.arch-preview-hint svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.arch-pause-icon{display:none}
.arch.is-previewing .arch-preview-art{opacity:1;transform:none}
.arch.is-previewing .ae,.arch.is-previewing .arch-scissors{opacity:0}
.arch.is-previewing .arch-threadwork{opacity:.16}
.arch.is-previewing .arch-play-icon{display:none}
.arch.is-previewing .arch-pause-icon{display:block}
.arch-copy{position:absolute;left:10%;right:10%;bottom:64px;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none}
.arch .ct{font:600 11px/1.4 var(--sans);color:#e3e8ff;padding:3px 9px;border:1px solid color-mix(in srgb,var(--a) 32%,transparent);border-radius:999px;background:rgba(5,3,12,.7)}
.arch .nm{font:700 clamp(15px,1.6vw,22px)/1.2 var(--serif);letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 12px #05030c}
.arch .ds{font:400 12.5px/1.45 var(--sans);color:#d4daf4;min-height:2.9em;text-wrap:pretty}
.arch[data-col=royal] .ct{color:#f6dfad;border-color:rgba(232,199,127,.4)}
.arch[data-col=royal] .ds{color:#e4dbf4}
.arch-open{position:absolute;left:9%;right:9%;bottom:15px;min-height:34px;display:flex;align-items:center;justify-content:center;gap:7px;padding:6px;border:1px solid color-mix(in srgb,var(--a) 35%,transparent);border-radius:999px;background:color-mix(in srgb,var(--a) 9%,#090818);color:#f1f5ff;font:600 11px/1.4 var(--sans);cursor:pointer;transition:background .2s,border-color .2s}
.arch-open span{font-size:15px;color:var(--b)}
.arch-open:hover{background:color-mix(in srgb,var(--a) 22%,#090818);border-color:var(--a)}
@media(hover:hover){.arch:hover::before{transform:scale(1.08)}}
@media(hover:none){.arch:is(:hover,:focus-within,.is-previewing){transform:none}}
@media(prefers-reduced-motion:reduce){
  .arch,.arch::before,.arch-preview-art,.arch svg.ae,.arch-scissors,.arch-threadwork,.arch-open{transition:none}
  .arch:is(:hover,:focus-within,.is-previewing){transform:none}
}

/* ---------- store ---------- */
.sec-h .sg{display:flex;align-items:flex-end;gap:14px}
.store-logo{width:128px;margin:-18px 0 -14px}
.bundle{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:30px;align-items:center;padding:30px 36px;border-radius:26px;border:1.5px dashed var(--stitch);background:radial-gradient(70% 120% at 0 0,rgba(122,124,255,.28),transparent 60%),rgba(10,12,40,.7);margin-bottom:46px;overflow:hidden}
.bundle h3{font-size:clamp(24px,2.6vw,38px)}
.bundle p{margin:12px 0 22px;max-width:46ch}
.bundle .price{font:700 34px var(--serif);color:#fff;margin-right:14px}
.bundle .price s{font:500 17px var(--sans);color:var(--muted);margin-left:8px}
.fan{position:relative;height:250px}
.fan .aa{position:absolute;width:42%;border-radius:10px;box-shadow:0 0 0 1px rgba(170,190,255,.3),0 18px 40px -10px rgba(0,0,0,.7);transition:transform .5s cubic-bezier(.2,.9,.2,1)}
.fan .aa:nth-child(1){left:2%;top:26%;transform:rotate(-10deg)}
.fan .aa:nth-child(2){left:20%;top:2%;transform:rotate(-3deg)}
.fan .aa:nth-child(3){left:36%;top:30%;transform:rotate(3deg)}
.fan .aa:nth-child(4){left:50%;top:6%;transform:rotate(8deg)}
.fan .aa:nth-child(5){left:56%;top:48%;transform:rotate(14deg)}
.bundle:hover .fan .aa{--delay:0s;--play:running}
.filters{display:flex;flex-direction:column;gap:14px;margin-bottom:34px}
.tabs,.chips{display:flex;gap:8px;flex-wrap:wrap}
.tab{padding:10px 18px;border-radius:999px;border:1px solid var(--line);background:rgba(14,18,60,.4);font:600 13px var(--sans);cursor:pointer;color:#c3cbf2;transition:all .25s}
.tab:hover{border-color:var(--cyan);color:#fff}
.tab[aria-pressed=true]{background:linear-gradient(135deg,rgba(93,220,255,.22),rgba(122,92,255,.3));border-color:var(--cyan);color:#fff;box-shadow:0 0 24px -6px var(--cyan)}
.chips .tab{padding:7px 14px;font-size:12.5px}
.chips .tab[aria-pressed=true]{border-color:var(--a);box-shadow:0 0 24px -6px var(--a)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.card{position:relative;isolation:isolate;border-radius:18px;padding:9px;background:linear-gradient(180deg,rgba(26,31,90,.55),rgba(10,12,36,.82));border:1px solid var(--line);transition:transform .5s cubic-bezier(.2,.9,.2,1),box-shadow .5s,border-color .4s}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:0;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--a) 34%,transparent),transparent 58%);opacity:0;transition:opacity .4s}
.card>*:not(.cthreads){position:relative;z-index:1}
.cthreads{position:absolute;inset:-22px;width:calc(100% + 44px);height:calc(100% + 44px);z-index:-1;pointer-events:none;overflow:visible;opacity:0;transition:opacity .4s}
.cthreads path{fill:none;stroke:var(--a);stroke-width:1.4px;vector-effect:non-scaling-stroke;stroke-dasharray:5 7;animation:flow 1.4s linear infinite}
.card:hover,.card.force-hover{transform:translateY(-8px) scale(1.03);border-color:color-mix(in srgb,var(--a) 70%,transparent);box-shadow:0 36px 70px -26px var(--a),0 0 0 1px color-mix(in srgb,var(--a) 40%,transparent)}
.card:hover::before,.card.force-hover::before,.card:hover .cthreads,.card.force-hover .cthreads{opacity:1}
.card-art{position:relative;border-radius:12px;overflow:hidden}
.card-art .aa{border-radius:12px;transition:transform .6s}
.card:hover .card-art .aa,.card.force-hover .card-art .aa{transform:scale(1.06)}
.badge{position:absolute;left:10px;top:10px;z-index:3;padding:5px 10px;border-radius:999px;background:rgba(5,3,12,.7);border:1px solid var(--stitch);font:700 11px var(--sans);letter-spacing:.08em;color:#fff}
.wave{position:absolute;left:12px;bottom:10px;z-index:3;display:flex;gap:3px;align-items:flex-end;height:18px;opacity:0;transition:opacity .3s}
.wave i{width:3px;height:100%;border-radius:2px;background:var(--b);transform-origin:bottom;animation:wv .9s ease-in-out infinite alternate}
.wave i:nth-child(2n){animation-delay:-.3s}.wave i:nth-child(3n){animation-delay:-.55s}.wave i:nth-child(4n){animation-delay:-.15s}
@keyframes wv{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
.card:hover .wave,.card.force-hover .wave{opacity:1}
.peek{position:absolute!important;right:16px;top:0;width:64px;z-index:5!important;transform:translateY(0);opacity:0;pointer-events:none;transition:transform .55s cubic-bezier(.2,1.3,.3,1),opacity .3s}
.peek svg{width:100%;height:auto;filter:drop-shadow(0 0 10px rgba(93,220,255,.4))}
.card:hover .peek,.card.force-hover .peek{transform:translateY(-78%);opacity:1}
.card-body{padding:14px 8px 8px}
.card-top{display:flex;justify-content:space-between;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--b)}
.card-top span:last-child{color:var(--muted);font-weight:500}
.card h3{margin:8px 0 12px;font-size:19px;transition:text-shadow .4s,letter-spacing .4s}
.card:hover h3,.card.force-hover h3{text-shadow:0 0 22px var(--a);letter-spacing:.045em}
.specs{display:flex;flex-wrap:wrap;gap:6px;padding:0;list-style:none}
.specs li{padding:4px 9px;border-radius:7px;border:1px dashed var(--stitch);font-size:11.5px;color:#b4bdea}
.buy{display:flex;align-items:center;gap:8px;margin-top:16px}
.buy .btn{white-space:nowrap;letter-spacing:.1em}
.price{font:700 22px var(--serif);color:#fff;margin-right:auto}
.price small{font:500 12px var(--sans);color:var(--muted);margin-right:4px}
.empty{grid-column:1/-1;padding:60px;text-align:center;border:1.5px dashed var(--stitch);border-radius:20px}
.grid-more{text-align:center;margin-top:44px}

/* ---------- live demo ---------- */
.demo{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;padding:16px;border-radius:24px;border:1.5px dashed var(--stitch);background:linear-gradient(180deg,rgba(20,26,82,.4),rgba(5,3,12,.7))}
.sc{position:relative;container-type:inline-size;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#05030c;isolation:isolate}
.sc-bg{position:absolute;inset:0;width:100%;height:100%}
.sc.shake .sc-bg,.sc.shake .sc-hud{animation:shake .55s}
@keyframes shake{20%{transform:translate(-1.2cqw,.5cqw)}40%{transform:translate(1cqw,-.6cqw)}60%{transform:translate(-.6cqw,.4cqw)}80%{transform:translate(.4cqw,0)}}
.sc-hud{position:absolute;left:1.6cqw;top:5.6cqw;width:15cqw;display:grid;gap:.6cqw}
.sc-hud i{display:block;height:.8cqw;border-radius:1cqw;background:rgba(255,255,255,.12);overflow:hidden}
.sc-hud i::after{content:"";display:block;width:var(--w);height:100%;background:linear-gradient(90deg,#ff5f8a,#ff9ab3)}
.sc-hud i+i::after{background:linear-gradient(90deg,#5ddcff,#7a5cff)}
.sc-live,.sc-view,.sc-cam,.sc-bar{position:absolute;z-index:3}
.sc-live{left:1.6cqw;top:1.6cqw;display:flex;gap:.8cqw;align-items:center;font:600 1.4cqw var(--sans);color:#fff}
.sc-live b{padding:.3cqw .9cqw;border-radius:.5cqw;background:#e5415f;font-size:1.2cqw;letter-spacing:.1em}
.sc-view{right:1.6cqw;top:1.6cqw;padding:.4cqw 1cqw;border-radius:.6cqw;background:rgba(5,3,12,.6);font:600 1.3cqw var(--sans);color:#d5dcff}
.sc-cam{left:1.6cqw;bottom:1.6cqw;width:20cqw;aspect-ratio:4/3;border-radius:1cqw;overflow:hidden;border:.25cqw dashed rgba(190,215,255,.6);background:linear-gradient(135deg,#1b1f5a,#0b0d2a);box-shadow:0 0 3cqw -1cqw var(--a)}
.sc-cam svg{width:100%;height:100%}
.sc-bar{right:1.6cqw;bottom:1.6cqw;width:22cqw;display:grid;gap:.8cqw}
.sc-chip{padding:.7cqw 1.1cqw;border-radius:.8cqw;background:rgba(5,3,12,.66);border:.15cqw solid rgba(150,170,255,.25);font:600 1.2cqw var(--sans);color:#cfd7ff;display:flex;justify-content:space-between;gap:1cqw}
.sc-chip b{color:var(--b)}
.sc-goal{height:.7cqw;border-radius:1cqw;background:rgba(255,255,255,.12);overflow:hidden;margin-top:.5cqw}
.sc-goal i{display:block;height:100%;width:62%;background:linear-gradient(90deg,var(--a),var(--b))}
.sc-slot{position:absolute;left:50%;top:3cqw;width:40cqw;transform:translateX(-50%);z-index:4}
.sc-slot .aa{width:100%}
.sc-react{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(70% 70% at 50% 34%,color-mix(in srgb,var(--a) 40%,transparent),transparent 70%),radial-gradient(120% 100% at 50% 50%,transparent 55%,rgba(5,3,12,.7))}
.sc-react.go{animation:react 1.1s ease-out}
@keyframes react{0%{opacity:0}18%{opacity:1}100%{opacity:0}}
.sc.mini .sc-live,.sc.mini .sc-view,.sc.mini .sc-bar,.sc.mini .sc-hud{display:none}
.sc.mini .sc-cam{width:19cqw;left:2cqw;bottom:2cqw}
.sc.mini .sc-slot{left:auto;right:3cqw;top:4cqw;width:46cqw;transform:none}
.demo-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.demo-controls .sp{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.chat{display:flex;flex-direction:column;border-radius:12px;background:rgba(8,12,36,.85);border:1px solid var(--line);min-height:0;overflow:hidden}
.chat h4{font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#aab4e6;padding:14px 16px;border-bottom:1px solid var(--line)}
.chat-list{flex:1;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;padding:14px;overflow:hidden;font-size:13.5px;line-height:1.4}
.msg{color:#d5dcff;animation:rise .35s backwards;word-break:break-word}
.msg b{margin-right:6px}
.msg.sys{padding:8px 10px;border-radius:8px;color:#fff;background:linear-gradient(90deg,color-mix(in srgb,var(--a) 34%,transparent),transparent);border-left:2px solid var(--a)}
.chat-in{margin:12px;padding:11px 14px;border-radius:10px;border:1px solid var(--line);color:#6f78a8;font-size:13px}

/* ---------- showcase wall ---------- */
.reveal-h{display:grid;grid-template-columns:200px minmax(0,1fr);gap:30px;align-items:end;margin-bottom:30px}
.reveal-h .gw svg{width:100%;height:auto}
.wallbox{position:relative;perspective:1300px;margin:0 -24px;padding:30px 24px 70px;overflow:hidden;
  -webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 48%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 80% 75% at 50% 48%,#000 55%,transparent 100%)}
.wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px;transform-style:preserve-3d}
.wall-card{position:relative;z-index:var(--zi,1);translate:calc(var(--px,0)*var(--k)*1px) calc(var(--py,0)*var(--k)*1px);transform:translateY(var(--y)) rotate(var(--r)) scale(var(--s));transition:transform .5s cubic-bezier(.2,.9,.2,1),opacity .5s,filter .5s;cursor:pointer;border-radius:10px;box-shadow:0 0 0 1px rgba(170,190,255,.22),0 16px 30px -12px rgba(0,0,0,.8)}
.wall-card .aa{border-radius:10px}
.wall-card:hover{transform:translateY(-8px) rotate(0) scale(1.35);z-index:50;box-shadow:0 0 0 1px var(--a),0 30px 70px -10px var(--a)}
.wall-card.dim{opacity:.12;filter:saturate(.3) blur(1px)}
.wall-gwen{position:absolute;bottom:0;left:-12%;width:120px;z-index:60;pointer-events:none;animation:walk 46s linear infinite}
.wall-gwen svg{animation:stepbob .7s ease-in-out infinite alternate}
@keyframes walk{0%{left:-12%;transform:scaleX(1)}49.5%{left:104%;transform:scaleX(1)}50%{left:104%;transform:scaleX(-1)}99.5%{left:-12%;transform:scaleX(-1)}100%{left:-12%;transform:scaleX(1)}}
@keyframes stepbob{to{transform:translateY(-5px) rotate(1.5deg)}}
.wall-count{font:600 14px var(--sans);color:var(--b);margin-top:8px}

/* ---------- custom ---------- */
.custom{padding-top:150px}
.custom-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:30px;align-items:center}
.custom h2{font-size:clamp(34px,5vw,74px)}
.custom .lede{margin:22px 0 30px;font-size:18px;max-width:46ch}
.steps{list-style:none;padding:0;margin:0 0 34px;display:grid;gap:0;counter-reset:s}
.steps li{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:13px 0;border-bottom:1.5px dashed rgba(190,215,255,.2);counter-increment:s}
.steps li::before{content:counter(s);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1.5px dashed var(--cyan);font:700 13px var(--serif);color:#fff}
.steps b{color:#fff;font-weight:600}.steps span{color:var(--muted);font-size:14px;display:block}
.craft-stage{position:relative;height:640px}
.craft-stage .thr{z-index:3}
.craft-sign{position:absolute;left:50%;top:-11%;width:160px;transform:translateX(-50%);z-index:3;transform-origin:50% -150%;animation:signSway 7s ease-in-out infinite alternate}
.craft-gwen{position:absolute;left:50%;bottom:84px;width:228px;transform:translateX(-50%);z-index:2}
.craft-gwen svg{width:100%;height:auto}
.table{position:absolute;left:12%;right:12%;bottom:0;height:150px;z-index:3}
.table svg{width:100%;height:100%}
.fl{position:absolute;z-index:4;padding:10px;border-radius:12px;background:rgba(14,18,60,.72);border:1.5px dashed var(--stitch);backdrop-filter:blur(6px);animation:bob 8s ease-in-out infinite;font-size:11.5px;color:#c8d0f5}
.fl h5{font:700 11px var(--sans);letter-spacing:.1em;margin-bottom:8px;color:var(--b);text-transform:uppercase}
.fl-sketch{left:1%;top:12%;width:130px;transform:rotate(-6deg)}
.fl-story{left:0;top:48%;width:150px;animation-delay:-2s}
.fl-time{right:0;top:8%;width:170px;animation-delay:-3s}
.fl-frames{right:1%;top:44%;width:140px;transform:rotate(4deg);animation-delay:-1s}
.fl-pal{left:18%;top:2%;width:120px;animation-delay:-4s}
.fl-sound{right:3%;top:29%;width:110px;animation-delay:-5s}
.fl-done{left:3%;bottom:15%;width:150px;animation-delay:-6s}
.fl-done .aa,.fl-done2 .aa{border-radius:8px}
.fl-done2{right:2%;bottom:20%;width:140px;animation-delay:-7s}
.fl svg{width:100%;height:auto}
.fl .bars{display:flex;gap:4px;align-items:center;height:36px}
.fl .bars i{flex:1;border-radius:3px;background:var(--b);animation:wv 1s ease-in-out infinite alternate}
.fl .bars i:nth-child(2n){animation-delay:-.4s}.fl .bars i:nth-child(3n){animation-delay:-.7s}
.fl .tl{display:grid;gap:5px}
.fl .tl i{display:block;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--a),var(--b));opacity:.85}
.fl .pal{display:flex;gap:6px}.fl .pal i{width:22px;height:22px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(255,255,255,.25)}
.fl .strip{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.fl .strip i{display:block;aspect-ratio:4/3;border-radius:4px;border:1px solid var(--stitch);background:linear-gradient(135deg,var(--bg1),var(--bg2))}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:90px}
.tier{position:relative;padding:28px;border-radius:20px;border:1.5px dashed var(--stitch);background:rgba(12,15,50,.6);display:flex;flex-direction:column;gap:14px}
.tier.hot{background:linear-gradient(180deg,rgba(122,92,255,.26),rgba(12,15,50,.7));border-style:solid;border-color:rgba(190,215,255,.5);transform:translateY(-14px)}
.tier .price{margin:0}
.tier ul{list-style:none;padding:0;display:grid;gap:8px;font-size:14px;color:#c5cdf5;flex:1}
.tier li::before{content:"+";color:var(--cyan);margin-right:10px;font-weight:700}

/* ---------- craft / why ---------- */
.craft-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:70px;align-items:start}
.feat{list-style:none;padding:0;display:grid}
.feat li{display:grid;grid-template-columns:40px 1fr;gap:16px;padding:17px 0;border-bottom:1.5px dashed rgba(190,215,255,.18)}
.feat svg{width:30px;height:30px;fill:none;stroke:var(--cyan);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.feat b{display:block;font:600 17px var(--serif);color:#fff;letter-spacing:.02em}
.feat span{font-size:14.5px;color:var(--muted)}
.cmp{border-radius:22px;overflow:hidden;border:1.5px solid rgba(190,215,255,.3);background:rgba(10,12,40,.7)}
.cmp-r{display:grid;grid-template-columns:110px 1fr 1fr;border-bottom:1.5px dashed rgba(190,215,255,.16)}
.cmp-r:last-child{border:0}
.cmp-r>*{padding:16px 18px;font-size:14px}
.cmp-r>:first-child{font-weight:700;color:#fff}
.cmp-r>:nth-child(2){color:#818ab8}
.cmp-r>:nth-child(3){color:#e6ecff;background:linear-gradient(90deg,rgba(93,220,255,.08),transparent)}
.cmp-h>*{font:700 12px var(--sans)!important;letter-spacing:.14em;text-transform:uppercase;padding-top:20px;padding-bottom:20px}
.cmp-h>:nth-child(3){color:var(--cyan)}
.cmp-logo{display:flex;align-items:center;gap:10px}
.cmp-logo .logo{width:64px;margin:-14px -8px -14px -14px}

/* ---------- reviews ---------- */
.rv-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:24px;align-items:start}
.rev{display:flex;flex-direction:column;gap:16px}
.rev:nth-child(2){margin-top:44px}.rev:nth-child(3){margin-top:16px}
.rev .sc{border:1px solid var(--line)}
.rev blockquote{font:500 clamp(18px,1.7vw,24px)/1.4 var(--serif);color:#fff;letter-spacing:.01em}
.rev:not(:first-child) blockquote{font-size:clamp(16px,1.35vw,19px)}
.who{display:flex;align-items:center;gap:12px;font-size:14px}
.who i{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--a),var(--b));flex:none}
.who b{display:block;color:#fff}.who span{color:var(--muted);font-size:13px}
.tiny{font-size:12.5px;color:#6f78a8;margin-top:30px}

/* ---------- faq ---------- */
.faq{max-width:860px;margin:0 auto}
.faq details{border-bottom:1.5px dashed rgba(190,215,255,.2)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 4px;font:600 clamp(17px,1.6vw,21px) var(--serif);color:#fff}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1.5px dashed var(--cyan);font:400 22px var(--sans);transition:transform .35s}
.faq details[open] summary::after{transform:rotate(45deg);background:rgba(93,220,255,.15)}
.faq p{padding:0 4px 26px;max-width:62ch;font-size:16px}
.faq-h{text-align:center;margin-bottom:46px}
.faq-h .stitch-u{margin-inline:auto}

/* ---------- final cta ---------- */
.cta{position:relative;margin-top:100px;padding:120px 0 0;overflow:hidden;isolation:isolate;background:radial-gradient(60% 60% at 70% 100%,#241165,transparent 70%)}
.cta .dust{opacity:.9}
.cta-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:60px}
.door{position:relative;margin:0 auto;width:min(100%,440px);aspect-ratio:3/4.1;border-radius:50% 50% 0 0/30% 30% 0 0;border:2px solid rgba(190,215,255,.5);border-bottom:0;background:radial-gradient(80% 60% at 50% 70%,rgba(93,220,255,.5),rgba(122,92,255,.28) 50%,rgba(5,3,12,.4) 80%);box-shadow:0 0 120px -10px rgba(93,220,255,.45),inset 0 0 90px rgba(93,220,255,.3);overflow:hidden}
.door::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 80%,rgba(255,255,255,.07) 0 4deg,transparent 4deg 12deg)}
.cta-gwen{position:absolute;left:50%;bottom:0;height:80%;transform:translateX(-50%) translateX(26%)}
.cta-gwen svg{height:100%;width:auto}
.cta-copy{position:relative;padding-bottom:60px}
.cta-copy .logo{width:min(300px,70vw);margin:0 0 4px -34px}
.cta-copy h2{font-size:clamp(32px,5vw,70px);margin-bottom:20px}
.cta-copy p{max-width:50ch;margin:0 0 32px;font-size:18px}


/* ---------- footer ---------- */
.foot{position:relative;border-top:1.5px dashed var(--stitch);padding:70px 0 40px;background:linear-gradient(180deg,rgba(10,12,40,.6),var(--void))}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.4fr;gap:34px}
.foot .logo{width:200px;margin:-30px 0 0 -26px}
.foot h3{font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#aab4e6;margin-bottom:16px}
.foot ul{list-style:none;padding:0;display:grid;gap:10px;font-size:15px}
.foot ul a{text-decoration:none;color:#c9d1f7}.foot ul a:hover{color:var(--cyan)}
.news{display:flex;gap:8px;margin-top:14px}
.news input{flex:1;min-width:0;padding:13px 16px;border-radius:999px;border:1px solid var(--line);background:rgba(14,18,60,.5);color:#fff;font:inherit}
.legal{margin-top:50px;padding-top:24px;border-top:1px solid var(--line);font-size:12.5px;color:#6f78a8;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* ---------- overlays ---------- */
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:96;transform:translateX(105%);transition:transform .5s cubic-bezier(.2,.9,.2,1);background:rgba(8,10,34,.97);border-left:1.5px dashed var(--stitch);padding:calc(var(--safe-t) + 24px) 24px 24px;display:flex;flex-direction:column;gap:16px}
.drawer.on{transform:none}
.drawer h3{display:flex;justify-content:space-between;align-items:center}
.x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:none;cursor:pointer;font-size:20px}
.cart-list{flex:1;overflow:auto;display:grid;gap:12px;align-content:start}
.ci{display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;padding:8px;border-radius:12px;border:1px solid var(--line)}
.ci .aa{border-radius:8px}.ci b{font:600 14px var(--serif);color:#fff}.ci span{font-size:12px;color:var(--muted);display:block}
.ci button{border:0;background:none;color:var(--muted);cursor:pointer;font-size:12px;text-decoration:underline}
.cart-total{display:flex;justify-content:space-between;font:700 20px var(--serif);color:#fff;padding-top:14px;border-top:1.5px dashed var(--stitch)}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 26px);z-index:97;transform:translate(-50%,calc(100% + 80px));opacity:0;pointer-events:none;padding:14px 22px;border-radius:999px;background:rgba(10,12,40,.95);border:1.5px dashed var(--cyan);color:#fff;font-size:14px;transition:transform .5s cubic-bezier(.2,1.2,.3,1),opacity .3s;max-width:90vw}
.toast.on{transform:translate(-50%,0);opacity:1}
.ppm{position:fixed;inset:0;z-index:92;background:rgba(5,3,12,.96);overflow:auto;padding:calc(var(--safe-t) + 20px) 0 60px;display:none}
.ppm.on{display:block}
.ppm .x{position:fixed;right:20px;top:calc(var(--safe-t) + 16px);z-index:3;background:rgba(10,12,40,.9)}

/* ---------- product page ---------- */
.pp{width:min(1240px,100% - 48px);margin:30px auto 0;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:44px}
.pp-stage{position:relative;border-radius:22px;padding:14px;border:1.5px dashed var(--stitch);background:radial-gradient(80% 80% at 50% 0,color-mix(in srgb,var(--a) 22%,transparent),rgba(8,10,34,.8))}
.pp-stage .aa{border-radius:14px}
.pp-seal{position:absolute;right:20px;bottom:-28px;width:112px;z-index:3}
.pp-peek{position:absolute;left:30px;top:0;width:78px;transform:translateY(-82%);z-index:4}
.pp-peek svg{width:100%;height:auto}
.crumbs{font-size:13px;color:var(--muted);margin-bottom:14px}
.pp-info h2{font-size:clamp(30px,3.4vw,50px);margin:12px 0 10px}
.pp-info .tag{font-size:17px;color:#c5cdf5;max-width:42ch}
.pp-price{display:flex;align-items:baseline;gap:14px;margin:24px 0 20px}
.pp-price .price{font-size:40px}
.pp-price span{font-size:14px;color:var(--turq)}
.spec{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:22px;border-top:1.5px dashed rgba(190,215,255,.2)}
.spec div{padding:13px 0;border-bottom:1.5px dashed rgba(190,215,255,.2);font-size:14px}
.spec div:nth-child(odd){padding-right:14px}
.spec dt,.spec small{display:block;font-size:12px;color:var(--muted);margin-bottom:2px}
.spec b{color:#fff;font-weight:600}
.spec .wide{grid-column:1/-1}
.files{list-style:none;padding:0;display:grid;gap:7px;font-size:14px;color:#c5cdf5;margin-bottom:26px}
.files li::before{content:"+";color:var(--cyan);margin-right:10px;font-weight:700}
.pp-buy{display:flex;gap:12px;flex-wrap:wrap}
.pp-buy .btn.lg{flex:1;min-width:220px}
.pp-on{grid-column:1/-1;margin-top:20px}
.pp-on h3{font-size:clamp(22px,2.4vw,32px);margin-bottom:6px}
.pp-on-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;align-items:center;margin-top:20px}
.pp-on-side{display:grid;gap:12px}
.pp-on-side .row{display:flex;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:12px;border:1.5px dashed var(--stitch);font-size:14px;color:#c5cdf5}

/* ---------- concept board ---------- */
.board{position:relative;padding:120px 0 40px;background:linear-gradient(180deg,var(--void),#080a26 30%,#05030c)}
.board-band{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:end;padding-bottom:40px;border-bottom:1.5px dashed var(--stitch);margin-bottom:80px}
.board-sec{margin-bottom:130px}
.board-sec>h3{font-size:clamp(26px,3vw,42px);margin-bottom:8px}
.board-sec>p{margin-bottom:34px;max-width:64ch}
.browser{border-radius:16px;overflow:hidden;border:1.5px solid rgba(190,215,255,.3);background:var(--void);box-shadow:0 60px 120px -40px rgba(0,0,0,.9)}
.browser-bar{display:flex;gap:8px;align-items:center;padding:12px 16px;background:#0c0f34;border-bottom:1px solid var(--line)}
.browser-bar i{width:11px;height:11px;border-radius:50%;background:#2b3170}
.browser-bar span{margin-left:14px;flex:1;max-width:420px;padding:6px 14px;border-radius:999px;background:rgba(5,3,12,.7);font-size:12.5px;color:#8f98c9}
.browser .pp{width:100%;padding:60px 40px 70px;margin:0}
.phones{display:flex;gap:34px;flex-wrap:wrap;justify-content:center}
.phone{position:relative;width:292px;height:620px;border-radius:42px;border:9px solid #151a4a;background:var(--void);overflow:hidden;container-type:inline-size;box-shadow:0 40px 80px -30px rgba(93,220,255,.25),0 0 0 1.5px rgba(190,215,255,.25)}
.phone::before{content:"";position:absolute;left:50%;top:8px;width:86px;height:22px;border-radius:12px;background:#000;transform:translateX(-50%);z-index:9}
.ph-cap{margin-top:16px;text-align:center;font-size:14px;color:var(--muted)}
.ph-in{position:absolute;inset:0;padding:40px 16px 16px;overflow:hidden}
.ph-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.ph-top .logo{width:74px;margin:-8px 0 -4px -12px}
.ph-top .ic{display:flex;gap:8px}.ph-top .ic i{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:11px;font-style:normal}
.ph-hero{position:relative;height:330px;margin:4px -16px 0;overflow:hidden}
.ph-hero .gw{position:absolute;left:50%;bottom:0;height:88%;transform:translateX(-50%)}
.ph-hero .gw svg{height:100%;width:auto}
.ph-hero .pf{position:absolute;width:44%;z-index:2}
.ph h4{font-size:25px;line-height:1.08;margin:6px 0 10px}
.ph p{font-size:13px;line-height:1.5}
.ph .btn{width:100%;margin-top:10px;padding:14px}
.ph-chips{display:flex;gap:7px;margin:14px 0 10px;overflow:hidden}
.ph-chips span{flex:none;padding:7px 12px;border-radius:999px;border:1px solid var(--line);font-size:11.5px;color:#c3cbf2}
.ph-chips span.on{border-color:var(--cyan);color:#fff;background:rgba(93,220,255,.14)}
.ph-card{padding:7px;border-radius:14px;border:1px solid var(--line);background:rgba(14,18,60,.6);margin-bottom:14px}
.ph-card .aa{border-radius:9px}
.ph-card .r{display:flex;justify-content:space-between;align-items:center;padding:10px 4px 2px}
.ph-card b{font:600 14px var(--serif);color:#fff}.ph-card span{font:700 14px var(--serif);color:#fff}
.ph-bar{position:absolute;left:0;right:0;bottom:0;padding:12px 14px 16px;background:linear-gradient(180deg,transparent,rgba(5,3,12,.96) 30%);z-index:5}
.ph-bar .btn{margin:0}
.states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 34px;align-items:start;padding-top:70px}
.states .lbl{margin-top:18px;font-size:14px;color:var(--muted)}
.states .lbl b{display:block;color:#fff;font:600 16px var(--serif);margin-bottom:4px}
.btn-row{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:60px;padding:28px;border-radius:20px;border:1.5px dashed var(--stitch)}
.btn-row figure{display:grid;gap:10px;justify-items:center;font-size:12.5px;color:var(--muted)}
.film{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.film figure{display:grid;gap:10px}
.film figcaption{font-size:13px;color:var(--muted);line-height:1.35}
.film figcaption b{display:block;color:#fff;font-weight:600;font-size:14px}
.film .aa{border-radius:10px;box-shadow:0 0 0 1px rgba(170,190,255,.25)}
.bsys{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
.bsys>div{padding:28px;border-radius:20px;border:1.5px dashed var(--stitch);background:rgba(10,12,40,.5)}
.bsys h4{font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#aab4e6;margin-bottom:18px}
.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.sw{height:84px;border-radius:12px;padding:10px;display:flex;align-items:flex-end;font-size:11.5px;font-weight:600;border:1px solid rgba(255,255,255,.1)}
.type-s .big{font:700 40px var(--serif);color:#fff;letter-spacing:.06em}
.type-s .sm{font:500 18px var(--sans);color:#c5cdf5;margin-top:10px}
.clear{position:relative;display:grid;place-items:center;padding:34px;border:1.5px dashed var(--cyan);border-radius:12px}
.clear .logo{width:150px}
.poses{display:flex;gap:6px;align-items:flex-end;justify-content:space-between}
.poses .gw{width:19%}.poses svg{width:100%;height:auto}
.poses figcaption{text-align:center;font-size:11.5px;color:var(--muted);margin-top:8px}
.rules{list-style:none;padding:0;display:grid;gap:10px;font-size:14.5px;color:#c5cdf5}
.rules li::before{content:"+";color:var(--cyan);margin-right:10px;font-weight:700}

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-grid{grid-template-columns:1fr 1fr 1fr}
  .film{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
  .hdr-in{grid-template-columns:auto 1fr}
  .nav-l,.nav-r a{display:none}
  .hdr-logo{width:84px;left:16px;margin-left:0}
  .hdr-sp{width:84px}
  .burger{display:block}
  .hero{min-height:0;padding-bottom:90px}
  .hero-grid,.col-wrap,.custom-grid,.craft-grid,.bundle,.demo{grid-template-columns:1fr}
  /* minmax(0,…) lets the preview column shrink to the screen; plain 1fr grew to the long title and cut the modal off. */
  .pp,.pp-on-grid{grid-template-columns:minmax(0,1fr)}
  .hero-grid{min-height:0}
  .hero-stage{height:620px;margin-top:20px}
  .thr{top:-70px;height:calc(70px - 3%)}
  .fa-raid::before,.fa-raid::after{height:14vh}
  .craft-stage .thr{top:-60px!important;height:calc(60px - 6%)!important}
  .hero-copy{padding-top:10px}
  .arches{grid-template-columns:repeat(5,minmax(210px,1fr));overflow-x:auto;padding:30px 4px 24px;scroll-snap-type:x mandatory}
  .arch{scroll-snap-align:center}
  .col-host{display:none}
  .reveal-h{grid-template-columns:90px 1fr}
  .tiers{grid-template-columns:1fr}.tier.hot{transform:none}
  .rv-grid{grid-template-columns:1fr}.rev:nth-child(n){margin-top:0}
  .cta-grid{grid-template-columns:1fr;gap:30px}.cta-copy{padding-bottom:0}
  .states{grid-template-columns:1fr 1fr}
  .bsys{grid-template-columns:1fr}
  .browser .pp{padding:30px 20px}
}
@media(max-width:700px){
  .wrap{width:min(1280px,100% - 32px)}
  .grid{grid-template-columns:1fr;gap:20px}
  .peek,.cthreads{display:none}
  .spool{display:none}
  .hero-stage{height:520px}
  .fa-follow{width:34%;top:30%}.fa-sub{width:28%;top:64%;left:0}.fa-raid{width:36%;left:62%}.fa-donation{display:none}.fa-cheer{width:30%;left:68%;top:70%}
  .hello{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}.foot-grid>:first-child,.foot-grid>:last-child{grid-column:1/-1}
  .film{grid-template-columns:repeat(2,minmax(0,1fr))}
  .states{grid-template-columns:1fr}
  .craft-stage{height:560px}.fl-pal,.fl-sound,.fl-frames{display:none}
  .cmp-r{grid-template-columns:78px 1fr 1fr}.cmp-r>*{padding:12px 10px;font-size:12.5px}
  .demo{padding:10px}.demo-controls .btn{padding:11px 14px;font-size:10.5px}
  .sc-chip,.sc-view{display:none}
  .swatches{grid-template-columns:repeat(2,1fr)}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-play-state:paused!important;animation-delay:-2.6s!important;scroll-behavior:auto!important}
  .hero-thread .t1{stroke-dashoffset:0!important}
}

.craft-film{display:grid;grid-template-columns:104px repeat(3,minmax(0,1fr));gap:12px;align-items:end;margin-top:36px}
.craft-film .gw svg{width:100%;height:auto}
.craft-film .aa{border-radius:8px;box-shadow:0 0 0 1px rgba(170,190,255,.25)}
.craft-film p{grid-column:1/-1;font-size:13.5px;margin-top:4px}
.foot-peek{position:absolute;right:9%;top:0;width:86px;transform:translateY(-84%)}
.foot-peek svg{width:100%;height:auto;filter:drop-shadow(0 0 14px rgba(93,220,255,.4))}
@media(max-width:700px){.craft-film{grid-template-columns:repeat(3,minmax(0,1fr))}.craft-film .gw{display:none}.foot-peek{right:20px;width:64px}}

/* =====================================================================
   MERGE LAYER: V1 stays the foundation. Everything below is the restrained
   set of effects borrowed from V2 (mist, scissors, the cut) plus the slots
   that hold the real Gwen artwork.
   ===================================================================== */

/* hallowed mist: two soft gradients drifting behind the content (compositor-only, no blur filters) */
#mist{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
#mist i{position:absolute;width:64vmax;height:64vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(96,110,255,.13),rgba(130,80,255,.05) 55%,transparent);animation:mistDrift 52s ease-in-out infinite alternate;will-change:transform}
#mist i:nth-child(1){left:-22vmax;top:8vh}
#mist i:nth-child(2){right:-26vmax;top:46vh;animation-duration:64s;background:radial-gradient(closest-side,rgba(60,200,255,.09),transparent)}
@keyframes mistDrift{to{transform:translate(10vw,-6vh) scale(1.15)}}
.hmist{position:absolute;inset:auto 0 0 0;height:46%}
.hmist i{position:absolute;bottom:-12%;width:60%;height:100%;border-radius:50%;background:radial-gradient(closest-side,rgba(110,120,255,.26),rgba(100,70,230,.1) 60%,transparent);animation:mistRoll 18s ease-in-out infinite alternate;will-change:transform}
.hmist i:nth-child(1){left:-10%}.hmist i:nth-child(2){right:-14%;animation-delay:-8s;background:radial-gradient(closest-side,rgba(63,227,207,.15),transparent 70%)}
@keyframes mistRoll{to{transform:translateX(8%) scale(1.12,1.04)}}
#fxCv{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:101}

/* sections emerge from the mist: a soft bloom and a short blur-in on the heading (no hiding of content without JS) */
.js .sec-h{opacity:0;filter:blur(6px);transition:opacity .9s,filter .9s}
.js .sec.mist-in .sec-h{opacity:1;filter:none}
.mist-burst{position:absolute;left:50%;top:-30px;width:140%;height:460px;margin-left:-70%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(110,125,255,.22),rgba(120,80,255,.08) 55%,transparent);opacity:0;transform:scale(.4,.5)}
.sec.mist-in .mist-burst{animation:burst 2s ease-out forwards}
@keyframes burst{0%{opacity:0;transform:scale(.4,.5)}35%{opacity:1}100%{opacity:0;transform:scale(1.1,1)}}

/* header sound toggle (reuses the cart button look) */
.cart-btn[aria-pressed=false] #sndWaves{display:none}
.cart-btn[aria-pressed=false]{opacity:.7}

/* scissors (UI object) */
.scis{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 0 12px rgba(93,220,255,.45));--o:16}
.scis .h{transform-box:view-box;transform-origin:50% 50%}
.scis .h-a{transform:rotate(calc(var(--o)*-1deg))}
.scis .h-b{transform:rotate(calc(var(--o)*1deg))}
.scis.idle .h-a{animation:snipA 5.6s infinite}
.scis.idle .h-b{animation:snipB 5.6s infinite}
@keyframes snipA{0%,50%,100%{transform:rotate(-17deg)}10%,30%{transform:rotate(-1.5deg)}20%{transform:rotate(-17deg)}}
@keyframes snipB{0%,50%,100%{transform:rotate(17deg)}10%,30%{transform:rotate(1.5deg)}20%{transform:rotate(17deg)}}
/* V1's card hover peek: the drawn character is gone, a pair of scissors snips at the card corner instead */
.peek{width:58px!important}
.peek svg.scis{transform:rotate(180deg)}
.card:hover .peek .scis .h-a,.card.force-hover .peek .scis .h-a{animation:snipA 1.8s infinite}
.card:hover .peek .scis .h-b,.card.force-hover .peek .scis .h-b{animation:snipB 1.8s infinite}
.pp-peek{width:62px!important}.pp-peek svg.scis{transform:rotate(180deg)}
.foot-peek{width:64px!important}
.hero-scis{position:absolute;left:30%;top:76%;width:84px;z-index:4;transform:rotate(-24deg);opacity:.9;animation:bob 7s ease-in-out infinite}

/* Gwen art slots */
.gslot{position:relative;pointer-events:none;isolation:isolate}
.gslot .art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:saturate(.92) contrast(1.05) brightness(.96) drop-shadow(0 0 1px rgba(150,230,255,.8)) drop-shadow(0 0 22px rgba(93,220,255,.2)) drop-shadow(0 28px 34px rgba(0,0,0,.6));-webkit-mask-image:linear-gradient(180deg,#000 88%,transparent);mask-image:linear-gradient(180deg,#000 88%,transparent)}
body.blend .gslot .art{mix-blend-mode:screen}
.gslot .grade{position:absolute;inset:0;z-index:1;background:linear-gradient(205deg,rgba(70,100,255,.4),rgba(150,80,255,.3) 55%,rgba(30,20,90,.15));mix-blend-mode:soft-light;-webkit-mask:var(--art) 50% 100%/contain no-repeat;mask:var(--art) 50% 100%/contain no-repeat}
.gslot .gs-mist{position:absolute;left:-14%;right:-14%;pointer-events:none;border-radius:50%;background:radial-gradient(closest-side,rgba(115,125,255,.34),rgba(100,70,230,.14) 60%,transparent);animation:mistRoll 14s ease-in-out infinite alternate}
.gslot .gs-mist.b{bottom:10%;height:50%;z-index:-1}
.gslot .gs-mist.f{bottom:-6%;height:30%;z-index:2;opacity:.9;animation-delay:-6s}
.gslot .gs-th{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.gslot .gs-th path{fill:none;stroke:#7fe4ff;stroke-width:1.4px;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:5 9;animation:flow 3.4s linear infinite}
.gslot .gs-th.b{z-index:-1;opacity:.55}.gslot .gs-th.f{z-index:2;opacity:.4}
.gslot .gs-sp{position:absolute;inset:0;z-index:3;pointer-events:none}
.gslot .gs-sp i{position:absolute;bottom:8%;width:3px;height:3px;border-radius:50%;background:#bfeaff;box-shadow:0 0 8px #5ddcff;opacity:0;animation:gsRise 9s linear infinite}
.gslot .gs-sp i:nth-child(1){left:12%;animation-delay:-1s}.gslot .gs-sp i:nth-child(2){left:26%;animation-delay:-4s;animation-duration:11s}.gslot .gs-sp i:nth-child(3){left:40%;animation-delay:-7s}.gslot .gs-sp i:nth-child(4){left:55%;animation-delay:-2s;animation-duration:12s}.gslot .gs-sp i:nth-child(5){left:68%;animation-delay:-5s}.gslot .gs-sp i:nth-child(6){left:80%;animation-delay:-8s;animation-duration:10s}.gslot .gs-sp i:nth-child(7){left:90%;animation-delay:-3s}.gslot .gs-sp i:nth-child(8){left:5%;animation-delay:-6s;animation-duration:13s}
@keyframes gsRise{0%{transform:translateY(0);opacity:0}15%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-260px);opacity:0}}
.gslot.empty{display:none}
.gslot.empty::before{content:"";position:absolute;inset:5% 6% 0;border:1.5px dashed rgba(190,215,255,.26);border-radius:46% 46% 10px 10px/26% 26% 10px 10px;background:radial-gradient(70% 55% at 50% 38%,rgba(93,220,255,.12),transparent 72%)}
.gslot.empty::after{content:attr(data-label);position:absolute;left:0;right:0;top:46%;text-align:center;font:600 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#7f89c0;padding:0 14%;line-height:1.6}
.hero-gwen.empty,.poses .gslot.empty{display:block}
.hero-gwen{position:absolute;left:50%;bottom:0;height:86%;width:54%;transform:translateX(-50%);z-index:3}
.hero-gwen::before{content:"";position:absolute;left:-10%;right:-10%;top:6%;bottom:0;z-index:-2;background:radial-gradient(55% 60% at 50% 45%,rgba(93,220,255,.16),transparent 70%)}
body:not(.has-art) .hello{display:none}
.col-gwen{width:100%;height:440px}
body:not(.art-collections) .col-host{display:none}
body:not(.art-collections) .col-wrap{grid-template-columns:1fr}
.reveal-h{grid-template-columns:1fr}
.craft-gwen{width:300px;height:440px;bottom:74px}
.door .cta-gwen{position:absolute;left:50%;bottom:0;width:78%;height:90%;transform:translateX(-50%)}
.door .cta-mist{position:absolute;left:-10%;right:-10%;bottom:-6%;height:42%;pointer-events:none;z-index:3}
.door .cta-mist i{position:absolute;bottom:0;width:62%;height:100%;border-radius:50%;background:radial-gradient(closest-side,rgba(120,130,255,.5),rgba(100,70,230,.22) 60%,transparent);animation:mistRoll 14s ease-in-out infinite alternate}
.door .cta-mist i:nth-child(1){left:-8%}.door .cta-mist i:nth-child(2){right:-8%;animation-delay:-7s;background:radial-gradient(closest-side,rgba(63,227,207,.24),transparent)}
.craft-film{grid-template-columns:repeat(3,minmax(0,1fr))}
.ph-gslot{position:absolute;left:50%;bottom:0;height:88%;width:72%;transform:translateX(-50%)}
.poses{align-items:flex-start;gap:14px}
.poses figure{flex:1;min-width:0}
.poses .gslot{aspect-ratio:3/4;width:100%}

/* THE CUT: fabric overlay */
#snip{position:fixed;inset:0;z-index:99;display:none;overflow:hidden;cursor:pointer}
#snip.on,html.intro-on #snip{display:block}
#snip.black,html.intro-on #snip{background:#000}
#snip .dim{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 55%,rgba(8,8,40,.3),rgba(2,2,12,.7));opacity:0}
#snip .imist{position:absolute;inset:0;opacity:var(--m,0);pointer-events:none}
#snip .imist i{position:absolute;border-radius:50%;background:radial-gradient(closest-side,rgba(110,120,255,.3),rgba(110,70,230,.12) 60%,transparent)}
#snip .imist i:nth-child(1){left:-10%;top:28%;width:70%;height:64%}
#snip .imist i:nth-child(2){right:-14%;top:10%;width:66%;height:60%;background:radial-gradient(closest-side,rgba(63,227,207,.14),transparent 70%)}
#snip .imist i:nth-child(3){left:20%;bottom:-18%;width:70%;height:50%}
#snip .cut{position:absolute;inset:0;visibility:hidden;background:radial-gradient(80% 60% at 50% 50%,rgba(52,52,170,.45),transparent),repeating-linear-gradient(45deg,rgba(255,255,255,.03) 0 2px,transparent 2px 6px),repeating-linear-gradient(-45deg,rgba(255,255,255,.03) 0 2px,transparent 2px 6px),linear-gradient(180deg,#0b0c36,#05030c)}
#snip .cut svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#snip .cut polyline{fill:none;stroke:#8fe6ff;stroke-width:3}
#snip .cut polyline.g{stroke:#5ddcff;stroke-width:12;opacity:.22}
#snip .cut polyline.d{stroke:rgba(255,255,255,.7);stroke-width:1.2;stroke-dasharray:6 6}
#snip .gap{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#snip .gap polyline{fill:none;stroke-linecap:round;opacity:0}
#snip .gap .gp1{stroke:#e6f8ff}#snip .gap .gp2{stroke:#8fe6ff}#snip .gap .gp3{stroke:#6a6cff}
#snip .ths{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#snip .th{fill:none;stroke:#7fe4ff;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
#snip .th.g{stroke:#5ddcff;stroke-width:12;opacity:.22}
#snip .th.w{stroke:#fff;stroke-width:1.2;stroke-dasharray:5 14;filter:none;opacity:.8;animation:flow 1.6s linear infinite}
#snip .cz-sw{position:absolute;opacity:0;pointer-events:none}

#snip .mistc{position:absolute;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;border-radius:50%;background:radial-gradient(closest-side,rgba(140,150,255,.6),rgba(95,65,210,.35) 55%,rgba(40,20,110,0) 100%);transform:scale(0);opacity:0}
#snip.simple{background:transparent}
#snip .sf{position:absolute;inset:0;opacity:0;transition:opacity .22s ease;background:radial-gradient(80% 70% at 50% 50%,rgba(60,60,180,.5),#05030c)}

/* while the opening plays, the hero holds its first frame and then plays as the fabric opens */
html.intro-on .hero-copy>*,html.intro-on .hero-thread .t1{animation-play-state:paused}

@media(max-width:980px){
  .hero-gwen{width:64%}
  .door .cta-gwen{width:70%}
}
@media(max-width:700px){
  .hero-scis{width:60px}
  #mist i:nth-child(2){display:none}
}
@media(prefers-reduced-motion:reduce){
  .js .sec-h{opacity:1!important;filter:none!important}
}

html.cutting .aa,html.cutting .aa *,html.cutting .hero-bg *,html.cutting .hero-thread *,html.cutting .fa,html.cutting .hero-scis,html.cutting #mist i,html.cutting .mist-burst,html.cutting .beam,html.cutting .spool,html.cutting .sign{animation-play-state:paused!important}

/* board panels may shrink (the character-scene frames were stretching the grid on phones) */
.bsys>div{min-width:0}
@media(max-width:980px){.bsys{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){.poses{gap:8px}.poses figcaption{font-size:10px}}

/* Gwen stays inside the original atelier scene, behind its hanging alerts. */
.hero-gwen-media{position:absolute;left:6%;top:20%;width:94%;height:78%;z-index:1;pointer-events:none;opacity:.66;overflow:hidden;-webkit-mask-image:radial-gradient(ellipse at 50% 44%,#000 24%,rgba(0,0,0,.9) 43%,transparent 72%);mask-image:radial-gradient(ellipse at 50% 44%,#000 24%,rgba(0,0,0,.9) 43%,transparent 72%)}
.hero-poster,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:51% 42%}
.hero-video{opacity:0;transition:opacity .65s ease}
.hero.video-ready .hero-video{opacity:1}
.hero-motion{position:absolute;right:5%;bottom:0;z-index:5;display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:8px 12px;border:1px solid rgba(190,215,255,.2);border-radius:999px;background:rgba(5,3,12,.55);color:#bcc8e3;font:500 11px/1.4 var(--sans);cursor:pointer;backdrop-filter:blur(8px)}
.hero-motion[hidden]{display:none}
.hero-motion:hover{border-color:var(--cyan);color:#fff}
.hero-motion-icon{font-size:13px;width:14px;text-align:center}
@media(max-width:700px){.hero-gwen-media{left:0;width:100%;top:18%;height:80%;opacity:.62}.hero-poster,.hero-video{object-position:51% 40%}}
@media(prefers-reduced-motion:reduce){.hero-video{transition:none}}

/* A stitched shortcut back to Gwen's atelier entrance. */
.back-top{position:fixed;right:22px;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);z-index:55;display:flex;align-items:center;gap:10px;padding:9px 15px 9px 10px;min-height:54px;border:1px solid rgba(93,220,255,.48);border-radius:999px;background:linear-gradient(120deg,rgba(15,27,54,.94),rgba(31,17,65,.94));box-shadow:0 5px 24px rgba(0,0,0,.35),0 0 18px rgba(93,220,255,.1);color:#d6efff;cursor:pointer;backdrop-filter:blur(12px);transition:border-color .2s,box-shadow .2s,transform .2s}
.back-top[hidden],html:has(#ppm.on) .back-top,html:has(#drawer.on) .back-top,html:has(#mnav.on) .back-top{display:none}
.back-top::before{content:"";position:absolute;inset:4px;border:1px dashed rgba(145,141,255,.5);border-radius:inherit;pointer-events:none}
.back-top-icon{display:block;width:29px;height:34px;filter:drop-shadow(0 0 5px rgba(93,220,255,.65));transition:transform .25s}
.back-top-icon .scis{width:100%;height:100%;display:block}
.back-top-label{font:700 10px/1.4 var(--sans);letter-spacing:.13em}
.back-top-arrow{width:18px;height:18px;color:var(--cyan);transition:transform .2s}
.back-top:hover{border-color:var(--cyan);box-shadow:0 5px 24px rgba(0,0,0,.35),0 0 25px rgba(93,220,255,.25),0 0 32px rgba(122,92,255,.16);transform:translateY(-2px)}
.back-top:hover .back-top-icon{transform:rotate(-12deg)}
.back-top:hover .back-top-arrow{transform:translateY(-2px)}
.back-top:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
@media(max-width:700px){.back-top{right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 14px);min-height:48px;padding:7px 12px 7px 9px;gap:7px}.back-top-icon{width:25px;height:30px}.back-top-label{font-size:9px}}
@media(prefers-reduced-motion:reduce){.back-top,.back-top-icon,.back-top-arrow{transition:none}.back-top:hover,.back-top:hover .back-top-icon,.back-top:hover .back-top-arrow{transform:none}}

/* The atelier code: a stitched agreement in Gwen's cyan and violet. */
.studio-rules{position:relative;isolation:isolate;overflow:hidden;padding:110px 0;background:radial-gradient(ellipse at 75% 45%,rgba(77,46,148,.2),transparent 60%),radial-gradient(ellipse at 5% 80%,rgba(53,156,186,.09),transparent 55%),var(--void);border-top:1px dashed var(--stitch)}
.rules-layout{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:70px;align-items:center}
.rules-intro .logo{display:block;width:180px;margin:0 0 12px -20px}
.rules-eyebrow{display:block;font:700 10px/1.5 var(--sans);letter-spacing:.21em;color:var(--cyan);margin-bottom:18px}
.rules-intro h2{font-size:clamp(44px,5vw,76px);line-height:1.05;margin-bottom:22px}
.rules-intro>p{max-width:32ch;font-size:16px;line-height:1.8;margin:24px 0 0;color:#b4bedf}
.rules-intro>small{display:block;max-width:34ch;font-size:11px;line-height:1.7;color:#8e9abc;margin-top:16px}
.rules-seal{position:relative;width:150px;height:100px;margin:18px 0 20px}
.rules-seal>span{position:absolute;left:45px;top:0;width:55px;height:82px;transform:rotate(28deg);filter:drop-shadow(0 0 12px rgba(93,220,255,.55))}
.rules-seal .scis{width:100%;height:100%}
.rules-seal i{position:absolute;left:0;right:-20px;bottom:15px;border-bottom:1px dashed var(--cyan);transform:rotate(-12deg);opacity:.65}
.rules-panel{position:relative;padding:26px;border:1px solid rgba(148,139,233,.32);border-radius:90px 90px 22px 22px;background:linear-gradient(155deg,rgba(34,27,73,.75),rgba(8,11,31,.92));box-shadow:0 20px 80px rgba(0,0,0,.22),0 0 60px rgba(93,220,255,.045)}
.rules-panel::before{content:"";position:absolute;inset:9px;border:1px dashed rgba(133,145,205,.26);border-radius:82px 82px 15px 15px;pointer-events:none}
.rules-panel-head{display:flex;justify-content:space-between;gap:12px;padding:20px 22px 22px;color:#a3b2d5;font-size:9px;letter-spacing:.15em}
.rules-panel-head span:first-child{color:var(--cyan)}
.rules-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rule-card{display:flex;align-items:flex-start;gap:10px;padding:20px 15px;min-width:0;border:1px solid rgba(133,145,205,.15);border-radius:15px;background:rgba(8,10,29,.5)}
.rule-num{flex:none;font:500 13px var(--serif);color:var(--cyan);padding-top:4px}
.rule-card h3{font-size:16px;line-height:1.45;margin-bottom:8px;color:#e8eaff}
.rule-card p{font-size:12px;line-height:1.8;color:#aeb9d8}
.rules-footnote{text-align:center;font:400 12px var(--serif);letter-spacing:.04em;color:#9a9dca;margin:23px 0 4px}
.terms-dialog{width:min(760px,calc(100vw - 32px));max-height:85svh;box-sizing:border-box;margin:auto;padding:32px;border:1px solid rgba(93,220,255,.45);border-radius:24px;color:var(--white);background:radial-gradient(ellipse at 100% 0,rgba(122,92,255,.18),transparent 55%),#080b20;box-shadow:0 0 60px rgba(93,220,255,.12);overflow:auto;overscroll-behavior:contain}
.terms-dialog::backdrop{background:rgba(2,3,12,.8);backdrop-filter:blur(8px)}
.terms-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.terms-heading h2{font-size:30px}.terms-heading .rules-eyebrow{font-size:9px;margin-bottom:12px}
.terms-close{flex:none;width:40px;height:40px;border:1px solid var(--stitch);border-radius:50%;background:rgba(122,92,255,.1);color:#eaf4ff;font-size:24px;cursor:pointer}
.terms-close:hover{border-color:var(--cyan)}
.terms-lede{margin:18px 0 26px;color:#aeb9d8;font-size:14px}
.terms-clause{display:flex;gap:16px;padding:20px 0;border-top:1px dashed rgba(133,145,205,.25)}
.terms-clause>span{color:var(--cyan);font-size:12px;padding-top:3px}
.terms-clause h3{font-size:18px;margin-bottom:10px}.terms-clause p{font-size:14px;line-height:1.85;color:#b6c0dc}
@media(max-width:980px){.rules-layout{gap:35px;grid-template-columns:minmax(0,.7fr) minmax(0,1fr)}.rules-cards{grid-template-columns:1fr}.rules-panel{padding:22px}.rules-panel-head{padding:18px 10px}.rule-card{padding:15px}}
@media(max-width:700px){.studio-rules{padding:70px 0}.rules-layout{grid-template-columns:1fr;gap:32px}.rules-intro .logo{width:145px}.rules-intro h2{font-size:48px}.rules-intro>p{max-width:38ch}.rules-seal{height:85px;margin:14px 0}.rules-panel{border-radius:55px 55px 20px 20px;padding:21px}.rules-panel::before{border-radius:47px 47px 13px 13px}.rules-panel-head{font-size:8px;letter-spacing:.09em;padding:14px 6px 18px}.rule-card h3{font-size:17px}.rule-card p{font-size:13px}.terms-dialog{padding:22px;max-height:88svh}.terms-heading h2{font-size:25px}}

/* The rules seal gently snips its thread without interrupting reading. */
.rules-seal>span{animation:rulesScissorsFloat 5.6s ease-in-out infinite}
.rules-seal .h-a{animation:snipA 5.6s ease-in-out infinite}
.rules-seal .h-b{animation:snipB 5.6s ease-in-out infinite}
@keyframes rulesScissorsFloat{0%,100%{transform:translate(0,0) rotate(28deg)}25%{transform:translate(5px,-3px) rotate(24deg)}55%{transform:translate(9px,-6px) rotate(30deg)}}
@media(prefers-reduced-motion:reduce){.rules-seal>span,.rules-seal .h-a,.rules-seal .h-b{animation:none}}

/* Hallowed mist and a magical thread tie the custom workshop together. */
.craft-stage{isolation:isolate}
.atelier-aura{position:absolute;inset:-7% -5% 0;z-index:0;pointer-events:none;overflow:hidden;mask-image:radial-gradient(ellipse at 50% 52%,#000 35%,transparent 73%);-webkit-mask-image:radial-gradient(ellipse at 50% 52%,#000 35%,transparent 73%)}
.atelier-mist{position:absolute;display:block;border-radius:50%;filter:blur(24px);animation:atelierMistDrift 18s ease-in-out infinite alternate}
.atelier-mist-cyan{width:78%;height:62%;left:7%;top:12%;background:radial-gradient(ellipse,rgba(57,183,215,.19),rgba(42,141,181,.06) 52%,transparent 73%)}
.atelier-mist-violet{width:82%;height:63%;right:-4%;top:25%;background:radial-gradient(ellipse,rgba(122,92,255,.23),rgba(83,48,168,.06) 57%,transparent 74%);animation-delay:-8s}
.atelier-mist-floor{left:8%;bottom:4%;width:87%;height:27%;background:radial-gradient(ellipse,rgba(93,220,255,.19),rgba(122,92,255,.1) 40%,transparent 72%);animation-delay:-12s}
.atelier-thread{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none;fill:none}
.atelier-thread-glow{stroke:#5ddcff;stroke-width:4;opacity:.13;filter:blur(5px)}
.atelier-thread-line{stroke:url(#atelierThreadGradient);stroke-width:1.25;opacity:.38;stroke-dasharray:3 9;stroke-linecap:round;animation:atelierThreadFlow 35s linear infinite}
.atelier-stitches{stroke:#a39cef;stroke-width:1;stroke-dasharray:4 8;opacity:.2}
.atelier-sparks{stroke:#a7eaff;stroke-width:1;opacity:.45;animation:atelierSparkGlow 7s ease-in-out infinite alternate}
@keyframes atelierMistDrift{from{transform:translate(-8px,5px) scale(.97)}to{transform:translate(12px,-9px) scale(1.06)}}
@keyframes atelierThreadFlow{to{stroke-dashoffset:-240}}
@keyframes atelierSparkGlow{from{opacity:.2}to{opacity:.55}}
@media(max-width:700px){.atelier-mist{filter:blur(18px)}.atelier-thread-line{opacity:.28}.atelier-aura{inset:0 -2%}.atelier-stitches{opacity:.14}}
@media(prefers-reduced-motion:reduce){.atelier-mist,.atelier-thread-line,.atelier-sparks{animation:none}}

/* Custom packages awaken with a stitched orbit and Gwen's scissors. */
.tier{isolation:isolate;--tier-x:50%;--tier-y:35%;--tier-lift:0px;transition:transform .4s ease,border-color .35s,box-shadow .35s}
.tier.hot{--tier-lift:-14px}
.tier::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:radial-gradient(280px circle at var(--tier-x) var(--tier-y),rgba(93,220,255,.13),rgba(122,92,255,.08) 40%,transparent 72%);opacity:0;transition:opacity .4s}
.tier:is(:hover,:focus-within){transform:translateY(calc(var(--tier-lift) - 7px));border-color:rgba(93,220,255,.7);box-shadow:0 16px 40px rgba(0,0,0,.25),0 0 26px rgba(93,220,255,.1)}
.tier:is(:hover,:focus-within)::before{opacity:1}
.tier-orbit{position:absolute;inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px);pointer-events:none;overflow:visible;z-index:2;opacity:0;transition:opacity .3s}
.tier-orbit rect{fill:none;stroke:#5ddcff;stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-dasharray:14 86;stroke-linecap:round;filter:drop-shadow(0 0 4px #5ddcff)}
.tier:is(:hover,:focus-within) .tier-orbit{opacity:.85}
.tier:is(:hover,:focus-within) .tier-orbit rect{animation:tierThreadOrbit 4.8s linear infinite}
.tier-scissors{position:absolute;top:-26px;right:20px;width:43px;height:57px;z-index:3;pointer-events:none;opacity:0;transform:translateY(7px) rotate(25deg);transition:opacity .3s,transform .4s}
.tier-scissors .scis{width:100%;height:100%}
.tier:is(:hover,:focus-within) .tier-scissors{opacity:1;transform:translateY(0) rotate(25deg)}
.tier:is(:hover,:focus-within) .tier-scissors .h-a{animation:snipA 3.8s ease-in-out infinite}
.tier:is(:hover,:focus-within) .tier-scissors .h-b{animation:snipB 3.8s ease-in-out infinite}
.tier li{transition:color .3s,transform .3s;transition-delay:calc(var(--tier-item,0)*35ms)}
.tier:is(:hover,:focus-within) li{color:#e0e7ff;transform:translateX(3px)}
.tier .btn{position:relative;overflow:hidden}
.tier .btn::after{content:"";position:absolute;inset:-70% auto -70% -55%;width:35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-22deg);pointer-events:none}
.tier:is(:hover,:focus-within) .btn::after{animation:tierButtonShine 1.1s ease-out both}
.tier.tier-enter{animation:tierUnfold .85s cubic-bezier(.2,.65,.25,1) both;animation-delay:var(--tier-delay,0ms)}
@keyframes tierThreadOrbit{to{stroke-dashoffset:-100}}
@keyframes tierButtonShine{to{left:135%}}
@keyframes tierUnfold{from{opacity:0;transform:translateY(26px);filter:blur(3px)}to{opacity:1;transform:translateY(var(--tier-lift));filter:blur(0)}}
@media(max-width:980px){.tier.hot{--tier-lift:0px}}
@media(hover:none){.tier:is(:hover,:focus-within){transform:translateY(var(--tier-lift))}}
@media(prefers-reduced-motion:reduce){.tier,.tier::before,.tier-orbit,.tier-scissors,.tier li{transition:none}.tier.tier-enter,.tier-orbit rect,.tier-scissors .h-a,.tier-scissors .h-b,.tier .btn::after{animation:none!important}.tier:is(:hover,:focus-within){transform:translateY(var(--tier-lift))}.tier:is(:hover,:focus-within) li{transform:none}}

/* A sealed metal atelier: future custom work, ready-made alerts available now. */
.custom-locked{position:relative;isolation:isolate}
.custom-locked .custom-content{opacity:.42;filter:saturate(.65);pointer-events:none;user-select:none}
/* While custom work is sealed its price cards and the studio desk stay out of sight; they come back with the section
   when it opens. */
.custom-locked :is(#custom-tiers,.craft-stage){display:none}
/* The lock sits over the section and its overlay clips: keep room for the whole message (measured 320–1440 px, AR/EN). */
.custom-locked{min-height:900px}
@media(max-width:700px){.custom-locked{min-height:980px}}
@media(max-width:340px){.custom-locked{min-height:1020px}}
.custom-locked .custom-content *, .custom-locked .custom-content *::before,.custom-locked .custom-content *::after{animation-play-state:paused!important}
.custom-lock-overlay{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden;background:linear-gradient(180deg,transparent 3%,rgba(5,3,12,.2) 18%,rgba(5,3,12,.56) 35%,rgba(5,3,12,.25) 70%,transparent 95%)}
.custom-lock-scene{position:absolute;left:50%;top:15%;width:min(1100px,100%);height:660px;transform:translateX(-50%)}
.custom-chains{position:absolute;top:0;left:0;width:100%;height:auto;filter:drop-shadow(0 6px 6px #03030b) drop-shadow(0 0 10px rgba(93,220,255,.12));opacity:.9}
.atelier-padlock{position:relative;width:144px;height:168px;margin:150px auto 0;filter:drop-shadow(0 0 15px rgba(93,220,255,.27));transform-origin:50% 20%;animation:atelierLockSway 8s ease-in-out infinite alternate}
.atelier-padlock::before{content:"";position:absolute;inset:-45px;border-radius:50%;z-index:-1;background:radial-gradient(ellipse,rgba(93,220,255,.14),rgba(122,92,255,.12) 40%,transparent 70%)}
.atelier-padlock svg{width:100%;height:100%}
.custom-lock-message{position:relative;text-align:center;max-width:570px;margin:8px auto 0;padding:22px 28px 24px;border-radius:26px;background:radial-gradient(ellipse at 50% 0,rgba(34,29,70,.9),rgba(5,5,20,.92) 75%);border:1px solid rgba(139,141,213,.27);box-shadow:0 20px 70px rgba(0,0,0,.35);pointer-events:auto}
.lock-eyebrow{display:block;color:#9baccd;font:600 9px/1.6 var(--sans);letter-spacing:.22em;margin-bottom:12px}
.custom-lock-message h3{font-size:clamp(20px,2.3vw,30px);letter-spacing:.07em}
.custom-lock-message strong{display:block;font:600 clamp(30px,4vw,48px)/1.2 var(--serif);letter-spacing:.06em;margin-top:5px;background:linear-gradient(110deg,#81e9ff,#c8b3ff,#72cfff);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:0 0 26px rgba(93,220,255,.16)}
.lock-stitch{display:block;width:90px;border-top:1px dashed #5ddcff;margin:18px auto}
.custom-lock-message p{color:#aeb9d8;font-size:14px;line-height:1.7;margin-bottom:20px}
.custom-lock-message .btn{font-size:11px;gap:12px}
.custom-lock-message small{display:block;font-size:10px;color:#8592b5;margin:16px auto 0;max-width:42ch;line-height:1.7}
@keyframes atelierLockSway{from{transform:rotate(-2deg)}to{transform:rotate(2deg)}}
@media(max-width:980px){.custom-lock-scene{top:13%;width:100%;}.atelier-padlock{margin-top:130px}}
@media(max-width:700px){.custom-lock-scene{top:270px;height:560px}.custom-chains{top:74px;width:760px;max-width:none;left:50%;transform:translateX(-50%)}.atelier-padlock{width:115px;height:134px;margin-top:162px}.custom-lock-message{margin:8px 18px 0;padding:22px 18px}.lock-eyebrow{font-size:8px;letter-spacing:.13em}.custom-lock-message h3{font-size:22px}.custom-lock-message strong{font-size:32px}.custom-lock-message p{font-size:13px}.custom-lock-message .btn{font-size:10px;padding-inline:16px}.custom-locked .custom-content{opacity:.34}}
@media(prefers-reduced-motion:reduce){.atelier-padlock{animation:none}}

/* Tension in the chains and a quiet magical pulse in Gwen's lock. */
.chain-cross rect{transform-box:fill-box;transform-origin:center;animation:studioChainTension 7s ease-in-out infinite}
.chain-right rect{animation-direction:reverse;animation-delay:-.3s}
.atelier-padlock{animation:studioLockTension 7s ease-in-out infinite}
.atelier-padlock::before{animation:studioLockAura 7s ease-in-out infinite}
.lock-magic{transform-box:fill-box;transform-origin:center;animation:studioKeyPulse 7s ease-in-out infinite;filter:drop-shadow(0 0 5px #5ddcff)}
@keyframes studioChainTension{0%,100%{transform:translate(0,0) rotate(0)}30%{transform:translate(4px,1px) rotate(.3deg)}46%{transform:translate(-2px,-1px) rotate(-.25deg)}52%{transform:translate(1px,0) rotate(.1deg)}70%{transform:translate(0,0) rotate(0)}}
@keyframes studioLockTension{0%,100%{transform:rotate(-2deg) translateY(0)}30%{transform:rotate(2.2deg) translateY(2px)}46%{transform:rotate(-1.5deg) translateY(-1px)}56%{transform:rotate(.7deg) translateY(0)}75%{transform:rotate(-.8deg) translateY(1px)}}
@keyframes studioLockAura{0%,100%{opacity:.55;transform:scale(.96)}35%{opacity:1;transform:scale(1.07)}65%{opacity:.7;transform:scale(1)}}
@keyframes studioKeyPulse{0%,100%{opacity:.6;transform:scale(.9)}35%{opacity:1;transform:scale(1.3)}65%{opacity:.75;transform:scale(1)}}
.custom-lock-scene:not(.lock-visible) .chain-cross rect,.custom-lock-scene:not(.lock-visible) .atelier-padlock,.custom-lock-scene:not(.lock-visible) .atelier-padlock::before,.custom-lock-scene:not(.lock-visible) .lock-magic{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.chain-cross rect,.atelier-padlock,.atelier-padlock::before,.lock-magic{animation:none!important}}

.craft-policy-note{font-size:12px;line-height:1.8;color:#9aa8cd;margin:18px 0 0;max-width:65ch}
.craft-policy-note a{color:var(--cyan);text-underline-offset:4px}

/* Gwen's enchanted fabric frames the craft details without covering the copy. */
.craft-showcase{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 88% 50%,rgba(37,28,88,.18),transparent 65%),var(--void)}
.craft-showcase>.wrap{position:relative;z-index:1}
.craft-enchantment{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.craft-haze{position:absolute;width:72%;height:65%;border-radius:50%;filter:blur(42px);animation:craftMistBreathe 22s ease-in-out infinite alternate}
.craft-haze-cyan{right:-15%;top:5%;background:radial-gradient(ellipse,rgba(45,157,190,.16),transparent 68%)}
.craft-haze-violet{left:-25%;bottom:-15%;background:radial-gradient(ellipse,rgba(105,67,186,.16),transparent 68%);animation-delay:-11s}
.craft-stitchwork{position:absolute;inset:0;width:100%;height:100%;fill:none;opacity:.55}
.craft-silk-glow{stroke:#5ddcff;stroke-width:3;opacity:.15;filter:blur(5px)}
.craft-silk{stroke:url(#craftSilk);stroke-width:1;stroke-dasharray:2 10;stroke-linecap:round;opacity:.42;animation:craftSilkTravel 40s linear infinite}
.craft-arch-stitches{stroke:#aaa0e6;stroke-width:.8;stroke-dasharray:4 10;opacity:.13}
.craft-constellation{stroke:#9cdfff;stroke-width:1;opacity:.38;animation:craftStarBreathe 9s ease-in-out infinite alternate}
.craft-emblem{position:absolute;right:6%;top:35px;width:115px;height:160px;transform:rotate(30deg);opacity:.11;filter:drop-shadow(0 0 20px #5ddcff)}
.craft-emblem .scis{width:100%;height:100%}
#craft .feat li{border-radius:12px;transition:background .3s,transform .3s}
#craft .feat li:hover{background:linear-gradient(90deg,rgba(93,220,255,.045),transparent);transform:translateX(3px)}
#craft .cmp{background:rgba(8,11,31,.88);box-shadow:0 18px 70px rgba(0,0,0,.23),0 0 40px rgba(93,220,255,.035)}
.delivery-manifest{position:relative;margin-top:24px;padding:23px;border:1px solid rgba(148,139,233,.28);border-radius:22px;background:linear-gradient(140deg,rgba(25,28,64,.78),rgba(11,10,31,.88));box-shadow:inset 0 0 35px rgba(122,92,255,.035)}
.delivery-manifest::before{content:"";position:absolute;inset:6px;border:1px dashed rgba(164,164,217,.18);border-radius:16px;pointer-events:none}
.delivery-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.delivery-heading>span{font:700 9px/1.5 var(--sans);letter-spacing:.16em;color:var(--cyan)}
.delivery-heading>b{font:500 13px/1.5 var(--serif);color:#dcdcf8}
.delivery-files{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.delivery-files>div{position:relative;display:grid;gap:5px;padding:17px 13px;min-width:0;border:1px solid rgba(137,152,216,.16);border-radius:12px;background:rgba(6,8,24,.45);transition:border-color .3s,background .3s}
.delivery-files>div:hover{border-color:rgba(93,220,255,.5);background:rgba(25,28,62,.55)}
.delivery-type{font:700 9px/1.5 var(--sans);letter-spacing:.12em;color:#87dff4;margin-bottom:4px}
.delivery-files b{font-size:13px;color:#e4e8fb}.delivery-files small{font-size:11px;line-height:1.6;color:#99a7ca}
.delivery-manifest>p,.audio-delivery-note{font-size:12px;line-height:1.8;color:#9eaed0;margin-top:17px}
@keyframes craftMistBreathe{from{transform:translate(-8px,8px) scale(.96)}to{transform:translate(14px,-12px) scale(1.06)}}
@keyframes craftSilkTravel{to{stroke-dashoffset:-240}}
@keyframes craftStarBreathe{from{opacity:.2}to{opacity:.48}}
@media(max-width:700px){.craft-haze{filter:blur(25px);width:110%}.craft-emblem{right:-20px;top:55px;width:95px;opacity:.07}.craft-stitchwork{opacity:.3}.delivery-manifest{padding:20px}.delivery-heading{align-items:start;flex-direction:column;gap:5px}.delivery-files{gap:8px}.delivery-files>div{padding:13px 10px}}
@media(prefers-reduced-motion:reduce){.craft-haze,.craft-silk,.craft-constellation{animation:none}#craft .feat li,.delivery-files>div{transition:none}#craft .feat li:hover{transform:none}}

/* An embroidery hoop and oversized scissors form Gwen's quiet background seal. */
.craft-details{position:relative;isolation:isolate;min-width:0}
.craft-details>.cmp,.craft-details>.delivery-manifest,.craft-details>.craft-policy-note,.craft-details>.craft-film{position:relative;z-index:1}
.craft-sigil{position:absolute;left:50%;top:-200px;width:calc(100% + 180px);max-width:800px;aspect-ratio:1;transform:translateX(-50%);z-index:0;pointer-events:none}
.craft-sigil::before{content:"";position:absolute;inset:6%;border-radius:50%;background:radial-gradient(ellipse,rgba(93,220,255,.055),rgba(122,92,255,.04) 46%,transparent 72%);animation:sigilBreathing 12s ease-in-out infinite alternate}
.sigil-embroidery{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sigil-hoop{stroke:url(#sigilSilk);stroke-width:1.2;opacity:.24;filter:drop-shadow(0 0 7px rgba(93,220,255,.25))}
.sigil-inner{stroke:#aaa4e9;stroke-width:.7;opacity:.12}
.sigil-stitches{stroke:url(#sigilSilk);stroke-width:2;stroke-dasharray:2 12;opacity:.2}
.sigil-running-thread{stroke:#90e8ff;stroke-width:2.8;stroke-dasharray:2 98;stroke-linecap:round;opacity:.65;filter:drop-shadow(0 0 5px #5ddcff);animation:sigilStitchLight 30s linear infinite}
.sigil-lace{stroke:url(#sigilSilk);stroke-width:1;opacity:.19}
.sigil-gems{stroke:#a8dcff;stroke-width:1;fill:rgba(122,92,255,.12);opacity:.35;animation:sigilGemLight 8s ease-in-out infinite alternate}
.sigil-scissors{position:absolute;left:50%;top:12%;width:43%;height:55%;transform:translateX(-50%) rotate(28deg);opacity:.12;filter:drop-shadow(0 0 20px rgba(93,220,255,.25))}
.sigil-scissors .scis{width:100%;height:100%}
@keyframes sigilStitchLight{to{stroke-dashoffset:-100}}
@keyframes sigilBreathing{from{opacity:.65;transform:scale(.97)}to{opacity:1;transform:scale(1.025)}}
@keyframes sigilGemLight{from{opacity:.2}to{opacity:.48}}
@media(max-width:980px){.craft-sigil{top:-100px;width:calc(100% + 90px);max-width:720px}.sigil-scissors{opacity:.08}}
@media(max-width:700px){.craft-sigil{top:-65px;width:calc(100% + 70px)}.sigil-hoop{opacity:.17}.sigil-running-thread{opacity:.4}.sigil-scissors{opacity:.065}}
@media(prefers-reduced-motion:reduce){.craft-sigil::before,.sigil-running-thread,.sigil-gems,.sigil-scissors .h{animation:none!important}}

/* Let the embroidery seal read more clearly while the comparison stays in front. */
.sigil-hoop{opacity:.4;filter:drop-shadow(0 0 9px rgba(93,220,255,.38))}
.sigil-inner{opacity:.2}
.sigil-stitches{opacity:.34}
.sigil-running-thread{opacity:.85;stroke-width:3.2}
.sigil-lace{opacity:.3}
.sigil-gems{opacity:.5}
.sigil-scissors{opacity:.23;filter:drop-shadow(0 0 24px rgba(93,220,255,.4))}
.craft-sigil::before{background:radial-gradient(ellipse,rgba(93,220,255,.075),rgba(122,92,255,.055) 46%,transparent 72%)}
@keyframes sigilGemLight{from{opacity:.32}to{opacity:.64}}
@media(max-width:980px){.sigil-scissors{opacity:.15}}
@media(max-width:700px){.sigil-hoop{opacity:.3}.sigil-running-thread{opacity:.65}.sigil-scissors{opacity:.12}}

/* Snip to reveal replaces the three static animation stills. */
#craftFilm{display:block;margin-top:26px}
.snip-preview{border:1px solid rgba(140,151,214,.32);border-radius:22px;overflow:hidden;background:linear-gradient(145deg,#0e102e,#080919);box-shadow:0 15px 50px rgba(0,0,0,.2)}
.snip-preview-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px dashed rgba(154,160,214,.2);font:700 8px/1.6 var(--sans);letter-spacing:.12em;color:#9baacf}
.snip-silent{color:#77d6ed;white-space:nowrap}
.snip-window{position:relative;aspect-ratio:16/9;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 50%,#191a4b,#070a1d 80%)}
.snip-alert-slot{position:absolute;inset:10px 14px;z-index:1;opacity:0;transition:opacity .35s}
.snip-alert-slot .aa{height:100%;width:100%;aspect-ratio:auto;border-radius:12px;box-shadow:none;background:radial-gradient(ellipse at 50% 60%,rgba(80,40,122,.24),transparent 75%)}
.snip-fabric{position:absolute;top:0;bottom:0;width:50%;z-index:3;background:radial-gradient(ellipse at 50% 50%,rgba(63,47,110,.3),transparent 70%),repeating-linear-gradient(45deg,rgba(159,157,219,.035) 0 1px,transparent 1px 7px),#0c0d26;transition:transform 1s cubic-bezier(.25,.75,.3,1),opacity 1s}
.snip-fabric-left{left:0;border-right:1px dashed rgba(93,220,255,.6)}
.snip-fabric-right{right:0;border-left:1px dashed rgba(172,140,255,.45)}
.snip-closed-mark{position:absolute;left:50%;top:39%;width:70%;transform:translateX(-50%);z-index:4;text-align:center;transition:opacity .3s}
.snip-closed-mark>span{font:500 clamp(13px,1.5vw,20px)/1.5 var(--serif);letter-spacing:.09em;color:#c5c5e9}
.snip-closed-mark svg{width:100%;height:30px;margin-top:12px;filter:drop-shadow(0 0 4px rgba(93,220,255,.4))}
.snip-cut-scissors{position:absolute;z-index:5;left:50%;top:57%;width:52px;height:68px;transform:translate(-50%,-50%) rotate(90deg);filter:drop-shadow(0 0 9px rgba(93,220,255,.3))}
.snip-cut-scissors .scis{width:100%;height:100%}
.snip-mist{position:absolute;top:28%;width:65%;height:70%;z-index:6;border-radius:50%;opacity:0;pointer-events:none;filter:blur(22px)}
.snip-mist-one{left:-10%;background:radial-gradient(ellipse,rgba(93,220,255,.35),transparent 65%)}
.snip-mist-two{right:-10%;background:radial-gradient(ellipse,rgba(122,92,255,.4),transparent 65%)}
.snip-preview.is-cut .snip-cut-scissors{animation:snipLocalCut 1.1s ease-in-out both}
.snip-preview.is-cut .snip-cut-scissors .h-a{animation:snipA .6s ease-in-out both}
.snip-preview.is-cut .snip-cut-scissors .h-b{animation:snipB .6s ease-in-out both}
.snip-preview.is-cut .snip-mist{animation:snipMistBurst 1.8s ease-out both}
.snip-preview.is-revealed .snip-fabric-left{transform:translateX(-105%);opacity:0}
.snip-preview.is-revealed .snip-fabric-right{transform:translateX(105%);opacity:0}
.snip-preview.is-revealed .snip-closed-mark{opacity:0}
.snip-preview.is-revealed .snip-alert-slot{opacity:1}
.snip-preview-footer{position:relative;padding:20px;text-align:center;border-top:1px dashed rgba(154,160,214,.2)}
.snip-preview-footer .btn{min-width:190px;font-size:11px;gap:12px}
.snip-preview-footer .btn:disabled{opacity:.65;cursor:wait}
#craftFilm #snipStatus{font-size:12px;line-height:1.6;color:#a1afd1;margin:12px 0 0;min-height:20px}
@keyframes snipLocalCut{0%{transform:translate(-50%,-50%) rotate(90deg);opacity:1}45%{transform:translate(-50%,-60%) rotate(90deg);opacity:1}75%{transform:translate(40%,-60%) rotate(110deg);opacity:0}100%{transform:translate(40%,-60%) rotate(110deg);opacity:0}}
@keyframes snipMistBurst{0%{opacity:0;transform:scale(.8)}35%{opacity:.8;transform:scale(1.12)}100%{opacity:0;transform:scale(1.4)}}
@media(max-width:700px){.snip-preview-head{padding:14px 12px;font-size:7px;letter-spacing:.07em}.snip-window{aspect-ratio:16/10}.snip-cut-scissors{width:42px;height:55px}.snip-preview-footer{padding:18px 12px}.snip-alert-slot{inset:8px}.snip-closed-mark>span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.snip-fabric,.snip-closed-mark,.snip-alert-slot{transition:none}.snip-preview.is-cut .snip-cut-scissors,.snip-preview.is-cut .snip-cut-scissors .h,.snip-preview.is-cut .snip-mist{animation:none}.snip-preview.is-revealed .snip-cut-scissors{opacity:0}.snip-preview.is-revealed .snip-mist{opacity:0}}

/* Gwen's luminous studio gate forms the footer's signature backdrop. */
.foot{isolation:isolate;overflow:hidden;padding:90px 0 85px;background:radial-gradient(ellipse at 15% 55%,rgba(42,73,130,.15),transparent 55%),linear-gradient(160deg,#090b24,#05030c 75%)}
.foot>.wrap{position:relative;z-index:2}
.footer-enchantment{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.footer-portal{position:absolute;left:-85px;top:-15px;width:670px;height:560px;opacity:.65}
.footer-arch{stroke:url(#footerSilk);stroke-width:1.4;opacity:.45;filter:drop-shadow(0 0 8px rgba(93,220,255,.4))}
.footer-arch-stitches{stroke:#83d9fa;stroke-width:1.4;stroke-dasharray:.3 1.2;opacity:.4;animation:footerThreadFlow 38s linear infinite}
.footer-orbit{stroke:#b0a0eb;stroke-width:1;stroke-dasharray:2 10;opacity:.3}
.footer-orbit-light{stroke:#83e8ff;stroke-width:2;stroke-dasharray:3 97;stroke-linecap:round;filter:drop-shadow(0 0 6px #5ddcff);opacity:.8;animation:footerThreadFlow 28s linear infinite}
.footer-stars{stroke:#b1e8ff;stroke-width:1;opacity:.55;animation:footerStarsGlow 8s ease-in-out infinite alternate}
.footer-giant-scissors{position:absolute;left:90px;top:120px;width:230px;height:300px;transform:rotate(27deg);opacity:.15;filter:drop-shadow(0 0 25px rgba(93,220,255,.4));animation:footerScissorsFloat 12s ease-in-out infinite alternate}
.footer-giant-scissors .scis{width:100%;height:100%}
.footer-silk-trail{position:absolute;inset:0;width:100%;height:100%;opacity:.3}
.footer-silk-trail path{stroke:url(#footerSilk);stroke-width:1.2;stroke-dasharray:3 14;stroke-linecap:round;animation:footerSilkFlow 40s linear infinite}
.footer-magic-mist{position:absolute;left:-12%;top:5%;width:70%;height:100%;border-radius:50%;background:radial-gradient(ellipse,rgba(56,137,178,.14),rgba(122,92,255,.09) 42%,transparent 70%);filter:blur(30px);animation:footerMistBreathe 18s ease-in-out infinite alternate}
.foot-grid{gap:30px}
.foot h3{color:#c1c9ea}
.foot ul a{display:inline-block;transition:color .2s,transform .2s}
.foot ul a:hover{transform:translateX(3px)}
.footer-contact-pending{color:#8f9abd;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.footer-contact-pending small{font-size:8px;letter-spacing:.06em;border:1px dashed rgba(141,148,196,.3);border-radius:6px;padding:2px 5px;text-transform:uppercase}
.footer-update-card{padding:19px 17px;border:1px solid rgba(133,147,215,.32);border-radius:18px;background:linear-gradient(145deg,rgba(28,32,73,.8),rgba(9,11,32,.9));box-shadow:0 0 25px rgba(93,220,255,.06);position:relative}
.footer-update-card::before{content:"";position:absolute;inset:5px;border:1px dashed rgba(154,166,217,.2);border-radius:13px;pointer-events:none}
.footer-status{display:flex;align-items:center;gap:8px;font:700 9px/1.5 var(--sans);letter-spacing:.12em;color:#91ddf5}
.footer-status i{width:5px;height:5px;border-radius:50%;background:#5ddcff;box-shadow:0 0 9px #5ddcff;animation:footerStarsGlow 4s ease-in-out infinite alternate}
.footer-update-card p{font-size:12px;line-height:1.85;margin:12px 0 17px;color:#aab8d9}
.footer-shop-link{font:700 9px/1.8 var(--sans);letter-spacing:.07em;color:#b8eaff;text-decoration:none;display:inline-flex;gap:10px;align-items:center}
.footer-shop-link:hover{color:#fff}.footer-shop-link span{font-size:16px}
.foot .legal{color:#929dbe;padding-top:22px;position:relative}
@keyframes footerThreadFlow{to{stroke-dashoffset:-100}}
@keyframes footerSilkFlow{to{stroke-dashoffset:-240}}
@keyframes footerStarsGlow{from{opacity:.35}to{opacity:.8}}
@keyframes footerScissorsFloat{from{transform:translateY(0) rotate(25deg)}to{transform:translateY(-9px) rotate(30deg)}}
@keyframes footerMistBreathe{from{transform:scale(.97) translateX(-8px)}to{transform:scale(1.07) translateX(12px)}}
.foot:not(.footer-in-view) .footer-enchantment *,.foot:not(.footer-in-view) .footer-status i{animation-play-state:paused!important}
@media(max-width:980px){.footer-portal{left:-190px;opacity:.5}.footer-giant-scissors{left:-30px;opacity:.11}.foot{padding-bottom:105px}}
@media(max-width:700px){.foot{padding:75px 0 115px}.foot-grid{gap:32px 20px}.footer-portal{left:50%;transform:translateX(-50%);top:-10px;width:600px;height:510px;opacity:.65}.footer-giant-scissors{left:50%;margin-left:-95px;top:145px;width:190px;height:245px;opacity:.1}.footer-silk-trail{opacity:.2}.footer-magic-mist{width:140%;left:-20%;height:55%}.foot .legal{margin-top:36px;font-size:11px;line-height:1.8}.footer-update-card{max-width:450px}.footer-contact-pending{font-size:14px}}
@media(prefers-reduced-motion:reduce){.footer-enchantment *,.footer-status i{animation:none!important}.foot ul a{transition:none}.foot ul a:hover{transform:none}}

/* A cyan stitch, a violet halo and a clear place in Gwen's studio. */
.hdr .nav a{transition:color .25s,text-shadow .25s}
.hdr .nav a::after{border:0;height:2px;background:repeating-linear-gradient(90deg,#73e6ff 0 4px,transparent 4px 7px);filter:drop-shadow(0 0 4px rgba(93,220,255,.6));transition:transform .4s cubic-bezier(.2,.7,.25,1)}
.hdr .nav a:is(:hover,:focus-visible,.nav-active){color:#b6f4ff;text-shadow:0 0 13px rgba(93,220,255,.45)}
.hdr .nav a:is(:hover,:focus-visible,.nav-active)::after{transform:scaleX(1)}
.hdr .nav a::before{content:"";position:absolute;left:-10px;right:-10px;top:-3px;bottom:-3px;border-radius:12px;background:radial-gradient(ellipse,rgba(93,220,255,.09),rgba(122,92,255,.055) 40%,transparent 72%);z-index:-1;opacity:0;transition:opacity .3s;pointer-events:none}
.hdr .nav a:is(:hover,:focus-visible,.nav-active)::before{opacity:1}
.mnav a{position:relative;padding:5px 0;transition:color .25s,text-shadow .25s}
.mnav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:repeating-linear-gradient(90deg,#73e6ff 0 4px,transparent 4px 8px);transform:scaleX(0);transform-origin:left;transition:transform .3s;filter:drop-shadow(0 0 5px rgba(93,220,255,.5))}
.mnav a:is(:hover,:focus-visible,.nav-active){color:#aeeeff;text-shadow:0 0 16px rgba(93,220,255,.3)}
.mnav a:is(:hover,:focus-visible,.nav-active)::after{transform:scaleX(1)}
#soundBtn .sound-muted-mark{display:none}
#soundBtn[aria-pressed=true]{border-color:rgba(93,220,255,.42);box-shadow:inset 0 0 15px rgba(93,220,255,.065)}
#soundBtn[aria-pressed=true] svg{stroke:#b8efff}
#soundBtn[aria-pressed=false] .sound-muted-mark{display:block;stroke:#aaa5d6}
#soundBtn[aria-pressed=false] svg{stroke:#a3acc8}
#soundBtn::after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-radius:50%;background:#657296;border:1px solid #0b1027}
#soundBtn[aria-pressed=true]::after{background:#5ddcff;box-shadow:0 0 7px rgba(93,220,255,.65)}
#cartBtn.cart-added{animation:gwenCartGlow .8s ease-out both}
#cartBtn.cart-added svg{animation:gwenCartLift .65s ease-out both}
@keyframes gwenCartGlow{0%{box-shadow:0 0 0 rgba(93,220,255,0)}25%{border-color:#5ddcff;box-shadow:0 0 24px rgba(93,220,255,.45),0 0 36px rgba(122,92,255,.2)}100%{box-shadow:0 0 0 rgba(93,220,255,0)}}
@keyframes gwenCartLift{0%,100%{transform:translateY(0)}35%{transform:translateY(-3px) rotate(-5deg)}65%{transform:translateY(1px) rotate(3deg)}}
@media(prefers-reduced-motion:reduce){.hdr .nav a,.hdr .nav a::after,.hdr .nav a::before,.mnav a,.mnav a::after{transition:none}#cartBtn.cart-added,#cartBtn.cart-added svg{animation:none}#cartBtn.cart-added{border-color:#5ddcff;box-shadow:0 0 14px rgba(93,220,255,.25)}}

/* The hero title is stitched into view; the header seal stays softly present. */
.hero-copy .hero-title{position:relative;animation:none;text-shadow:none}
.hero-title-line{position:relative;display:block;width:fit-content;max-width:100%;white-space:nowrap;padding-bottom:.035em}
.hero-title-text{display:inline-block;color:#fff}
.hero-title-line>i{position:absolute;left:0;bottom:0;width:100%;height:1px;background:repeating-linear-gradient(90deg,#83e7ff 0 3px,transparent 3px 7px);box-shadow:0 0 10px rgba(93,220,255,.5);opacity:0;transform:scaleX(0);transform-origin:left;pointer-events:none}
.hero-title-animated .hero-title-line{animation:heroStitchEntrance 1.1s calc(var(--title-step)*.2s) cubic-bezier(.2,.7,.2,1) backwards}
.hero-title-animated .hero-title-line>i{animation:heroTitleThread 1.4s calc(var(--title-step)*.2s) ease-out both}
.hero-title-animated .hero-title-text{background:linear-gradient(105deg,#f8faff 0%,#f8faff 36%,#83e9ff 43%,#c6b8ff 49%,#fff 56%,#f8faff 67%,#f8faff 100%);background-size:300% 100%;background-position:100% 50%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:heroTitleLustre 10s calc(1.4s + var(--title-step)*.15s) ease-in-out infinite;filter:drop-shadow(0 0 16px rgba(93,220,255,.12))}
.hero-title-sparks{position:absolute;inset:-5% -3%;pointer-events:none;z-index:2}
.hero-title-sparks i{position:absolute;width:3px;height:3px;background:#a2edff;border-radius:50%;box-shadow:0 0 10px 2px rgba(93,220,255,.35);opacity:0}
.hero-title-sparks i:nth-child(1){left:7%;top:18%;--spark-delay:.25s}.hero-title-sparks i:nth-child(2){right:4%;top:48%;--spark-delay:.8s}.hero-title-sparks i:nth-child(3){left:40%;bottom:2%;--spark-delay:1.1s}.hero-title-sparks i:nth-child(4){right:16%;top:2%;--spark-delay:.55s}
.hero-title-animated .hero-title-sparks i{animation:heroTitleSpark 9s var(--spark-delay) ease-out infinite}
@keyframes heroStitchEntrance{from{opacity:0;transform:translateY(16px);clip-path:inset(0 100% 0 0);filter:blur(3px)}to{opacity:1;transform:translateY(0);clip-path:inset(0 0 0 0);filter:blur(0)}}
@keyframes heroTitleThread{0%{transform:scaleX(0);opacity:0}20%{opacity:.8}70%{transform:scaleX(1);opacity:.8}100%{transform:scaleX(1);opacity:0}}
@keyframes heroTitleLustre{0%,40%,100%{background-position:100% 50%}16%,26%{background-position:0% 50%}}
@keyframes heroTitleSpark{0%,24%,100%{opacity:0;transform:translateY(4px) scale(.5)}8%{opacity:.9;transform:translateY(-7px) scale(1)}20%{opacity:0;transform:translateY(-18px) scale(.3)}}
.hdr-logo{transform-origin:50% 0;opacity:1;filter:drop-shadow(0 0 9px rgba(93,220,255,.22));transition:opacity .45s,transform .45s,filter .35s}
.hdr-logo::before{content:"";position:absolute;inset:15%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,rgba(93,220,255,.14),rgba(122,92,255,.07) 45%,transparent 72%);filter:blur(8px);animation:headerSealBreathe 8s ease-in-out infinite alternate;pointer-events:none}
.hdr-logo::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 40%,rgba(187,247,255,.6) 48%,rgba(236,218,255,.7) 51%,transparent 59% 100%);background-size:300% 100%;mask:url("assets/gwen_logo-256.webp") center/contain no-repeat;-webkit-mask:url("assets/gwen_logo-256.webp") center/contain no-repeat;opacity:.8;animation:headerSealLustre 11s ease-in-out infinite;pointer-events:none}
/* The header logo is never shown above ~104 px, so it uses the 256 px file (44 KB instead of 232 KB). */
.hdr-logo{background-image:url("assets/gwen_logo-256.webp")}
.hdr-logo.logo-scrolled{opacity:.55;transform:scale(.88);filter:drop-shadow(0 0 5px rgba(93,220,255,.12))}
.hdr-logo:is(:hover,:focus-visible){opacity:1;transform:scale(1);filter:drop-shadow(0 0 14px rgba(93,220,255,.5))}
@keyframes headerSealBreathe{from{opacity:.45;transform:scale(.93)}to{opacity:.85;transform:scale(1.07)}}
@keyframes headerSealLustre{0%,35%,100%{background-position:100% 50%}14%,22%{background-position:0% 50%}}
@media(max-width:700px){.hero-title-sparks i{width:2px;height:2px}.hdr-logo.logo-scrolled{opacity:.55;transform:scale(.9)}}
@media(prefers-reduced-motion:reduce){.hero-title-animated .hero-title-line,.hero-title-animated .hero-title-line>i,.hero-title-animated .hero-title-text,.hero-title-animated .hero-title-sparks i,.hdr-logo::before,.hdr-logo::after{animation:none}.hero-title-animated .hero-title-text{background:none;color:#fff;filter:none}.hdr-logo{transition:none}}
.hdr-logo.logo-scrolled:is(:hover,:focus-visible){opacity:1;transform:scale(1)}

/* Gwen emerges from a transparent stitched portal, with no hard video edge. */
.hero-gwen-media{border-radius:32% 32% 20% 20%;-webkit-mask-image:radial-gradient(ellipse at 50% 46%,#000 25%,rgba(0,0,0,.92) 43%,transparent 73%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.25) 8%,#000 23%,#000 85%,transparent 100%);mask-image:radial-gradient(ellipse at 50% 46%,#000 25%,rgba(0,0,0,.92) 43%,transparent 73%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.25) 8%,#000 23%,#000 85%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
.gwen-thread-gate{position:absolute;left:50%;top:3%;width:94%;aspect-ratio:1;transform:translateX(-50%);z-index:0;pointer-events:none}
.gate-rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible;stroke:url(#heroGateSilk)}
.gate-outline{stroke-width:1.1;opacity:.3;filter:drop-shadow(0 0 7px rgba(93,220,255,.35))}
.gate-stitches{stroke-width:2;stroke-dasharray:3 10;opacity:.48;transform-origin:50% 50%;animation:heroGateTurn 70s linear infinite}
.gate-inner-stitches{stroke-width:1.1;stroke-dasharray:7 19;opacity:.28;transform-origin:50% 50%;animation:heroGateTurn 95s linear infinite reverse}
.gate-travelling-thread{stroke:#8be9ff;stroke-width:2.6;stroke-dasharray:3 97;stroke-linecap:round;opacity:.85;filter:drop-shadow(0 0 6px #5ddcff);animation:heroGateThread 24s linear infinite}
.gate-runes{stroke-width:1;fill:rgba(122,92,255,.04);opacity:.5}
.gate-sparks{stroke:#b7edff;stroke-width:1;opacity:.5;animation:heroGateSpark 8s ease-in-out infinite alternate}
.gate-mist{position:absolute;inset:-3%;border-radius:50%;background:radial-gradient(ellipse,transparent 40%,rgba(93,220,255,.065) 55%,rgba(122,92,255,.1) 63%,transparent 73%);filter:blur(12px);animation:heroGateBreathe 12s ease-in-out infinite alternate}
.gate-scissors{position:absolute;left:50%;top:-1%;width:46px;height:60px;transform:translateX(-50%) rotate(25deg);opacity:.65;filter:drop-shadow(0 0 9px rgba(93,220,255,.45))}
.gate-scissors .scis{width:100%;height:100%}
@keyframes heroGateTurn{to{transform:rotate(360deg)}}
@keyframes heroGateThread{to{stroke-dashoffset:-100}}
@keyframes heroGateSpark{from{opacity:.25}to{opacity:.7}}
@keyframes heroGateBreathe{from{transform:scale(.98);opacity:.65}to{transform:scale(1.03);opacity:1}}
@media(max-width:700px){.gwen-thread-gate{width:105%;top:6%}.gate-scissors{width:35px;height:46px;opacity:.5}.gate-stitches{opacity:.4}.gate-mist{filter:blur(9px)}}
@media(prefers-reduced-motion:reduce){.gate-stitches,.gate-inner-stitches,.gate-travelling-thread,.gate-sparks,.gate-mist,.gate-scissors .h{animation:none!important}}

/* A private local setup canvas with controllable transparent alert placement. */
.setup-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:14px}
.setup-eyebrow{font:700 8px/1.6 var(--sans);letter-spacing:.15em;color:var(--cyan)}
.setup-toolbar h3{font-size:23px;margin-top:6px}.setup-image-actions{display:flex;gap:8px;flex-wrap:wrap}.setup-image-actions button{font-size:9px}.setup-image-actions [hidden]{display:none}
.setup-file-status{font-size:11px;line-height:1.8;color:#99accd;margin-bottom:18px}
.setup-product-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.setup-product-row label{font-size:11px;color:#b9c9e7}.setup-product-row select{min-width:0;flex:1;border:1px solid rgba(129,149,215,.35);border-radius:11px;padding:11px 12px;background:#0d122e;color:#d9e7fb;font:500 12px var(--sans)}.setup-product-row select option{background:#0d122e}
#demoSetupBackground{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:0;background:#05030c}
#demoSetupBackground[hidden]{display:none}
#demoSc.has-setup-image>.sc-bg,#demoSc.has-setup-image>.sc-live,#demoSc.has-setup-image>.sc-view,#demoSc.has-setup-image>.sc-cam,#demoSc.has-setup-image>.sc-bar,#demoSc.has-setup-image>.sc-hud,#demoSc.has-setup-image>.sc-react{display:none}
#demoSc.has-setup-image{animation:none!important}
#demoSlot{touch-action:none;user-select:none;cursor:grab;border-radius:10px;outline:1px dashed transparent;transition:outline-color .2s}
#demoSlot:hover,#demoSlot.is-positioning{outline-color:rgba(93,220,255,.55)}
#demoSlot.is-positioning{cursor:grabbing}#demoSlot .aa{aspect-ratio:16/10;background:none}
.setup-adjustments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:17px;align-items:end;padding:15px;border-radius:13px;background:rgba(8,11,31,.6);border:1px dashed rgba(146,155,209,.25)}
.setup-adjustments label{font-size:10px;color:#aebcda}.setup-adjustments label>span{display:flex;gap:9px;align-items:center;margin-top:9px}.setup-adjustments input{min-width:0;width:100%;accent-color:#5ddcff;cursor:ew-resize}.setup-adjustments output{min-width:30px;font-size:10px;color:#8de4f6}.setup-adjustments button{grid-column:1/-1;justify-self:start;font-size:9px;padding:10px 14px}
.setup-preview-note{font-size:10px;line-height:1.85;color:#8ea0c2;margin-top:13px}
#demoCtl button:disabled{opacity:.35;cursor:not-allowed}.setup-from-product{margin-top:12px;font-size:10px}
@media(max-width:700px){.setup-toolbar h3{font-size:20px}.setup-product-row select{flex-basis:65%}.setup-adjustments{grid-template-columns:1fr;padding:13px}.setup-adjustments label>span{margin-top:5px}.setup-product-row .btn{font-size:9px}.setup-file-status{font-size:10px}}
@media(prefers-reduced-motion:reduce){#demoSlot{transition:none}}

#live{--live-a:#64dfff;--live-b:#8867ff;isolation:isolate;overflow:hidden}
#live[data-magic-col="hollow"]{--live-a:#47e8c5;--live-b:#956dff}
#live[data-magic-col="celestial"]{--live-a:#66ddff;--live-b:#377df4}
#live[data-magic-col="royal"]{--live-a:#ecc97e;--live-b:#b077ff}
#live[data-magic-col="arcane"]{--live-a:#37f2d5;--live-b:#ca69ef}
#live>.wrap{position:relative;z-index:1}
.live-magic{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.live-magic-haze{position:absolute;inset:8% -8%;background:radial-gradient(ellipse at 75% 40%,color-mix(in srgb,var(--live-a) 15%,transparent),transparent 48%),radial-gradient(ellipse at 25% 65%,color-mix(in srgb,var(--live-b) 18%,transparent),transparent 52%);animation:liveHaze 12s ease-in-out infinite alternate}
.live-magic-scissors{position:absolute;width:clamp(180px,26vw,410px);height:55%;right:2%;top:5%;opacity:.16;filter:drop-shadow(0 0 18px var(--live-a));transform:rotate(-23deg);animation:liveScissorFloat 10s ease-in-out infinite alternate}
.live-magic-scissors .scis{width:100%;height:100%;overflow:visible}
.live-magic-scissors .h{transform-origin:0 0}
.live-magic-scissors .h-a{animation:liveBlade 7s ease-in-out infinite}
.live-magic-scissors .h-b{animation:liveBlade 7s ease-in-out infinite reverse}
.live-magic-threads{position:absolute;inset:0;width:100%;height:100%;fill:none}
.live-thread-base{stroke:var(--live-b);stroke-width:1;stroke-dasharray:4 9;opacity:.32}
.live-thread-spark{stroke:var(--live-a);stroke-width:2;stroke-dasharray:1.5 98.5;stroke-linecap:round;filter:drop-shadow(0 0 5px var(--live-a));animation:liveThreadTravel 14s linear infinite}
.live-thread-spark:nth-of-type(4){animation-delay:-5s;animation-direction:reverse}
.live-thread-spark:nth-of-type(6){animation-delay:-8s}
.live-thread-spark:nth-of-type(8){animation-delay:-11s;animation-direction:reverse}
.live-magic-stars i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:var(--live-a);box-shadow:0 0 9px var(--live-a);animation:liveStar 4s ease-in-out var(--delay) infinite alternate}
.live-magic-wave{position:absolute;left:50%;top:50%;width:65%;height:55%;border:1px solid var(--live-a);border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.8)}
.live-magic-pulse .live-magic-wave{animation:liveWave 1.5s ease-out both}
#demoStream{box-shadow:0 0 45px color-mix(in srgb,var(--live-a) 7%,transparent);border-color:color-mix(in srgb,var(--live-a) 35%,#34335a);transition:border-color .6s,box-shadow .6s}
.live-magic *, .live-magic-scissors .h{animation-play-state:paused!important}
.live-magic-visible .live-magic *, .live-magic-visible .live-magic-scissors .h{animation-play-state:running!important}
@keyframes liveHaze{to{transform:translate(-3%,3%) scale(1.05);opacity:.7}}
@keyframes liveScissorFloat{to{transform:translateY(22px) rotate(-13deg)}}
@keyframes liveBlade{0%,35%,65%,100%{transform:rotate(-8deg)}45%,55%{transform:rotate(8deg)}}
@keyframes liveThreadTravel{to{stroke-dashoffset:-100}}
@keyframes liveStar{from{opacity:.18;transform:scale(.7)}to{opacity:.8;transform:scale(1.25)}}
@keyframes liveWave{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}20%{opacity:.35}100%{opacity:0;transform:translate(-50%,-50%) scale(1.6)}}
@media(max-width:700px){.live-magic-scissors{right:-45px;top:2%;height:350px;opacity:.13}.live-thread-base{opacity:.23}.live-thread-spark{opacity:.65}.live-magic-wave{width:95%;height:30%}}
@media(prefers-reduced-motion:reduce){.live-magic *, .live-magic-scissors .h{animation:none!important}#demoStream{transition:none}.live-magic-wave{display:none}}

/* Local stage magic leaves custom setup screenshots clean. */
#demoSc .atelier-room{animation:none!important}
.atelier-light{animation:atelierLight 9s ease-in-out infinite alternate}
.atelier-lamp{animation:atelierLamp 4s ease-in-out infinite alternate;filter:drop-shadow(0 0 7px #64dfff)}
.atelier-table-thread{animation:atelierThread 15s linear infinite}
.atelier-fx{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.atelier-fx i{position:absolute;left:50%;top:40%;width:.4cqw;height:1.4cqw;min-width:2px;background:var(--a,#64dfff);border-radius:50%;opacity:0;box-shadow:0 0 8px var(--a,#64dfff)}
.atelier-snip{position:absolute;right:4%;top:16%;width:5cqw;height:7cqw;opacity:0;filter:drop-shadow(0 0 9px #64dfff);transform:rotate(20deg)}
.atelier-snip .scis{width:100%;height:100%}
.live-magic-pulse .atelier-fx i{animation:atelierBurst 1.2s ease-out var(--delay) both}
.live-magic-pulse .atelier-snip{animation:atelierSnip 1.2s ease-out both}
.live-magic-pulse .atelier-snip .h-a{animation:liveBlade .6s ease-in-out 2}
.live-magic-pulse .atelier-snip .h-b{animation:liveBlade .6s ease-in-out 2 reverse}
#demoSc.has-setup-image .atelier-fx{display:none}
#live:not(.live-magic-visible) .atelier-room *{animation-play-state:paused}
@keyframes atelierLight{to{opacity:.45;transform:translateY(8px)}}
@keyframes atelierLamp{to{opacity:.5}}
@keyframes atelierThread{to{stroke-dashoffset:-100}}
@keyframes atelierBurst{0%{opacity:0;transform:rotate(var(--angle)) translateY(3cqw) scale(.5)}20%{opacity:.85}100%{opacity:0;transform:rotate(var(--angle)) translateY(var(--distance)) scale(.2)}}
@keyframes atelierSnip{0%{opacity:0;transform:translateY(8px) rotate(20deg)}25%,60%{opacity:.8}100%{opacity:0;transform:translateY(-12px) rotate(30deg)}}
@media(prefers-reduced-motion:reduce){.atelier-room *,.atelier-fx *{animation:none!important}.atelier-fx{display:none}}

.setup-stitched-title{position:relative;display:inline-block;padding-bottom:15px}
.setup-title-magic{position:absolute;inset:0;pointer-events:none}
.setup-title-thread{position:absolute;left:0;bottom:0;width:100%;height:15px;overflow:visible}
.setup-title-thread path{fill:none;stroke:#75e5ff;stroke-width:1.3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0;opacity:.55;filter:drop-shadow(0 0 3px #5ddcff)}
.setup-title-scissors{position:absolute;left:0;bottom:-8px;width:27px;height:35px;opacity:0;transform:translateX(-50%) rotate(50deg);filter:drop-shadow(0 0 5px #5ddcff)}
.setup-title-scissors .scis{width:100%;height:100%}
.setup-title-spark{position:absolute;right:0;bottom:6px;width:5px;height:5px;border-radius:50%;background:#ccf7ff;opacity:0;box-shadow:0 0 6px #5ddcff,0 0 14px #7a5cff}
.is-stitching .setup-title-thread path{animation:setupTitleStitch 2.2s ease-in-out both}
.is-stitching .setup-title-scissors{animation:setupTitleSnip 2.2s ease-in-out both}
.is-stitching .setup-title-scissors .h-a{animation:setupTitleBlade 2.2s ease-in-out both}
.is-stitching .setup-title-scissors .h-b{animation:setupTitleBlade 2.2s ease-in-out reverse both}
.is-stitching .setup-title-spark{animation:setupTitleSpark 2.2s ease-out both}
@keyframes setupTitleStitch{0%{stroke-dashoffset:100;opacity:.2}75%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.55}}
@keyframes setupTitleSnip{0%{left:0;opacity:0}10%{opacity:1}75%,88%{left:100%;opacity:1}100%{left:105%;opacity:0}}
@keyframes setupTitleBlade{0%,68%,100%{transform:rotate(-10deg)}76%,86%{transform:rotate(10deg)}}
@keyframes setupTitleSpark{0%,73%{opacity:0;transform:scale(.2)}80%{opacity:1;transform:scale(1.8)}100%{opacity:0;transform:scale(3.5)}}
@media(prefers-reduced-motion:reduce){.setup-title-magic *{animation:none!important}.setup-title-scissors,.setup-title-spark{display:none}}

/* Keep the stitched heading on its own line beneath the eyebrow. */
.setup-toolbar>div:first-child{display:flex;flex-direction:column;align-items:flex-start}
.setup-stitched-title{display:block;width:max-content;max-width:100%}


/* Gwen's luminous studio name in the stream HUD. */
#demoSc .sc-live{gap:.8cqw}
.demo-studio-name{position:relative;display:inline-block;letter-spacing:.12em;color:#b8edff;text-shadow:0 0 8px #5ddcff66;white-space:nowrap}
.demo-studio-name::after{content:"";position:absolute;left:0;right:0;bottom:-.5cqw;border-bottom:1px dashed #70dfff;opacity:.65}
.demo-studio-name::before{content:"";position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 25%,#a9f3ff66 48%,transparent 70%);background-size:250% 100%;mix-blend-mode:screen;animation:studioNameShine 7s ease-in-out infinite;pointer-events:none}
.live-magic-pulse .demo-studio-name{animation:studioNamePulse 1s ease-out}
#live:not(.live-magic-visible) .demo-studio-name::before{animation-play-state:paused}
@keyframes studioNameShine{0%,65%{background-position:180% 0;opacity:0}75%{opacity:1}100%{background-position:-80% 0;opacity:0}}
@keyframes studioNamePulse{35%{color:#fff;text-shadow:0 0 12px #5ddcff,0 0 18px #8867ff}}

/* A parallel atelier world behind the store. */
#store{isolation:isolate;overflow:hidden}
#store>.wrap{position:relative;z-index:1}
.store-world{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.store-world-nebula{position:absolute;inset:0;background:radial-gradient(ellipse at 12% 22%,#22678033,transparent 35%),radial-gradient(ellipse at 88% 60%,#582b9038,transparent 40%),radial-gradient(ellipse at 50% 90%,#1d536726,transparent 40%);animation:storeNebula 14s ease-in-out infinite alternate}
.store-world-portal{position:absolute;width:480px;aspect-ratio:1;border-radius:50%;border:1px solid #78dcff44;box-shadow:0 0 35px #5ddcff14,inset 0 0 35px #5ddcff14;animation:storePortal 65s linear infinite}
.store-world-portal::before{content:"";position:absolute;inset:18px;border:2px dashed #9f89ff55;border-radius:50%}
.store-world-portal::after{content:"✧";position:absolute;top:-18px;left:47%;color:#95e6ff;font-size:28px;text-shadow:0 0 12px #5ddcff}
.portal-one{left:-260px;top:110px;transform:rotate(-20deg)}
.portal-two{right:-260px;top:52%;width:540px;animation-direction:reverse;border-color:#a689ff44}
.store-world-scissors{position:absolute;right:3%;top:12px;width:150px;height:200px;opacity:.17;filter:drop-shadow(0 0 13px #5ddcff);transform:rotate(35deg);animation:storeScissors 10s ease-in-out infinite alternate}
.store-world-scissors .scis{width:100%;height:100%}
.store-world-scissors .h-a{animation:liveBlade 8s ease-in-out infinite}.store-world-scissors .h-b{animation:liveBlade 8s ease-in-out infinite reverse}
.store-world-threads{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#77cfff;stroke-width:1;stroke-dasharray:3 12;opacity:.26;animation:storeThread 30s linear infinite}
.store-world-stars i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;background:#9ddeff;border-radius:50%;box-shadow:0 0 9px #5ddcff;animation:liveStar 5s ease-in-out var(--delay) infinite alternate}
.store-world-title{position:relative;width:fit-content}
.store-world-title span{display:block}
.store-world-title i{position:absolute;left:0;right:0;bottom:-9px;height:2px;background:linear-gradient(90deg,#65dfff,#ac8aff);transform:scaleX(0);transform-origin:left;box-shadow:0 0 8px #5ddcff}
.store-world-title.title-awake span{animation:storeTitleReveal 1.5s ease-out both}
.store-world-title.title-awake i{animation:storeTitleThread 1.6s ease-out both}
.store-world *{animation-play-state:paused!important}
.world-visible .store-world *{animation-play-state:running!important}
@keyframes storeTitleReveal{0%{opacity:.25;transform:translateY(10px);filter:blur(5px)}65%{opacity:1;filter:blur(0);text-shadow:0 0 20px #66dfff77}100%{transform:none;text-shadow:0 0 8px #9077ff33}}
@keyframes storeTitleThread{0%{transform:scaleX(0);opacity:0}65%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:.4}}
@keyframes storePortal{to{transform:rotate(360deg)}}
@keyframes storeNebula{to{transform:scale(1.08) translateY(2%);opacity:.7}}
@keyframes storeThread{to{stroke-dashoffset:-300}}
@keyframes storeScissors{to{transform:translateY(16px) rotate(24deg)}}
@media(max-width:700px){.store-world-scissors{width:90px;height:120px;right:-10px;top:25px;opacity:.13}.portal-one{left:-365px}.portal-two{right:-430px}.store-world-threads{opacity:.17}.demo-studio-name{letter-spacing:.07em}}
@media(prefers-reduced-motion:reduce){.store-world *,.store-world-title span,.store-world-title i,.demo-studio-name,.demo-studio-name::before{animation:none!important}.store-world-title i{transform:scaleX(1);opacity:.4}}

/* The torn veil is confined to the outer store margin. */
.store-rift{position:absolute;left:-38px;top:390px;width:210px;height:660px;filter:drop-shadow(0 0 18px #5ddcff44);animation:riftBreathe 9s ease-in-out infinite alternate}
.rift-depth,.rift-starfield{position:absolute;inset:0;clip-path:polygon(49% 0,62% 9%,58% 16%,73% 26%,64% 36%,74% 48%,63% 61%,71% 72%,62% 87%,55% 100%,41% 96%,34% 85%,39% 73%,31% 62%,38% 49%,29% 36%,35% 26%,27% 17%,38% 8%)}
.rift-depth{background:radial-gradient(ellipse at 50% 50%,#07091e 15%,#332663 50%,#5ddcff66 80%,#b195ff99);box-shadow:inset 0 0 50px #67dfff77}
.rift-depth::before{content:"";position:absolute;inset:-20%;background:repeating-radial-gradient(ellipse at 48% 50%,transparent 0 28px,#8a78ff33 29px 31px,transparent 32px 52px);animation:riftDepth 15s ease-in-out infinite alternate}
.rift-starfield i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;background:#c9f7ff;box-shadow:0 0 8px #5ddcff;border-radius:50%;animation:riftStarDrift 8s ease-in-out var(--delay) infinite alternate}
.rift-seams{position:absolute;inset:0;width:100%;height:100%;fill:none}
.rift-edge{stroke:#8bdcff;stroke-width:1.3;opacity:.65}
.rift-edge-right{stroke:#b59aff}
.rift-running-stitch{stroke:#b9f5ff;stroke-width:2;stroke-dasharray:1 2;opacity:.7;filter:drop-shadow(0 0 4px #5ddcff);animation:riftStitch 18s linear infinite}
.rift-running-stitch:last-child{stroke:#bba3ff;animation-direction:reverse}
.rift-scissors{position:absolute;left:32%;top:18%;width:34px;height:46px;transform:rotate(145deg);filter:drop-shadow(0 0 7px #5ddcff);animation:riftScissorJourney 14s ease-in-out infinite alternate}
.rift-scissors .scis{width:100%;height:100%}
.rift-scissors .h-a{animation:liveBlade 3s ease-in-out infinite}.rift-scissors .h-b{animation:liveBlade 3s ease-in-out infinite reverse}
.rift-label{position:absolute;left:23px;top:45%;writing-mode:vertical-rl;font:600 8px var(--sans);letter-spacing:.3em;color:#80d9ef;opacity:.5}
#store:not(.world-visible) .store-rift,#store:not(.world-visible) .store-rift *{animation-play-state:paused!important}
@keyframes riftBreathe{to{transform:scaleX(1.1) translateX(4px);filter:drop-shadow(0 0 26px #9776ff66)}}
@keyframes riftDepth{to{transform:scale(1.4) rotate(8deg)}}
@keyframes riftStarDrift{from{opacity:.25;transform:translateY(-9px)}to{opacity:.9;transform:translateY(12px)}}
@keyframes riftStitch{to{stroke-dashoffset:-30}}
@keyframes riftScissorJourney{0%,15%{top:18%;transform:rotate(145deg)}85%,100%{top:72%;transform:rotate(160deg)}}
@media(max-width:1100px){.store-rift{left:-105px;width:190px;opacity:.7}.rift-label{display:none}}
@media(max-width:700px){.store-rift{top:250px;left:-113px;width:165px;height:540px;opacity:.55}.rift-scissors{width:25px;height:34px}}
@media(prefers-reduced-motion:reduce){.store-rift,.store-rift *,.rift-depth::before{animation:none!important}}

/* Gwen's notebook of stitched answers. */
#faq{isolation:isolate;overflow:hidden}
#faq>.wrap{position:relative;z-index:1}
.faq-pattern{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 15% 45%,#5ddcff0d,transparent 45%),radial-gradient(ellipse at 85% 60%,#8867ff18,transparent 45%)}
.faq-pattern>svg{width:100%;height:100%;fill:#5ddcff03;stroke:#8c8ccb;stroke-width:1;stroke-dasharray:4 10;opacity:.22}
.faq-pattern-scissors{position:absolute;right:8%;top:16%;width:110px;height:150px;opacity:.13;transform:rotate(-25deg);filter:drop-shadow(0 0 12px #5ddcff);animation:faqPatternFloat 12s ease-in-out infinite alternate}
.faq-pattern-scissors .scis{width:100%;height:100%}
#faq:not(.faq-visible) .faq-pattern-scissors{animation-play-state:paused}
#faqList{display:grid;gap:12px}
#faqList details{position:relative;border:1px solid #807cba33;border-radius:16px;background:linear-gradient(115deg,#11132bcc,#0a0a1dcc);box-shadow:0 5px 20px #03041022;transition:border-color .3s,box-shadow .3s,background .3s}
#faqList details::before{content:"";position:absolute;inset:7px;border:1px dashed #8994c52e;border-radius:11px;pointer-events:none}
#faqList summary{position:relative;padding:23px 22px;gap:16px;font-size:clamp(15px,1.5vw,19px)}
#faqList summary::after{margin-left:auto;width:29px;height:29px;font-size:19px}
.faq-stitch-number{flex:none;font:600 10px var(--sans);color:#72d5ee;letter-spacing:.1em;opacity:.7}
#faqList summary:focus-visible{outline:2px solid #80e5ff;outline-offset:4px;border-radius:16px}
#faqList details:hover{border-color:#83d6f766}
#faqList details[open]{border-color:#79dbff66;background:linear-gradient(115deg,#162440bb,#17132dcc);box-shadow:0 0 25px #5ddcff10}
#faqList p{padding:0 62px 27px;max-width:unset;font-size:14px;line-height:1.9;color:#bfcae3}
#faqList details[open] p{animation:faqAnswerUnfold .45s ease-out both}
.faq-snip{position:absolute;right:67px;top:10px;width:27px;height:36px;opacity:0;pointer-events:none;filter:drop-shadow(0 0 6px #5ddcff)}
.faq-snip .scis{width:100%;height:100%}
.faq-cut .faq-snip{animation:faqSnip .9s ease-out both}
.faq-cut .faq-snip .h-a{animation:liveBlade .45s ease-in-out 2}
.faq-cut .faq-snip .h-b{animation:liveBlade .45s ease-in-out 2 reverse}
.faq-cut::before{animation:faqStitchGlow 1s ease-out}
.faq-thread-title{position:relative;width:fit-content;margin-inline:auto}
.faq-title-reveal{animation:faqTitleThread 1.4s ease-out both}
@keyframes faqAnswerUnfold{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
@keyframes faqSnip{0%{opacity:0;transform:translateX(-12px) rotate(35deg)}25%,60%{opacity:.9}100%{opacity:0;transform:translateX(12px) rotate(55deg)}}
@keyframes faqStitchGlow{30%{border-color:#85e9ff;box-shadow:inset 0 0 14px #5ddcff22}100%{border-color:#8994c52e}}
@keyframes faqTitleThread{from{opacity:.3;filter:blur(4px);text-shadow:0 0 25px #5ddcff}65%{opacity:1;filter:blur(0);text-shadow:0 0 18px #5ddcff88}to{text-shadow:0 0 6px #8867ff44}}
@keyframes faqPatternFloat{to{transform:translateY(20px) rotate(-15deg)}}
@media(max-width:700px){#faqList summary{padding:21px 16px;gap:10px}#faqList p{padding:0 20px 24px;font-size:13px}.faq-stitch-number{font-size:9px}.faq-snip{right:54px;top:2px;width:21px;height:29px}.faq-pattern-scissors{right:-25px;width:95px;height:125px;opacity:.1}}
@media(prefers-reduced-motion:reduce){.faq-pattern-scissors,.faq-title-reveal,#faqList details[open] p,.faq-cut .faq-snip,.faq-cut .faq-snip .h,.faq-cut::before{animation:none!important}#faqList details{transition:none}.faq-snip{display:none}}

/* Hover reveals the cutter; opening waits briefly for the thread to part. */
#faqList summary{isolation:isolate}
#faqList details:hover,#faqList details:focus-within{box-shadow:0 0 24px #5ddcff19;border-color:#78e1ff88}
#faqList summary::after{transition:transform .3s,box-shadow .3s,background .3s}
#faqList details:hover summary::after,#faqList details:focus-within summary::after{box-shadow:0 0 13px #5ddcff44;background:#5ddcff18}
#faqList .faq-snip{transition:opacity .2s,transform .2s;z-index:2}
#faqList details:not([open]):hover .faq-snip,#faqList details:not([open]):focus-within .faq-snip{opacity:.85;transform:rotate(30deg)}
.faq-seal-thread{position:absolute;left:48px;right:65px;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,#6fddff,#ab8aff,transparent);opacity:0;transform:scaleX(.7);pointer-events:none;box-shadow:0 0 7px #5ddcff;transform-origin:right}
#faqList details:hover .faq-seal-thread,#faqList details:focus-within .faq-seal-thread{opacity:.6}
.faq-cut-spark{position:absolute;right:78px;top:22px;width:5px;height:5px;border-radius:50%;background:#e5fbff;box-shadow:0 0 9px #5ddcff,0 0 20px #b694ff;opacity:0;pointer-events:none}
#faqList .faq-unsealing .faq-snip{animation:faqPreCut .48s ease-in-out both}
#faqList .faq-unsealing .faq-snip .h-a{animation:liveBlade .24s ease-in-out 2}
#faqList .faq-unsealing .faq-snip .h-b{animation:liveBlade .24s ease-in-out 2 reverse}
.faq-unsealing .faq-seal-thread{animation:faqThreadPart .48s ease-out both}
.faq-unsealing .faq-cut-spark{animation:faqCutSpark .48s ease-out both}
#faqList .faq-unsealing{border-color:#a2edff;box-shadow:0 0 28px #5ddcff22}
#faqList .faq-resealing .faq-seal-thread{animation:faqThreadReturn .58s ease-out both}
#faqList .faq-cut .faq-snip{animation:none;opacity:0}
@keyframes faqPreCut{0%{opacity:1;transform:translateX(-12px) rotate(25deg)}60%{opacity:1;transform:translateX(0) rotate(50deg)}100%{opacity:0;transform:translateX(10px) rotate(55deg)}}
@keyframes faqThreadPart{0%{opacity:.9;transform:scaleX(1)}60%{opacity:1;transform:scaleX(.9)}100%{opacity:0;transform:scaleX(0)}}
@keyframes faqCutSpark{0%,40%{opacity:0;transform:scale(.2)}65%{opacity:1;transform:scale(2)}100%{opacity:0;transform:scale(4)}}
@keyframes faqThreadReturn{0%{opacity:0;transform:scaleX(0)}65%{opacity:1;transform:scaleX(1)}100%{opacity:.3;transform:scaleX(1)}}
@media(max-width:700px){.faq-seal-thread{left:35px;right:54px}.faq-cut-spark{right:64px;top:16px}}
@media(prefers-reduced-motion:reduce){.faq-unsealing *,.faq-resealing *{animation:none!important}.faq-seal-thread,.faq-cut-spark{display:none}}

/* Fade decorative atmospheres into one shared page base at section boundaries. */
.store-world,.live-magic,.faq-pattern,.craft-enchantment{
 -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 120px,#000 calc(100% - 120px),transparent 100%);
 mask-image:linear-gradient(to bottom,transparent 0,#000 120px,#000 calc(100% - 120px),transparent 100%);
}
.craft-showcase{background:var(--void)}
.hero{background:radial-gradient(60% 55% at 70% 42%,#171d62 0,transparent 70%),radial-gradient(55% 35% at 6% 80%,#220f5e 0,transparent 70%),var(--void)}
.hero .floor,.hero .hmist{
 -webkit-mask-image:linear-gradient(to bottom,#000 50%,transparent 100%);
 mask-image:linear-gradient(to bottom,#000 50%,transparent 100%);
}
.foot{background:var(--void)}
.foot::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 15% 55%,rgba(42,73,130,.15),transparent 55%),linear-gradient(160deg,#090b24,#05030c 75%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 130px);mask-image:linear-gradient(to bottom,transparent,#000 130px)}
.footer-magic{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 100px);mask-image:linear-gradient(to bottom,transparent,#000 100px)}
@media(max-width:700px){.store-world,.live-magic,.faq-pattern,.craft-enchantment{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 85px,#000 calc(100% - 85px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 85px,#000 calc(100% - 85px),transparent)}}

/* Let rules and footer atmosphere fade without masking their content. */
.studio-rules{background:var(--void)}
.studio-rules::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 75% 45%,rgba(77,46,148,.2),transparent 60%),radial-gradient(ellipse at 5% 80%,rgba(53,156,186,.09),transparent 55%);mask-image:linear-gradient(to bottom,transparent,#000 120px,#000 calc(100% - 120px),transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 120px,#000 calc(100% - 120px),transparent)}
.footer-enchantment{mask-image:linear-gradient(to bottom,transparent,#000 100px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 100px)}
.hero{background:radial-gradient(60% 55% at 70% 42%,#171d62 0,transparent 70%),radial-gradient(55% 35% at 6% 65%,#220f5e 0,transparent 70%),var(--void)}


/* A visible sweep precedes the measured height animation. */
#faqList .faq-unsealing .faq-snip{right:auto;left:48px;top:auto;bottom:-5px;width:32px;height:43px;animation:faqSeamSweep .7s ease-in-out both}
#faqList .faq-unsealing .faq-snip .h-a{animation:liveBlade .35s ease-in-out 2}
#faqList .faq-unsealing .faq-snip .h-b{animation:liveBlade .35s ease-in-out 2 reverse}
.faq-unsealing .faq-seal-thread{transform-origin:left;animation:faqSeamCut .7s ease-in-out both}
.faq-unsealing .faq-cut-spark{top:auto;bottom:8px;animation:faqCutSpark .7s ease-out both}
#faqList details[open] p{animation:none}
#faqList .faq-unfolding p{animation:faqFabricFall .5s ease-out both}
#faqList .faq-folding p{animation:faqFabricFold .42s ease-in both}
#faqList .faq-resealing .faq-seal-thread{animation:faqThreadReturn .42s ease-out both}
@keyframes faqSeamSweep{0%{left:48px;opacity:0;transform:rotate(65deg)}12%{opacity:1}80%{left:calc(100% - 95px);opacity:1;transform:rotate(65deg)}100%{left:calc(100% - 80px);opacity:0;transform:rotate(90deg)}}
@keyframes faqSeamCut{0%{opacity:1;transform:scaleX(1)}20%{opacity:1;transform:scaleX(.95)}85%{opacity:.7;transform:scaleX(.05)}100%{opacity:0;transform:scaleX(0)}}
@keyframes faqFabricFall{from{opacity:0;transform:translateY(-14px);filter:blur(2px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes faqFabricFold{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-10px)}}
@media(max-width:700px){#faqList .faq-unsealing .faq-snip{width:25px;height:34px}}
@media(prefers-reduced-motion:reduce){#faqList .faq-unfolding p,#faqList .faq-folding p{animation:none!important}}

/* Lower sections share the same visible global mist rather than covering it. */
.craft-showcase,.studio-rules,.foot{background:transparent}
.foot::before{background:radial-gradient(ellipse at 15% 55%,rgba(42,73,130,.15),transparent 55%),radial-gradient(ellipse at 70% 40%,rgba(28,30,90,.16),transparent 70%);mask-image:linear-gradient(to bottom,transparent,#000 130px,#000 calc(100% - 80px),transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 130px,#000 calc(100% - 80px),transparent)}


/* A shadow portal absorbs and returns Gwen's scissors on a calm cycle. */
#reviews{position:relative;isolation:isolate;overflow:hidden}
#reviews>.wrap{position:relative;z-index:1}
.review-vortex{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 110px,#000 calc(100% - 110px),transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 110px,#000 calc(100% - 110px),transparent)}
.review-vortex-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 9% 50%,#47338d38,transparent 45%),radial-gradient(ellipse at 85% 70%,#2c7c9520,transparent 45%);animation:reviewVortexHaze 12s ease-in-out infinite alternate}
.review-vortex-eye{position:absolute;left:-70px;top:24%;width:400px;height:400px;border-radius:50%;background:radial-gradient(ellipse,#02040bbf 0 19%,#16133299 34%,#6c4ca433 48%,transparent 70%)}
.review-vortex-ring{position:absolute;inset:12%;border-radius:50%;border:1px solid #7ccefa55;box-shadow:0 0 25px #5ddcff18,inset 0 0 25px #986dff18;transform:rotate(-25deg) scaleY(.75);animation:reviewVortexRing 16s linear infinite}
.review-vortex-ring::before{content:"";position:absolute;inset:10px;border:1px dashed #a78aff66;border-radius:50%}
.review-vortex-ring::after{content:"";position:absolute;left:50%;top:-3px;width:5px;height:5px;border-radius:50%;background:#a7efff;box-shadow:0 0 9px #5ddcff}
.review-vortex-ring.ring-inner{inset:23%;animation-direction:reverse;animation-duration:23s;opacity:.6}
.review-vortex-shadow{position:absolute;left:38%;top:30%;width:105px;height:140px;filter:drop-shadow(0 0 13px #8b7dff);animation:reviewShadowReturn 12s ease-in-out infinite}
.review-vortex-shadow .scis{width:100%;height:100%}
.review-vortex-shadow .h-a{animation:liveBlade 6s ease-in-out infinite}.review-vortex-shadow .h-b{animation:liveBlade 6s ease-in-out infinite reverse}
.review-vortex-wave{position:absolute;inset:15%;border:1px solid #9deaff;border-radius:50%;opacity:0;animation:reviewReturnWave 12s ease-out infinite}
.review-vortex-mote{position:absolute;left:50%;top:50%;width:3px;height:3px;border-radius:50%;background:#a5e9ff;box-shadow:0 0 8px #5ddcff;animation:reviewMotePull 4.5s linear var(--delay) infinite}
.review-vortex-threads{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#9b8cdb;stroke-width:1;stroke-dasharray:4 12;opacity:.2;animation:reviewThreadDrift 28s linear infinite}
.review-vortex *{animation-play-state:paused!important}
.vortex-visible .review-vortex *{animation-play-state:running!important}
@keyframes reviewShadowReturn{0%,15%{opacity:.42;transform:translate(-12px,4px) rotate(-25deg) scale(1)}42%,55%{opacity:0;transform:translate(0,8px) rotate(125deg) scale(.06)}70%{opacity:.5;transform:translate(0,0) rotate(-30deg) scale(1.08)}85%,100%{opacity:.42;transform:translate(-12px,4px) rotate(-25deg) scale(1)}}
@keyframes reviewReturnWave{0%,58%{opacity:0;transform:scale(.35)}65%{opacity:.35}82%,100%{opacity:0;transform:scale(1.5)}}
@keyframes reviewMotePull{0%{opacity:0;transform:rotate(var(--angle)) translateX(var(--travel)) scale(1)}20%{opacity:.65}90%{opacity:.35}100%{opacity:0;transform:rotate(calc(var(--angle) + 110deg)) translateX(8px) scale(.2)}}
@keyframes reviewVortexRing{to{transform:rotate(335deg) scaleY(.75)}}
@keyframes reviewVortexHaze{to{opacity:.6;transform:translateY(12px) scale(1.05)}}
@keyframes reviewThreadDrift{to{stroke-dashoffset:-240}}
@media(max-width:1100px){.review-vortex-eye{left:-160px;opacity:.75}}
@media(max-width:700px){.review-vortex-eye{left:-175px;top:10%;width:330px;height:330px;opacity:.6}.review-vortex-shadow{width:85px;height:115px}.review-vortex-threads{opacity:.13}}
@media(prefers-reduced-motion:reduce){.review-vortex *{animation:none!important}.review-vortex-mote,.review-vortex-wave{display:none}.review-vortex-shadow{opacity:.3;transform:rotate(-25deg)}}

/* Stitched sample letters, hung in Gwen's atelier. */
#rvGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:stretch;padding-top:35px}
#rvGrid .review-letter{position:relative;margin-top:0;min-width:0;padding:22px 18px 20px;gap:17px;border:1px solid color-mix(in srgb,var(--a) 30%,#35314e);border-radius:22px 22px 18px 18px;background:linear-gradient(145deg,#15152dcc,#090b1edb);box-shadow:0 12px 38px #02020c55;transform-origin:50% -20px;transition:transform .4s,border-color .4s,box-shadow .4s;isolation:isolate}
.review-letter::before{content:"";position:absolute;inset:7px;border:1px dashed color-mix(in srgb,var(--a) 23%,transparent);border-radius:16px;pointer-events:none;z-index:-1}
#rvGrid .review-letter:hover,#rvGrid .review-letter:focus-visible{transform:translateY(-5px) rotate(-.7deg);border-color:var(--a);box-shadow:0 15px 45px #02020c66,0 0 25px color-mix(in srgb,var(--a) 15%,transparent)}
#rvGrid .review-letter:nth-child(2):hover,#rvGrid .review-letter:nth-child(2):focus-visible{transform:translateY(-5px) rotate(.7deg)}
.review-letter-hangers{position:absolute;left:21%;right:21%;height:50px;top:-44px;display:flex;justify-content:space-between;pointer-events:none}
.review-letter-hangers i{width:1px;height:100%;background:linear-gradient(transparent,color-mix(in srgb,var(--a) 65%,transparent));box-shadow:0 0 5px color-mix(in srgb,var(--a) 20%,transparent)}
.review-letter-clip{position:absolute;left:50%;top:-27px;transform:translateX(-50%) rotate(15deg);width:29px;height:39px;filter:drop-shadow(0 0 6px var(--a));pointer-events:none}
.review-letter-clip .scis{width:100%;height:100%}
.review-letter:hover .review-letter-clip .h-a,.review-letter:focus .review-letter-clip .h-a{animation:liveBlade 1s ease-in-out}
.review-letter:hover .review-letter-clip .h-b,.review-letter:focus .review-letter-clip .h-b{animation:liveBlade 1s ease-in-out reverse}
.review-letter-label{font:600 8px var(--sans);letter-spacing:.16em;color:var(--a);opacity:.8}
#rvGrid .review-letter .sc{width:100%;aspect-ratio:16/9;border-radius:12px}
#rvGrid .review-letter blockquote{position:relative;isolation:isolate;font:500 clamp(17px,1.35vw,20px)/1.5 var(--serif);padding:7px 3px;letter-spacing:.01em}
.review-letter blockquote::before{content:"“";position:absolute;left:-3px;top:-28px;font:120px/1 var(--serif);color:var(--a);opacity:.09;z-index:-1;pointer-events:none}
#rvGrid .review-letter .who{margin-top:auto;padding-top:14px;border-top:1px dashed color-mix(in srgb,var(--a) 25%,transparent)}
.review-letter .who i{box-shadow:0 0 15px color-mix(in srgb,var(--a) 15%,transparent);border:1px solid color-mix(in srgb,var(--a) 45%,transparent)}
@media(max-width:900px){#rvGrid{grid-template-columns:1fr;gap:48px}#rvGrid .review-letter{max-width:620px;width:100%;margin-inline:auto}#rvGrid .review-letter blockquote{font-size:20px}}
@media(max-width:700px){#rvGrid .review-letter{padding:22px 16px 18px}#rvGrid .review-letter blockquote{font-size:18px}}
@media(prefers-reduced-motion:reduce){#rvGrid .review-letter{transition:none}#rvGrid .review-letter:hover,#rvGrid .review-letter:focus-visible{transform:none}.review-letter-clip .h{animation:none!important}}

/* Gwen-colored lettering and travelling seams. */
.review-magic-title{position:relative;width:fit-content;padding-bottom:14px}
.review-magic-title>span{display:block;color:#e7edff;background:linear-gradient(110deg,#e7edff 15%,#79e4ff 30%,#bd9aff 47%,#e7edff 64%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 8px #7a5cff22);animation:reviewTitleShine 9s ease-in-out infinite}
.review-title-thread{position:absolute;left:0;bottom:0;width:100%;height:18px;overflow:visible}
.review-title-thread path{fill:none;stroke:#8adeff;stroke-width:1.2;stroke-dasharray:100;stroke-dashoffset:0;opacity:.45;filter:drop-shadow(0 0 4px #5ddcff)}
.review-title-cutter{position:absolute;left:0;bottom:-8px;width:29px;height:39px;opacity:0;filter:drop-shadow(0 0 7px #5ddcff);pointer-events:none}
.review-title-cutter .scis{width:100%;height:100%}
.review-title-stitching .review-title-thread path{animation:reviewTitleDraw 2.4s ease-in-out both}
.review-title-stitching .review-title-cutter{animation:reviewTitleCut 2.4s ease-in-out both}
.review-title-stitching .review-title-cutter .h-a{animation:liveBlade .4s ease-in-out 6}
.review-title-stitching .review-title-cutter .h-b{animation:liveBlade .4s ease-in-out 6 reverse}
#reviews:not(.vortex-visible) .review-magic-title>span{animation-play-state:paused}
@keyframes reviewTitleShine{0%,40%{background-position:100% 0}80%,100%{background-position:0 0}}
@keyframes reviewTitleDraw{0%{stroke-dashoffset:100;opacity:.2}80%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.45}}
@keyframes reviewTitleCut{0%{left:0;opacity:0;transform:rotate(65deg)}10%{opacity:1}85%{left:calc(100% - 20px);opacity:1;transform:rotate(65deg)}100%{left:100%;opacity:0;transform:rotate(90deg)}}
/* Stronger glow belongs to the hovered card only. */
#rvGrid .review-letter:hover,#rvGrid .review-letter:focus-visible{transform:translateY(-9px) rotate(-1deg);box-shadow:0 22px 48px #02020c88,0 0 35px color-mix(in srgb,var(--a) 27%,transparent),inset 0 0 24px color-mix(in srgb,var(--a) 8%,transparent)}
#rvGrid .review-letter:nth-child(2):hover,#rvGrid .review-letter:nth-child(2):focus-visible{transform:translateY(-9px) rotate(1deg)}
.review-letter-aura{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--a) 20%,transparent),transparent 65%);opacity:0;transition:opacity .4s}
.review-letter:hover .review-letter-aura,.review-letter:focus-visible .review-letter-aura{opacity:1}
.review-letter-orbit{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:2px;background:conic-gradient(from 0deg,transparent 0 60%,var(--a) 74%,#e3faff 78%,var(--b) 83%,transparent 94%);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;opacity:0}
.review-letter:hover .review-letter-orbit,.review-letter:focus-visible .review-letter-orbit{opacity:.9;animation:reviewBorderPulse 2.8s ease-in-out infinite}
.review-letter:hover .review-letter-hangers i,.review-letter:focus-visible .review-letter-hangers i{box-shadow:0 0 10px var(--a);background:linear-gradient(transparent,var(--a))}
.review-letter-sparks{position:absolute;left:50%;top:-9px;pointer-events:none}
.review-letter-sparks i{position:absolute;width:3px;height:3px;border-radius:50%;background:#e4faff;box-shadow:0 0 8px var(--a);opacity:0}
.letter-flourish .review-letter-sparks i{animation:reviewClipSpark .8s ease-out var(--delay) both}
@keyframes reviewClipSpark{0%{opacity:0;transform:rotate(var(--angle)) translateX(2px)}25%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateX(32px) scale(.2)}}
@keyframes reviewBorderPulse{0%,100%{filter:hue-rotate(0deg) brightness(1);opacity:.65}50%{filter:hue-rotate(35deg) brightness(1.4);opacity:1}}
@media(prefers-reduced-motion:reduce){.review-magic-title>span,.review-title-thread path,.review-title-cutter,.review-title-cutter .h,.review-letter-orbit,.review-letter-sparks i{animation:none!important}.review-title-cutter,.review-letter-sparks{display:none}.review-letter-aura{transition:none}#rvGrid .review-letter:hover,#rvGrid .review-letter:focus-visible,#rvGrid .review-letter:nth-child(2):hover,#rvGrid .review-letter:nth-child(2):focus-visible{transform:none}}

@property --review-border-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.review-letter-orbit{background:conic-gradient(from var(--review-border-angle),transparent 0 60%,var(--a) 74%,#e3faff 78%,var(--b) 83%,transparent 94%)}
.review-letter:hover .review-letter-orbit,.review-letter:focus-visible .review-letter-orbit{animation:reviewBorderTravel 3s linear infinite}
@keyframes reviewBorderTravel{to{--review-border-angle:360deg}}
@media(prefers-reduced-motion:reduce){.review-letter:hover .review-letter-orbit,.review-letter:focus-visible .review-letter-orbit{animation:none!important}}


/* A weaving loom lives behind the chains; custom ordering remains closed. */
#custom{position:relative;isolation:isolate;overflow:hidden}
.custom-loom{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 130px,#000 calc(100% - 130px),transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 130px,#000 calc(100% - 130px),transparent)}
.loom-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 22% 40%,#6152aa33,transparent 48%),radial-gradient(ellipse at 70% 60%,#3cb8d01a,transparent 45%)}
.loom-canvas{position:absolute;width:80%;height:780px;left:-8%;top:70px;opacity:.5;filter:drop-shadow(0 0 6px #5ddcff33);transform:rotate(-8deg)}
.loom-frame{stroke:#9280bd;stroke-width:3;opacity:.25}
.loom-warp{stroke:#81dbf5;stroke-width:.8;opacity:.3}
.loom-weft{stroke:#b191ff;stroke-width:1;stroke-dasharray:420;animation:loomWeave 12s ease-in-out infinite}
.loom-alert{stroke:#91eaff;stroke-width:2;stroke-dasharray:370;animation:loomAlertForm 12s ease-in-out infinite;filter:drop-shadow(0 0 9px #8067ff)}
.loom-to-lock{stroke:#92ddff;stroke-width:1.5;stroke-dasharray:4 24;opacity:0;animation:loomReturn 12s linear infinite}
.loom-shuttle{animation:loomShuttle 6s ease-in-out infinite alternate;opacity:.6}
.loom-motes i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;background:#b7efff;border-radius:50%;box-shadow:0 0 9px #5ddcff;animation:loomMote 7s ease-in-out var(--delay) infinite}
.custom-loom *{animation-play-state:paused!important}
.loom-visible .custom-loom *{animation-play-state:running!important}
.loom-charged .atelier-padlock{filter:drop-shadow(0 0 24px #5ddcff99) drop-shadow(0 0 35px #a385ff66)}
.loom-charged .lock-stitch{box-shadow:0 0 14px #5ddcff}
.loom-charged .loom-canvas{opacity:.7;filter:drop-shadow(0 0 12px #5ddcff55)}
.loom-canvas,.atelier-padlock{transition:filter .4s,opacity .4s}
@keyframes loomWeave{0%{stroke-dashoffset:420;opacity:.15}40%,65%{stroke-dashoffset:0;opacity:.45}100%{stroke-dashoffset:-420;opacity:0}}
@keyframes loomAlertForm{0%,20%{stroke-dashoffset:370;opacity:0}50%,65%{stroke-dashoffset:0;opacity:.8}100%{stroke-dashoffset:-370;opacity:0;transform:translate(12px,-3px)}}
@keyframes loomReturn{0%,60%{opacity:0;stroke-dashoffset:0}72%{opacity:.6}100%{opacity:0;stroke-dashoffset:-180}}
@keyframes loomShuttle{to{transform:translate(360px,0)}}
@keyframes loomMote{0%{opacity:0;transform:translate(0,0)}30%{opacity:.6}100%{opacity:0;transform:translate(110px,70px) scale(.2)}}
@media(max-width:700px){.loom-canvas{width:150%;left:-55%;top:150px;height:660px;opacity:.35}.loom-charged .loom-canvas{opacity:.5}}
@media(prefers-reduced-motion:reduce){.custom-loom *{animation:none!important}.loom-canvas,.atelier-padlock{transition:none}.loom-weft{opacity:.2}.loom-alert{opacity:.3}.loom-to-lock,.loom-motes{display:none}}

/* Clearly shaped magical fabric sits at the edge, instead of a grid behind text. */
.loom-canvas.enchanted-fabric{width:340px;height:550px;left:-30px;top:200px;opacity:.8;transform:rotate(-9deg);filter:drop-shadow(0 0 18px #5ddcff22)}
.fabric-floating{transform-origin:50% 50%;animation:fabricFloat 9s ease-in-out infinite alternate}
.fabric-hem{animation:fabricHem 24s linear infinite}
.fabric-emblem{animation:fabricEmblemWeave 12s ease-in-out infinite;filter:drop-shadow(0 0 8px #89ccff)}
.fabric-heart{animation:fabricHeart 12s ease-in-out infinite;filter:drop-shadow(0 0 8px #5ddcff)}
.fabric-unravelling{animation:fabricUnravel 12s ease-in-out infinite;opacity:0}
.loom-charged .loom-canvas.enchanted-fabric{opacity:1;filter:drop-shadow(0 0 24px #8d7dff55)}
@keyframes fabricFloat{to{transform:translate(12px,-14px) rotate(5deg)}}
@keyframes fabricHem{to{stroke-dashoffset:-100}}
@keyframes fabricEmblemWeave{0%,10%{stroke-dashoffset:400;opacity:.15;fill:transparent}45%,65%{stroke-dashoffset:0;opacity:1;fill:#7b68d522}90%,100%{stroke-dashoffset:-400;opacity:0;fill:transparent}}
@keyframes fabricHeart{0%,30%,90%,100%{opacity:0}50%,65%{opacity:.9}}
@keyframes fabricUnravel{0%,60%{opacity:0;stroke-dashoffset:0}75%{opacity:.85}100%{opacity:0;stroke-dashoffset:-200}}
@media(min-width:1700px){.loom-canvas.enchanted-fabric{left:4%;width:390px;height:630px;top:160px}}
@media(max-width:1100px){.loom-canvas.enchanted-fabric{left:-90px;width:290px;height:470px;top:200px;opacity:.65}}
@media(max-width:700px){.loom-canvas.enchanted-fabric{left:-110px;width:260px;height:420px;top:115px;opacity:.6}.loom-charged .loom-canvas.enchanted-fabric{opacity:.75}}
@media(prefers-reduced-motion:reduce){.fabric-floating,.fabric-hem,.fabric-emblem,.fabric-heart,.fabric-unravelling{animation:none!important}.fabric-emblem{opacity:.6}.fabric-unravelling{display:none}}

/* Blue-violet metal links continue across the complete locked section. */
.custom-chains{left:50%;top:0;max-width:none;transform:translateX(-50%);overflow:visible;opacity:.92;filter:drop-shadow(0 4px 5px #02030b) drop-shadow(0 0 5px #6e78c422)}
.chain-magic-glint{animation:chainStudioGlint 10s linear infinite;pointer-events:none;filter:drop-shadow(0 0 3px #5ddcff)}
.chain-right .chain-magic-glint{animation-direction:reverse;animation-delay:-4s;stroke:#b49cff}
.custom-lock-scene:not(.lock-visible) .chain-magic-glint{animation-play-state:paused}
@keyframes chainStudioGlint{from{stroke-dashoffset:1900}to{stroke-dashoffset:-1900}}
@media(max-width:700px){.custom-chains{top:0;left:50%;transform:translateX(-50%);opacity:.88}.chain-magic-glint{opacity:.35}}
@media(prefers-reduced-motion:reduce){.chain-magic-glint{animation:none!important;opacity:.2}}

#showcase{position:relative;isolation:isolate;overflow:hidden}
#showcase>.wrap{position:relative;z-index:1}
#wall{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}
#wall .wall-card{display:block;padding:0;min-width:0;translate:none;transform:none;border:1px solid #8c86bd44;background:#0b1025;text-align:left;color:#e5eaff;overflow:hidden;box-shadow:0 8px 24px #02030a44}
#wall .wall-card:hover,#wall .wall-card:focus-visible{transform:translateY(-6px);z-index:2;box-shadow:0 0 23px color-mix(in srgb,var(--a) 20%,transparent);border-color:var(--a)}
#wall .wall-card .aa{border-radius:0}
.gallery-caption{display:block;padding:12px 14px;font:600 12px var(--sans);letter-spacing:.03em}
#wall .wall-card[hidden]{display:none}
.gallery-doll-world{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;mask-image:linear-gradient(transparent,#000 110px,#000 calc(100% - 110px),transparent);-webkit-mask-image:linear-gradient(transparent,#000 110px,#000 calc(100% - 110px),transparent)}
.gallery-doll-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 7% 40%,#438ba532,transparent 40%),radial-gradient(ellipse at 85% 70%,#7652bd22,transparent 40%)}
.gallery-gwen-doll{position:absolute;left:-25px;top:230px;width:235px;height:360px;opacity:.38;filter:drop-shadow(0 0 18px #68dfff22)}
.doll-floating{animation:galleryDollFloat 8s ease-in-out infinite alternate}
.gallery-doll-scissors{position:absolute;left:112px;top:438px;width:45px;height:60px;opacity:.4;transform:rotate(-30deg);filter:drop-shadow(0 0 8px #5ddcff)}
.gallery-doll-scissors .scis{width:100%;height:100%}
.gallery-doll-thread{position:absolute;left:-100px;top:480px;width:450px;height:240px;border:1px dashed #8deaff44;border-radius:50%;transform:rotate(-20deg);animation:galleryThread 25s linear infinite}
#showcase:not(.gallery-visible) .gallery-doll-world *{animation-play-state:paused}
@keyframes galleryDollFloat{to{transform:translateY(-12px) rotate(3deg);transform-origin:center}}
@keyframes galleryThread{to{transform:rotate(340deg)}}
@media(max-width:700px){#wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.gallery-caption{font-size:10px;padding:10px}.gallery-gwen-doll{left:-95px;width:190px;top:140px;opacity:.25}.gallery-doll-scissors{left:20px;top:370px;opacity:.25}}
@media(prefers-reduced-motion:reduce){.doll-floating,.gallery-doll-thread{animation:none!important}#wall .wall-card{transition:none}}

/* A stitched memory of Gwen, framed by floating toys and thread. */
.gallery-doll-art{position:absolute;left:-45px;top:160px;width:345px;height:530px;overflow:hidden;border-radius:45% 45% 22px 22px / 24% 24% 4% 4%;transform:rotate(-7deg);opacity:.65;border:1px solid #83c6ee55;box-shadow:0 0 30px #5ddcff19;background:#10172e;mask-image:linear-gradient(#000 65%,transparent);-webkit-mask-image:linear-gradient(#000 65%,transparent)}
.gallery-doll-art img{width:100%;height:100%;object-fit:cover;object-position:38% 50%;filter:saturate(.75) brightness(.7)}
.gallery-doll-art::after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#223d7330,#4b2c7044);pointer-events:none}
.gallery-art-stitches{position:absolute;inset:10px;border:1px dashed #a4dbef99;border-radius:inherit;z-index:1}
.gallery-doll-scissors{left:165px;top:600px;z-index:1;opacity:.45}
.gallery-doll-thread{display:none}
.gallery-toybox{position:absolute;inset:0}
.gallery-spool{position:absolute;left:30px;top:690px;width:95px;height:68px;border-radius:8px;background:repeating-linear-gradient(0deg,#5c81b066 0 2px,#26365d88 2px 5px);transform:rotate(18deg);box-shadow:0 0 20px #5ddcff13;opacity:.65}
.gallery-spool::before,.gallery-spool::after{content:"";position:absolute;left:-10px;right:-10px;height:15px;border-radius:50%;border:1px solid #9f8ac599;background:#292b4a}
.gallery-spool::before{top:-7px}.gallery-spool::after{bottom:-7px}
.gallery-button{position:absolute;width:35px;height:35px;border-radius:50%;background:radial-gradient(circle,#292549,#141d36);border:1px solid #9ab2db88;display:grid;grid-template-columns:repeat(2,4px);gap:5px;place-content:center;box-shadow:inset 0 0 0 4px #8996be22,0 0 12px #5ddcff15;opacity:.5;animation:galleryToyFloat 9s ease-in-out var(--toy-delay) infinite alternate}
.gallery-button i{width:4px;height:4px;border-radius:50%;background:#090c1d}
.button-0{left:8%;top:15%}.button-1{right:4%;top:20%;width:47px;height:47px}.button-2{right:7%;top:58%}.button-3{left:2%;bottom:15%}.button-4{right:14%;bottom:8%;width:27px;height:27px}
.gallery-connecting-thread{position:absolute;inset:0;width:100%;height:100%;fill:none}
.gallery-thread-base{stroke:#8f80cb;stroke-width:1;stroke-dasharray:3 10;opacity:.2}
.gallery-thread-current{stroke:var(--gallery-thread-color,#7ddfff);stroke-width:2;stroke-dasharray:4 96;opacity:0;filter:drop-shadow(0 0 5px #5ddcff)}
.gallery-thread-awake .gallery-thread-current{animation:galleryThreadSignal 1.8s ease-out both}
@keyframes galleryToyFloat{to{transform:translateY(-14px) rotate(25deg)}}
@keyframes galleryThreadSignal{0%{stroke-dashoffset:0;opacity:0}20%{opacity:.8}100%{stroke-dashoffset:-100;opacity:0}}
#showcase:not(.gallery-visible) .gallery-toybox *{animation-play-state:paused}
@media(min-width:1700px){.gallery-doll-art{left:1%;width:390px;height:580px}.gallery-spool{left:8%}}
@media(max-width:1100px){.gallery-doll-art{left:-125px;width:300px;height:470px;opacity:.5}.gallery-spool{left:-30px}.gallery-doll-scissors{left:95px}}
@media(max-width:700px){.gallery-doll-art{left:-155px;top:100px;width:265px;height:420px;opacity:.4}.gallery-doll-scissors{left:25px;top:460px}.gallery-spool{top:510px;left:-35px;transform:scale(.7) rotate(18deg)}.gallery-button{opacity:.3}}
@media(prefers-reduced-motion:reduce){.gallery-button,.gallery-thread-current{animation:none!important}}

.gallery-doll-art{top:330px;opacity:.52}
@media(max-width:700px){.gallery-doll-art{top:320px;opacity:.32}}


/* Cool the supplied artwork with presentation filters, preserving the source file. */
.gallery-doll-art img{filter:saturate(.5) brightness(.62) contrast(1.07)}
.gallery-doll-art::after{background:linear-gradient(135deg,#23547788,#5f389b77 55%,#13365466);mix-blend-mode:color}
.gallery-doll-art::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(110deg,#58dfff13,transparent 45%,#9a72ff1f)}
.gallery-pattern-play{position:absolute;inset:0;pointer-events:none}
.gallery-pattern-piece{position:absolute;width:115px;height:155px;fill:#28274d55;stroke:#a19bd477;stroke-width:1;opacity:.55;filter:drop-shadow(0 0 12px #5ddcff13);animation:galleryPatternFloat 11s ease-in-out infinite alternate}
.piece-one{right:-24px;top:34%;transform:rotate(18deg)}
.piece-two{left:-22px;bottom:12%;width:95px;height:130px;animation-delay:-5s;transform:rotate(-20deg)}
.pattern-stitch{fill:none;stroke:#83ddff;stroke-dasharray:3 5;opacity:.5}
.pattern-symbol{fill:#8e78e511;stroke:#a8b8ee;opacity:.55}
.gallery-floating-needle{position:absolute;right:5%;bottom:8%;width:70px;height:180px;fill:#46658a66;stroke:#afcee777;stroke-width:1.1;opacity:.55;transform:rotate(30deg);animation:galleryNeedleFloat 13s ease-in-out infinite alternate}
.needle-thread{fill:none;stroke:#8adfff;stroke-dasharray:4 8;opacity:.45;animation:galleryNeedleThread 15s linear infinite;animation-play-state:paused}
.gallery-scissor-constellation{position:absolute;left:95px;top:810px;width:100px;height:135px;filter:drop-shadow(0 0 9px #80cfff);pointer-events:none}
.gallery-scissor-constellation>.scis{width:100%;height:100%;opacity:0;animation:galleryScissorsForm 14s ease-in-out infinite}
.gallery-scissor-constellation i{position:absolute;left:50%;top:50%;width:3px;height:3px;background:#bddfff;border-radius:50%;box-shadow:0 0 6px #5ddcff;animation:galleryConstellationMote 14s ease-in-out var(--delay) infinite}
@keyframes galleryPatternFloat{to{translate:0 -18px;rotate:8deg}}
@keyframes galleryNeedleFloat{to{transform:translate(-7px,-15px) rotate(20deg)}}
@keyframes galleryNeedleThread{to{stroke-dashoffset:-180}}
@keyframes galleryScissorsForm{0%,25%,85%,100%{opacity:0;transform:scale(.7) rotate(-15deg)}45%,65%{opacity:.45;transform:scale(1) rotate(10deg)}}
@keyframes galleryConstellationMote{0%,100%{opacity:.1;transform:rotate(var(--orbit)) translateX(55px)}40%,65%{opacity:.65;transform:rotate(var(--orbit)) translateX(12px)}85%{opacity:0;transform:rotate(var(--orbit)) translateX(70px)}}
#showcase:not(.gallery-visible) .gallery-pattern-play *{animation-play-state:paused}
@media(max-width:700px){.gallery-pattern-piece{width:80px;height:110px;opacity:.35}.piece-one{right:-40px}.piece-two{left:-45px}.gallery-floating-needle{right:-25px;width:50px;opacity:.3}.gallery-scissor-constellation{left:-30px;top:820px;opacity:.7}}
@media(prefers-reduced-motion:reduce){.gallery-pattern-play *{animation:none!important}.gallery-scissor-constellation>.scis{opacity:.25}.gallery-scissor-constellation i{display:none}}

/* Embroidery, bobbins and paper patterns occupy the header's empty side. */
#showcase .reveal-h{display:flex;justify-content:space-between;align-items:center;gap:30px}
#showcase .reveal-h>div:first-child{position:relative;z-index:1}
.gallery-header-hoop{position:relative;flex:0 0 300px;height:260px;margin-right:5%;pointer-events:none;filter:drop-shadow(0 0 18px #665ba333);animation:galleryHoopFloat 11s ease-in-out infinite alternate}
.hoop-embroidery{width:100%;height:100%}
.hoop-hanging-thread{position:absolute;left:50%;top:-65px;width:1px;height:97px;background:linear-gradient(transparent,#8d9dd477)}
.hoop-scissors{position:absolute;left:39%;top:29%;width:68px;height:100px;transform:rotate(-20deg);opacity:.65;filter:drop-shadow(0 0 8px #5ddcff)}
.hoop-scissors .scis{width:100%;height:100%}
.hoop-scissors .h-a{animation:liveBlade 7s ease-in-out infinite}.hoop-scissors .h-b{animation:liveBlade 7s ease-in-out infinite reverse}
.hoop-needle-thread{animation:galleryNeedleThread 18s linear infinite;animation-play-state:paused}
.hoop-stitch-label{position:absolute;left:0;right:0;bottom:37px;text-align:center;font:600 7px var(--sans);letter-spacing:.2em;color:#91c9e3;opacity:.7}
.hoop-spark{position:absolute;left:77%;top:35%;width:4px;height:4px;background:#b8f3ff;border-radius:50%;box-shadow:0 0 9px #5ddcff;animation:liveStar 3s ease-in-out infinite alternate}
.gallery-mini-spool{position:absolute;width:32px;height:43px;border-radius:6px;background:repeating-linear-gradient(0deg,#52668988 0 2px,#21264188 2px 5px);border-top:5px solid #8477a077;border-bottom:5px solid #8477a077;opacity:.6;animation:galleryToyFloat 10s ease-in-out infinite alternate}
.mini-spool-one{left:20%;top:145px;transform:rotate(-20deg)}
.mini-spool-two{right:10%;top:95px;transform:rotate(25deg);animation-delay:-5s}
.gallery-header-pattern{position:absolute;right:20%;top:65px;width:100px;height:80px;opacity:.5;transform:rotate(-15deg);animation:galleryToyFloat 12s ease-in-out infinite alternate}
#showcase:not(.gallery-visible) .gallery-header-hoop,#showcase:not(.gallery-visible) .gallery-header-hoop *{animation-play-state:paused}
@keyframes galleryHoopFloat{to{transform:translateY(-10px) rotate(3deg)}}
@media(max-width:980px){.gallery-header-hoop{flex-basis:220px;height:210px;margin-right:0}.hoop-scissors{width:50px;height:76px}.hoop-stitch-label{font-size:6px;bottom:26px}}
@media(max-width:700px){#showcase .reveal-h{display:block}.gallery-header-hoop{width:185px;height:165px;margin:28px auto 10px}.hoop-scissors{width:42px;height:65px}.hoop-stitch-label{bottom:18px;font-size:5px}.hoop-hanging-thread{top:-25px;height:50px}.gallery-header-pattern{right:-30px;top:180px;opacity:.3}.mini-spool-one{left:5%;top:100px}.mini-spool-two{right:5%;top:170px}}
@media(prefers-reduced-motion:reduce){.gallery-header-hoop,.gallery-header-hoop *,.gallery-mini-spool,.gallery-header-pattern{animation:none!important}}

/* Shared stitched glow: one entrance, calm resting color, intentional hover replay. */
h2.gwen-section-title{position:relative;width:fit-content;max-width:100%;padding-bottom:15px;animation:none!important}
.gwen-section-title .gwen-heading-copy{display:block;background:linear-gradient(110deg,#e9f5ff 0 22%,#80e4ff 36%,#c1a0ff 49%,#e9f5ff 66% 100%);background-size:280% 100%;background-position:100% 0;background-clip:text;-webkit-background-clip:text;color:#e8f2ff;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 7px #8c71ff30);transition:filter .35s}
.gwen-section-title:hover .gwen-heading-copy{filter:drop-shadow(0 0 11px #79dfff66) drop-shadow(0 0 17px #9577ff33)}
.gwen-heading-seam{position:absolute;left:0;bottom:0;width:min(100%,280px);height:13px;pointer-events:none}
.gwen-heading-seam svg{width:100%;height:100%;overflow:visible}
.gwen-heading-seam path{fill:none;stroke:#88dfff;stroke-width:1.2;stroke-dasharray:100;stroke-dashoffset:0;opacity:.42;filter:drop-shadow(0 0 3px #5ddcff)}
.gwen-heading-seam i{position:absolute;right:0;bottom:4px;width:4px;height:4px;border-radius:50%;background:#d2f8ff;box-shadow:0 0 8px #5ddcff,0 0 13px #a085ff;opacity:0}
.gwen-heading-enter .gwen-heading-copy{animation:gwenHeadingLustre 2s ease-in-out both}
.gwen-heading-enter .gwen-heading-seam path{animation:gwenHeadingDraw 1.8s ease-in-out both}
.gwen-heading-enter .gwen-heading-seam i{animation:gwenHeadingSpark 2s ease-out both}
.gwen-section-title+.stitch-u{display:none}
.faq-h .gwen-section-title{margin-inline:auto}
.faq-h .gwen-heading-seam{left:50%;transform:translateX(-50%)}
@keyframes gwenHeadingLustre{0%{background-position:100% 0;filter:drop-shadow(0 0 3px #8c71ff22)}55%{filter:drop-shadow(0 0 13px #79dfff66)}100%{background-position:0 0;filter:drop-shadow(0 0 7px #8c71ff30)}}
@keyframes gwenHeadingDraw{0%{stroke-dashoffset:100;opacity:.15}80%{stroke-dashoffset:0;opacity:.9}100%{stroke-dashoffset:0;opacity:.42}}
@keyframes gwenHeadingSpark{0%,72%{opacity:0;transform:scale(.2)}82%{opacity:1;transform:scale(1.7)}100%{opacity:0;transform:scale(3)}}
@media(max-width:700px){.gwen-heading-seam{width:min(100%,220px)}}
@media(prefers-reduced-motion:reduce){.gwen-section-title *{animation:none!important}.gwen-section-title .gwen-heading-copy{transition:none}.gwen-heading-seam i{display:none}}

/* A sealed oath sits behind the readable terms. */
.studio-rules>.wrap{position:relative;z-index:1}
.rules-oath-magic{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;mask-image:linear-gradient(transparent,#000 130px,#000 calc(100% - 130px),transparent);-webkit-mask-image:linear-gradient(transparent,#000 130px,#000 calc(100% - 130px),transparent)}
.rules-oath-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 12% 55%,#435da32b,transparent 45%),radial-gradient(ellipse at 85% 55%,#7650ab29,transparent 45%)}
.rules-oath-scissors{position:absolute;left:-70px;top:10%;width:360px;height:470px;transform:rotate(35deg);opacity:.19;filter:drop-shadow(0 0 18px #5ddcff44)}
.rules-oath-scissors .scis{width:100%;height:100%}
.rules-oath-stitches{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#9b9dd9;stroke-width:1;stroke-dasharray:1 2;opacity:.18}
.rules-oath-wave{position:absolute;right:3%;top:20%;width:65%;height:60%;border:1px solid #8ce8ff;border-radius:50%;opacity:0;transform:scale(.7)}
.oath-sealing .rules-oath-scissors{animation:rulesOathStamp 1.8s ease-in-out both}
.oath-sealing .rules-oath-scissors .h-a{animation:rulesOathBlade 1.8s ease-in-out both}
.oath-sealing .rules-oath-scissors .h-b{animation:rulesOathBlade 1.8s ease-in-out reverse both}
.oath-sealing .rules-oath-wave{animation:rulesOathWave 2s ease-out both}
.oath-sealing .rules-oath-stitches path{animation:rulesOathThread 2s ease-out both}
.rules-panel{border-color:#9696d466;box-shadow:0 20px 80px #00000038,0 0 45px #7461ff14,inset 0 0 24px #5ddcff05}
.oath-sealing .rules-panel::before{animation:rulesPanelSeal 2s ease-out both}
#rulesTitle .gwen-heading-copy{filter:drop-shadow(0 0 12px #7b81ff55)}
.rule-card{transition:border-color .3s,box-shadow .3s,background .3s}
.rule-card h3{color:#e5f1ff;text-shadow:0 0 7px #91a6ff30}
.rule-num{color:#86e8ff;text-shadow:0 0 10px #5ddcff66}
.rule-card:hover,.rule-card:focus-within{border-color:#7cdaff66;box-shadow:0 0 19px #5ddcff13;background:linear-gradient(120deg,#172b4033,#28204433)}
.rule-card:hover h3{color:#f4f8ff;text-shadow:0 0 10px #9e8fff55}
.rule-card:hover .rule-num{color:#d8f9ff;text-shadow:0 0 13px #5ddcff}
.rule-card p{color:#bec9e2}
@keyframes rulesOathStamp{0%{transform:translateY(-45px) rotate(45deg);opacity:.1}55%{transform:translateY(12px) rotate(25deg);opacity:.3}70%{transform:translateY(-4px) rotate(33deg)}100%{transform:rotate(35deg);opacity:.19}}
@keyframes rulesOathBlade{0%,30%,100%{transform:rotate(-8deg)}52%,65%{transform:rotate(9deg)}}
@keyframes rulesOathWave{0%,45%{opacity:0;transform:scale(.6)}60%{opacity:.35}100%{opacity:0;transform:scale(1.6)}}
@keyframes rulesOathThread{0%,35%{stroke-dashoffset:100;opacity:0}75%{stroke-dashoffset:0;opacity:.45}100%{stroke-dashoffset:0;opacity:.18}}
@keyframes rulesPanelSeal{0%,40%{border-color:#8591cd42}65%{border-color:#a4eaff;box-shadow:inset 0 0 20px #5ddcff18}100%{border-color:#8591cd66}}
@media(min-width:1800px){.rules-oath-scissors{left:4%;width:400px;height:520px}}
@media(max-width:700px){.rules-oath-scissors{left:-110px;top:6%;width:260px;height:340px;opacity:.13}.rules-oath-wave{right:-20%;top:40%;width:140%;height:40%}.rules-oath-stitches{opacity:.13}}
@media(prefers-reduced-motion:reduce){.rules-oath-magic *,.oath-sealing .rules-panel::before{animation:none!important}.rules-oath-wave{display:none}.rule-card{transition:none}}

/* A recurring oath snip and a shadow gate on the right. */
.oath-sealing .rules-oath-scissors{animation:rulesOathStamp 7s ease-in-out infinite}
.oath-sealing .rules-oath-scissors .h-a{animation:rulesOathBlade 7s ease-in-out infinite}
.oath-sealing .rules-oath-scissors .h-b{animation:rulesOathBlade 7s ease-in-out infinite reverse}
.oath-sealing .rules-oath-wave{animation:rulesOathWave 7s ease-out infinite}
#cta:not(.oath-visible) .rules-oath-magic *{animation-play-state:paused}
.rules-shadow-portal{position:absolute;right:-100px;top:18%;width:330px;height:460px;border-radius:50%;background:radial-gradient(ellipse,#040614cc 18%,#25203a88 42%,#7966bd26 57%,transparent 72%);opacity:.7}
.rules-shadow-portal span{position:absolute;inset:15%;border:1px dashed #a39ae366;border-radius:50%;box-shadow:0 0 24px #5ddcff13;animation:rulesShadowTurn 30s linear infinite}
.rules-shadow-portal i{position:absolute;inset:24%;border:1px solid #8fd7e744;border-radius:50%;animation:rulesShadowBreathe 8s ease-in-out infinite alternate}
@keyframes rulesShadowTurn{to{transform:rotate(360deg)}}
@keyframes rulesShadowBreathe{to{transform:scale(.85);opacity:.4}}
/* The terms unfold after the button's seal has been cut. */
#readTerms{overflow:visible}
.terms-opening-scissors{position:absolute;left:-30px;top:-25px;width:37px;height:50px;opacity:0;pointer-events:none;filter:drop-shadow(0 0 8px #5ddcff)}
.terms-opening-scissors .scis{width:100%;height:100%}
#readTerms.terms-opening .terms-opening-scissors{animation:termsSealCut .65s ease-in-out both}
#readTerms.terms-opening .h-a{animation:liveBlade .3s ease-in-out 2}
#readTerms.terms-opening .h-b{animation:liveBlade .3s ease-in-out 2 reverse}
.terms-dialog.terms-unfold{animation:termsDocumentUnfold .5s ease-out both}
@keyframes termsSealCut{0%{left:-30px;opacity:0;transform:rotate(60deg)}20%{opacity:1}85%{opacity:1}100%{left:100%;opacity:0;transform:rotate(80deg)}}
@keyframes termsDocumentUnfold{from{opacity:.3;transform:translateY(16px) scaleY(.85)}to{opacity:1;transform:none}}
.consent-order,.checkout-order{margin:22px 0;padding:17px;border:1px dashed #859bd04d;border-radius:16px;background:#11172c88}
.consent-items{list-style:none;display:grid;gap:12px;padding:0}
.consent-items li,.consent-total{display:flex;justify-content:space-between;gap:18px;font-size:14px}
.consent-items strong,.consent-total strong{color:#8be7ff;white-space:nowrap}
.consent-total{border-top:1px dashed #6b779955;margin-top:16px;padding-top:14px;font-weight:700}
.consent-rules{display:grid;gap:14px;font-size:13px;line-height:1.8}
.consent-rules b{color:#e5edff}
.consent-full-terms{margin-top:20px}
.consent-check{display:flex;gap:12px;align-items:flex-start;margin:24px 0 13px;cursor:pointer;font-size:14px;color:#e6eeff}
.consent-check input{width:19px;height:19px;flex:none;accent-color:#71dcff}
.consent-mode{font-size:11px;margin-bottom:20px;color:#98accd}
.consent-continue{width:100%}
.consent-continue:disabled{opacity:.4;cursor:not-allowed}
.checkout-agreed{color:#89e5d5;font-size:13px}
.checkout-preview-info{margin:18px 0 24px;line-height:1.8;font-size:14px}
@media(max-width:700px){.rules-shadow-portal{right:-150px;top:48%;width:280px;height:390px;opacity:.45}.consent-items li{font-size:12px}.consent-check{font-size:13px}}
@media(prefers-reduced-motion:reduce){.rules-oath-magic *,.terms-opening-scissors,.terms-dialog.terms-unfold{animation:none!important}.terms-opening-scissors{display:none}}

.consent-full-terms{overflow:visible}
.consent-full-terms.terms-opening .terms-opening-scissors{animation:termsSealCut .65s ease-in-out both}
.consent-full-terms.terms-opening .h-a{animation:liveBlade .3s ease-in-out 2}
.consent-full-terms.terms-opening .h-b{animation:liveBlade .3s ease-in-out 2 reverse}


/* Keep the seal local; no shiny rectangle can escape these buttons. */
#readTerms::after,.consent-full-terms::after{display:none}
#readTerms,.consent-full-terms{overflow:visible}
.terms-round-seal{position:absolute;right:-13px;top:-21px;width:42px;height:42px;pointer-events:none;opacity:0;transform:scale(.75);filter:drop-shadow(0 0 8px #5ddcff);z-index:2}
.terms-round-seal svg{position:absolute;inset:0;width:100%;height:100%}
.seal-half{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#293a5c,#17192e);border:1px solid #9ac7ed}
.seal-half-left{clip-path:inset(0 50% 0 0)}
.seal-half-right{clip-path:inset(0 0 0 50%)}
.terms-opening .terms-round-seal{animation:termsRoundSeal .65s ease-out both}
.terms-opening .seal-half-left{animation:termsSealHalfLeft .65s ease-out both}
.terms-opening .seal-half-right{animation:termsSealHalfRight .65s ease-out both}
#readTerms.terms-opening .terms-opening-scissors,.consent-full-terms.terms-opening .terms-opening-scissors{z-index:3;animation:termsRoundSnip .65s ease-in-out both}
@keyframes termsRoundSeal{0%{opacity:0;transform:scale(.7)}20%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.2)}}
@keyframes termsSealHalfLeft{0%,55%{transform:none}100%{transform:translateX(-13px) rotate(-20deg)}}
@keyframes termsSealHalfRight{0%,55%{transform:none}100%{transform:translateX(13px) rotate(20deg)}}
@keyframes termsRoundSnip{0%{left:65%;opacity:0;transform:rotate(50deg)}25%{opacity:1}65%{left:calc(100% - 12px);opacity:1;transform:rotate(80deg)}100%{left:100%;opacity:0;transform:rotate(100deg)}}
@media(prefers-reduced-motion:reduce){.terms-round-seal{display:none}}
/* Continuous cyan and violet lustre, travelling out and back. */
.gwen-section-title .gwen-heading-copy{animation:gwenHeadingLustre 3.6s ease-in-out infinite alternate;animation-play-state:paused}
.gwen-heading-loop .gwen-heading-copy{animation-play-state:running}
.gwen-heading-loop .gwen-heading-seam path{animation:atelierSeamBreathe 3.6s ease-in-out infinite alternate}
@keyframes atelierSeamBreathe{from{opacity:.35;stroke:#88dfff}to{opacity:.85;stroke:#bb9cff}}
#collections{position:relative;isolation:isolate}
#collections>.wrap{position:relative;z-index:1}
.atelier-world-weave{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;direction:ltr;mask-image:linear-gradient(transparent,#000 14% 85%,transparent)}
.atelier-cloth{position:absolute;inset:0;background:radial-gradient(ellipse at 18% 50%,#45418b26,transparent 40%),radial-gradient(ellipse at 82% 50%,#3d638229,transparent 40%),repeating-linear-gradient(32deg,transparent 0 54px,#939fd707 55px 56px,transparent 57px 110px),repeating-linear-gradient(-32deg,transparent 0 54px,#8bccdf07 55px 56px,transparent 57px 110px);mask-image:linear-gradient(90deg,#000,transparent 35% 65%,#000)}
.atelier-world-threads{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.atelier-world-threads path{fill:none;stroke:var(--thread);vector-effect:non-scaling-stroke;transition:opacity .45s,stroke-width .45s}
.world-thread-track{stroke-width:1;stroke-dasharray:3 9;opacity:.18}
.world-thread-light{stroke-width:1.7;stroke-dasharray:7 93;opacity:.45;filter:drop-shadow(0 0 5px var(--thread));animation:atelierThreadTravel 8s linear infinite}
.atelier-world-threads g:nth-child(even) .world-thread-light{animation-direction:reverse;animation-delay:-4s}
.world-awake .world-thread-track{opacity:.65}
.world-awake .world-thread-light{opacity:1;stroke-width:3}
.atelier-shear{position:absolute;left:calc(50% - 52px);top:12%;width:104px;height:150px;opacity:.3;filter:drop-shadow(0 0 12px #77dfff);animation:atelierShearFloat 6s ease-in-out infinite alternate}
.atelier-shear svg{width:100%;height:100%}
.atelier-world-relic{position:absolute;width:180px;height:220px;color:var(--thread);opacity:.48;transition:opacity .4s,filter .4s;animation:atelierRelicFloat 7s ease-in-out infinite alternate;animation-delay:var(--delay)}
.relic-0{left:5%;top:24%;transform:rotate(-13deg)}
.relic-1{left:15%;top:64%;transform:rotate(12deg)}
.relic-2{left:calc(50% - 90px);top:76%}
.relic-3{right:6%;top:19%;transform:rotate(13deg)}
.relic-4{right:15%;top:65%;transform:rotate(-16deg)}
.atelier-relic-hoop{display:grid;place-items:center;width:125px;height:125px;border:1px solid currentColor;border-radius:50%;box-shadow:0 0 0 7px #8caad309,0 0 0 8px #8caad325,inset 0 0 30px #8aa8e111;background:radial-gradient(ellipse,#17253e77,transparent);position:relative}
.atelier-relic-hoop::after{content:"";position:absolute;inset:10px;border:1px dashed currentColor;border-radius:50%;opacity:.45;animation:spin 50s linear infinite}
.atelier-relic-hoop svg{width:68px;height:68px;filter:drop-shadow(0 0 6px currentColor)}
.atelier-spool{position:absolute;bottom:22px;right:4px;width:38px;height:50px;border:1px solid currentColor;border-radius:8px;background:repeating-linear-gradient(0deg,transparent 0 4px,currentColor 5px 6px);opacity:.65;transform:rotate(-24deg)}
.atelier-spool::before,.atelier-spool::after{content:"";position:absolute;left:-5px;width:46px;height:6px;border-radius:50%;background:currentColor}
.atelier-spool::before{top:-3px}.atelier-spool::after{bottom:-3px}
.atelier-needle{position:absolute;left:12px;bottom:22px;width:2px;height:74px;background:linear-gradient(#efffff,var(--thread),transparent);transform:rotate(40deg);box-shadow:0 0 8px var(--thread)}
.atelier-needle::before{content:"";position:absolute;top:3px;left:-2px;width:4px;height:10px;border:1px solid currentColor;border-radius:50%}
.atelier-world-relic i{position:absolute;width:4px;height:4px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor;animation:gwenRelicDot 2s infinite alternate}@keyframes gwenRelicDot{from{opacity:.35}to{opacity:.85}}
.atelier-world-relic i:nth-last-child(2){right:4px;top:30px}.atelier-world-relic i:last-child{left:-25px;bottom:65px;animation-delay:-1s}
.atelier-world-relic.world-awake{opacity:.9;filter:drop-shadow(0 0 12px var(--thread))}
@keyframes atelierThreadTravel{to{stroke-dashoffset:-100}}
@keyframes atelierRelicFloat{to{translate:0 -18px;rotate:4deg}}
@keyframes atelierShearFloat{from{transform:rotate(-18deg) translateY(0)}to{transform:rotate(10deg) translateY(-14px)}}
@media(max-width:1250px){.atelier-world-relic{scale:.7;opacity:.28}.relic-0,.relic-1{left:-45px}.relic-3,.relic-4{right:-45px}.atelier-shear{opacity:.18}}
@media(max-width:700px){.atelier-world-relic{scale:.55;opacity:.25}.relic-2{top:86%}.atelier-shear{left:auto;right:10%;top:4%;width:70px}.atelier-world-threads{opacity:.7}}
@media(prefers-reduced-motion:reduce){.atelier-world-weave *,.gwen-heading-loop *{animation:none!important}}
.atelier-relic-hoop svg{fill:none;stroke:currentColor;stroke-width:1.4}
/* Keep the upper-left relic clear of the heading and its supporting copy. */
.relic-0{top:47%;left:1%}
@media(max-width:1250px){.relic-0{left:-45px}}
/* Public illustrative previews are visibly marked even on a flat black setup. */
.aa>.aa-preview-watermark{position:absolute;inset:-25% -22%;z-index:30;pointer-events:none;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,1fr);align-items:center;justify-items:center;direction:ltr;animation:previewMarkDrift 9s ease-in-out infinite alternate;opacity:.38;transform:rotate(-18deg);color:#e3eeff;text-shadow:0 1px 2px #02030d,0 0 3px #85b7e0;font:700 3.2cqw/1.15 Arial,sans-serif;letter-spacing:.08em;user-select:none}
.aa-preview-watermark>span{white-space:nowrap;text-align:center}.aa-preview-watermark small{display:block;font-size:1.8cqw;letter-spacing:.22em;margin-top:.5cqw;color:#b4c8f4}
.preview-protection-note{font-size:12px;color:#a8bcdd;margin:8px 0 14px;line-height:1.6}
@keyframes previewMarkDrift{from{transform:rotate(-18deg) translate(-3%, -2%)}to{transform:rotate(-18deg) translate(5%, 4%)}}
@media(prefers-reduced-motion:reduce){.aa>.aa-preview-watermark{animation:none!important;transform:rotate(-18deg)}}
.violet-live-preview{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;opacity:1;pointer-events:none;border-radius:6px;background:#000}
.violet-preview-info{font-size:12px;line-height:1.7;color:#b1cee9;margin:0 0 15px;padding:12px 14px;border:1px dashed #9b8bdc55;border-radius:12px;background:#7d69dc0b}
.setup-product-row{flex-wrap:wrap}
.aa.aa-media-preview{aspect-ratio:16/10;background:#060713}.aa-media-preview>img{inset:0;width:100%;height:100%;object-fit:contain;animation:none}.aa-media-preview>.edit-duration{inset:auto 10px 10px auto;z-index:2;padding:5px 8px;border:1px solid #a6cef544;border-radius:20px;background:#060713cc;font:600 12px Arial,sans-serif;animation:none;color:#d8edff}
.product-edit-video{width:100%;display:block;aspect-ratio:16/9;background:#000;border-radius:12px}.media-product-stage{aspect-ratio:16/9}
.media-audio-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0;padding:13px 16px;border:1px solid #82b7e244;border-radius:13px;background:#0c132b;color:#bce5ff;font-size:12px}.media-audio-controls input{flex:1;min-width:100px;accent-color:#76ddff}.media-audio-controls output{min-width:36px}.media-audio-controls .btn{font-size:10px}
#mediaAudioControls[hidden]{display:none!important}
.aa-media-preview>.edit-card-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;animation:none;filter:saturate(.8) contrast(1.04) brightness(.94);pointer-events:none}
.aa-media-preview::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(135deg,#67deff,#7c66d1 55%,#a179de);mix-blend-mode:color;opacity:.38}
.card:has(.edit-card-video):hover .card-art{box-shadow:0 0 25px #8b7aff25}
.violet-delivery-bundle{margin-top:24px}.violet-delivery-bundle h3{font:600 17px var(--serif);color:#cceaff;margin-bottom:14px}.violet-delivery-bundle .files{margin-top:0}

#demoSlot{opacity:var(--alert-opacity,.8)}

.aa-media-preview>.edit-card-video{opacity:0;transition:opacity .2s}.aa-media-preview>.edit-card-video.is-previewing{opacity:1}.aa-media-preview>.edit-card-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;animation:none;filter:saturate(.8) contrast(1.04) brightness(.94)}

.bundle[hidden]{display:none!important}

#purchaseConsent{position:relative;isolation:isolate;background:radial-gradient(ellipse at 95% 0,#6745c829,transparent 55%),radial-gradient(ellipse at 0 80%,#39cee514,transparent 50%),#090d22;border-color:#78dfff80;box-shadow:0 0 0 1px #997bff20,0 0 65px #7361ff25,0 30px 100px #0009}#purchaseConsent::backdrop{background:#020410ce;backdrop-filter:blur(7px)}.consent-magic{position:absolute;inset:0;z-index:-1;overflow:hidden;border-radius:inherit;pointer-events:none}.consent-thread-map{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#87ddff;stroke-width:1;stroke-dasharray:5 13;opacity:.18;animation:consentThreadTravel 22s linear infinite}.consent-world-ring{position:absolute;right:-120px;top:-140px;width:370px;height:370px;border:1px solid #a383ff30;border-radius:50%;box-shadow:0 0 0 18px #80dbff05,0 0 0 19px #8cbdff20;animation:spin 40s linear infinite}.consent-world-ring::before{content:"";position:absolute;inset:15px;border:1px dashed #7dddff50;border-radius:50%}.consent-world-ring::after{content:"";position:absolute;bottom:50px;left:26px;width:5px;height:5px;border-radius:50%;background:#b2efff;box-shadow:0 0 18px #80dfff}.consent-shear{position:absolute;left:-60px;top:125px;width:42px;height:60px;color:#a2ebff;opacity:0;filter:drop-shadow(0 0 10px #7dddff)}.consent-shear svg{width:100%;height:100%}.consent-arriving .consent-shear{animation:consentUnseal 1s ease-in-out}.consent-magic>i{position:absolute;width:3px;height:3px;background:#b8edff;box-shadow:0 0 15px #67dfff;left:6%;top:40%;animation:checkoutTwinkle 4s ease-in-out infinite alternate}.consent-magic>i:nth-last-child(2){left:90%;top:67%}.consent-magic>i:last-child{left:65%;top:20%}.consent-gwen-seal{display:grid;place-items:center;width:54px;height:54px;flex:none;margin-inline-end:14px;border:1px dashed #91e8ff80;border-radius:50%;background:radial-gradient(#80dfff1c,#7f5eff16);box-shadow:0 0 22px #67dfff25;transition:box-shadow .4s,border-color .4s}.consent-gwen-seal svg{width:35px;height:43px;filter:drop-shadow(0 0 5px #7dddff)}#purchaseConsent .terms-heading{align-items:center}#purchaseConsent h2{color:#e9f9ff;text-shadow:0 0 18px #9682ff45}#purchaseConsent .consent-order{border:1px solid #83caff55;background:linear-gradient(125deg,#17304855,#281c4355);box-shadow:inset 0 0 24px #75ddff08}.consent-rules>p{position:relative;margin:0;padding:13px 16px;padding-inline-start:50px;border:1px solid #8d9bc42b;border-radius:13px;background:#0e132788;transition:border-color .2s,background .2s}.consent-rules>p:hover{border-color:#80dfff66;background:#18234088}.consent-rule-number{position:absolute;inset-inline-start:15px;top:17px;color:#7ad9ed;font:700 10px Arial;letter-spacing:1px}.consent-arriving .consent-rules>p{animation:consentRuleReveal .45s both;animation-delay:var(--rule-delay)}.consent-check{padding:14px;border:1px dashed #829ac94a;border-radius:13px;transition:background .3s,border-color .3s}.consent-approved .consent-check{border-color:#80e6ff;background:#5de0ff0c}.consent-approved .consent-gwen-seal{border-color:#bdefff;box-shadow:0 0 28px #75ddff70}.consent-approved .consent-continue{box-shadow:0 0 28px #8670ff55,0 0 16px #64dfff35}.consent-continue{transition:box-shadow .4s,opacity .3s}.consent-arriving{animation:consentDocumentReveal .5s both}@keyframes consentThreadTravel{to{stroke-dashoffset:-300}}@keyframes consentUnseal{15%{opacity:1}85%{opacity:1}100%{left:105%;opacity:0;transform:rotate(15deg)}}@keyframes consentRuleReveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes consentDocumentReveal{from{opacity:.3;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}@media(max-width:600px){.consent-gwen-seal{width:40px;height:40px;margin-inline-end:9px}.consent-gwen-seal svg{width:28px;height:34px}.consent-rules>p{padding:12px;padding-inline-start:40px}.consent-rule-number{inset-inline-start:12px}#purchaseConsent h2{font-size:23px}}@media(prefers-reduced-motion:reduce){#purchaseConsent,.consent-thread-map,.consent-world-ring,.consent-shear,.consent-rules>p,.consent-magic>i{animation:none!important}}

#purchaseConsent{border-color:#a9edff;box-shadow:0 0 0 1px #9b79ff70,0 0 40px #66dfff35,0 0 95px #8262ff40,0 30px 100px #0009;background:radial-gradient(ellipse at 100% 0,#7847df45,transparent 58%),radial-gradient(ellipse at 0 100%,#28bbd72b,transparent 55%),#0a0e27}.consent-rune-orbit{position:absolute;width:280px;height:280px;border:2px solid #9981ff55;border-radius:50%;box-shadow:0 0 28px #7c5cff25,inset 0 0 30px #63dfff20;animation:spin 22s linear infinite}.consent-rune-orbit::before{content:"";position:absolute;inset:15px;border:2px dotted #77e3ff88;border-radius:50%}.consent-rune-orbit::after{content:"✦";position:absolute;top:20px;left:34px;font-size:24px;color:#b6eaff;text-shadow:0 0 18px #66dfff}.orbit-a{left:-170px;top:30%}.orbit-b{right:-170px;bottom:-65px;animation-direction:reverse}.consent-guardian{position:absolute;width:95px;height:135px;opacity:.22;filter:drop-shadow(0 0 14px #80deff);animation:consentGuardianFloat 5s ease-in-out infinite alternate}.consent-guardian svg{width:100%;height:100%}.guardian-left{left:-24px;bottom:60px;transform:rotate(23deg)}.guardian-right{right:-22px;top:25px;animation-delay:-2.5s;transform:rotate(-23deg)}.consent-cross-threads{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#ac8bff;stroke-width:1.3;stroke-dasharray:6 15;opacity:.22;animation:consentThreadTravel 16s linear infinite}.consent-star{position:absolute;left:var(--star-x);top:var(--star-y);font-size:9px;color:#b1efff;text-shadow:0 0 10px #64dfff;opacity:.45;animation:consentStarShine 3s ease-in-out infinite alternate;animation-delay:var(--star-delay)}#purchaseConsent h2{text-shadow:0 0 12px #b1e7ff55,0 0 30px #9272ff70}#purchaseConsent .rules-eyebrow{color:#a3efff;text-shadow:0 0 14px #64ddff90}.consent-gwen-seal{background:radial-gradient(#a6eeff25,#7b54ff35);box-shadow:0 0 26px #77dfff60,inset 0 0 14px #97baff40}.consent-gwen-seal svg{filter:drop-shadow(0 0 8px #9fe9ff)}#purchaseConsent .consent-order{background:linear-gradient(125deg,#193951aa,#34245388);border-color:#94deff85;box-shadow:0 0 22px #6bcfff16,inset 0 0 28px #88cfff12}.consent-rules>p{background:linear-gradient(120deg,#111d32ef,#1a1530e8);border-color:#92a8de55;box-shadow:inset 3px 0 #76dcff30}.consent-rule-number{color:#a7f0ff;text-shadow:0 0 10px #66dfff}.consent-rules b{color:#f0f7ff;text-shadow:0 0 12px #a0b7ff40}.consent-approved .consent-gwen-seal{box-shadow:0 0 40px #75ddff90,0 0 65px #8c6aff55}.consent-approved .consent-continue{box-shadow:0 0 34px #8e70ff80,0 0 25px #64dfff60}@keyframes consentStarShine{to{opacity:.9;transform:scale(1.5) rotate(45deg)}}@keyframes consentGuardianFloat{to{translate:0 -12px;filter:drop-shadow(0 0 22px #a083ff)}}@media(prefers-reduced-motion:reduce){.consent-rune-orbit,.consent-guardian,.consent-cross-threads,.consent-star{animation:none!important}}

.hero-world-bloom{position:absolute;inset:0;overflow:hidden;pointer-events:none;mask-image:linear-gradient(transparent,#000 13%,#000 83%,transparent);animation:heroWorldArrival 1.6s ease-out both}.hero-silk-rift{position:absolute;left:-20%;bottom:4%;width:135%;height:40%;border-radius:50%;background:radial-gradient(ellipse,#6acfff18,transparent 60%);border-top:1px solid #7ee7ff4d;box-shadow:0 -15px 50px #7c63ff12;transform:rotate(-18deg);animation:heroRiftBreathe 7s ease-in-out infinite alternate}.hero-luminous-weave{position:absolute;inset:0;width:100%;height:100%;fill:none}.weave-track{stroke:#9292d6;stroke-width:1;stroke-dasharray:3 12;opacity:.18}.weave-light{stroke:#98ecff;stroke-width:2;stroke-dasharray:4 96;opacity:.7;filter:drop-shadow(0 0 7px #62dfff);animation:heroWeaveTravel 10s linear infinite}.weave-light.violet{stroke:#b995ff;animation-delay:-5s;animation-direction:reverse}.hero-silk-shard{position:absolute;width:80px;height:105px;border:1px solid #92deff55;border-radius:12px 30px 12px 30px;display:grid;place-items:center;color:#b3eaff70;font-size:38px;background:repeating-linear-gradient(0deg,transparent 0 7px,#76bdff0d 8px 9px),linear-gradient(140deg,#74e4ff12,#9965ff20);box-shadow:0 0 22px #896bff16;animation:heroShardFloat 6s ease-in-out infinite alternate}.hero-silk-shard::before{content:"";position:absolute;inset:7px;border:1px dashed #c2a8ff55;border-radius:inherit}.shard-one{left:5%;top:27%;rotate:-24deg}.shard-two{right:4%;top:68%;rotate:22deg;animation-delay:-2s}.shard-three{left:15%;bottom:8%;rotate:14deg;width:55px;height:70px;animation-delay:-4s}.hero-thread-moon{position:absolute;left:17%;top:12%;width:90px;height:90px;border:1px solid #86dfff50;border-radius:50%;box-shadow:0 0 30px #76bfff25,inset 0 0 22px #9570ff20;animation:heroMoonSpin 35s linear infinite}.hero-thread-moon::before{content:"";position:absolute;inset:10px;border:1px dashed #b394ff75;border-radius:50%}.hero-thread-moon span{position:absolute;left:20px;top:2px;width:5px;height:5px;background:#d0f9ff;border-radius:50%;box-shadow:0 0 15px #65dfff}.hero-bloom-star{position:absolute;left:var(--x);top:var(--y);font-size:8px;font-style:normal;color:#9feaff;opacity:.45;text-shadow:0 0 10px #8b76ff;animation:heroBloomTwinkle 3.5s ease-in-out infinite alternate;animation-delay:var(--delay)}@keyframes heroWorldArrival{from{opacity:0;transform:scale(1.035)}to{opacity:1;transform:none}}@keyframes heroWeaveTravel{to{stroke-dashoffset:-100}}@keyframes heroRiftBreathe{to{opacity:.5;translate:0 12px}}@keyframes heroShardFloat{to{translate:0 -15px;filter:drop-shadow(0 0 10px #8a76ff)}}@keyframes heroMoonSpin{to{transform:rotate(360deg)}}@keyframes heroBloomTwinkle{to{opacity:.8;transform:scale(1.5)}}@media(max-width:900px){.hero-silk-shard{opacity:.4;scale:.7}.hero-thread-moon{left:3%;top:14%;scale:.7}.weave-light{opacity:.35}}@media(max-width:600px){.hero-silk-shard{opacity:.25;scale:.5}.hero-thread-moon{opacity:.35}.hero-bloom-star{font-size:6px}.hero-silk-rift{opacity:.4}}.hero-world-paused .hero-world-bloom *{animation-play-state:paused!important}@media(prefers-reduced-motion:reduce){.hero-world-bloom,.hero-world-bloom *{animation:none!important}}

/* Overscan global haze so its clipped viewport edge cannot form a seam, including view zoom. */
#mist{inset:-25vh -10vw;zoom:var(--gwen-view-inverse,1);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent)}
.live-magic-haze{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 78%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 78%,transparent)}

#wall{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.wallbox{padding-top:26px}#wall .wall-card{border:1px solid color-mix(in srgb,var(--a) 50%,transparent);border-radius:20px;background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--a) 14%,transparent),transparent 75%),#0b1024;box-shadow:0 12px 34px #0006,inset 0 1px color-mix(in srgb,var(--b) 25%,transparent);transition:transform .35s,box-shadow .35s,border-color .35s}#wall .wall-card::after{content:"";position:absolute;inset:6px;border:1px dashed color-mix(in srgb,var(--a) 24%,transparent);border-radius:14px;pointer-events:none}#wall .wall-card:hover,#wall .wall-card:focus-visible{transform:translateY(-9px);border-color:var(--b);box-shadow:0 0 26px color-mix(in srgb,var(--a) 40%,transparent),0 18px 45px #0007}#wall .aa{aspect-ratio:16/9;overflow:hidden}#wall .edit-card-poster,#wall .edit-card-video{filter:saturate(1.04) contrast(1.03) brightness(1.06)}#wall .aa-media-preview::after{opacity:.12}.gallery-meta{display:flex;justify-content:space-between;gap:10px;padding:16px 18px 0;font:700 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--b)}.gallery-meta strong{font-size:15px;letter-spacing:0;text-shadow:0 0 12px color-mix(in srgb,var(--b) 50%,transparent)}.gallery-caption{font:600 clamp(14px,1.2vw,18px)/1.35 var(--serif);padding:8px 18px 6px;color:#eef7ff;letter-spacing:.02em;min-height:54px}.gallery-hover-copy{display:block;padding:4px 18px 18px;color:var(--b);font:700 9px var(--sans);letter-spacing:.14em;opacity:.55;transition:opacity .3s}.wall-card:hover .gallery-hover-copy{opacity:1}.gallery-play-seal{position:absolute;top:calc((100% - 115px)/2);left:50%;width:58px;height:58px;display:grid;place-items:center;border:1px solid var(--b);border-radius:50%;background:#090e26b8;box-shadow:0 0 22px color-mix(in srgb,var(--a) 60%,transparent);transform:translate(-50%,-50%) scale(.8);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;z-index:4}.gallery-play-seal svg{width:25px;height:25px;fill:var(--b);filter:drop-shadow(0 0 6px var(--a))}.wall-card:hover .gallery-play-seal,.wall-card:focus-visible .gallery-play-seal{opacity:1;transform:translate(-50%,-50%) scale(1)}#wallTabs{gap:10px}#wallTabs .tab{border-color:#8cc5ff44;padding:10px 17px}#wallTabs .tab[aria-pressed=true]{box-shadow:0 0 22px #6addff45;border-color:#7ce8ff}#wallCount{color:#b1ecff;text-shadow:0 0 12px #7a75ff55;margin-top:14px}@media(max-width:1000px){#wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}@media(max-width:600px){#wall{grid-template-columns:1fr;gap:20px}.gallery-caption{font-size:18px}.gallery-play-seal{width:48px;height:48px}#wallTabs .tab{padding:8px 12px}}@media(prefers-reduced-motion:reduce){#wall .wall-card,.gallery-play-seal{transition:none}}
/* Gwen's illuminated exhibition: stitched light, dimensional frames and quiet motion. */
#wall{position:relative;padding:24px 0 36px;isolation:isolate}
#wall::before{content:"";position:absolute;inset:0 -22px;z-index:-1;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 calc(33.333% - 1px),#76daff12 calc(33.333% - 1px) 33.333%),radial-gradient(ellipse at 50% 0,#775cff20,transparent 65%);mask-image:linear-gradient(transparent,#000 6%,#000 92%,transparent)}
#wall .wall-card{overflow:hidden;padding:10px;transform:none;translate:none;text-align:start;background:radial-gradient(ellipse at 15% 0,color-mix(in srgb,var(--a) 25%,transparent),transparent 70%),linear-gradient(135deg,#141831,#080b1b);border-color:color-mix(in srgb,var(--a) 65%,transparent)}
#wall .wall-card .aa{border-radius:13px;box-shadow:0 0 0 1px #c3e7ff22;transition:filter .4s,transform .6s}
#wall .wall-card:hover .aa{filter:brightness(1.1);transform:scale(1.018)}
#wall .wall-card:hover,#wall .wall-card:focus-visible{transform:translateY(-7px);box-shadow:0 0 32px color-mix(in srgb,var(--a) 40%,transparent),0 24px 50px #0008,inset 0 0 28px color-mix(in srgb,var(--a) 10%,transparent)}
.gallery-living-frame{position:absolute;inset:3px;pointer-events:none;border-radius:18px;overflow:hidden;opacity:.5;transition:opacity .3s}
.gallery-living-frame svg{width:100%;height:100%;fill:none;stroke:var(--b);stroke-width:.35;filter:drop-shadow(0 0 3px var(--a))}
.gallery-living-frame rect{stroke-dasharray:9 41;animation:galleryStitchTravel 9s linear infinite;animation-play-state:paused}
.wall-card:hover .gallery-living-frame{opacity:1}.wall-card:hover .gallery-living-frame rect,.wall-card:focus-visible .gallery-living-frame rect{animation-duration:3s;animation-play-state:running}
.gallery-edition{position:absolute;top:20px;left:20px;z-index:3;padding:5px 9px;background:#070a20ba;border:1px solid #a4dfff40;border-radius:7px;font:700 10px var(--sans);letter-spacing:.15em;color:#d4f6ff;pointer-events:none}
.gallery-meta{padding-top:20px}.gallery-caption{display:block;font-size:clamp(17px,1.4vw,22px);min-height:65px;text-shadow:0 0 18px color-mix(in srgb,var(--a) 35%,transparent)}
.gallery-hover-copy{padding-bottom:14px;opacity:.8}.gallery-play-seal{border:1px solid #d1f9ff;outline:1px dashed var(--a);outline-offset:7px;background:linear-gradient(140deg,#30445bcf,#251343d9);box-shadow:0 0 30px var(--a),inset 0 0 16px #7ddfff33}
#wallTabs .tab{background:linear-gradient(140deg,#141a36,#0a0c20);transition:box-shadow .3s,transform .3s}#wallTabs .tab:hover{transform:translateY(-3px);box-shadow:0 0 18px #8bcaff38}
@keyframes galleryStitchTravel{to{stroke-dashoffset:-100}}
@media(max-width:600px){#wall::before{background:radial-gradient(ellipse at 50% 0,#775cff25,transparent 70%)}.gallery-caption{min-height:0;font-size:20px}}
@media(prefers-reduced-motion:reduce){.gallery-living-frame rect{animation:none}#wall .wall-card .aa,#wallTabs .tab{transition:none}}
.gallery-enchanted-workshop{position:absolute;inset:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 0 45%,#65cfff12,transparent 35%),radial-gradient(ellipse at 100% 72%,#b171ff18,transparent 32%)}
.workshop-ribbons{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#a1c5ff;stroke-width:1;stroke-dasharray:3 14;opacity:.22}.workshop-ribbons .workshop-current{stroke:#8ceeff;stroke-width:2;stroke-dasharray:2 98;filter:drop-shadow(0 0 7px #65dfff);animation:galleryStitchTravel 18s linear infinite;animation-play-state:paused}
.workshop-object{position:absolute;width:105px;height:145px;filter:drop-shadow(0 0 15px #8f80ff38);animation:workshopFloat 7s ease-in-out infinite alternate;animation-delay:var(--float-delay);opacity:.65}.workshop-object svg{width:100%;height:100%;fill:#342b5c66;stroke:#95ceff99;stroke-width:1.5}.workshop-stitch{fill:none;stroke:#ad90ff;stroke-dasharray:3 4}.workshop-symbol{fill:#7ddfff18;stroke:#9decff;filter:drop-shadow(0 0 5px #76dfff)}
.object-0{left:3%;top:27%;rotate:-22deg}.object-1{right:3%;top:15%;rotate:19deg}.object-2{right:5%;top:43%;rotate:24deg}.object-3{left:4%;top:55%;rotate:-18deg}.object-4{left:2%;top:80%;rotate:16deg}.object-5{right:3%;top:73%;rotate:-23deg}.object-6{right:2%;top:91%;rotate:12deg}.object-7{left:3%;top:9%;rotate:28deg}
.workshop-portal{position:absolute;width:175px;height:175px;border:1px solid #86dfff55;border-radius:50%;box-shadow:0 0 45px #7a70ff1a,inset 0 0 35px #6edfff12;display:grid;place-items:center;animation:workshopOrbit 35s linear infinite}.workshop-portal::before,.workshop-portal::after{content:"";position:absolute;inset:11px;border:1px dashed #b58cff88;border-radius:50%}.workshop-portal::after{inset:30px;border-style:solid;border-color:#6edfff33}.workshop-portal i{font-style:normal;font-size:46px;color:#b0efff88;text-shadow:0 0 20px #8277ff}.portal-0{left:-55px;top:38%}.portal-1{right:-55px;top:59%}.portal-2{left:-65px;top:91%}.portal-3{right:-45px;top:4%}
.workshop-spark{position:absolute;left:var(--sx);top:var(--sy);color:#b8eaff;font-size:12px;font-style:normal;opacity:.2;text-shadow:0 0 12px #8c70ff;animation:workshopSpark 4s ease-in-out infinite alternate;animation-delay:var(--float-delay)}
@keyframes workshopFloat{to{translate:0 -20px;rotate:5deg}}@keyframes workshopOrbit{to{transform:rotate(360deg)}}@keyframes workshopSpark{to{opacity:.65;transform:scale(1.3)}}
#showcase:not(.gallery-visible) .gallery-enchanted-workshop *{animation-play-state:paused}
@media(max-width:1450px){.workshop-object{width:65px;height:95px;opacity:.4}.workshop-portal{width:120px;height:120px;opacity:.5}}
@media(max-width:700px){.workshop-object{width:42px;height:62px;opacity:.22}.workshop-portal{opacity:.25}.workshop-ribbons{opacity:.12}.workshop-spark{opacity:.15}}
@media(prefers-reduced-motion:reduce){.gallery-enchanted-workshop *{animation:none!important}}
/* Allow setup controls to wrap within narrow phones and enlarged layouts. */
.setup-toolbar>div,.setup-image-actions,.demo-controls .sp{min-width:0;max-width:100%}
.setup-product-row select{max-width:100%;width:0}
.setup-image-actions .btn,.demo-controls .btn{max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media(max-width:400px){
 .setup-product-row{align-items:stretch}
 .setup-product-row label{flex-basis:100%}
 .setup-product-row select{flex:1 1 100%;width:100%}
 .setup-product-row .btn{align-self:flex-start}
 .setup-image-actions{width:100%}
 .demo-controls .sp{width:100%;margin-inline-start:0}
}
.demo>*{min-width:0}
@media(max-width:700px){.demo{grid-template-columns:minmax(0,1fr)}}

/* Product hover and keyboard focus wake the existing scissors without changing layout. */
#store{--product-scissor-glow:#5ddcff}
#store:has(.card[data-col="midnight"]:is(:hover,:focus-within)){--product-scissor-glow:#9d9aff}
#store:has(.card[data-col="hollow"]:is(:hover,:focus-within)){--product-scissor-glow:#3fe3cf}
#store:has(.card[data-col="celestial"]:is(:hover,:focus-within)){--product-scissor-glow:#5ddcff}
#store:has(.card[data-col="royal"]:is(:hover,:focus-within)){--product-scissor-glow:#bd8aff}
#store:has(.card[data-col="arcane"]:is(:hover,:focus-within)){--product-scissor-glow:#7a5cff}
#store .store-world-scissors{transition:opacity .3s ease,filter .3s ease}
#store:has(.card:is(:hover,:focus-within)) .store-world-scissors{opacity:.95;filter:brightness(1.65) drop-shadow(0 0 8px var(--product-scissor-glow)) drop-shadow(0 0 24px var(--product-scissor-glow))}
@media(prefers-reduced-motion:reduce){#store .store-world-scissors{transition:none}}
#collections{--collection-scissor-glow:#75dcff}
#collections:has(.arch[data-col="midnight"]:is(:hover,:focus-within)){--collection-scissor-glow:#9896ff}
#collections:has(.arch[data-col="hollow"]:is(:hover,:focus-within)){--collection-scissor-glow:#66e5c5}
#collections:has(.arch[data-col="celestial"]:is(:hover,:focus-within)){--collection-scissor-glow:#75dcff}
#collections:has(.arch[data-col="royal"]:is(:hover,:focus-within)){--collection-scissor-glow:#d9b884}
#collections:has(.arch[data-col="arcane"]:is(:hover,:focus-within)){--collection-scissor-glow:#c185ff}
#collections .atelier-shear{transition:opacity .3s ease,filter .3s ease}
#collections:has(.arch:is(:hover,:focus-within)) .atelier-shear{opacity:1;filter:brightness(2) drop-shadow(0 0 10px var(--collection-scissor-glow)) drop-shadow(0 0 30px var(--collection-scissor-glow))}
@media(prefers-reduced-motion:reduce){#collections .atelier-shear{transition:none}}

@media(pointer:coarse){
 *,*::before,*::after{animation:none!important;backdrop-filter:none!important;scroll-behavior:auto!important}
 h1,h2,h3,h1 span,h2 span,h3 span{opacity:1!important;filter:none!important;transform:none!important;clip-path:none!important}
 .arch-preview-trigger,.gwen-touch-spark,.vault-magic,.support-magic,.collection-weave,.help-seal,canvas,.magic-spark,.magic-glyph{display:none!important}
 .magic-scissors-hero{filter:none!important}.vault h1,.vault h2,.eyebrow{text-shadow:none!important}
 .card,.wall-card,.arch,.entry,.empty,.library-head,.support-desk,.studio-help{box-shadow:none!important;filter:none!important}
 .edit-card-video{display:none!important}.edit-card-poster{display:block!important;opacity:1!important}
 .collection-gate,.collection-gate *{filter:none!important;box-shadow:none!important}
 body::before,body::after{display:none!important}
 }

/* Immediate preview mount; opacity-only exit keeps mobile work small. */
 .card[data-preview-card]{cursor:pointer}.card[data-preview-card]:focus-visible{outline:2px solid #71dcff;outline-offset:5px}
 .ppm{display:block!important;opacity:0;visibility:hidden;pointer-events:none;background:rgba(5,3,12,.96);transition:opacity 180ms ease,visibility 0s linear 180ms}
 .ppm.on{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 120ms ease,visibility 0s}
 @media(prefers-reduced-motion:reduce){.ppm,.ppm.on{transition:none!important}}

.search-intro{padding-block:40px;max-width:960px}.search-intro h2{font-size:clamp(22px,3vw,32px)}.search-intro p{line-height:1.9;color:#bdcbea;margin-block:16px}.search-intro a{color:#83e4ff}.buy button:disabled,.pp-buy button:disabled{opacity:.65;cursor:default;box-shadow:none}