@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root{color-scheme:dark;font-family:'Space Grotesk',Arial,sans-serif;background:#080d1a;color:#f7f9ff;font-synthesis:none}
*{box-sizing:border-box}
html{min-width:320px}
body{margin:0;min-height:100vh}
.page-shell{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:100vh;overflow:hidden;background:radial-gradient(ellipse at 72% 46%,#102541 0%,transparent 34%),radial-gradient(ellipse at 15% 85%,#101931 0%,transparent 35%),#080d1a}
.page-shell::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.25;background-image:linear-gradient(#8ca7d214 1px,transparent 1px),linear-gradient(90deg,#8ca7d214 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,transparent,#000 26%,#000 78%,transparent)}
.page-shell::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#080d1a 0%,transparent 50%,#080d1a20 100%)}
.ambient{position:absolute;z-index:-1;filter:blur(80px);border-radius:50%;pointer-events:none;opacity:.18}
.ambient-one{width:440px;height:440px;right:5%;top:12%;background:#258bff;animation:float-one 13s ease-in-out infinite alternate}
.ambient-two{width:340px;height:340px;right:28%;bottom:-12%;background:#7b3ff2;animation:float-two 17s ease-in-out infinite alternate}
.grid-floor{position:absolute;z-index:-1;right:-12%;bottom:-30%;width:75%;height:55%;transform:perspective(600px) rotateX(68deg);transform-origin:bottom;opacity:.2;background-image:linear-gradient(#84abf9 1px,transparent 1px),linear-gradient(90deg,#84abf9 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to top,#000,transparent 90%)}
.site-header,.site-footer{width:min(100% - 112px,1440px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between}
.site-header{padding-top:35px}
.brand{display:flex;align-items:center;gap:12px}
.brand-name{font-size:27px;font-weight:700;letter-spacing:-.08em;line-height:1}
.brand-period,.title-period{color:#72ede4}
.brand-symbol{width:26px;height:26px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;transform:rotate(-24deg)}
.brand-symbol span{border:2px solid #83f2e9;border-radius:3px}.brand-symbol span:nth-child(2),.brand-symbol span:nth-child(3){opacity:.48}
.header-caption,.eyebrow,.visual-label,.site-footer,.status-copy small{font-family:'DM Mono',monospace;letter-spacing:.1em}
.header-caption{color:#7f94b3;font-size:10px}.header-caption span{color:#7cf2e7;margin-left:7px;font-size:17px}
.main-content{width:min(100% - 112px,1440px);margin:auto;min-height:650px;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(410px,.97fr);align-items:center;gap:30px;padding:70px 0 84px}
.message{position:relative;z-index:2;max-width:690px;padding-top:10px}
.eyebrow{display:flex;align-items:center;gap:12px;width:max-content;max-width:100%;padding:10px 14px;border:1px solid #6ce9df38;border-radius:3px;background:#65e8dc0b;color:#92eee8;font-size:10px;font-weight:500;white-space:nowrap}
.eyebrow-light{width:6px;height:6px;border-radius:50%;background:#7bf9f1;box-shadow:0 0 0 4px #7bf9f122,0 0 14px #7bf9f1;animation:blink 2.6s ease-in-out infinite}
.eyebrow-index{margin-left:13px;color:#63878d}
h1{margin:32px 0 24px;font-size:clamp(60px,6.6vw,104px);font-weight:600;letter-spacing:-.085em;line-height:1.08;text-wrap:balance}
h1 span{color:#b7c9e4}h1 .title-period{color:#70eee6}
.lead{margin:0;font-size:clamp(23px,2.3vw,34px);letter-spacing:-.035em;font-weight:500;line-height:1.35;color:#f0f5ff}
.supporting{max-width:470px;margin:17px 0 44px;color:#92a2bb;font-size:16px;line-height:1.75}
.status-panel{display:flex;align-items:center;gap:16px;width:min(100%,462px);min-height:80px;padding:16px 19px;border:1px solid #a9c6ff28;background:linear-gradient(110deg,#ffffff0b,#ffffff03);box-shadow:0 16px 44px #00000021;backdrop-filter:blur(14px);border-radius:12px}
.status-icon{display:grid;place-items:center;flex:none;width:39px;height:39px;border:1px solid #7af7ed4d;border-radius:10px;background:#6aefe311}
.status-icon span{width:13px;height:13px;border:2px solid #7bf9f1;border-top-color:transparent;border-radius:50%;animation:spin 1.9s linear infinite}
.status-copy{display:flex;flex-direction:column;gap:6px;min-width:0}.status-copy strong{font-size:13px;font-weight:600;letter-spacing:.01em}.status-copy small{font-size:9px;color:#7b8da9;letter-spacing:.02em}
.status-bars{display:flex;align-items:end;gap:3px;margin-left:auto;height:21px}.status-bars i{width:3px;height:7px;border-radius:3px;background:#80f5eb;animation:bars 1.25s ease-in-out infinite alternate}.status-bars i:nth-child(2){animation-delay:.16s}.status-bars i:nth-child(3){animation-delay:.32s}.status-bars i:nth-child(4){animation-delay:.48s}.status-bars i:nth-child(5){animation-delay:.64s}
.visual{position:relative;width:min(100%,610px);aspect-ratio:1;margin-inline:auto;transform:translateX(3%);filter:drop-shadow(0 0 35px #1c5fb42e)}
.visual-halo{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle,#3154a34f 0%,#3154a320 30%,transparent 67%);box-shadow:0 0 100px #247cbe13}
.visual::before,.visual::after{content:"";position:absolute;inset:4%;border-radius:50%;border:1px solid #91c4fc13}.visual::after{inset:19%;border-style:dashed;border-color:#96bafa3d;animation:spin 75s linear infinite reverse}
.orbit{position:absolute;border-radius:50%;border:1px solid #70a7df55;animation:spin 32s linear infinite}.orbit-outer{inset:1%;border-color:#609ada31;border-style:dashed}.orbit-middle{inset:12%;border-color:#78b3ed52;animation-duration:24s;animation-direction:reverse}.orbit-inner{inset:28%;border-color:#93c9ff68;box-shadow:inset 0 0 35px #639af31b,0 0 30px #639af31b;animation-duration:18s}
.orbit-outer::before,.orbit-middle::before,.orbit-inner::before{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#82efe7;box-shadow:0 0 20px #7cf7e9;top:14%;left:14%}.orbit-middle::before{background:#a1adff;box-shadow:0 0 20px #8c9fff;top:auto;left:auto;right:12%;bottom:12%}.orbit-inner::before{width:5px;height:5px;top:0;left:50%}
.orbit-dot{position:absolute;width:3px;height:3px;background:#8cbbf7;border-radius:50%;box-shadow:0 0 10px #8cbbf7}.orbit-dot-one{right:15%;bottom:14%}.orbit-dot-two{top:6%;right:25%}
.core-glow{position:absolute;inset:31%;border-radius:50%;background:#579cfa;filter:blur(43px);opacity:.35;animation:breathe 5s ease-in-out infinite}
.core{position:absolute;inset:34%;display:grid;place-items:center;border:1px solid #d0ecff5c;border-radius:50%;background:radial-gradient(circle at 30% 25%,#374f8b 0%,#142948 33%,#0a1931 75%);box-shadow:inset 0 0 32px #8aabf13d,0 0 42px #5b9aff45,0 0 110px #538aff18;animation:breathe 5s ease-in-out infinite}.core svg{width:83%;height:83%;filter:drop-shadow(0 0 9px #86d8ef99)}
.visual-label{position:absolute;z-index:2;padding:10px 13px;border:1px solid #7aa4d452;border-radius:3px;background:#101d35c9;color:#9ab5d4;font-size:9px;white-space:nowrap;box-shadow:0 10px 30px #0004;backdrop-filter:blur(8px)}.visual-label span{color:#7cf4e9;margin-left:12px}.visual-label-top{top:18%;right:-1%}.visual-label-bottom{left:0;bottom:18%}
.crosshair{position:absolute;color:#96b4d3a1;font-family:'DM Mono',monospace;font-size:19px;font-weight:400}.crosshair-one{top:22%;left:7%}.crosshair-two{right:10%;bottom:18%}
.site-footer{gap:20px;padding:25px 0 32px;border-top:1px solid #afc8ed1c;color:#6c7f9b;font-size:10px}.footer-line{height:1px;flex:1;background:linear-gradient(90deg,#7a9abd2e,transparent)}.footer-plus{color:#6ee9e2;margin-inline:5px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{50%{transform:scale(1.055)}}@keyframes blink{50%{opacity:.4;box-shadow:0 0 0 4px #7bf9f10b,0 0 4px #7bf9f1}}@keyframes bars{to{height:20px;opacity:.45}}@keyframes float-one{to{transform:translate(-70px,60px)}}@keyframes float-two{to{transform:translate(80px,-60px)}}
@media(max-width:1050px){.main-content{grid-template-columns:minmax(0,1fr) minmax(340px,.9fr);gap:0}.visual{transform:translateX(4%)}h1{font-size:clamp(58px,6.5vw,78px)}.visual-label-top{right:-2%}}
@media(max-width:900px){.site-header,.site-footer,.main-content{width:min(100% - 40px,560px)}.site-header{padding-top:24px}.header-caption{font-size:8px}.main-content{display:flex;flex-direction:column;align-items:stretch;min-height:0;gap:6px;padding:74px 0 45px}.message{padding-top:0}.eyebrow{font-size:9px}h1{font-size:clamp(53px,11.8vw,80px);margin:27px 0 20px}.lead{font-size:24px}.supporting{margin-bottom:30px;font-size:14px}.visual{width:min(100%,440px);margin-top:4px;transform:none}.visual-label{font-size:8px}.visual-label-top{right:0}.visual-label-bottom{left:0}.site-footer{padding:22px 0 26px;font-size:9px}}
@media(max-width:390px){.site-header,.site-footer,.main-content{width:calc(100% - 32px)}.header-caption{letter-spacing:0}.brand-name{font-size:24px}h1{font-size:50px}.eyebrow{gap:8px;padding:9px}.eyebrow-index{margin-left:3px}.visual-label{font-size:7px;padding:7px}.status-copy strong{font-size:12px}.status-copy small{font-size:8px}.site-footer{gap:10px;font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
