.galaxy-page{--paper:#f9f8ff;--ink:#252135;--muted:#686379;--line:#e3dfee;--green:#7151c4;--lime:#e9dfff;--gold:#e2d4ff;background:#f9f8ff;background-image:radial-gradient(ellipse at 78% 10%,#e9e0fa88,transparent 40%);color:var(--ink);overflow-x:clip}.galaxy-page .site-header{position:relative;z-index:5}.galaxy-page .site-brand>span{background:#e9e0ff;border-color:#9278be}.galaxy-page .site-brand small{color:#7c679c}.galaxy-page .site-nav a[aria-current=page]{border-color:#8362c8}.galaxy-page .motion-switch{border-color:#c8b8e2;color:#614687;background:#fbfaff}.galaxy-page .wrap{width:min(1280px,calc(100% - 96px))}.galaxy-page .badge{background:#e6dbff;color:#573582}.galaxy-page .pill:hover{background:#ede6fc}.reading-progress{position:fixed;inset:0 auto auto 0;width:100%;height:3px;transform:scaleX(0);transform-origin:left;z-index:100;background:linear-gradient(90deg,#7655d6,#ce72aa,#7dbbdf)}.section-space{padding-block:100px}.section-label,.mono{font:10px/1.8 var(--mono);letter-spacing:1.5px}.section-label{display:block;color:#736287;margin-bottom:22px}h2 em{font:italic 1em var(--serif);color:#7651a7}h2{font-size:clamp(35px,4vw,56px);font-weight:650;line-height:1.2;letter-spacing:-.055em}.galaxy-hero{display:grid;grid-template-columns:1fr 1.03fr;position:relative;gap:15px;align-items:center;padding:76px 0 48px;min-height:820px}.hero-content{position:relative;z-index:2}.hero-eyebrow{display:flex;align-items:center;gap:10px;font:9px var(--mono);letter-spacing:1px;color:#756888;margin-bottom:33px}.hero-eyebrow .badge{margin-left:7px;font-size:9px;padding:4px 7px}.signal-dot{display:inline-block;width:6px;height:6px;background:#9164ce;border-radius:50%;box-shadow:0 0 0 4px #9b73d214}.repo-chip{display:inline-flex;align-items:center;gap:9px;background:#fff9;padding:7px 12px;border:1px solid #dcd2ed;border-radius:7px;font:10px var(--mono);color:#615275;box-shadow:0 3px 8px #60417d03}.repo-chip svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5}.repo-chip b{color:#ab97c5;font-weight:400;padding:0 3px}.galaxy-hero h1{font-size:clamp(49px,5.7vw,82px);font-weight:800;letter-spacing:-.075em;line-height:1.15;margin:25px 0 28px}.galaxy-hero h1>span{color:#8052ba;background:linear-gradient(112deg,#6344be 8%,#9d4b9a 65%,#b75289);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-lead{font-size:15px;line-height:1.95;color:#72677f;max-width:390px}.hero-lead strong{color:#59416d;font-weight:650}.hero-actions{display:flex;gap:17px;flex-wrap:wrap;align-items:center;margin-top:31px}.gx-link{display:inline-flex;align-items:center;justify-content:center;gap:22px;text-decoration:none;min-height:49px;border:1px solid #d5c9e8;padding:12px 22px;border-radius:9px;font:600 12px var(--sans);transition:transform .2s,box-shadow .2s}.gx-link:hover{transform:translateY(-3px)}.gx-link.primary{color:#fff;background:linear-gradient(120deg,#7150b2,#514074);border-color:#7852b2;box-shadow:inset 0 1px 0 #ffffff40,0 5px 14px #6e41a523}.gx-link.primary:hover{box-shadow:inset 0 1px 0 #ffffff40,0 7px 25px #6e41a544}.gx-link.secondary{background:#fcfaffb3;color:#645273}.hero-meta{display:flex;align-items:center;gap:12px;margin-top:37px;font-size:10px;color:#756984}.hero-meta a{font-weight:750;text-decoration:none;color:#574368}.author-bubble{display:grid;place-content:center;width:32px;height:32px;border:1px solid #c2b1d8;background:#eee7f8;border-radius:50%;font:15px var(--mono);letter-spacing:-2px;padding-right:2px;color:#72578f}.meta-separator{color:#b29bc6}.constellation{position:relative;height:620px;margin-left:-15px;isolation:isolate;min-width:0;perspective:1000px}.halo{position:absolute;max-width:100%;z-index:-1;border-radius:50%;filter:blur(4px);pointer-events:none}.halo-one{width:470px;height:470px;left:10%;top:15%;background:radial-gradient(circle,#d4bcf755 0,#ede3fd77 42%,transparent 70%)}.halo-two{width:300px;height:300px;right:0;top:10px;background:radial-gradient(circle,#ecd3ea99 0,transparent 70%)}.orbit-lines{position:absolute;width:110%;height:110%;left:-5%;top:-4%;fill:none;stroke:#cbb8e1;stroke-width:1;stroke-dasharray:4 7;opacity:.65;transform:rotate(var(--orbit-angle,0deg));will-change:transform}.core-window{position:absolute;left:7%;top:25%;width:81%;height:313px;border:1px solid #cdbbdf;border-radius:17px;box-shadow:0 23px 48px #7a56a320,inset 0 0 0 5px #fff9;overflow:hidden;background:#fefaffb3;transform:rotate(-8deg);backdrop-filter:blur(10px)}.window-bar{height:41px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #dbcae770;padding:0 16px;font:8px var(--mono);color:#7d6791;background:#fff8}.window-dots{display:flex;gap:4px}.window-dots i{display:block;width:5px;height:5px;background:#cbb6df;border-radius:50%}.window-dots i:nth-child(2){background:#d9c6a0}.window-dots i:nth-child(3){background:#b4cabc}.cube-universe{height:232px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 70%,#d9ccf0a6,transparent 70%),linear-gradient(145deg,#e8dcff44,#f8f4ff66);isolation:isolate}.cube-universe:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#b7a7cf23 1px,transparent 1px),linear-gradient(90deg,#b7a7cf23 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse,black,transparent 75%);z-index:-1}.hero-cube{transform:scale(2.4);margin-top:-9px;filter:drop-shadow(0 13px 6px #8261b322)}.orbital-ring{position:absolute;width:215px;height:93px;border:1px solid #ac84d099;border-radius:50%;transform:rotate(-16deg);bottom:35px;box-shadow:0 2px 0 #fff9,0 9px 12px #906aba12}.cube-caption{font:9px var(--mono);position:absolute;bottom:18px;color:#7c6692;letter-spacing:.2px}.mini-star{position:absolute;color:#9767c6}.star-one{left:15%;top:48px;font-size:23px}.star-two{right:16%;bottom:50px;font-size:23px}.star-three{right:24%;top:35px;font-size:12px}.core-footer{height:40px;border-top:1px solid #d6c6e588;display:flex;align-items:center;justify-content:space-between;padding-inline:17px;font:7px var(--mono);letter-spacing:1px;color:#746284;background:#fff9}.core-footer i{display:inline-block;width:5px;height:5px;background:#969f66;border-radius:50%;margin-right:6px}.orbit-widget{position:absolute;z-index:3;padding:20px 24px;border:1px solid #dbccea;border-radius:15px;background:#fff9;backdrop-filter:blur(15px);box-shadow:0 14px 30px #84639c12;display:flex;align-items:center;flex-direction:column;gap:18px}.widget-label{font:7px var(--mono);letter-spacing:1.5px;color:#806b97}.widget-note{font:9px var(--sans);color:#796a87}.switch-widget{right:0;top:10%;width:173px;transform:rotate(9deg);gap:15px;padding:18px}.switch-widget:has(input:checked){background:#24202d;border-color:#675077}.switch-widget:has(input:checked) .widget-label,.switch-widget:has(input:checked) .widget-note{color:#d1c2e0}.button-widget{right:1%;bottom:5%;width:280px;transform:rotate(8deg);padding:20px 20px 15px;background:linear-gradient(140deg,#21192be8,#33243ced);border-color:#a486bd;box-shadow:0 15px 40px #51416e30}.button-widget .widget-label{color:#c4afda}.button-widget .widget-note{color:#d0c1dd}.button-widget .gx-sparkle-button-button{padding:14px 24px}.bookmark-widget{position:absolute;left:0;bottom:13%;display:flex;gap:13px;align-items:center;padding:10px 18px 10px 10px;background:#fffc;border:1px solid #e4d7f0;border-radius:15px;transform:rotate(-12deg);box-shadow:0 8px 25px #947ea31a;z-index:3;font-size:10px;line-height:1.6;color:#7e668e}.bookmark-widget strong{color:#51405f;font-size:11px}.tiny-coordinate{position:absolute;font:7px var(--mono);letter-spacing:1px;color:#8d789d}.coordinate-top{left:11%;top:13%}.code-float{position:absolute;border:1px solid #d2c1e2;background:#fefaffb3;border-radius:5px;padding:8px 11px;font:9px var(--mono);color:#83689e;z-index:3}.code-float-one{top:4%;left:30%;transform:rotate(-8deg)}.code-float-two{bottom:27%;right:-13px;transform:rotate(7deg)}.hero-bottom{display:flex;grid-column:1/-1;justify-content:space-between;gap:20px;margin-top:24px;font:8px var(--mono);letter-spacing:1px;color:#7e6a8e}.hero-bottom>span:first-child>span{font-size:16px;margin-left:12px}.hero-bottom b{font-weight:400;color:#aa90bc;margin:0 9px}.galaxy-ribbon{overflow:hidden;background:linear-gradient(100deg,#eee4fa,#e6e5fc,#f3e1f0);border-block:1px solid #d9c9ec;padding:17px 0}.galaxy-ribbon>div{display:flex;width:max-content;align-items:center;gap:44px;animation:ribbon-run 45s linear infinite;font:10px var(--mono);letter-spacing:1.2px;color:#786085}.galaxy-ribbon i{font-size:24px;font-style:normal;color:#a27bc2}.galaxy-nav{position:sticky;top:0;z-index:40;backdrop-filter:blur(15px);background:#f9f8fff2;border-bottom:1px solid var(--line)}.galaxy-nav>div{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:65px}.nav-issue{font:9px var(--mono);letter-spacing:1.1px;color:#79658e}.galaxy-nav nav{display:flex;gap:34px}.galaxy-nav a{min-height:48px;display:inline-flex;align-items:center;font-size:11px;text-decoration:none}.galaxy-nav a[aria-current=true]{color:#794ac1;text-decoration:underline;text-underline-offset:8px}.intro-section{display:grid;grid-template-columns:1fr 1.18fr;gap:80px}.intro-heading h2{font-size:46px}.bracket-art{display:flex;align-items:center;gap:20px;margin-top:45px;font:90px var(--mono);color:#d5c4ed}.bracket-art i{font-size:77px;font-style:normal;color:#9872c5;display:block;transform:rotate(-10deg);filter:drop-shadow(2px 3px 0 #e3d7f0)}.intro-copy p{font-size:14px;line-height:2;color:#6f637b}.intro-copy .big-copy{font-size:21px;line-height:1.7;color:#43364f;letter-spacing:-.4px}.intro-copy strong{color:#47354f}.answer-card{display:flex;gap:17px;margin:25px 0;padding:22px 24px;border:1px solid #d9cdeb;background:linear-gradient(135deg,#eee7f8,#faf7ff);border-radius:12px}.answer-card h3{font-size:17px;font-weight:750;margin:0 0 8px}.answer-card p{font-size:13px;margin:0}.answer-spark{font-size:29px;line-height:1.2;color:#9472bc}.answer-card a{color:#725194;font-weight:650}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:39px}.section-heading h2{margin-bottom:0}.section-heading>p{color:#6c6079;font-size:13px;margin-bottom:7px;line-height:1.9}.playground-section{background:#ece7f5;border-block:1px solid #ddd3eb;position:relative}.component-tabs{display:flex;gap:8px;margin-bottom:22px;overflow-x:auto;padding:3px 3px 7px;scrollbar-width:thin}.component-tab{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 16px;min-height:48px;text-decoration:none;border:1px solid #d6cbe3;background:#f7f4fc;color:#6a587e;border-radius:10px;font-size:12px;white-space:nowrap;flex:1;transition:background .2s,box-shadow .2s}.component-tab small{font:8px var(--mono);opacity:1}.tab-symbol{font-size:18px;line-height:1}.component-tab[aria-selected=true]{background:#3e2c54;color:#fff;border-color:#56406d;box-shadow:0 4px 9px #2e1c4216}.component-tab:hover{border-color:#9977b9}.component-panel{background:#fbf9ff;border:1px solid #d9cde6;border-radius:15px;overflow:hidden;margin-bottom:30px;box-shadow:0 6px 20px #45305708;min-width:0}.component-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 32px;border-bottom:1px solid #e1d7eb}.component-intro .mono{font-size:8px;color:#755588;letter-spacing:1.2px}.component-intro h3{font-size:25px;font-weight:700;letter-spacing:-1px;margin:8px 0 0}.source-link{font:10px var(--mono);min-height:44px;display:inline-flex;align-items:center;color:#76578e;white-space:nowrap}.workbench-grid{display:grid;grid-template-columns:.87fr 1.13fr;min-width:0}.preview-side{min-width:0;padding:25px;background:radial-gradient(ellipse at 30% 10%,#e9ddf6bb,transparent 70%),#f3eef9;border-right:1px solid #dfd4eb;display:flex;flex-direction:column}.demo-stage{position:relative;min-height:350px;display:flex;align-items:center;justify-content:center;isolation:isolate;border-radius:11px;overflow:hidden;transition:background .3s}.dark-stage{background:#15131e;border:1px solid #2d283a;background-image:radial-gradient(ellipse at 50% 60%,#39204777,transparent 68%)}.light-stage{background:#fbf8ff;border:1px solid #d7c9e6;background-image:radial-gradient(circle at 50% 45%,#e2d4f688,transparent 70%)}.preview-label{position:absolute;top:18px;left:18px;font:7px var(--mono);letter-spacing:1.5px;color:#aaa0ba}.light-stage .preview-label{color:#826d95}.preview-hint{position:absolute;bottom:18px;left:15px;right:15px;text-align:center;font:10px/1.7 var(--sans);color:#b0a5bd}.light-stage .preview-hint{color:#786786}.demo-object{display:flex;align-items:center;justify-content:center;min-width:0;width:100%;padding-inline:20px}.demo-glass-cube .demo-object{transform:scale(1.8)}.demo-theme-switch:has(input:checked){background:#17141e;border-color:#4d3d60}.demo-theme-switch:has(input:checked) .preview-label,.demo-theme-switch:has(input:checked) .preview-hint{color:#c9b8db}.preview-caption{padding:22px 4px 0}.preview-caption>p{font-size:12px;line-height:1.9;color:#786880;margin-bottom:15px}.tech-pill{font:9px/1.8 var(--mono);display:inline-block;background:#e7ddf2;padding:5px 9px;border:1px solid #d8c8e9;border-radius:5px;color:#694681}.preview-caption .creator{font-size:10px;margin:20px 0 0;color:#7a6789}.creator a{font-weight:700;color:#604373;overflow-wrap:anywhere}.code-editor{background:#1b1824;min-width:0;display:flex;flex-direction:column}.code-toolbar{height:54px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #3a3049;padding-inline:20px}.code-tabs{display:flex;gap:20px;height:100%;align-items:stretch}.code-tabs a{color:#b4a6c6;display:inline-flex;align-items:center;font:10px var(--mono);border-bottom:2px solid transparent;text-decoration:none;min-width:40px}.code-tabs a[aria-selected=true]{color:#e5cbff;border-bottom-color:#b98ae5}.editor-note{font:8px var(--mono);color:#ac9cba}.code-pane{min-width:0}.code-file{display:flex;justify-content:space-between;align-items:center;padding:10px 20px 0;font:9px var(--mono);color:#b29ac6;min-height:47px}.copy-code{display:inline-flex;align-items:center;gap:10px;background:#31283f;border:1px solid #59446d;border-radius:5px;padding:8px 10px;color:#e6d5f5;min-height:34px;font:9px var(--mono)}.copy-code:hover{background:#4b355f}.copy-code.copied{border-color:#a6c195;color:#d9edca}.code-pane pre{font:12px/1.9 var(--mono);margin:0;max-height:400px;height:400px;overflow:auto;color:#d7cce3;padding:12px 17px 22px 0;tab-size:2;scrollbar-color:#624f78 #241d2e;scrollbar-width:thin;overscroll-behavior:contain}.code-pane pre code{font:inherit;counter-reset:code-line;display:block;min-width:max-content}.code-line{display:inline;padding-right:15px}.code-line:before{counter-increment:code-line;content:counter(code-line);display:inline-block;width:43px;box-sizing:border-box;padding-right:15px;text-align:right;color:#857190;user-select:none;font-size:10px;position:sticky;left:0;background:#1b1824}.tok-comment{color:#a997b5}.tok-tag{color:#e9b0d1}.tok-string{color:#b9d89c}.tok-property{color:#b9a5ed}.tok-selector{color:#e6cda4}.tok-number{color:#9dced9}.code-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;border-top:1px solid #3a3049;padding:15px 20px}.copy-file{background:#ae89d0;border:1px solid #ba94dd;border-radius:5px;padding:10px 12px;color:#21132f;display:flex;align-items:center;gap:16px;min-height:40px;font:650 10px var(--sans)}.copy-file:hover{background:#c3a1df}.code-actions>a{color:#d1b7e6;font:9px var(--mono);display:inline-flex;align-items:center;min-height:40px;white-space:nowrap}.adaptation{margin:0;padding:18px 30px;border-top:1px solid #e0d4ea;font-size:10px;line-height:1.9;color:#756080;background:#f8f4fc}.adaptation>span{color:#9b75ba;margin-right:7px}.playground-footnote{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:10px;color:#725f80}.playground-footnote a{min-height:44px;display:inline-flex;align-items:center}.playground-footnote i{display:inline-block;width:5px;height:5px;background:#728b5d;border-radius:50%;margin-right:7px}.anatomy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px}.anatomy-item{min-width:0}.anatomy-item h3{font-size:18px;line-height:1.4;font-weight:700;margin-bottom:15px}.anatomy-item p{font-size:13px;line-height:1.95;color:#6c6079}.anatomy-item code,.integration-steps code{font:11px var(--mono);color:#764b93;background:#ede6f5;padding:2px 4px;border-radius:3px;overflow-wrap:anywhere}.concept-tag{font:9px var(--mono);color:#7c5f90;display:inline-block;border-bottom:1px solid #ccb9dc;padding-bottom:7px;margin-top:6px}.anatomy-visual{height:190px;position:relative;display:grid;place-items:center;margin-bottom:22px;overflow:hidden}.anatomy-visual>span{position:absolute;left:4px;bottom:10px;font:9px var(--mono);color:#a080b6}.layers-visual i{position:absolute;width:100px;height:100px;border:1px solid #b59dcf;border-radius:17px;transform:rotate(-28deg) skew(15deg,10deg);box-shadow:0 10px 10px #73568c0a;background:linear-gradient(135deg,#fbf8ffbb,#ddccefb3)}.layers-visual i:nth-child(1){top:67px;left:calc(50% - 62px)}.layers-visual i:nth-child(2){top:43px;left:calc(50% - 50px)}.layers-visual i:nth-child(3){top:20px;left:calc(50% - 38px);background:linear-gradient(135deg,#eddffeaa,#c6addfaa)}.gradient-visual i{width:127px;height:127px;border-radius:28px;background:conic-gradient(#8560cf,#abdcec,#de99c5,#d9c083,#8560cf);padding:2px;transform:rotate(-12deg);box-shadow:0 9px 25px #8d5ab51c;position:relative}.gradient-visual i:after{content:'';position:absolute;inset:5px;background:#f9f8ff;border-radius:24px}.timing-visual i{height:13px;width:13px;border-radius:50%;background:#9970c7;position:absolute;box-shadow:0 0 0 9px #e8dcf8}.timing-visual i:nth-child(1){left:20%;top:65px;background:#c7aadf}.timing-visual i:nth-child(2){left:46%;top:102px}.timing-visual i:nth-child(3){right:20%;top:49px;background:#6c4c98}.timing-visual:before{content:'';width:72%;height:90px;border:1px dashed #c5aed9;transform:rotate(-13deg);border-radius:50%}.integration-section{background:#f0ebf7;border-block:1px solid #e1d5ed}.integration-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:110px}.integration-heading h2{font-size:49px}.integration-heading>p{font-size:14px;color:#756680;line-height:1.95;max-width:370px}.terminal-note{background:linear-gradient(130deg,#2d233a,#1c1925);border:1px solid #7c5c98;border-radius:12px;padding:22px 28px;color:#e0c8ed;max-width:345px;margin-top:32px;transform:rotate(-3deg);box-shadow:7px 8px 0 #e2d6ed}.terminal-dots{font-size:8px;letter-spacing:5px;color:#866395;margin-bottom:24px}.terminal-note>code{font:12px/2.1 var(--mono)}.terminal-note code>span{color:#b9b6e7}.terminal-note code b{font-weight:400;color:#c3d6a5}.terminal-note>small{display:block;font-size:9px;color:#b4a2c1;border-top:1px solid #54415d;padding-top:18px;margin-top:21px}.integration-steps{padding:0;margin:0;list-style:none}.integration-steps li{display:flex;gap:24px;padding-bottom:27px;margin-bottom:30px;border-bottom:1px solid #d9cbe6}.integration-steps li:last-child{border:0;margin:0;padding:0}.integration-steps li>span{font:11px var(--mono);color:#77558a;padding-top:5px}.integration-steps h3{font-size:19px;line-height:1.4;margin-bottom:13px;letter-spacing:-.5px}.integration-steps p{font-size:13px;color:#766680;line-height:1.95;margin-bottom:10px}.integration-steps strong{color:#4f3d5a}.galaxy-faq{display:grid;grid-template-columns:.7fr 1.3fr;gap:100px}.galaxy-faq h2{font-size:45px}.galaxy-faq details{border-top:1px solid var(--line);padding-block:15px}.galaxy-faq details:last-child{border-bottom:1px solid var(--line)}.galaxy-faq summary{cursor:pointer;min-height:44px;font-size:14px;font-weight:650;padding:9px 20px 9px 0}.galaxy-faq details p{font-size:13px;color:#766880;line-height:1.95;margin:10px 0}.credits-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;border-top:1px solid var(--line);padding-block:65px 80px}.credits-heading h2{font-size:43px}.credits-heading p{font-size:12px;color:#7c6b86;line-height:1.95;max-width:420px}.credits-heading .commit-note{font-size:10px;margin-block:25px}.commit-note code{font-family:var(--mono);color:#77508f}.galaxy-page .story-tags{margin-bottom:0}.component-credits{list-style:none;margin:0;padding:0}.component-credits li{display:flex;align-items:center;gap:22px;padding:18px 0;border-bottom:1px solid var(--line)}.component-credits li>span{font:9px var(--mono);color:#9980ad}.component-credits li>div{flex:1;min-width:0}.component-credits strong{display:block;font-size:13px;margin-bottom:2px}.component-credits li>div>a{font-size:10px;color:#806095;overflow-wrap:anywhere}.component-credits li>a{font:9px var(--mono);min-height:44px;display:flex;align-items:center;white-space:nowrap}.reading-sources{grid-column:1/-1;padding-top:5px;display:grid;grid-template-columns:.6fr 1.4fr;gap:35px}.reading-sources h3{font-size:18px}.reading-sources ol{display:flex;flex-wrap:wrap;gap:11px 30px;font-size:11px;color:#7b6786;margin:0;padding-left:20px}.reading-sources li{padding:3px 0}.galaxy-outro{text-align:center;padding:72px 0 60px;background:radial-gradient(ellipse at 50% 55%,#e9d4f177,transparent 68%),linear-gradient(100deg,#eee6fa,#e7e7fa,#f4e6f0);border-block:1px solid #ded1eb;position:relative;overflow:hidden}.outro-spark{display:block;font-size:46px;color:#9a71ba;line-height:1.1;margin-bottom:27px}.galaxy-outro h2{font-size:55px;margin-bottom:20px}.galaxy-outro p{font-size:14px;color:#7b6586}.galaxy-outro .wrap>div{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:29px}.next-story{font-size:11px;display:inline-flex;align-items:center;min-height:44px;margin-top:23px;color:#765b85}.galaxy-page .site-footer{color:#745881}.galaxy-page .site-footer>p{color:#7c6b89}.galaxy-page .toast{background:#352244;color:#fff}.galaxy-page :focus-visible{outline-color:#966dc6}.galaxy-page a{overflow-wrap:break-word}#code-dialog{width:min(760px,calc(100vw - 36px));max-height:90vh;padding:25px;border:1px solid #9f82b8;border-radius:13px;background:#f9f5ff;color:#352640}#code-dialog::backdrop{background:#21142f99;backdrop-filter:blur(5px)}#code-dialog form>div{display:flex;justify-content:space-between;align-items:center;gap:15px}#code-dialog h2{font-size:24px;margin:0}#code-dialog form>div>button{border:0;background:none;font-size:25px;min-width:44px;min-height:44px}#code-dialog p{font-size:12px}#copy-fallback{width:100%;height:310px;display:block;background:#231b2e;color:#e8d5f5;border:1px solid #8a69a3;border-radius:6px;padding:15px;font:11px/1.8 var(--mono);resize:vertical;margin-bottom:20px}.demo-sleep *, .demo-sleep *::before,.demo-sleep *::after,.demo-sleep::before,.demo-sleep::after{animation-play-state:paused!important}.no-motion .floating-element{translate:0 0!important}.no-motion .orbit-lines{transform:none!important;will-change:auto}.has-motion .floating-element{animation:widget-float 7s ease-in-out infinite}.has-motion .switch-widget{animation-delay:-2s}.has-motion .button-widget{animation-delay:-4s}.has-motion .bookmark-widget{animation-delay:-1s}.has-motion .mini-star{animation:star-turn 12s linear infinite}.has-motion .star-two{animation-direction:reverse}.has-motion .layers-visual i{animation:layer-breathe 7s ease-in-out infinite}.has-motion .layers-visual i:nth-child(2){animation-delay:-2s}.has-motion .gradient-visual i{animation:border-turn 15s linear infinite}.has-motion .timing-visual i{animation:dot-bob 4s ease-in-out infinite}.has-motion .timing-visual i:nth-child(2){animation-delay:-1.3s}.has-motion .timing-visual i:nth-child(3){animation-delay:-2.6s}@keyframes ribbon-run{to{transform:translateX(-50%)}}@keyframes widget-float{50%{translate:0 -10px}}@keyframes star-turn{to{rotate:360deg}}@keyframes layer-breathe{50%{translate:0 -10px}}@keyframes border-turn{to{filter:hue-rotate(360deg)}}@keyframes dot-bob{50%{translate:0 -14px}}
@media(max-width:1150px){.galaxy-hero{min-height:740px;padding-top:55px}.constellation{height:550px}.core-window{height:280px;top:26%}.cube-universe{height:199px}.hero-cube{transform:scale(2.1)}.switch-widget{right:-5%;width:145px;top:9%}.button-widget{width:250px;right:-3%}.bookmark-widget{left:-2%;bottom:12%;padding-right:12px}.code-float-two{right:-4%}.galaxy-hero h1{font-size:64px}.intro-section{gap:50px}.intro-heading h2{font-size:41px}.integration-grid{gap:60px}.integration-heading h2{font-size:44px}.component-tab{padding:12px 13px;gap:7px}.component-tab small{display:none}.anatomy-grid{gap:30px}.workbench-grid{grid-template-columns:.95fr 1.05fr}.preview-side{padding:20px}.code-actions{padding-inline:14px}.code-actions>a{font-size:8px}.copy-file{font-size:9px}.galaxy-faq{gap:60px}}
@media(max-width:900px){.galaxy-page .wrap{width:calc(100% - 64px)}.galaxy-hero{grid-template-columns:1fr 1fr;min-height:630px;gap:5px;padding-top:45px;padding-bottom:35px}.galaxy-hero h1{font-size:52px;letter-spacing:-.07em}.hero-eyebrow{font-size:7px;gap:7px;margin-bottom:23px}.hero-eyebrow .badge{font-size:7px;margin-left:0}.repo-chip{font-size:9px}.hero-lead{font-size:12px}.hero-actions{gap:10px}.gx-link{font-size:10px;padding:12px 15px;gap:12px;min-height:45px}.hero-meta{font-size:8px;gap:8px}.constellation{height:460px;margin-left:0}.core-window{top:26%;left:2%;width:98%;height:255px}.cube-universe{height:180px}.window-bar{height:37px;font-size:6px;padding:0 12px}.core-footer{height:37px;font-size:6px;padding:0 12px}.hero-cube{transform:scale(1.8)}.orbital-ring{width:170px;height:75px}.switch-widget{top:3%;right:-4%;width:124px;padding:12px 10px;gap:8px}.widget-label{font-size:6px;letter-spacing:1px}.switch-widget .gx-theme-switch-switch{font-size:18px;min-height:36px}.widget-note{font-size:8px}.button-widget{bottom:0;right:-4%;width:220px;gap:12px;padding:14px 10px}.button-widget .gx-sparkle-button-button{padding:12px 18px}.button-widget .gx-sparkle-button-text_button{font-size:12px}.bookmark-widget{bottom:2%;left:-11%;z-index:2;gap:9px;padding:7px;max-width:150px;font-size:8px}.bookmark-widget .gx-bookmark-checkbox-container{width:40px;height:44px}.bookmark-widget strong{font-size:9px}.code-float{font-size:7px;padding:7px}.code-float-one{left:7%;top:9%}.code-float-two{right:-5%;bottom:26%}.coordinate-top{display:none}.halo-one{width:380px;height:380px;left:-30px}.hero-bottom{font-size:6px;letter-spacing:.6px;gap:10px}.hero-bottom b{margin:0 4px}.hero-bottom>span:first-child>span{margin-left:3px}.galaxy-nav nav{gap:23px}.nav-issue{font-size:7px}.section-space{padding-block:75px}.intro-section{gap:35px;grid-template-columns:.9fr 1.1fr}.intro-heading h2{font-size:35px}.intro-copy .big-copy{font-size:18px}.intro-copy p{font-size:12px}.answer-card{padding:18px;gap:12px}.answer-card p{font-size:12px}.section-heading{align-items:flex-start;gap:25px}.section-heading>p{font-size:11px;margin-top:36px;max-width:245px}.section-heading h2{font-size:39px}.component-tab{flex:0 0 auto;min-width:109px;padding:11px 15px}.workbench-grid{grid-template-columns:1fr 1.15fr}.component-intro{padding:22px}.component-intro h3{font-size:23px}.preview-side{padding:16px}.demo-stage{min-height:310px}.demo-object{padding-inline:14px}.preview-hint{font-size:9px;left:10px;right:10px;bottom:13px}.demo-gradient-card .gx-gradient-card-card{width:195px;height:250px;padding:25px 20px}.demo-gradient-card .gx-gradient-card-card p{font-size:24px}.code-toolbar{padding-inline:15px}.editor-note{font-size:6px}.code-pane pre{font-size:11px;height:385px;max-height:385px}.code-line:before{width:35px;padding-right:10px;font-size:9px}.code-file{padding:9px 12px 0;font-size:8px}.copy-code{font-size:8px;gap:7px}.code-actions{gap:8px;flex-wrap:wrap}.copy-file{font-size:10px;gap:10px}.code-actions>a{font-size:9px}.adaptation{padding:16px 22px}.preview-caption>p{font-size:11px}.tech-pill{font-size:8px}.anatomy-grid{gap:25px}.anatomy-item h3{font-size:16px}.anatomy-item p{font-size:12px}.anatomy-visual{height:170px}.integration-grid{grid-template-columns:.9fr 1.1fr;gap:40px}.integration-heading h2{font-size:36px}.integration-heading>p{font-size:12px}.terminal-note{padding:20px}.terminal-note>code{font-size:10px}.integration-steps li{gap:17px}.integration-steps h3{font-size:17px}.integration-steps p{font-size:12px}.galaxy-faq{gap:35px}.galaxy-faq h2{font-size:38px}.galaxy-faq summary{font-size:13px}.credits-section{gap:40px}.credits-heading h2{font-size:35px}.component-credits li{gap:15px}.component-credits strong{font-size:12px}}
@media(max-width:650px){.galaxy-page .wrap{width:calc(100% - 40px)}.galaxy-hero{display:flex;flex-direction:column;align-items:stretch;padding-top:37px;gap:20px;padding-bottom:28px}.hero-eyebrow{font-size:8px;margin-bottom:22px;gap:10px}.hero-eyebrow .badge{font-size:8px;margin-left:7px}.repo-chip{font-size:10px}.galaxy-hero h1{font-size:clamp(47px,12vw,68px);line-height:1.14;letter-spacing:-.065em;margin-top:20px;margin-bottom:23px}.hero-lead{font-size:14px;max-width:420px}.hero-actions{gap:14px;margin-top:25px}.gx-link{font-size:11px;gap:18px;padding:13px 17px}.hero-meta{font-size:9px;margin-top:28px}.constellation{height:470px;max-width:470px;width:100%;align-self:center;margin-top:1px}.core-window{left:7%;width:88%;top:24%;height:272px}.window-bar{font-size:7px;height:39px}.cube-universe{height:194px}.core-footer{height:39px;font-size:6px}.hero-cube{transform:scale(2)}.orbital-ring{width:190px}.switch-widget{right:3%;top:2%;width:129px;gap:9px;padding:13px}.switch-widget .gx-theme-switch-switch{font-size:19px;min-height:38px}.button-widget{right:1%;bottom:0;transform:rotate(6deg);width:225px;padding:17px 12px}.button-widget .gx-sparkle-button-text_button{font-size:13px}.bookmark-widget{bottom:8%;left:0;transform:rotate(-10deg);z-index:3}.code-float-one{left:13%;top:8%;font-size:8px}.code-float-two{right:1%;bottom:30%;font-size:8px}.hero-bottom{font-size:7px;line-height:1.7;margin-top:9px;justify-content:center}.hero-bottom>span:last-child{display:none}.galaxy-ribbon{padding:13px 0}.galaxy-ribbon>div{gap:27px;font-size:8px}.galaxy-ribbon i{font-size:20px}.galaxy-nav>div{min-height:58px}.nav-issue{display:none}.galaxy-nav nav{width:100%;justify-content:space-between;gap:8px}.galaxy-nav a{font-size:9px;min-height:46px}.section-space{padding-block:58px}.section-label{font-size:9px;letter-spacing:1.1px;margin-bottom:18px}.intro-section{grid-template-columns:1fr;gap:21px}.intro-heading h2{font-size:38px;margin-bottom:0}.bracket-art{display:none}.intro-copy .big-copy{font-size:18px;line-height:1.8}.intro-copy p{font-size:13px}.answer-card{padding:20px 17px;margin:21px 0}.answer-card h3{font-size:16px}.answer-card p{font-size:12px}.section-heading{display:block;margin-bottom:27px}.section-heading h2{font-size:38px}.section-heading>p{font-size:12px;margin:20px 0 0;max-width:none}.component-tabs{gap:6px;margin-bottom:18px}.component-tab{min-width:98px;padding:11px 13px;font-size:11px;gap:8px}.component-intro{padding:20px 17px;align-items:flex-start;gap:12px}.component-intro .mono{font-size:7px}.component-intro h3{font-size:22px;margin-top:8px}.source-link{font-size:8px;min-height:36px}.workbench-grid{grid-template-columns:1fr}.preview-side{border-right:0;border-bottom:1px solid #dacee6;padding:17px}.demo-stage{min-height:286px}.preview-label{font-size:7px;top:16px;left:16px}.preview-hint{font-size:9px;bottom:15px}.demo-object{padding-inline:19px}.demo-gradient-card{min-height:330px}.demo-gradient-card .gx-gradient-card-card{width:207px;height:250px}.preview-caption{padding:18px 2px 0}.preview-caption>p{font-size:12px}.preview-caption .creator{font-size:10px;margin-top:16px}.tech-pill{font-size:9px}.code-toolbar{height:53px;padding-inline:17px}.code-tabs a{font-size:10px}.editor-note{font-size:8px}.code-file{padding:10px 14px 0;font-size:9px}.copy-code{font-size:9px;min-height:40px;padding:9px 11px}.code-pane pre{font-size:11px;height:320px;max-height:320px;padding-top:12px}.code-line:before{width:35px}.code-actions{padding:14px 17px;gap:12px;flex-wrap:nowrap}.copy-file{font-size:10px;padding:10px}.code-actions>a{font-size:9px}.adaptation{padding:16px 19px;font-size:10px}.component-panel{border-radius:12px;margin-bottom:22px}.playground-footnote{display:block;font-size:10px}.playground-footnote>a{margin-top:7px}.anatomy-grid{grid-template-columns:1fr;gap:27px}.anatomy-item{display:grid;grid-template-columns:105px 1fr;gap:0 20px}.anatomy-item h3{font-size:18px;grid-column:2;align-self:end}.anatomy-item p{font-size:12px;grid-column:2;margin-bottom:11px}.anatomy-visual{height:170px;grid-column:1;grid-row:1/4;transform:scale(.75);transform-origin:left top;overflow:visible;margin:0}.anatomy-visual>span{bottom:0;left:8px}.layers-visual i{width:73px;height:73px}.layers-visual i:nth-child(1){left:-1px;top:84px}.layers-visual i:nth-child(2){left:8px;top:61px}.layers-visual i:nth-child(3){left:17px;top:38px}.gradient-visual i{width:105px;height:105px;margin-top:20px}.timing-visual{width:140px}.concept-tag{grid-column:2;justify-self:start;font-size:8px;margin-top:0}.integration-grid{grid-template-columns:1fr;gap:38px}.integration-heading h2{font-size:38px}.integration-heading>p{font-size:13px;max-width:none}.terminal-note{max-width:300px;transform:rotate(-2deg);margin-top:25px;padding:20px 24px}.terminal-note>code{font-size:11px}.integration-steps li{gap:17px;padding-bottom:20px;margin-bottom:25px}.integration-steps h3{font-size:19px}.integration-steps p{font-size:13px}.galaxy-faq{grid-template-columns:1fr;gap:15px}.galaxy-faq h2{font-size:37px}.galaxy-faq details{padding-block:13px}.galaxy-faq summary{font-size:13px}.galaxy-faq details p{font-size:12px}.credits-section{grid-template-columns:1fr;gap:27px;padding-block:47px 55px}.credits-heading h2{font-size:37px}.credits-heading p{font-size:12px}.component-credits li{padding:13px 0}.component-credits strong{font-size:13px}.component-credits li>a{font-size:9px}.reading-sources{grid-template-columns:1fr;gap:5px;padding-top:10px}.reading-sources ol{display:block;font-size:11px;line-height:1.9}.galaxy-outro{padding:52px 0 40px}.galaxy-outro h2{font-size:44px}.galaxy-outro p{font-size:12px}.galaxy-outro .wrap>div{gap:12px}.outro-spark{font-size:39px;margin-bottom:24px}.next-story{font-size:10px}.halo-one{width:340px;height:340px;left:0}.halo-two{width:250px;height:250px;right:-10px}.orbit-lines{width:100%;height:100%;left:0;top:0}}
@media(max-width:360px){.galaxy-hero h1{font-size:44px}.hero-actions{gap:10px}.hero-actions .gx-link{padding-inline:13px;font-size:10px}.constellation{height:430px}.core-window{height:252px;left:2%;width:96%}.cube-universe{height:174px}.switch-widget{right:0}.button-widget{width:208px;right:0;padding:14px 10px}.bookmark-widget{left:-3px;bottom:9%;max-width:118px;gap:5px}.bookmark-widget .gx-bookmark-checkbox-container{width:36px}.bookmark-widget strong{font-size:8px}.code-float-two{display:none}.code-float-one{left:3%;font-size:7px}.section-heading h2,.intro-heading h2{font-size:33px}.component-intro h3{font-size:19px}.source-link{font-size:7px}.code-actions{padding-inline:12px;gap:7px}.copy-file{font-size:9px;gap:6px}.code-actions>a{font-size:8px}.anatomy-item{grid-template-columns:85px 1fr;gap:0 15px}.anatomy-visual{transform:scale(.65)}.galaxy-nav a{font-size:8px}}

/* Keep code layout local to its scrollport and let vertical gestures reach the page. */
.code-pane pre{contain:layout paint;overscroll-behavior-x:contain;overscroll-behavior-y:auto}
@media(max-width:700px){
  .galaxy-hero h1{letter-spacing:-.045em;font-size:clamp(40px,10.6vw,65px)}
  .galaxy-page h2{letter-spacing:-.04em}
  .intro-copy p,.integration-heading>p,.integration-steps p,.galaxy-faq details p{font-size:14px;line-height:1.9}
  .answer-card p,.anatomy-item p,.preview-caption>p{font-size:13px;line-height:1.9}
  .galaxy-nav nav{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
  .galaxy-nav a{flex-shrink:0;font-size:10px;padding-inline:3px}
  .component-tabs{overscroll-behavior-x:contain;scroll-padding-inline:4px}
  .code-pane pre{font-size:13px;line-height:1.85;height:min(360px,60svh);max-height:360px}
  .code-tabs a{min-height:48px;min-width:48px;font-size:12px}
  .copy-code,.copy-file,.code-actions>a{min-height:44px;font-size:11px}
  .code-actions{flex-wrap:wrap}
  .code-actions>a{padding-inline:4px}
  #copy-fallback{font-size:16px;height:min(310px,45svh)}
  [data-ui="neon-search"] input{font-size:16px}
}
@media(hover:none){
  .galaxy-nav{backdrop-filter:none;background:#f9f8ff}
  .core-window{backdrop-filter:none;background:#fdfaff}
  .orbit-widget{backdrop-filter:none}
  .switch-widget{background:#fcfaff}
  .hero-cube,.halo{filter:none}
  .orbit-lines{will-change:auto}
}
@media(pointer:coarse){
  [data-ui="neon-search"] input,#copy-fallback{font-size:16px}
  .copy-code,.copy-file,.code-actions>a{min-height:44px;font-size:11px}
  .code-pane pre{font-size:13px;height:min(360px,60svh);max-height:360px}
}

.code-pane pre,.code-pane code{background:#1b1824}
.orbit-clip{position:absolute;inset:0;overflow:clip;pointer-events:none}
