/* Shared visual language for the complete experience, not isolated screens. */
.hero-foot{gap:0;display:flex;align-items:stretch;margin-top:29px;max-width:540px;border:1px solid #bfced624;background:linear-gradient(115deg,#0c1725d9,#111b2580);border-radius:10px;backdrop-filter:blur(12px);overflow:hidden;box-shadow:inset 0 1px 0 #ffffff09}
.hero-foot>span{position:relative;display:flex;align-items:center;gap:12px;padding:15px 20px;border:0;border-right:1px solid #ffffff15;font:8px/1.8 var(--mono);color:#acbdcf;letter-spacing:1px;overflow:hidden}
.hero-foot>span i{font:500 30px var(--display);color:#ecf4db;letter-spacing:-1.5px;margin:0;display:inline-block;min-width:44px}.hero-foot>span:nth-child(2) i{color:var(--lilac)}.hero-foot>span:last-child{font-size:7px;line-height:1.9}
.hero-foot>span:after{content:'';position:absolute;left:-100%;top:0;width:60%;height:100%;background:linear-gradient(100deg,transparent,#d4ff5312,transparent);animation:statSweep 9s ease-in-out infinite}.hero-foot>span:nth-child(2):after{animation-delay:2s}.hero-foot>span:nth-child(3):after{animation-delay:4s}
.hero-annotation{right:5%;bottom:17%;padding:20px 24px;gap:18px;border:1px solid #bbceec2b;border-radius:12px;background:linear-gradient(120deg,#0e192ad9,#172a2f77);backdrop-filter:blur(14px);box-shadow:0 12px 40px #0002;max-width:380px;overflow:hidden}
.hero-annotation:after{content:'';position:absolute;left:70px;bottom:0;width:65%;height:1px;background:linear-gradient(90deg,transparent,var(--acid),transparent);animation:annotationSignal 6s ease-in-out infinite}
.hero-annotation .cross{width:40px;height:40px;border:1px solid #d4ff5344;border-radius:50%;display:grid;place-items:center;position:relative;flex-shrink:0;font-size:21px;color:var(--acid)}
.hero-annotation .cross:before,.hero-annotation .cross:after{content:'';position:absolute;inset:-7px;border:1px dashed #b8a2ff55;border-radius:50%;animation:miniOrbit 18s linear infinite}.hero-annotation .cross:after{inset:-3px;border:0;border-top:2px solid var(--acid);animation-duration:9s}
.hero-annotation b{font-size:10px;letter-spacing:2px}.hero-annotation div>span{font:11px/1.7 var(--body);color:#b2c0cf;max-width:220px}.hero-annotation i{font-size:25px;animation:annotationArrow 4s ease-in-out infinite}
.world-footer{height:72px;border-top-color:#d4ff532a;gap:16px}.world-footer>button{padding:11px 14px;border:1px solid #ffffff18;border-radius:30px;background:#0b162a77;transition:color .3s,background .3s,border-color .3s,transform .3s;position:relative;overflow:hidden;font-size:8px;letter-spacing:.8px}.world-footer>button:hover{color:var(--acid);border-color:#d4ff5370;transform:translateY(-3px);background:#d4ff5312}.world-footer #worldLocation{font-size:8px;letter-spacing:1.2px;color:#a1b5c5}.world-footer .coordinate{font-size:8px;color:#758aa2}.live-dot{animation:sharedBeacon 3s ease-in-out infinite}
.button,.learn-solid{position:relative;overflow:hidden;box-shadow:inset 0 1px 0 #ffffff30,0 8px 25px #d4ff5309}.button:after,.learn-solid:after{content:'';position:absolute;top:-50%;left:-80%;height:200%;width:40%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,#fff7,transparent);transition:left .75s;pointer-events:none}.button:hover:after,.learn-solid:hover:after{left:140%}.quiet,.back-link,.learn-link{transition:color .25s,transform .25s}.quiet:hover,.back-link:hover,.learn-link:hover{transform:translateX(3px)}
.eyebrow,.learn-kicker{color:#b4c6d1;letter-spacing:2px}.hero-desc{font-weight:400;color:#bcc8d3}.hero-desc:before{content:'';display:block;height:1px;width:45px;margin-bottom:15px;background:linear-gradient(90deg,var(--lilac),transparent)}
.glass{border-color:#c8daf12d;background:linear-gradient(140deg,#112033e8,#090f1be8);box-shadow:0 20px 60px #0003,inset 0 1px 0 #ffffff0b}.glass:before{content:'';position:absolute;left:15%;right:15%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#b8a2ff88,transparent);pointer-events:none}
.lab-toolbar{border-radius:14px;padding:15px 18px;gap:18px}.tool-button,.add-group button{transition:transform .3s,color .3s,background .3s;border-radius:8px}.tool-button:hover,.add-group button:hover{transform:translateY(-4px);background:#b8a2ff12}.add-group button small,.tool-button span{font-size:9px;color:#a7b7c8}.tool-button.active{background:#d4ff5316;box-shadow:inset 0 0 0 1px #d4ff5344}.lab-status{border-radius:30px;letter-spacing:.5px;font-size:10px}.lab-status b{padding-left:14px;border-left:1px solid #ffffff22;color:var(--lilac)}
.lab-inspector h3{font-size:18px;letter-spacing:-.7px;line-height:1.5}.lab-inspector .eyebrow{font-size:7px}.lab-inspector input{background:#060d17;box-shadow:inset 0 2px 12px #0003;transition:box-shadow .3s,border-color .3s}.lab-inspector input:focus{box-shadow:0 0 0 3px #d4ff5312}.lab-inspector button:not(#hideInspector){transition:padding-left .25s,color .25s,background .25s;border-radius:4px}.lab-inspector button:not(#hideInspector):hover{padding-left:7px;background:#d4ff5309}.lab-inspector .danger:hover{color:#ffadb4;background:#f2758710!important}.node-label{box-shadow:0 6px 18px #0003;border-radius:7px}.node-label.selected{box-shadow:0 0 18px #d4ff5318,inset 0 0 12px #d4ff5308}.node-label.selected:before{content:'';position:absolute;left:-1px;top:7px;bottom:7px;width:2px;background:var(--acid)}
.journey-top .mono{padding:10px 13px;border:1px solid #b8a2ff33;border-radius:7px;color:var(--lilac)}.chapter-dots button{height:4px;border-radius:4px}.journey-caption .eyebrow{color:var(--acid)}.journey-badge{padding:18px 10px;border:1px solid #ffffff1c;border-radius:30px;background:#0c152b77;backdrop-filter:blur(8px)}
.settings .eyebrow,.terminal .eyebrow{color:var(--lilac)}.settings select{border-radius:7px;padding:8px}.terminal{border-radius:12px}.terminal pre{padding:12px;border:1px solid #ffffff10;background:#050c14aa;border-radius:7px}.terminal form{border-top-color:#d4ff5330}.terminal form>span{animation:sharedBeacon 2s infinite}#toast{box-shadow:0 10px 40px #0005;border:1px solid #ebffa3;border-radius:10px}
.learn-progress-num{font-weight:550!important}.learn-header{background:linear-gradient(110deg,#0a111ce8,#17182de8);backdrop-filter:blur(18px)}.learn-header nav button{position:relative;transition:color .3s,transform .3s}.learn-header nav button:hover{transform:translateY(-2px)}.learn-reader-body blockquote{border-radius:0 12px 12px 0;box-shadow:inset 0 0 30px #d4ff5303}.learn-check{border-radius:12px;background:linear-gradient(130deg,#b8a2ff0c,#d4ff5305)}.learn-option{position:relative;overflow:hidden;border-radius:9px!important;transition:transform .25s,background .25s,border-color .25s!important}.learn-option:hover:not(:disabled){transform:translateX(4px);background:#d4ff5308}.learn-option>span{border-radius:8px!important}.learn-search{transition:border-color .3s}.learn-search:focus-within{border-color:var(--acid)}.learn-source{border-radius:8px;background:#b8a2ff07;padding:17px!important}.learn-source a{transition:color .3s}.learn-source a:hover{color:var(--acid)}
.learn-cidr-form>div{border-radius:8px;background:#050c1477;padding:13px!important}.learn-bits span{transition:background .35s,transform .35s}.learn-bits span:hover{transform:translateY(-4px);filter:brightness(1.5)}.learn-subnet-output dl>div{transition:background .25s,padding .25s}.learn-subnet-output dl>div:hover{background:#b8a2ff08;padding-left:8px;padding-right:8px}.learn-handshake{border-radius:12px}.learn-tcp-arrow span{border-radius:8px;position:relative;overflow:hidden}.learn-tcp-arrow.is-sent span:after{content:'';position:absolute;left:-10%;width:12%;top:0;bottom:0;background:#d4ff5322;animation:tcpSignal 3s linear infinite}.learn-dns-node.is-active>span{animation:sharedBeacon 3s infinite}.learn-footer{border-top-color:#b8a2ff22}.learn-footer button{transition:color .3s,transform .3s}.learn-footer button:hover{color:var(--acid);transform:translateX(4px)}
@keyframes statSweep{0%,65%{left:-100%}90%,100%{left:180%}}@keyframes miniOrbit{to{transform:rotate(360deg)}}@keyframes annotationArrow{0%,100%{transform:translate(0,0);opacity:.6}50%{transform:translate(-4px,4px);opacity:1}}@keyframes annotationSignal{0%,100%{transform:scaleX(.3);opacity:.3}50%{transform:scaleX(1);opacity:1}}@keyframes sharedBeacon{0%,100%{opacity:.6}50%{opacity:1}}@keyframes tcpSignal{to{left:110%}}
@media(max-width:1100px){.hero-foot>span{padding:12px 15px;gap:9px}.hero-foot>span i{font-size:26px;min-width:36px}.hero-annotation{max-width:310px;padding:16px}.hero-annotation b{font-size:9px}.world-footer .coordinate{display:none}.lab-toolbar{gap:12px}}
@media(max-width:700px){.hero-foot{max-width:100%;margin-top:25px;width:max-content}.hero-foot>span{padding:12px 9px;gap:6px;font-size:6px;letter-spacing:.4px}.hero-foot>span i{font-size:21px;min-width:31px}.hero-foot>span:last-child{font-size:5px}.hero-annotation{bottom:14%;right:6%;max-width:230px;padding:14px;gap:13px}.hero-annotation .cross{width:27px;height:27px;font-size:16px}.hero-annotation b{font-size:7px;letter-spacing:1px}.hero-annotation div>span{display:none}.hero-annotation i{display:none}.world-footer{height:66px;gap:8px}.world-footer>button{font-size:6px;padding:9px 10px;letter-spacing:.3px}.world-footer #worldLocation{font-size:6px;letter-spacing:.5px}.hero-desc:before{margin-bottom:11px}.lab-toolbar{padding:10px;gap:8px}.add-group button small,.tool-button span{font-size:6px}.lab-inspector h3{font-size:12px}.lab-status{font-size:7px;padding:10px 12px}.lab-status b{padding-left:8px}.journey-badge{padding:13px 7px;font-size:6px}.learn-source{padding:12px!important}.learn-cidr-form>div{padding:10px!important}}
html[data-motion=reduced] *,html[data-motion=reduced] *:before,html[data-motion=reduced] *:after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Academy navigation follows the same identity as the 3D world. */
.learn-shell .learn-header{height:104px;display:grid;grid-template-columns:minmax(165px,1fr) auto auto auto auto;gap:22px;padding:0 4%;position:relative;isolation:isolate;border-bottom:1px solid #b8a2ff33;box-shadow:0 10px 40px #0002;background:linear-gradient(110deg,#0b1522f5,#111326f5)}
.learn-shell .learn-header:after{content:'';position:absolute;left:0;bottom:-1px;width:28%;height:1px;background:linear-gradient(90deg,transparent,var(--acid),var(--violet),transparent);animation:headerSignal 12s ease-in-out infinite;pointer-events:none}
.learn-shell .learn-wordmark{display:grid;grid-template-columns:32px auto;align-items:center;justify-content:start;column-gap:10px;padding:0;transition:filter .3s,transform .3s;text-align:left}
.learn-shell .learn-wordmark svg{grid-row:1/3;width:31px;height:31px;fill:none;stroke:var(--acid);stroke-width:2;filter:drop-shadow(0 0 8px #d4ff5333)}
.learn-shell .learn-wordmark svg path{stroke-dasharray:105;animation:identitySignal 8s ease-in-out infinite}
.learn-shell .learn-wordmark b{font:700 25px/1.15 var(--display);letter-spacing:-1.5px}.learn-shell .learn-wordmark>span{font:7px/1.6 var(--mono);letter-spacing:1.8px;margin:4px 0 0;color:#a5b7ca}.learn-shell .learn-wordmark:hover{filter:drop-shadow(0 0 14px #d4ff5322);transform:translateY(-2px)}
.learn-shell .learn-header nav{display:flex;gap:4px;padding:5px;border:1px solid #ffffff18;border-radius:32px;background:#060d1a77;justify-content:center}
.learn-shell .learn-header nav button{font:500 11px var(--body);padding:13px 17px;border-radius:24px;white-space:nowrap;position:relative;overflow:hidden;color:#aebbc9;transition:background .3s,color .3s,transform .3s}
.learn-shell .learn-header nav button small{font:7px var(--mono);color:#7d90a5;margin-right:6px}.learn-shell .learn-header nav button:after{display:none}.learn-shell .learn-header nav button.is-active{background:#d4ff5316;color:var(--acid);box-shadow:inset 0 0 0 1px #d4ff5333}.learn-shell .learn-header nav button.is-active small{color:var(--acid)}
.learn-shell .learn-header nav button:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent,#d4ff5320,transparent);transform:translateX(-130%);transition:transform .6s;pointer-events:none}.learn-shell .learn-header nav button:hover:before{transform:translateX(130%)}.learn-shell .learn-header nav button:hover{background:#ffffff08;color:var(--acid)}
.learn-shell .learn-progress{position:relative;display:flex;align-items:center;gap:9px;padding:9px 0 14px;min-width:90px}.learn-shell .learn-progress-num{font:550 28px/1 var(--display);letter-spacing:-1.5px;color:var(--acid)}.learn-shell .learn-progress>span:nth-child(2){font:6px/1.8 var(--mono);letter-spacing:1px;color:#9eafc1}
.learn-shell .learn-progress-track{position:absolute;left:0;right:0;bottom:2px;height:2px;background:#b8a2ff22;overflow:hidden}.learn-shell .learn-progress-track i{display:block;width:var(--learn-progress,0%);height:100%;background:linear-gradient(90deg,var(--acid),#b8a2ff);box-shadow:0 0 10px #d4ff5355;transition:width .65s ease}
.learn-shell .learn-home-link{font:500 10px var(--body);padding:12px 15px;border:1px solid #d4ff5340;border-radius:25px;color:#deefc7;background:#d4ff5308;white-space:nowrap;transition:background .3s,transform .3s,border-color .3s}.learn-shell .learn-home-link:hover{background:#d4ff531c;border-color:var(--acid);transform:translateX(-3px)}
.learn-shell .learn-close{width:36px;height:36px;font-size:21px;border-color:#c1cce62b;background:#ffffff04;transition:transform .3s,background .3s}.learn-shell .learn-close:hover{transform:rotate(90deg);background:#b8a2ff16}
.learn-shell .learn-scroll{height:calc(100% - 104px)}
@media(max-width:1100px){.learn-shell .learn-header{gap:12px;padding:0 3%;grid-template-columns:minmax(135px,1fr) auto auto auto auto}.learn-shell .learn-wordmark b{font-size:21px}.learn-shell .learn-wordmark{column-gap:7px;grid-template-columns:27px auto}.learn-shell .learn-wordmark svg{width:26px;height:26px}.learn-shell .learn-header nav button{padding:12px 11px;font-size:10px}.learn-shell .learn-header nav button small{display:none}.learn-shell .learn-progress{min-width:75px}.learn-shell .learn-home-link{font-size:9px;padding:11px}}
@media(max-width:750px){.learn-shell .learn-header{height:128px;grid-template-columns:1fr auto auto auto;gap:10px;padding:15px 5%;align-content:center}.learn-shell .learn-header nav{position:static;grid-column:1/-1;grid-row:2;justify-content:space-between;width:100%;padding:3px;border-radius:24px;gap:0;margin-top:4px}.learn-shell .learn-header nav button{flex:1;font-size:9px;padding:10px 8px}.learn-shell .learn-wordmark b{font-size:19px}.learn-shell .learn-wordmark>span{font-size:5px;letter-spacing:1.4px}.learn-shell .learn-wordmark{grid-template-columns:21px auto;column-gap:6px}.learn-shell .learn-wordmark svg{width:21px;height:21px}.learn-shell .learn-progress{min-width:48px;gap:4px;padding:4px 0 9px}.learn-shell .learn-progress-num{font-size:21px}.learn-shell .learn-progress>span:nth-child(2){font-size:5px;letter-spacing:.2px}.learn-shell .learn-home-link{font-size:8px;padding:9px 10px}.learn-shell .learn-close{width:28px;height:28px;font-size:18px}.learn-shell .learn-scroll{height:calc(100% - 128px)}}