.guide-page{background:#050719;color:#f2eddd}
.guide-header{height:80px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(20px,5vw,76px);border-bottom:1px solid rgba(191,236,255,.18);background:#050719}
.guide-header>p{font-size:.54rem;color:#9296b1}.back-link{position:relative;justify-self:end;display:grid;place-items:center;min-height:44px;font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;text-decoration:none;color:#d0d2df;transition:color .25s}.back-link::after{content:"";position:absolute;left:0;right:100%;bottom:5px;height:1px;background:#62dcff;transition:right .45s cubic-bezier(.16,1,.3,1)}.back-link:hover{color:#62dcff}.back-link:hover::after,.back-link:focus-visible::after{right:0}
.guide-hero{position:relative;min-height:720px;padding:clamp(105px,11vw,160px) clamp(20px,8vw,116px) 88px;overflow:hidden;background:radial-gradient(ellipse at 80% 42%,rgba(66,148,235,.22),transparent 35%),linear-gradient(180deg,#080a29,#141440 58%,#29264f);border-bottom:1px solid rgba(191,236,255,.18);isolation:isolate}
.guide-hero::before{content:"83";position:absolute;right:-.03em;bottom:-.23em;font-size:33rem;font-weight:800;line-height:1;color:rgba(174,234,255,.025);letter-spacing:-.17em;z-index:-1}
.guide-hero .kicker{animation:guideRise .8s .08s both cubic-bezier(.16,1,.3,1)}.guide-hero h1{position:relative;z-index:2;font-size:clamp(4.4rem,8.8vw,9.2rem);line-height:.79;letter-spacing:-.09em;font-weight:620;max-width:1050px;text-wrap:balance;animation:guideRise 1.1s .16s both cubic-bezier(.16,1,.3,1)}.guide-hero h1 em{font-style:normal;font-weight:220;color:#c8f8ff;text-shadow:0 0 28px rgba(98,220,255,.42)}
.guide-deck{position:relative;z-index:2;margin:36px 0 0 11%;max-width:380px;color:#c4c6d7;font-size:.9rem;line-height:1.7;animation:guideRise .9s .32s both cubic-bezier(.16,1,.3,1)}
.guide-geometry{position:absolute;right:-7%;top:17%;width:60%;height:53%;transform:rotate(-5deg);opacity:.76;z-index:1;animation:geometryArrive 1.5s .2s both cubic-bezier(.16,1,.3,1)}.guide-earth{position:absolute;left:0;right:0;bottom:-64%;height:100%;border-radius:50% 50% 0 0;border-top:1px solid rgba(98,220,255,.54);background:radial-gradient(ellipse at 50% 0,rgba(46,54,119,.8),transparent 62%);box-shadow:0 -10px 45px rgba(98,220,255,.1)}.guide-ray{position:absolute;left:-8%;right:9%;top:41%;height:1px;background:linear-gradient(90deg,rgba(255,191,137,.9),rgba(98,220,255,.55),transparent);box-shadow:0 0 12px rgba(98,220,255,.5);transform:rotate(3deg);transform-origin:left;animation:rayIgnite 1.5s .65s both cubic-bezier(.16,1,.3,1)}.guide-geometry>span{position:absolute;right:13%;top:23%;color:#9beaff;font-size:.55rem}.guide-cloud{position:absolute;right:4%;top:27%;width:62%;height:35%;filter:drop-shadow(0 0 12px rgba(98,220,255,.45))}.guide-cloud i{position:absolute;left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,#62dcff 22%,#e5fdff 55%,transparent);top:calc(var(--i,1)*12%);border-radius:50%;transform:skewY(-5deg)}.guide-cloud i:nth-child(1){--i:1}.guide-cloud i:nth-child(2){--i:2;left:8%}.guide-cloud i:nth-child(3){--i:3;left:-5%}.guide-cloud i:nth-child(4){--i:4;left:12%}.guide-cloud i:nth-child(5){--i:5;left:-2%}.guide-cloud i:nth-child(6){--i:6;left:15%}
@keyframes guideRise{from{opacity:0;transform:translateY(28px)}}@keyframes geometryArrive{from{opacity:0;transform:rotate(-5deg) translateX(8%)}}@keyframes rayIgnite{from{opacity:0;transform:rotate(3deg) scaleX(.1)}}
.hero-index{position:absolute;z-index:2;right:6%;bottom:48px;display:flex;gap:30px;font-size:.53rem;color:#9a9db5}.hero-index span::before{content:"+ ";color:#62dcff}
.guide-article{width:min(1280px,calc(100% - 64px));margin:0 auto;display:grid;grid-template-columns:240px minmax(0,850px);justify-content:space-between;gap:7vw;padding:125px 0 140px}.guide-rail{align-self:start;position:sticky;top:30px;display:grid;gap:0;border-top:1px solid rgba(191,236,255,.2);padding-top:18px}.guide-rail>span{color:#62dcff;font-size:.63rem;margin-bottom:22px}.guide-rail div{display:flex;flex-direction:column;border-bottom:1px solid rgba(191,236,255,.14);padding:17px 0}.guide-rail b{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em}.guide-rail small{color:#9da0b8;margin-top:4px}
.guide-copy{max-width:850px}.guide-copy section{position:relative;padding-bottom:106px}.guide-copy section+section{padding-top:18px;border-top:1px solid rgba(191,236,255,.18)}.guide-copy section::before{content:attr(data-section);position:absolute;right:0;top:0;font:400 6rem/1 'Major Mono Display';color:rgba(190,235,255,.025)}.guide-copy h2{font-size:clamp(2.8rem,4.9vw,5.2rem);line-height:.94;margin-bottom:38px;max-width:820px}.guide-copy p:not(.kicker){font-size:1rem;line-height:1.86;color:#c3c5d5;max-width:760px;text-wrap:pretty}.guide-copy p+p{margin-top:24px}.guide-copy code{font-family:'Major Mono Display';font-size:.7em;color:#c8f8ff;background:rgba(98,220,255,.09);padding:2px 5px;overflow-wrap:anywhere}
.token-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(191,236,255,.2);border:1px solid rgba(191,236,255,.2);margin-bottom:36px}.token-grid div{position:relative;background:#080a29;padding:22px 20px 22px 72px;display:flex;flex-direction:column;min-height:92px;justify-content:center;transition:background-color .3s}.token-grid div:hover{background:#0d1238}.token-grid div::before{content:"";position:absolute;left:21px;top:25px;width:32px;height:40px;background:var(--swatch);border:1px solid rgba(255,255,255,.25);box-shadow:0 0 17px color-mix(in srgb,var(--swatch),transparent 55%);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .3s}.token-grid div:hover::before{transform:scale(1.08);box-shadow:0 0 26px color-mix(in srgb,var(--swatch),transparent 35%)}.token-grid b{font-size:.81rem}.token-grid span{font:400 .61rem 'Major Mono Display';color:#a9acc0;margin-top:5px}
.reproduce{margin-top:6px;padding:72px 62px 76px!important;border:1px solid rgba(98,220,255,.28)!important;background:radial-gradient(circle at 100% 0,rgba(98,220,255,.14),transparent 38%),linear-gradient(140deg,#09102c,#0c1733)}.reproduce::after{content:"PROMPT / COUPLE THE LIGHT";position:absolute;right:22px;bottom:17px;font:400 .48rem 'Major Mono Display';color:rgba(137,232,255,.5)}.reproduce h2{font-size:clamp(2.8rem,4.5vw,4.6rem);max-width:690px}
@media(max-width:900px){.guide-header{grid-template-columns:1fr auto}.guide-header>p{display:none}.guide-hero{min-height:720px;padding-top:132px}.guide-geometry{right:-22%;top:26%;width:84%;opacity:.57}.guide-article{width:calc(100% - 64px);grid-template-columns:1fr;padding-block:95px;gap:70px}.guide-rail{position:static;grid-template-columns:repeat(4,1fr);border-bottom:1px solid rgba(191,236,255,.18)}.guide-rail>span{grid-column:1/-1}.guide-rail div{border-bottom:0;padding-right:18px}.guide-copy{max-width:none}.guide-copy p:not(.kicker){max-width:780px}.guide-copy section{padding-bottom:88px}}
@media(max-width:520px){.guide-header{height:68px;padding-inline:18px}.back-link{font-size:.56rem}.guide-hero{min-height:700px;padding:108px 18px 74px}.guide-hero h1{font-size:clamp(3.55rem,16.4vw,5.05rem);line-height:.81}.guide-deck{margin:28px 0 0;max-width:285px;font-size:.82rem}.guide-geometry{width:125%;right:-52%;top:43%;opacity:.42}.hero-index{left:18px;right:18px;bottom:36px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.guide-article{width:calc(100% - 36px);padding-block:78px;gap:56px}.guide-rail{grid-template-columns:1fr 1fr}.guide-rail>span{grid-column:1/-1}.guide-rail div{padding-right:10px}.guide-copy section{padding-bottom:76px}.guide-copy h2{font-size:clamp(2.6rem,13vw,4rem);margin-bottom:30px}.guide-copy p:not(.kicker){font-size:.94rem;line-height:1.82}.token-grid{grid-template-columns:1fr}.reproduce{padding:40px 24px 56px!important}.guide-page .site-footer{padding-top:44px}}
