.env-intro{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;background:radial-gradient(135% 105% at 50% 42%,#100d0a 0%,#070609 70%);overflow:hidden}html:not(.env-playing) .env-intro{display:none}html.env-playing{overflow:hidden}.env-intro{--ew:min(82vw, 470px);--eh:calc(var(--ew) * 0.66);--pw:calc(var(--ew) * 0.84);--ph:calc(var(--ew) * 0.56);--paper:#f2ede1;--paper-2:#e7e0d0;--paper-3:#dbd2be;--paper-in:#efe9dc;--seam:rgba(120, 104, 74, 0.26);--gold:#e0a24a;--gold-deep:#a9772b;--e-out:cubic-bezier(0.16, 1, 0.3, 1);--e-spring:cubic-bezier(0.34, 1.28, 0.42, 1);--e-inout:cubic-bezier(0.6, 0, 0.3, 1);--e-expand:cubic-bezier(0.22, 1, 0.32, 1);--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}.env-scene{position:relative;width:var(--ew);height:var(--eh)}.env{position:absolute;inset:0;transform:translateY(96vh);transform-style:flat;will-change:transform}.env-intro.is-appear .env{animation:env-enter 1.15s var(--e-out)both}@keyframes env-enter{0%{transform:translateY(99vh)scale(.984)}60%{transform:translateY(-1.6%)scale(1.006)}100%{transform:translateY(0)scale(1)}}.env__grain{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background-image:var(--grain);background-size:140px 140px;mix-blend-mode:overlay;opacity:.07}.env__back,.env__pocket,.env__flap{position:absolute;left:0;width:var(--ew)}.env__back{top:0;height:var(--eh);z-index:0;border-radius:12px;overflow:hidden;background:radial-gradient(120% 80% at 50% 12%,var(--paper-in),var(--paper-3) 78%);box-shadow:0 48px 80px rgba(0,0,0,.55),inset 0 2px 6px rgba(120,104,74,.18);transform:translateZ(0);backface-visibility:hidden}.env-page{position:absolute;left:50%;top:50%;width:var(--pw);height:var(--ph);z-index:2;border-radius:12px;background:linear-gradient(158deg,#1b1610 0%,#100c08 55%,#0b0906 100%);box-shadow:0 0 0 1px rgba(224,162,74,.4)inset,0 20px 44px rgba(0,0,0,.55);transform:perspective(1200px)translate(-50%,-46%)rotateX(0);transform-origin:50% 50%;transition:transform .85s var(--e-spring),opacity .2s linear;will-change:transform;backface-visibility:hidden}.env-page__shadow{position:absolute;left:50%;bottom:-10%;width:74%;height:16%;transform:translateX(-50%)scale(1);background:radial-gradient(closest-side,rgba(0,0,0,.5),transparent);filter:blur(10px);opacity:0;z-index:-1;transition:opacity .6s var(--e-out),transform .85s var(--e-out)}.env-page__face{position:absolute;inset:0;padding:8.5%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.55em;overflow:hidden;border-radius:inherit}.env-page__face::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 70% at 18% 0%,rgba(224,162,74,.16),transparent 60%)}.epf-eyebrow{position:relative;font-family:var(--font-mono,monospace);font-size:calc(var(--ew) * .026);letter-spacing:.2em;text-transform:lowercase;color:var(--gold);opacity:.92}.epf-title{position:relative;font-family:var(--font-display,sans-serif);font-weight:800;font-size:calc(var(--ew) * .07);line-height:1.03;letter-spacing:-.02em;color:#f4f2ea;margin:.1em 0}.epf-title em{font-style:normal;color:var(--gold)}.epf-rule{position:relative;width:calc(var(--ew) * .17);height:2px;flex-shrink:0;background:linear-gradient(90deg,var(--gold),transparent);margin-top:.35em}.epf-foot{position:relative;font-family:var(--font-mono,monospace);font-size:calc(var(--ew) * .022);letter-spacing:.14em;color:rgba(244,242,234,.55)}.env-page__rim{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 60% at 50% 0%,rgba(224,162,74,.2),transparent 62%);opacity:0;transition:opacity .7s var(--e-spring)}.env__pocket{top:0;height:var(--eh);z-index:3;clip-path:polygon(0 0,50% 46%,100% 0,100% 100%,0 100%);background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%);border-radius:12px;overflow:hidden;transform:translateZ(0);backface-visibility:hidden}.env__pocket .env__grain{clip-path:polygon(0 0,50% 46%,100% 0,100% 100%,0 100%)}.env__pocket::before,.env__pocket::after{content:"";position:absolute;inset:0}.env__pocket::before{clip-path:polygon(0 0,50% 46%,50% 100%,0 100%);background:linear-gradient(120deg,#f6f1e6,#e9e2d2);box-shadow:1px 0 0 var(--seam)}.env__pocket::after{clip-path:polygon(100% 0,50% 46%,50% 100%,100% 100%);background:linear-gradient(240deg,#ded5c1,#efe8d9)}.env__flap{top:0;height:calc(var(--eh) * .6);z-index:6;transform-origin:50% 0;transform:perspective(1150px)rotateX(0);clip-path:polygon(0 0,100% 0,50% 100%);background:linear-gradient(180deg,#f4efe4 0%,#ece4d3 55%,#e2d9c6 100%);transition:transform .9s var(--e-inout);backface-visibility:visible;overflow:hidden}.env__sheen{position:absolute;inset:-10% 0;clip-path:polygon(0 0,100% 0,50% 100%);background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.3) 50%,transparent 58%);transform:translateX(-75%);opacity:0;will-change:transform}.env__seal{position:absolute;left:50%;top:calc(var(--eh) * .46);width:calc(var(--ew) * .13);height:calc(var(--ew) * .13);margin:calc(var(--ew) * -.065)0 0 calc(var(--ew) * -.065);z-index:7;border-radius:50%;transform-origin:50% 50%;background:radial-gradient(circle at 35% 30%,#f0c079,var(--gold) 45%,var(--gold-deep) 100%);box-shadow:0 2px 6px rgba(0,0,0,.35),inset 0 0 0 2px rgba(255,255,255,.18),inset 0 -4px 8px rgba(120,70,10,.5);transition:opacity .4s var(--e-inout),transform .5s var(--e-inout)}.env__seal b{position:absolute;inset:0;display:grid;place-items:center;color:#6d4310;font-family:var(--font-display,serif);font-weight:800;font-size:calc(var(--ew) * .07)}.env__seal .shard{position:absolute;left:50%;top:50%;width:42%;height:42%;margin:-21% 0 0 -21%;background:linear-gradient(160deg,var(--gold),var(--gold-deep));clip-path:polygon(50% 0,100% 75%,12% 100%);opacity:0}.env__flash{position:absolute;left:50%;top:50%;width:340%;height:340%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(240,200,130,.85),transparent 55%);opacity:0;pointer-events:none}.env-frame{position:fixed;inset:0;width:100vw;height:var(--app-vh,100dvh);z-index:9;opacity:0;overflow:hidden;background:var(--bg,#0c0b09);clip-path:inset(var(--fi-t,40vh) var(--fi-r,33vw) var(--fi-b,40vh) var(--fi-l,33vw) round 14px);transform:translateZ(0);will-change:clip-path,opacity;backface-visibility:hidden}.env-frame__hero{min-height:var(--app-vh,100dvh)}.env-intro.is-open .env__seal{opacity:0;transform:translateY(26px)scale(.5)rotate(24deg);transition:opacity .4s var(--e-inout).12s,transform .55s var(--e-inout).09s}.env-intro.is-open .env__seal b{animation:seal-pop .5s var(--e-inout)both}.env-intro.is-open .shard{animation:shard-fly .55s var(--e-out).05s both}.env-intro.is-open .shard.s2{animation-delay:.08s}.env-intro.is-open .shard.s3{animation-delay:.11s}.env-intro.is-open .env__flash{animation:seal-flash .34s ease .04s both}.env-intro.is-open .env__flap{transform:perspective(1150px)rotateX(166deg)}.env-intro.is-open .env__sheen{animation:flap-sheen .8s var(--e-inout).12s both}.env-intro.is-out .env__flap{z-index:1}.env-intro.is-out .env-page{transform:perspective(1200px)translate(-50%,-138%)rotateX(9deg)}.env-intro.is-out .env-page__shadow{opacity:.5;transform:translateX(-50%)scale(.7)}.env-intro.is-out .env-page__rim{opacity:1}.env-intro.is-expand .env-page{opacity:0}.env-intro.is-expand .env-frame{opacity:1;clip-path:inset(0 0 0 0 round 0);transition:clip-path .95s var(--e-expand),opacity .2s linear}.env-intro.is-expand .env__back,.env-intro.is-expand .env__pocket,.env-intro.is-expand .env__flap,.env-intro.is-expand .env__seal{opacity:0;transition:opacity .45s ease .15s}.env-intro.is-done{opacity:0;transition:opacity .4s ease}@keyframes seal-pop{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:translateY(26px)scale(.5)rotate(24deg);opacity:0}}@keyframes shard-fly{0%{opacity:1;transform:translate(0,0)rotate(0)scale(.8)}100%{opacity:0;transform:translate(var(--sx,0),var(--sy,40px))rotate(var(--sr,40deg))scale(1)}}@keyframes seal-flash{0%{opacity:0}35%{opacity:.85}100%{opacity:0}}@keyframes flap-sheen{0%{opacity:0;transform:translateX(-75%)}15%{opacity:1}100%{opacity:0;transform:translateX(75%)}}.shard.s1{--sx:-140%;--sy:120%;--sr:-50deg}.shard.s2{--sx:130%;--sy:150%;--sr:60deg}.shard.s3{--sx:-20%;--sy:190%;--sr:12deg}@media(prefers-reduced-motion:reduce){.env-intro{display:none!important}}