@import url("https://fonts.googleapis.com/css2?family=Dancing+Script:wght@500;600;700&family=Great+Vibes&family=Outfit:wght@400;500;600;700;800&family=Pacifico&family=Pinyon+Script&family=Sacramento&family=Satisfy&family=Style+Script&family=Yellowtail&display=swap");
:root{--ink:#26283b;--muted:rgba(38,40,59,.55);--blue:#8db6ea;--peri:#5d63c9;--mauve:#c487d4;--lilac:#a99be8;--pale:#eceefb;--soft:#d9d8f1;--tile:#f7f7fb;--tile-hover:#f1f1f9;}*{box-sizing:border-box;margin:0;padding:0;}body{min-height:100vh;background:#ffffff;color:var(--ink);font-family:"Outfit",var(--font-sans),system-ui,sans-serif;padding:40px 32px 56px;}header{max-width:1180px;margin:0 auto 26px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;}header h1{font-weight:300;font-size:26px;}header p{color:var(--muted);font-weight:300;font-size:14px;margin-top:6px;}button{font:300 13px/1 "Outfit",sans-serif;letter-spacing:.06em;color:var(--muted);background:var(--pale);border:0;padding:10px 16px;border-radius:4px;cursor:pointer;white-space:nowrap;}button:hover{color:var(--ink);}.section-head{max-width:1180px;margin:0 auto 14px;display:flex;align-items:baseline;gap:12px;}.section-head h2{font-weight:400;font-size:17px;white-space:nowrap;}.section-head span{color:var(--muted);font-size:13px;font-weight:300;}.section-gap{height:36px;}.grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}.grid.single{grid-template-columns:minmax(0,1fr);max-width:1180px;}@media (max-width:980px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));}}@media (max-width:640px){.grid{grid-template-columns:1fr;}}.tile{background:var(--tile);border-radius:10px;padding:20px 22px 18px;display:grid;grid-template-rows:minmax(220px,1fr) auto;gap:16px;min-height:340px;cursor:pointer;overflow:hidden;transition:background .2s;}.tile:hover{background:var(--tile-hover);}.tile.keeper{background:linear-gradient(120deg,#eef3fc,#f6f2fb);min-height:300px;grid-template-columns:1.4fr 1fr;grid-template-rows:auto;align-items:center;padding:28px 36px;}.art{display:grid;place-items:center;min-height:0;}.meta{display:grid;gap:4px;}.meta .name{display:flex;gap:10px;align-items:baseline;font-size:15px;font-weight:500;white-space:nowrap;}.meta .num{color:var(--peri);font-weight:400;font-size:13px;}.meta p{color:var(--muted);font-size:13px;font-weight:300;line-height:1.45;text-wrap:pretty;}.keeper .meta .name{font-size:18px;}.keeper .meta p{font-size:14px;}.badge{justify-self:start;font-size:11px;letter-spacing:.12em;color:var(--peri);background:#ffffff;padding:5px 10px;border-radius:20px;margin-bottom:6px;}.hint{font-size:10.5px;letter-spacing:.16em;color:var(--muted);white-space:nowrap;}.hy-grad{background:linear-gradient(120deg,var(--blue),var(--peri) 55%,var(--mauve));-webkit-background-clip:text;background-clip:text;color:transparent;}.script{font-family:"Dancing Script",cursive;font-weight:600;}.plane{fill:var(--peri);}.svg-cap{font:400 16px "Outfit",sans-serif;fill:var(--ink);opacity:0;}.done .svg-cap{animation:fadein .8s ease-out forwards;}@keyframes fadein{to{opacity:1;}}@keyframes rise{to{opacity:1;transform:none;}}@keyframes draw{to{stroke-dashoffset:0;}}@keyframes restin{to{opacity:1;transform:none;}}.flap-wrap{display:grid;justify-items:center;gap:18px;}.board-label{font-size:11px;letter-spacing:.3em;color:var(--muted);}.flap-word{display:flex;align-items:center;gap:.2em;font-weight:300;font-size:54px;line-height:1;}.flap-word .static{opacity:0;}.play .flap-word .static{animation:fadein .6s ease-out forwards;}.flap-last{display:flex;align-items:center;gap:.06em;}.flap{display:inline-grid;place-items:center;width:1.05em;height:1.25em;border-radius:6px;background:#ffffff;color:var(--peri);font-weight:500;position:relative;overflow:hidden;}.flap::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--pale);}.flap .glyph{display:inline-block;}.flap .glyph.flip{animation:flip .09s ease-out;}.flap.landed .glyph{animation:land .5s cubic-bezier(.3,1.8,.5,1);}.flap-word .rest{opacity:0;transform:translateX(-.3em);}.done .flap-word .rest{animation:restin .6s cubic-bezier(.2,.8,.2,1) forwards;}.flap-tag{font-size:13px;letter-spacing:.3em;color:var(--muted);opacity:0;}.done .flap-tag{animation:fadein .8s ease-out forwards;}@keyframes flip{from{transform:translateY(-40%);opacity:.3;}to{transform:none;opacity:1;}}@keyframes land{from{transform:scale(.6);}to{transform:scale(1);}}.pass{display:flex;width:272px;height:122px;opacity:0;transform:translateY(40px) rotate(-5deg);}.play .pass{animation:rise .8s cubic-bezier(.2,.8,.2,1) .1s forwards;}.pass .main{flex:1;background:var(--pale);border-radius:10px 0 0 10px;padding:14px 16px;display:grid;gap:7px;align-content:start;}.pass .stub{width:76px;background:#e3e1f7;border-radius:0 10px 10px 0;border-left:2px dashed #ffffff;display:grid;place-items:center;align-content:center;gap:2px;transform-origin:0 100%;}.play .pass .stub{animation:tear .7s cubic-bezier(.4,0,.2,1) 2.3s forwards;}@keyframes tear{to{transform:translate(16px,8px) rotate(10deg);}}.lbl{font-size:8.5px;letter-spacing:.2em;color:var(--muted);white-space:nowrap;}.flight .plane{transition:opacity .5s;}.done .flight .plane{opacity:0;}.pname{font-size:19px;font-weight:400;white-space:nowrap;}.route{display:flex;align-items:center;gap:6px;}.route .code{font-size:24px;font-weight:500;color:var(--peri);line-height:1;}.route svg{width:110px;height:20px;overflow:visible;}.route .rl{stroke:var(--lilac);stroke-width:1.5;stroke-dasharray:2 4;}.route .rplane{transform:translateX(0);}.play .route .rplane{animation:fly 1.5s cubic-bezier(.55,0,.3,1) .8s forwards;}@keyframes fly{to{transform:translateX(92px);}}.stub .gate{font-size:40px;line-height:1;}.flight,.stamps,.tag,.compass,.window,.sky,.metro{width:min(100%,290px);overflow:visible;}.fp-trail{fill:none;stroke:var(--lilac);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round;}.fp-mpath{fill:none;stroke:#ffffff;stroke-width:10;stroke-dasharray:1;stroke-dashoffset:1;}.fp-dot{fill:var(--peri);}.fp-end{fill:var(--mauve);transform-box:fill-box;transform-origin:center;transform:scale(0);}.done .fp-end{animation:pop .5s cubic-bezier(.3,1.8,.5,1) forwards;}.fp-ring{fill:none;stroke:var(--mauve);stroke-width:1.5;transform-box:fill-box;transform-origin:center;opacity:0;}.done .fp-ring{animation:ripple 1.2s ease-out forwards;}.fp-A{font:400 15px "Outfit",sans-serif;fill:var(--ink);}.fp-Z{stroke:var(--peri);opacity:0;}.done .fp-Z{animation:fadein .5s ease-out forwards;}@keyframes pop{to{transform:scale(1);}}@keyframes ripple{0%{opacity:.9;transform:scale(1);}100%{opacity:0;transform:scale(4);}}.stamp{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(2.3);}.play .st1{animation:thud .42s cubic-bezier(.55,0,.8,.2) .4s forwards;}.play .st2{animation:thud .42s cubic-bezier(.55,0,.8,.2) 1.4s forwards;}@keyframes thud{0%{opacity:0;transform:scale(2.3);}80%{opacity:.95;transform:scale(.95);}100%{opacity:.92;transform:scale(1);}}.play .stamps{animation:shake .22s ease .82s,shake2 .22s ease 1.82s;}@keyframes shake{30%{transform:translate(1.5px,2px);}60%{transform:translate(-1px,-1px);}}@keyframes shake2{30%{transform:translate(-1.5px,2px);}60%{transform:translate(1px,-1px);}}.ink-peri{fill:none;stroke:var(--peri);}.ink-mauve{fill:none;stroke:var(--mauve);}.ink-text{fill:var(--peri);font-family:"Outfit",sans-serif;}.ink-text.m{fill:var(--mauve);}.swing{transform-box:view-box;transform-origin:140px 8px;}.play .swing{animation:swing 2.6s ease-in-out forwards;}@keyframes swing{0%{transform:rotate(-30deg);}20%{transform:rotate(20deg);}40%{transform:rotate(-11deg);}60%{transform:rotate(6deg);}80%{transform:rotate(-2.5deg);}100%{transform:rotate(0);}}.tag-code{font:500 32px "Outfit",sans-serif;letter-spacing:3px;fill:var(--peri);}.tag-small{font:400 9.5px "Outfit",sans-serif;letter-spacing:3px;fill:var(--ink);}.carousel{display:grid;justify-items:center;gap:14px;width:100%;}.bags{display:flex;align-items:flex-end;gap:4px;height:44px;}.bag{display:inline-grid;place-items:center;width:22px;height:28px;border-radius:5px;background:var(--pale);font-size:16px;color:var(--ink);opacity:0;transform:translateX(360px);position:relative;}.bag::before{content:"";position:absolute;top:-5px;left:50%;width:8px;height:5px;margin-left:-4px;border:1.5px solid var(--soft);border-bottom:0;border-radius:3px 3px 0 0;}.bag.gap{background:transparent;width:6px;}.bag.gap::before{display:none;}.bag.zbag{width:32px;height:40px;background:linear-gradient(135deg,var(--blue),var(--peri) 55%,var(--mauve));color:#ffffff;font-family:"Dancing Script",cursive;font-weight:600;font-size:26px;}.play .bag{animation:ride 1s cubic-bezier(.2,.7,.3,1) calc(.2s + var(--i) * .13s) forwards;}@keyframes ride{0%{opacity:1;transform:translateX(360px);}85%{transform:translateX(-3px) rotate(-2deg);}100%{opacity:1;transform:none;}}.belt{width:100%;max-width:300px;height:7px;border-radius:4px;background:repeating-linear-gradient(90deg,var(--soft) 0 14px,#ebeaf7 14px 20px);}.play .belt{animation:belt .35s linear 8;}@keyframes belt{from{background-position:0 0;}to{background-position:-20px 0;}}.card-scene{perspective:900px;}.card-scene{opacity:0;transform:translateY(20px);}.play .card-scene{animation:rise .6s ease-out forwards;}.card{width:250px;height:156px;position:relative;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.5,0,.2,1);}.face.back{transition:opacity 0s linear .45s;}.face.front{opacity:0;transition:opacity 0s linear .45s;}.flipped .face.back{opacity:0;}.flipped .face.front{opacity:1;}.flipped .card{transform:rotateY(180deg);}.face{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;}.face.back{background:#f3f1fb;}.face.back svg{width:100%;height:100%;}.face.front{transform:rotateY(180deg);background:linear-gradient(135deg,var(--blue),var(--lilac) 55%,var(--mauve));display:grid;place-items:center;align-content:center;gap:4px;color:#ffffff;}.face.front .greet{font-size:11px;letter-spacing:.3em;opacity:.9;}.face.front .big{font-size:30px;font-weight:500;white-space:nowrap;}.pm{fill:none;stroke:var(--peri);stroke-width:1.2;stroke-dasharray:1;stroke-dashoffset:1;}.play .pm{animation:draw .6s ease-out forwards;}.addr{stroke:#c9c6ea;stroke-width:1.2;stroke-dasharray:1;stroke-dashoffset:1;}.play .addr{animation:draw .5s ease-out forwards;}.needle{transform-box:view-box;transform-origin:110px 100px;}.play .needle{animation:seek 3.2s cubic-bezier(.3,.1,.3,1) forwards;}@keyframes seek{0%{transform:rotate(-40deg);}45%{transform:rotate(790deg);}62%{transform:rotate(694deg);}76%{transform:rotate(735deg);}88%{transform:rotate(714deg);}100%{transform:rotate(720deg);}}.ring-l{font:400 8.5px "Outfit",sans-serif;fill:var(--muted);}.ring-z{fill:none;stroke:var(--lilac);stroke-width:11;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s;}.done .ring-z{stroke:var(--peri);}.compass-halo{fill:none;stroke:var(--mauve);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center;}.done .compass-halo{animation:ripple 1.2s ease-out forwards;}.window{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;}.window.dragging{cursor:grabbing;}@keyframes lift{0%{transform:translateY(0);}72%{transform:translateY(-134px);}86%{transform:translateY(-124px);}100%{transform:translateY(-128px);}}.window .cabin{animation:bob 3.2s ease-in-out infinite;}@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-2.5px);}}.window .cloud{fill:#ffffff;}.window .drift1{animation:drift 6s linear infinite;}.window .drift2{animation:drift 9s linear -3s infinite;}.window .drift3{animation:drift 4.5s linear -2s infinite;}.window .drift4{animation:drift 7.5s linear -5s infinite;}@keyframes drift{from{transform:translateX(140px);}to{transform:translateX(-160px);}}.window .cal-pen{fill:none;stroke:#ffffff;stroke-width:24;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;}.play .window .cal-pen{animation:draw 1.8s cubic-bezier(.45,0,.35,1) 1.3s forwards;}.window .wing{transform-box:fill-box;transform-origin:0% 100%;animation:flex 3.2s ease-in-out infinite;}@keyframes flex{0%,100%{transform:rotate(0);}50%{transform:rotate(-1.5deg);}}.window .svg-cap{opacity:0;}.play .window .svg-cap{animation:fadein .8s ease-out 1.8s forwards;}.tile:hover .window .cabin{animation-duration:1.2s;}.sky-trail{fill:none;stroke:url(#sky-grad);stroke-width:9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:url(#puff);}.done .sky-trail{animation:diffuse 3s ease-out forwards;}@keyframes diffuse{to{stroke-width:13;opacity:.75;}}.sky .plane{transition:opacity .6s;}.done.sky-tile .sky .plane{opacity:0;}.m-line{fill:none;stroke:var(--peri);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;}.play .m-line{animation:draw 1s cubic-bezier(.55,0,.3,1) .2s forwards;}.m-stop{fill:#ffffff;stroke:var(--peri);stroke-width:3;transform-box:fill-box;transform-origin:center;transform:scale(0);transition:fill .25s;}.play .m-stop{animation:pop .4s cubic-bezier(.3,1.8,.5,1) forwards;animation-delay:calc(.9s + var(--i) * .08s);}.m-stop.lit{fill:var(--mauve);}.m-lbl{font:400 11px "Outfit",sans-serif;fill:var(--muted);transition:fill .25s;}.m-lbl.lit{fill:var(--ink);}.m-train{fill:var(--ink);opacity:0;}.play .m-train{animation:fadein .2s linear 1.2s forwards;}.m-term{fill:#ffffff;stroke:var(--ink);stroke-width:3;}.m-zlabel{font:400 22px "Outfit",sans-serif;fill:var(--ink);opacity:0;}.done .m-zlabel{animation:fadein .7s ease-out forwards;}.m-name{font:400 9.5px "Outfit",sans-serif;letter-spacing:3px;fill:var(--peri);}.czg{display:inline-block;height:1.5em;width:.81em;overflow:visible;vertical-align:-.5em;fill:none;stroke:url(#sky-grad);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;}.czg.white{stroke:#ffffff;}.czu{fill:none;stroke-width:8;stroke-linecap:round;stroke-linejoin:round;}.stub .gate-z{height:40px;width:22px;vertical-align:0;stroke-width:9;}.zbag .czg{height:30px;width:16px;vertical-align:0;stroke-width:10;}.bloom,.wc,.pixel,.stars,.liquid{width:min(100%,290px);overflow:visible;}.cap-html{font-size:16px;color:var(--ink);opacity:0;white-space:nowrap;}.done .cap-html{animation:fadein .8s ease-out forwards;}.stack-c{display:grid;justify-items:center;gap:16px;}.small-cap{font-size:12px;letter-spacing:.38em;padding-left:.38em;color:var(--ink);opacity:0;white-space:nowrap;}.done .small-cap{animation:fadein .8s ease-out forwards;}.floret{transform:scale(0);transform-box:fill-box;transform-origin:center;}.play .floret{animation:pop .45s cubic-bezier(.3,1.8,.5,1) forwards;}.drop{fill:var(--peri);transform:translateY(-110px);opacity:0;transform-box:fill-box;transform-origin:center;}.play .drop{animation:dropfall .9s forwards;}@keyframes dropfall{0%{opacity:1;transform:translateY(-110px);animation-timing-function:cubic-bezier(.55,0,1,.45);}60%{opacity:1;transform:translateY(0) scale(1);}100%{opacity:0;transform:translateY(0) scale(3);}}.blot{transform:scale(0);transform-box:fill-box;transform-origin:center;opacity:.6;mix-blend-mode:multiply;}.play .blot{animation:spread 1.4s cubic-bezier(.2,.8,.2,1) forwards;}@keyframes spread{to{transform:scale(1);}}.wc-z{opacity:0;}.play .wc-z{animation:fadein .8s ease-out 1.5s forwards;}.magnet{display:flex;align-items:center;font-size:38px;font-weight:600;white-space:pre;}.mg{display:inline-block;transform:translate(var(--x,0px),var(--y,0px)) rotate(var(--r,0deg));transition:transform .8s cubic-bezier(.3,1.5,.5,1);transition-delay:calc(var(--i) * 30ms);}.mg.c1{color:#8db6ea;}.mg.c2{color:#5d63c9;}.mg.c3{color:#c487d4;}.mg.c4{color:#a99be8;}.mgz .czg{stroke-width:13;}.magnet.instant .mg{transition:none;}.env{position:relative;width:190px;height:124px;margin-top:60px;perspective:700px;}.env .eback{position:absolute;inset:0;background:#d9d8f1;border-radius:6px;}.env .letter{position:absolute;left:12px;right:12px;top:8px;height:108px;background:#ffffff;border-radius:4px;display:grid;place-items:center;align-content:start;padding-top:10px;gap:0;z-index:1;}.env .letter .lz{font-size:44px;line-height:1;}.env .letter .ln{font-size:13px;letter-spacing:.08em;white-space:nowrap;}.play .env .letter{animation:pull 1s cubic-bezier(.2,.8,.2,1) 1.05s forwards;}@keyframes pull{to{transform:translateY(-74px);}}.env .pocket{position:absolute;inset:0;background:#e9e7f9;clip-path:polygon(0 28%,50% 64%,100% 28%,100% 100%,0 100%);border-radius:6px;z-index:2;}.env .flap{position:absolute;left:0;right:0;top:0;height:64%;background:#c9c6ea;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;z-index:3;}.play .env .flap{animation:openflap .7s ease-in-out .3s forwards;}@keyframes openflap{0%{transform:rotateX(0);z-index:3;}49%{z-index:3;}50%{z-index:0;}100%{transform:rotateX(180deg);z-index:0;}}.neon{font-size:40px;font-weight:300;color:#5d63c9;white-space:nowrap;display:flex;align-items:center;text-shadow:0 0 3px rgba(141,182,234,.9),0 0 12px rgba(169,155,232,.85),0 0 28px rgba(196,135,212,.65);}.neon span{opacity:.07;}.neon .neon-z{stroke:#8b6fd6;filter:drop-shadow(0 0 3px rgba(141,182,234,.9)) drop-shadow(0 0 10px rgba(196,135,212,.75));margin:0 .04em;}.play .neon .tube1{animation:flick 1.1s steps(1) .2s forwards;}.play .neon .tube2{animation:flick 1s steps(1) 1.1s forwards,buzz 4s steps(1) 2.4s infinite;}@keyframes flick{0%{opacity:.07;}10%{opacity:1;}14%{opacity:.1;}24%{opacity:1;}28%{opacity:.2;}40%,100%{opacity:1;}}@keyframes buzz{0%,90%,100%{opacity:1;}92%{opacity:.35;}94%{opacity:1;}96%{opacity:.5;}}.jelly{display:flex;align-items:baseline;font-size:40px;font-weight:400;white-space:pre;}.jelly span{display:inline-block;transform-origin:50% 100%;cursor:default;}.jelly .jz .czg{stroke-width:8;}.play .jelly span{animation:jello .8s cubic-bezier(.3,1.6,.5,1) calc(var(--i) * .06s) both;}.tile .jelly span:hover{animation:wobble .6s ease both !important;}@keyframes jello{0%{transform:scale(1,0);opacity:0;}40%{transform:scale(1.2,.7);opacity:1;}65%{transform:scale(.9,1.15);}100%{transform:none;opacity:1;}}@keyframes wobble{0%{transform:none;}30%{transform:scale(1.25,.75);}50%{transform:scale(.85,1.18);}70%{transform:scale(1.06,.95);}100%{transform:none;}}.px{opacity:0;transform:scale(0);transform-box:fill-box;transform-origin:center;}.play .px{animation:pxin .3s ease-out forwards;}@keyframes pxin{to{opacity:1;transform:scale(1);}}.done .pix{animation:fadeout .6s ease-out forwards;}@keyframes fadeout{to{opacity:0;}}.pz{opacity:0;}.done .pz{animation:fadein .7s ease-out .25s forwards;}.spot{position:relative;font-size:42px;font-weight:500;white-space:nowrap;line-height:1.3;}.spot-base .czg{stroke:#e6e4f6;}.spot-base{color:#e6e4f6;}.spot-top{position:absolute;inset:0;--mx:-100px;--my:50%;--r:54px;-webkit-mask-image:radial-gradient(circle var(--r) at var(--mx) var(--my),#000 60%,transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--mx) var(--my),#000 60%,transparent 100%);}.chain{display:flex;gap:3px;perspective:600px;align-items:center;}.ct{position:relative;width:23px;height:34px;transform-style:preserve-3d;}.ct.gap{width:8px;}.ct.zt{width:32px;height:44px;}.ct .f,.ct .b{position:absolute;inset:0;border-radius:4px;display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;}.ct .f{background:var(--pale);}.ct .b{background:#ffffff;transform:rotateY(180deg);font-size:19px;color:var(--ink);opacity:0;}.ct.zt .b{background:linear-gradient(135deg,var(--blue),var(--peri) 55%,var(--mauve));color:#ffffff;font-size:28px;}.ct.gap .f{background:transparent;}.play .ct{animation:tflip .5s cubic-bezier(.4,0,.2,1) calc(.3s + var(--i) * .1s) forwards;}.play .ct .f{animation:hidehalf .5s steps(1) calc(.3s + var(--i) * .1s) forwards;}.play .ct .b{animation:showhalf .5s steps(1) calc(.3s + var(--i) * .1s) forwards;}@keyframes tflip{to{transform:rotateY(180deg);}}@keyframes hidehalf{0%{opacity:1;}50%,100%{opacity:0;}}@keyframes showhalf{0%{opacity:0;}50%,100%{opacity:1;}}.bgstar{fill:var(--lilac);animation:twinkle var(--dur,3s) ease-in-out var(--del,0s) infinite;}@keyframes twinkle{0%,100%{opacity:.2;}50%{opacity:1;}}.zs{fill:var(--peri);transform:scale(0);transform-box:fill-box;transform-origin:center;}.play .zs{animation:pop .4s cubic-bezier(.3,1.8,.5,1) forwards;}.cl{fill:none;stroke:url(#sky-grad);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;}.play .cl{animation:draw 1.6s cubic-bezier(.55,0,.3,1) 1s forwards;}.lq-text{font:500 42px "Outfit",sans-serif;}.lq-outline{fill:none;stroke:#d9d8f1;stroke-width:1;}.lq-rise{transform:translateY(100px);}.play .lq-rise{animation:lqrise 2.6s cubic-bezier(.3,.6,.3,1) .2s forwards;}@keyframes lqrise{to{transform:translateY(34px);}}.lq-wave{animation:lqwave 1.4s linear infinite;}@keyframes lqwave{from{transform:translateX(0);}to{transform:translateX(-100px);}}.layers{position:relative;width:150px;height:150px;--sx:0;--sy:0;}.ly{position:absolute;inset:0;display:grid;place-items:center;font-family:"Dancing Script",cursive;font-weight:600;font-size:136px;line-height:1;transform:translate(calc(var(--d) * var(--sx) * 1px),calc(var(--d) * var(--sy) * 1px));transition:transform .6s cubic-bezier(.3,1.5,.5,1);}.ly.d3{color:#ebe9f8;}.ly.d2{color:#d4d1f0;}.ly.d1{color:#b3a8ea;}.env .letter .czg.lz{height:40px;width:22px;vertical-align:0;stroke-width:9;margin-bottom:4px;}.ct.zt .b .czg{height:32px;width:17px;vertical-align:0;stroke-width:10;}.ly .czg{height:140px;width:76px;vertical-align:0;stroke-width:9;}.ly.d3 .czg{stroke:#ebe9f8;}.ly.d2 .czg{stroke:#d4d1f0;}.ly.d1 .czg{stroke:#b3a8ea;}
body{padding:32px 24px 56px}.gallery-top{max-width:1180px;margin:0 auto 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}.gallery-top h1{font-size:clamp(26px,4vw,42px);letter-spacing:-.04em}.gallery-top p{color:var(--muted);margin-top:8px;max-width:650px;line-height:1.55}.gallery-actions{display:flex;align-items:center;gap:16px}.gallery-actions a{color:var(--peri);text-decoration:none;font-weight:600;white-space:nowrap}.gallery-actions a:hover{text-decoration:underline}.gallery-actions button{border:1px solid #d9d8f1;background:#fff;color:var(--ink);border-radius:999px;padding:10px 16px;font:600 13px Outfit,system-ui,sans-serif;cursor:pointer}.gallery-actions button:hover{background:var(--tile-hover)}.section-head{max-width:1180px;margin:0 auto 18px}.grid{max-width:1180px;margin:0 auto;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}.tile{cursor:pointer}@media(max-width:640px){body{padding:22px 14px 40px}.gallery-top{align-items:flex-start;flex-direction:column}.gallery-actions{flex-wrap:wrap}}.gallery-eyebrow{margin:0 0 10px;color:#6869a8;font-size:10px;font-weight:600;letter-spacing:.19em;text-transform:uppercase}.gallery-top h1{margin:0;font-weight:400;letter-spacing:-.045em}.gallery-intro{max-width:760px;margin-top:13px;color:#55576c;font-size:15px;line-height:1.7;font-weight:300}.gallery-instruction{margin-top:12px;color:#77798b;font-size:12px;letter-spacing:.015em}.gallery-actions{align-self:flex-start;padding-top:22px}.gallery-actions a{text-decoration:none;border-bottom:1px solid rgba(93,99,201,.35);padding-bottom:3px}.gallery-actions a:hover{border-color:#5d63c9}@media(max-width:640px){.gallery-actions{padding-top:0}.gallery-intro{font-size:14px;line-height:1.65}}
/* Crisp pixel-to-mark finish and the new Ribbon experiment */
.done .pix{animation:fadeout .45s ease-out forwards}
.pz{opacity:0}
.done .pz{animation:fadein .45s ease-out .12s forwards}
.ribbon-art{width:min(100%,290px);overflow:visible}
.ribbon-piece{fill:url(#ribbon-grad);transform-box:fill-box;transform-origin:center;opacity:0}
.play .ribbon-top{animation:ribbon-top .75s cubic-bezier(.2,.8,.2,1) .12s forwards}
.play .ribbon-diag{animation:ribbon-diag .8s cubic-bezier(.2,.8,.2,1) .34s forwards}
.play .ribbon-bottom{animation:ribbon-bottom .75s cubic-bezier(.2,.8,.2,1) .56s forwards}
@keyframes ribbon-top{from{opacity:0;transform:translate(-24px,-16px) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes ribbon-diag{from{opacity:0;transform:translate(22px,-16px) rotate(8deg)}to{opacity:1;transform:none}}
@keyframes ribbon-bottom{from{opacity:0;transform:translate(-18px,18px) rotate(7deg)}to{opacity:1;transform:none}}

/* Pixel to polish: liquid pixel merge into the handwritten mark */
.px-morph{isolation:isolate}
.px{opacity:0;transform:scale(0);transform-box:fill-box;transform-origin:center}
.play .px{animation:pxin .3s ease-out forwards}
.pz{opacity:0}
.pixel .svg-cap{opacity:0}
.pixel.done .svg-cap{animation:fadein .8s ease-out forwards}
.pixel .pix{transition:opacity .05s linear}

/* Editorial introduction: clearer hierarchy, natural reading typography, and a quiet frame */
.gallery-top{max-width:1180px;align-items:flex-end;margin:0 auto 34px;gap:30px}
.gallery-heading{flex:1;min-width:0}
.gallery-top .gallery-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:600 10px/1.2 "Outfit",sans-serif;letter-spacing:.19em;text-transform:uppercase;color:#777b98}
.eyebrow-line{display:inline-block;width:24px;height:1px;background:linear-gradient(90deg,var(--blue),var(--mauve))}
.gallery-top h1{font-family:"Avenir Next","Segoe UI",system-ui,sans-serif;font-size:clamp(30px,3.4vw,42px);font-weight:600;letter-spacing:-.045em;line-height:1.08;color:var(--ink);margin:0 0 19px}
.intro-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 225px;gap:34px;padding:25px 28px 24px 30px;border:1px solid rgba(111,112,164,.2);border-radius:13px;background:linear-gradient(135deg,#fff 0%,#fbfbff 65%,#f8f6fc 100%);box-shadow:0 2px 5px rgba(38,40,59,.025),0 12px 30px rgba(62,64,112,.075),inset 0 1px 0 rgba(255,255,255,.95);overflow:hidden}
.intro-panel:before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--blue),var(--peri),var(--mauve))}
.intro-main{min-width:0}
.intro-kicker{font:600 10px/1.2 "Outfit",sans-serif!important;letter-spacing:.17em!important;text-transform:uppercase;color:var(--peri)!important;margin:0 0 10px!important}
.gallery-top .gallery-intro{max-width:760px;margin:0!important;color:#45475a;font-family:"Avenir Next","Segoe UI",system-ui,sans-serif;font-size:15px;font-weight:400;line-height:1.75;letter-spacing:-.008em;text-wrap:pretty}
.intro-guide{align-self:stretch;padding:3px 0 0 24px;border-left:1px solid rgba(111,112,164,.16);display:flex;flex-direction:column;justify-content:center;gap:13px}
.guide-title{font:600 10px/1.2 "Outfit",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8587a0;margin-bottom:1px}
.guide-step{display:grid;grid-template-columns:25px 1fr;gap:9px;align-items:start}
.guide-step>span{font:500 10px/1.6 "Outfit",sans-serif;letter-spacing:.08em;color:#9698b1}
.guide-step p{display:grid;gap:2px}
.guide-step strong{font:600 12px/1.3 "Avenir Next","Segoe UI",system-ui,sans-serif;color:var(--ink)}
.guide-step small{font:400 11px/1.45 "Avenir Next","Segoe UI",system-ui,sans-serif;color:#77798d}
.gallery-actions{display:flex;flex-direction:column;align-items:flex-end;gap:12px;flex-shrink:0;padding-bottom:2px}
.gallery-actions a{font:500 11px/1.4 "Outfit",sans-serif;color:#77798d;text-decoration:none}
.gallery-actions a:hover{color:var(--peri)}
.gallery-actions button{border:1px solid rgba(93,99,201,.18);box-shadow:0 3px 10px rgba(38,40,59,.06);background:#fff;padding:11px 16px}
.gallery-actions button:hover{background:#f5f4fc;border-color:rgba(93,99,201,.35)}
@media(max-width:760px){
 .gallery-top{display:flex;flex-direction:column;align-items:stretch;gap:17px;margin-bottom:26px}
 .intro-panel{grid-template-columns:1fr;gap:18px;padding:22px 21px 20px 24px}
 .gallery-top .gallery-intro{font-size:14.5px;line-height:1.7}
 .intro-guide{border-left:0;border-top:1px solid rgba(111,112,164,.16);padding:15px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 .guide-title{grid-column:1/-1}
 .guide-step{grid-template-columns:1fr;gap:4px}
 .gallery-actions{flex-direction:row;align-items:center;justify-content:space-between;width:100%;padding:0}
}
@media(max-width:420px){.intro-panel{padding:20px 17px 18px 21px}.intro-guide{grid-template-columns:1fr;gap:9px}.guide-title{grid-column:auto}.guide-step{grid-template-columns:25px 1fr;gap:8px}}

/* Tile chain: individual 3D flips reveal the name in a left-to-right sequence */
.tile-chain{width:100%;display:flex;justify-content:center;align-items:center;overflow:visible}
.tc-chain{display:flex;gap:3px;align-items:flex-end;padding:16px 0 10px;perspective:520px;perspective-origin:50% -40%;transform:scale(.88);transform-origin:center}
.tc-wrap{display:block;position:relative;width:23px;height:34px;flex:0 0 23px}
.tc-wrap.tc-gap{width:6px;flex-basis:6px}
.tc-wrap.tc-z{width:32px;height:44px;flex-basis:32px}
.tc-shadow{position:absolute;left:6%;right:6%;bottom:-6px;height:6px;border-radius:50%;background:rgba(38,40,59,.28);filter:blur(2.5px)}
.tc-gap .tc-shadow{display:none}
.tc-tile{display:block;position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 50%;will-change:transform}
.tc-front,.tc-back{position:absolute;inset:0;border-radius:3px;display:grid;place-items:center;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.tc-front{transform:translateZ(3px);background:radial-gradient(circle,rgba(255,255,255,.75) 0 1.2px,transparent 1.6px) 0 0/7px 7px,linear-gradient(135deg,#b9d0f2,#a99be8 60%,#c487d4);box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
.tc-back{transform:rotateY(180deg) translateZ(3px);background:linear-gradient(180deg,#fff,#f2f2fa);font:400 19px/1 "Outfit",system-ui,sans-serif;color:#26283b;box-shadow:inset 0 -2px 0 rgba(93,99,201,.12)}
.tc-special .tc-back{background:linear-gradient(135deg,#8db6ea,#5d63c9 55%,#c487d4);box-shadow:none}
.tc-z-mark{width:17px;height:32px;fill:none;stroke:#fff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.tc-tile:before,.tc-tile:after{content:"";position:absolute;top:1px;bottom:1px;width:6px;transform:rotateY(90deg);background:linear-gradient(90deg,#9a96dc 50%,#dcdcef 50%)}
.tc-tile:before{left:-3px}.tc-tile:after{left:calc(100% - 3px)}
.tc-special:before,.tc-special:after{background:linear-gradient(90deg,#9a96dc 50%,#4b51b3 50%)}
.tc-empty .tc-front,.tc-empty:before,.tc-empty:after{display:none}
.tc-front:after,.tc-back:after{content:"";position:absolute;inset:0;background:#26283b;opacity:0;pointer-events:none}
.tc-chain.is-playing .tc-tile{animation:tc-flip .75s cubic-bezier(.45,0,.25,1) calc(.3s + var(--i)*.1s) both}
.tc-chain.is-playing .tc-shadow{animation:tc-shadow .75s cubic-bezier(.45,0,.25,1) calc(.3s + var(--i)*.1s) both}
.tc-chain.is-playing .tc-front:after{animation:tc-shade-out .75s linear calc(.3s + var(--i)*.1s) both}
.tc-chain.is-playing .tc-back:after{animation:tc-shade-in .75s linear calc(.3s + var(--i)*.1s) both}
@keyframes tc-flip{0%{transform:translateY(0) translateZ(0) rotateY(0)}45%{transform:translateY(-10px) translateZ(16px) rotateY(100deg)}80%{transform:translateY(0) translateZ(0) rotateY(190deg)}100%{transform:translateY(0) translateZ(0) rotateY(180deg)}}
@keyframes tc-shadow{0%,100%{transform:none;opacity:1}45%{transform:translateY(2px) scale(.7,.8);opacity:.4}80%{transform:none;opacity:1}}
@keyframes tc-shade-out{0%{opacity:0}45%,100%{opacity:.4}}
@keyframes tc-shade-in{0%,45%{opacity:.45}100%{opacity:0}}
@media(max-width:380px){.tc-chain{transform:scale(.78)}}