/* CHICHUN / NEXT — keeps the original identity, gives it space and depth. */
:root{--ease-out:cubic-bezier(.16,1,.3,1)}
body{overflow-x:clip}
[hidden]{display:none!important}
button,a,input,select,summary{touch-action:manipulation}
:focus-visible{outline:2px solid var(--lime);outline-offset:5px}
.reading-progress{height:2px;position:fixed;top:0;left:0;right:0;background:linear-gradient(90deg,var(--cyan),var(--lime));transform-origin:left;transform:scaleX(0);z-index:150;pointer-events:none}
.header{transition:background .3s,box-shadow .3s}
.header.is-scrolled{background:#080e18ed;box-shadow:0 10px 35px #0003}
.motion-toggle{height:38px;width:38px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#83f5ff08;color:var(--cyan);font:17px ui-monospace,monospace;cursor:pointer}
.motion-toggle:hover{border-color:var(--cyan);background:#83f5ff15}
.hero-topline{padding-bottom:18px}
.hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0;min-height:690px}
.hero-text{padding:57px 0 48px}
.hero h1{font-size:clamp(3.4rem,5.3vw,6.25rem);line-height:1.045;letter-spacing:-.065em;white-space:normal;position:relative}
.hero-side-label{font-size:10px;letter-spacing:.13em;color:#8eabb9;margin-bottom:27px}
.hero-text>p{font-size:15px;max-width:470px;line-height:1.8;margin-top:29px}
.gradient-type{background-image:linear-gradient(110deg,#e0fbff 5%,#87efff 35%,#95c6ff 65%,#d9f9ff 90%);background-size:180% 100%;animation:spectrum 9s ease-in-out infinite alternate}
.hero-smallstats{gap:33px;margin-top:39px}
.hero-smallstats strong{font-size:23px}
.hero-smallstats span{color:#98adba;font-size:8px}
.hero-actions{gap:10px;margin-top:27px}
.hero-actions .pill-link{min-height:54px;padding:13px 20px;font-size:12px}
.hero-scene{height:620px;border:0;overflow:visible;background:radial-gradient(ellipse at 52% 50%,#1a3c5355 0,transparent 67%);perspective:1100px;--rx:0deg;--ry:0deg}
.hero-scene:before{inset:-15px 0;background-size:50px 50px;opacity:.55}
.hero-scene:after{inset:22px 0;opacity:.6}
.spatial-canvas{display:block;width:100%;height:100%;outline:none}
.hero-scene .spatial-canvas{position:absolute;inset:0;z-index:0;opacity:.9;pointer-events:none}
.hero-scene .scene-overlay{z-index:3}
.scene-corner{font-size:8px;letter-spacing:.11em;color:#8fb9c4}
.scene-corner.top-left{left:15px;top:36px}
.scene-corner.top-right{right:15px;top:36px}
.scene-corner.bottom-left{left:15px;bottom:44px}
.scene-corner.bottom-right{right:15px;bottom:44px;color:var(--lime)}
.bird-cutout{width:43%;height:65%;left:30%;top:17%;transform:rotateX(var(--rx)) rotateY(var(--ry)) rotate(-6deg);transition:transform .65s var(--ease-out);filter:drop-shadow(0 25px 40px #0009);pointer-events:none}
.bird-cutout:before{inset:-8%;border:1px solid #8df4ff65;background:linear-gradient(150deg,#80eafa0d,transparent);border-radius:45% 45% 13% 13%;clip-path:none;transform:translateZ(-45px) rotate(8deg);box-shadow:0 0 40px #8df4ff0a,inset 0 0 40px #8df4ff0b}
.bird-cutout:after{content:'';position:absolute;inset:-2%;border:1px solid #e0ffff66;border-radius:44% 44% 13% 13%;box-shadow:0 0 22px #8df4ff18;pointer-events:none}
.bird-cutout img{border-radius:44% 44% 13% 13%;clip-path:none;object-position:center 33%;filter:saturate(.7) contrast(1.06);mask-image:linear-gradient(#000 0 83%,#000b 100%)}
.bird-glow{inset:15% -10%;background:#7aeaff33;filter:blur(70px)}
.bird-tag{top:auto;bottom:111px;right:1%;transform:rotate(-3deg);max-width:224px;backdrop-filter:blur(16px);background:#0c1c29c9;border:1px solid #83ecff70;border-radius:3px;padding:14px 17px;box-shadow:0 10px 50px #0008}
.bird-tag b{font-size:11px;letter-spacing:.06em}
.bird-tag span{font-size:10px}
.scene-toggle{bottom:39px;left:50%;transform:translateX(-50%);padding:10px 14px;white-space:nowrap;border-color:#80f5ff66;color:var(--cyan);background:#09151de6;letter-spacing:.06em}
.scene-toggle:hover{background:#163343;border-color:var(--cyan)}
.orbital-label{position:absolute;z-index:4;left:3%;top:39%;color:#a7dae0;font:9px/1.65 ui-monospace,monospace;letter-spacing:.09em;pointer-events:none}
.orbital-label:after{content:'';display:block;width:65px;border-top:1px solid #7ceaff66;margin-top:9px;transform:rotate(-25deg);transform-origin:left}
.orbital-label strong{display:block;color:var(--lime);font-weight:500}
.hero-bottomline a{color:var(--cyan);display:flex;gap:14px;align-items:center}
.hero-bottomline a:hover{color:var(--lime)}
.ticker-wrap{background:linear-gradient(90deg,#0a1520,#11202b,#0a1520)}
.cap-card{--rx:0deg;--ry:0deg;isolation:isolate;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s var(--ease-out),border-color .35s,box-shadow .35s}
.cap-card:after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(400px circle at var(--pointer-x,50%) var(--pointer-y,0%),#87f5ff17,transparent 65%);z-index:-1;pointer-events:none}
.cap-card:hover{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-5px);border-color:#87f5ff77;box-shadow:0 25px 60px #0004}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal.is-revealed{opacity:1;transform:translateY(0)}
.cap-card.reveal:nth-child(2){transition-delay:.05s}.cap-card.reveal:nth-child(3){transition-delay:.1s}.cap-card.reveal:nth-child(4){transition-delay:.15s}
.spatial-section{padding:104px 0 90px;position:relative;isolation:isolate;border-block:1px solid #a2dff31c;background:radial-gradient(ellipse at 70% 50%,#10273b66,transparent 70%),#080f19}
.spatial-section .section-header{margin-bottom:35px}
.spatial-section .section-header h2{font-size:clamp(2.8rem,4.8vw,5.3rem);margin-top:20px}
.spatial-section .section-header>p{max-width:385px}
.spatial-shell{position:relative;border:1px solid #87cde344;border-radius:22px;overflow:hidden;background:#08111a;box-shadow:0 40px 95px #0004}
.spatial-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;position:relative;z-index:3;padding:18px 24px;border-bottom:1px solid #91d2e524;background:#0b1825cc;backdrop-filter:blur(15px)}
.spatial-toolbar>.eyebrow{font-size:10px;letter-spacing:.1em}
.spatial-toolbar{padding-right:76px}
.spatial-toolbar>.motion-toggle{position:absolute;right:20px;top:18px}
.spatial-modes{display:flex;gap:5px;flex-wrap:wrap}
.spatial-modes button{padding:9px 14px;min-height:37px;border:1px solid transparent;color:#a0bac9;background:transparent;border-radius:7px;font:11px ui-monospace,monospace;cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.spatial-modes button[aria-pressed=true]{color:var(--lime);border-color:#c5ff8344;background:#c5ff8310}
.spatial-modes button:hover{color:#fff;background:#83e9ff12}
.spatial-viewport{height:490px;position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 50%,#15304488,transparent 62%)}
.spatial-viewport:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#8bdeff09 1px,transparent 1px),linear-gradient(90deg,#8bdeff09 1px,transparent 1px);background-size:45px 45px;mask-image:radial-gradient(ellipse,#0006,transparent 72%);z-index:-1}
.spatial-viewport .spatial-canvas{cursor:grab;touch-action:pan-y;position:absolute;inset:0}
.spatial-viewport .spatial-canvas:active{cursor:grabbing}
.spatial-viewport .spatial-canvas:focus-visible{outline:2px solid var(--lime);outline-offset:-6px}
.spatial-display{position:absolute;top:25px;left:26px;pointer-events:none;display:grid;gap:9px;font:10px ui-monospace,monospace;letter-spacing:.07em;color:#8baaba;z-index:2}
.spatial-display strong{color:#dcf7f8;font-weight:500}
.spatial-display .spatial-index{font-size:47px;line-height:1;color:#b4dcea22;letter-spacing:-.08em;margin-bottom:5px}
.spatial-coordinate{position:absolute;right:26px;top:27px;text-align:right;color:#7da3b6;font:9px/1.8 ui-monospace,monospace;letter-spacing:.08em;pointer-events:none}
.spatial-hint{position:absolute;left:26px;bottom:23px;color:#a2bdca;font:10px/1.7 ui-monospace,monospace;letter-spacing:.02em;pointer-events:none}
.spatial-hint span{color:var(--lime)}
.spatial-controls{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 24px;border-top:1px solid #91d2e524;background:#0b1825;position:relative;z-index:3}
.spatial-control-actions{display:flex;gap:8px;flex-wrap:wrap}
.spatial-button{display:inline-flex;align-items:center;gap:9px;border:1px solid #9fd6e43b;background:transparent;border-radius:7px;color:#d8edf2;min-height:40px;padding:10px 13px;font:11px ui-monospace,monospace;cursor:pointer;text-decoration:none}
.spatial-button:hover{color:var(--lime);border-color:#c5ff8380;background:#c5ff8308}
.spatial-button.accent{background:var(--lime);color:#10201c;border-color:var(--lime)}
.spatial-sliders{display:flex;gap:22px;align-items:center}
.spatial-sliders label{display:grid;gap:9px;color:#94adbb;font:9px ui-monospace,monospace;letter-spacing:.07em}
.spatial-sliders input[type=range]{width:110px;accent-color:var(--cyan);height:16px;cursor:pointer}
.spatial-sliders select{color:#c5dce4;border:1px solid #a8d6e230;border-radius:5px;background:#132536;min-height:32px;padding:4px 7px;font:10px ui-monospace,monospace;max-width:150px}
.spatial-footnote{display:flex;justify-content:space-between;gap:20px;margin-top:23px;align-items:center;color:#8ca5b5;font:11px/1.7 ui-monospace,monospace}
.spatial-footnote a{color:var(--cyan);white-space:nowrap}
.spatial-footnote a:hover{color:var(--lime)}
.spatial-notice{position:absolute;bottom:55px;left:50%;transform:translateX(-50%);max-width:85%;text-align:center;color:#cfedef;font:11px/1.6 ui-monospace,monospace;pointer-events:none;padding:8px 14px;border-radius:6px;background:#0a1924e8;border:1px solid #81edff33;z-index:3}
.spatial-notice:empty{display:none}
.spatial-shell:fullscreen{border:0;border-radius:0;display:flex;flex-direction:column;width:100vw;height:100dvh;background:#070d15}
.spatial-shell:fullscreen .spatial-viewport{flex:1;min-height:0;height:auto}
.spatial-shell:fullscreen .spatial-toolbar,.spatial-shell:fullscreen .spatial-controls{flex-shrink:0}
.spatial-dialog{position:fixed;inset:0;margin:auto;width:calc(100vw - 24px);height:calc(100dvh - 24px);max-width:none;max-height:none;padding:0;border:1px solid #87cde344;border-radius:16px;background:#070d15;color:var(--ink);overflow:hidden}
.spatial-dialog::backdrop{background:#020810e8;backdrop-filter:blur(12px)}
.spatial-shell.is-expanded{display:flex;flex-direction:column;height:100%;border:0;border-radius:0}
.spatial-shell.is-expanded .spatial-viewport{flex:1;min-height:0;height:auto}
.spatial-shell.is-expanded .spatial-toolbar,.spatial-shell.is-expanded .spatial-controls{flex-shrink:0}
.lab-panel-spatial{padding:0;background:transparent;border:0;border-radius:0}
.lab-panel-spatial .spatial-viewport{height:550px}
.lab-panel-spatial .spatial-footnote{padding-inline:4px}
.lab-menu{gap:8px}.lab-tab{padding:16px 20px}
.lab-intro .inner-grid{padding-bottom:45px}
.lab-intro .inner-grid p{max-width:530px}
.lab-intro .inner-grid h1{overflow-wrap:normal}
.terminal-quick{display:flex;gap:8px;padding:10px 20px 14px;background:#0a1520;flex-wrap:wrap;border-top:1px solid #9fdcf420}
.terminal-quick button{border:1px solid #83d9e333;background:#83d9e308;color:#9ed9e3;padding:7px 10px;border-radius:5px;font:10px ui-monospace,monospace;cursor:pointer}
.terminal-quick button:hover{color:var(--lime);border-color:var(--lime)}
@keyframes spectrum{to{background-position:100% 50%}}
html[data-motion=paused] *,html[data-motion=paused] *:before,html[data-motion=paused] *:after{animation-play-state:paused!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
html[data-motion=paused] .reveal{opacity:1;transform:none}
html[data-motion=paused] .bird-cutout{transform:rotate(-6deg)}
html[data-motion=paused] .cap-card{transform:none}
@media(max-width:1100px){.hero-grid{min-height:625px}.hero-scene{height:575px}.hero h1{font-size:5.35vw}.hero-smallstats{gap:22px}.spatial-sliders{gap:14px}.spatial-sliders input[type=range]{width:80px}.spatial-toolbar{gap:12px}.scene-corner.top-right{display:none}.bird-tag{right:-2%;bottom:105px}.hero-actions .pill-link{font-size:11px;padding:12px 15px}.lab-tab{padding:14px;font-size:11px}}
@media(max-width:800px){.spatial-toolbar{align-items:flex-start;flex-direction:column;padding:18px}.spatial-modes{width:100%;gap:4px}.spatial-modes button{flex:1;padding:9px}.spatial-controls{align-items:flex-start;flex-wrap:wrap;padding:17px}.spatial-sliders{width:100%;justify-content:space-between;gap:10px}.spatial-sliders input[type=range]{width:100px}.spatial-control-actions{width:100%}.spatial-control-actions>*{flex:1;justify-content:center}.spatial-viewport{height:430px}.lab-panel-spatial .spatial-viewport{height:440px}.spatial-footnote{align-items:flex-start;flex-direction:column;gap:10px}.header-inner{gap:10px}.header-tools{gap:6px}}
@media(max-width:700px){.hero-grid{grid-template-columns:1fr;gap:0}.hero-text{padding:38px 0 13px}.hero h1{font-size:clamp(2.9rem,10.3vw,4.8rem);line-height:1.06;letter-spacing:-.065em}.hero-side-label{font-size:8px;letter-spacing:.08em;margin-bottom:22px}.hero-text>p{font-size:14px;line-height:1.75;margin-top:23px;max-width:470px}.hero-actions{margin-top:23px}.hero-actions .pill-link{min-height:49px;padding:12px 16px;font-size:11px}.hero-smallstats{margin-top:29px;gap:32px}.hero-smallstats strong{font-size:21px}.hero-smallstats span{font-size:8px}.hero-scene{height:480px;margin-top:2px;max-width:520px;width:100%;justify-self:center;overflow:hidden}.bird-cutout{height:62%;width:42%;left:29%;top:17%}.bird-tag{right:2%;bottom:94px;padding:11px 12px;max-width:185px}.bird-tag span{font-size:9px}.bird-tag b{font-size:10px}.orbital-label{left:3%;top:36%;font-size:8px}.orbital-label:after{width:39px}.scene-corner.top-left{top:28px;left:10px}.scene-corner.bottom-left{left:10px;bottom:32px;font-size:7px}.scene-corner.bottom-right{right:10px;bottom:32px;font-size:7px}.scene-toggle{bottom:29px;padding:9px 11px;font-size:9px}.scene-toggle span{margin-left:5px}.hero-topline .eyebrow{font-size:8px;letter-spacing:.08em}.hero-bottomline{font-size:8px;letter-spacing:.03em;gap:15px}.hero-bottomline>span:last-child{display:none}.motion-toggle{width:34px;height:34px;font-size:15px}.kbd-button{font-size:10px;padding:9px}.spatial-section{padding:72px 0 64px}.spatial-section .section-header h2{font-size:clamp(2.7rem,9vw,4.4rem)}.spatial-section .section-header>p{font-size:14px}.spatial-shell{border-radius:14px}.spatial-viewport{height:370px}.lab-panel-spatial .spatial-viewport{height:370px}.spatial-display{left:18px;top:20px;font-size:8px}.spatial-display .spatial-index{font-size:34px}.spatial-coordinate{right:16px;top:20px;font-size:7px}.spatial-hint{left:16px;bottom:17px;font-size:8px;max-width:85%}.spatial-button{font-size:10px;padding:10px}.spatial-sliders label{font-size:8px}.spatial-sliders input[type=range]{width:86px}.spatial-sliders select{max-width:116px;font-size:9px}.spatial-notice{bottom:50px;font-size:10px;width:max-content}.lab-menu{flex-direction:row;flex-wrap:wrap}.lab-tab{flex:1 1 40%;padding:13px 10px;white-space:nowrap;font-size:10px}.lab-tab span{margin-right:6px}.lab-intro .inner-grid{padding-bottom:27px}.lab-panel-spatial{padding:0}.header-tools .kbd-button span{display:none}.terminal-quick{padding:10px 12px}}
@media(max-width:390px){.hero h1{font-size:10.1vw}.hero-actions{gap:7px}.hero-actions .pill-link{font-size:10px;padding:10px 13px}.hero-scene{height:430px}.hero-smallstats{gap:24px}.brand small{font-size:6px}.header-tools{gap:4px}.motion-toggle{width:30px;height:30px}.spatial-sliders input[type=range]{width:64px}.spatial-modes button{font-size:10px;padding:8px 5px}.spatial-sliders select{max-width:105px}.spatial-viewport,.lab-panel-spatial .spatial-viewport{height:330px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}
@media(max-width:700px){.lab-intro .inner-grid h1{font-size:clamp(2.4rem,9.4vw,4.5rem)}}
@media(max-width:800px){.spatial-toolbar{padding-right:18px}.spatial-toolbar>.eyebrow{padding-right:42px;font-size:9px}.spatial-toolbar>.motion-toggle{right:18px;top:12px;width:30px;height:30px}}
