/* REL 6.17.40 — homepage master system
   One control surface for the whole tannerd.net family: observe, remember, automate,
   structure and preserve context. The diagram is explanatory, not fake telemetry. */

.master-celestial{overflow:visible!important;isolation:isolate}
.master-celestial::before{opacity:.82}
.master-system{--master-accent:91,180,197;position:relative;z-index:5;width:min(690px,46vw);aspect-ratio:1;margin:auto;filter:drop-shadow(0 34px 70px rgba(0,0,0,.62));user-select:none}
.master-system::before,.master-system::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.master-system::before{inset:5.5%;border:1px solid rgba(242,238,228,.18);box-shadow:0 0 0 34px rgba(210,168,79,.012),0 0 95px rgba(var(--master-accent),.08),inset 0 0 52px rgba(var(--master-accent),.025)}
.master-system::after{inset:18%;border:1px dashed rgba(210,168,79,.24);animation:masterSpin 54s linear infinite}
.master-map{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.master-map .ring{fill:none;stroke:rgba(242,238,228,.14);stroke-width:1}
.master-map .ring.gold{stroke:rgba(210,168,79,.24);stroke-dasharray:3 9}
.master-map .axis{fill:none;stroke:rgba(242,238,228,.1);stroke-width:1}
.master-map .route{fill:none;stroke:rgba(242,238,228,.12);stroke-width:1.2;transition:stroke .22s ease,stroke-width .22s ease,filter .22s ease}
.master-map .route.is-active{stroke:rgba(var(--master-accent),.8);stroke-width:2;filter:drop-shadow(0 0 8px rgba(var(--master-accent),.38));stroke-dasharray:5 8;animation:masterRoute 5.8s linear infinite}
.master-map .constellation{fill:none;stroke:rgba(210,168,79,.19);stroke-width:1;stroke-dasharray:2 8}
.master-core{position:absolute;left:50%;top:50%;width:29%;aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid rgba(242,238,228,.34);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(var(--master-accent),.075),rgba(6,7,8,.95) 56%,rgba(2,3,4,.99));box-shadow:0 0 0 13px rgba(var(--master-accent),.018),0 0 46px rgba(var(--master-accent),.1)}
.master-core::before{content:"";position:absolute;width:34%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffce9 0 7%,#efc85f 22%,#bf8323 52%,#49300f 100%);border:1px solid #f1d179;box-shadow:0 0 12px rgba(239,196,83,.72),0 0 32px rgba(210,168,79,.24);animation:masterPulse 4.6s ease-in-out infinite}
.master-core::after{content:"";position:absolute;inset:14%;border:1px solid rgba(210,168,79,.26);border-radius:50%;animation:masterSpin 28s linear reverse infinite}
.master-core span,.master-core em,.master-core b{position:absolute;z-index:2;text-transform:uppercase;text-align:center}
.master-core span{top:13%;font:900 .44rem var(--mono);letter-spacing:.18em;color:#8f887b}
.master-core b{bottom:13%;font:900 .5rem var(--mono);letter-spacing:.15em;color:#efe0b7}
.master-core em{bottom:29%;font:900 .42rem var(--mono);letter-spacing:.14em;font-style:normal;color:rgb(var(--master-accent))}
.master-node{--x:50%;--y:8%;--node:91,180,197;position:absolute;z-index:8;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:104px;aspect-ratio:1;border-radius:50%;border:1px solid rgba(242,238,228,.21);background:rgba(3,4,5,.9);color:#c5bfb3;padding:0;display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.34),inset 0 0 0 7px rgba(var(--node),.014);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease,background .2s ease}
.master-node::before{content:attr(data-index);position:absolute;top:11px;font:900 .4rem var(--mono);letter-spacing:.14em;color:rgba(var(--node),.7)}
.master-node span{font:900 .49rem/1.12 var(--mono);letter-spacing:.1em;text-transform:uppercase;text-align:center;max-width:78px}
.master-node:hover,.master-node:focus-visible{transform:translate(-50%,-50%) scale(1.055);outline:none;border-color:rgba(var(--node),.72);color:#fff8e8}
.master-node.is-active{border-color:rgba(var(--node),.92);color:#fff8e8;background:radial-gradient(circle,rgba(var(--node),.12),rgba(3,4,5,.94) 66%);box-shadow:0 0 0 7px rgba(var(--node),.025),0 0 30px rgba(var(--node),.2),inset 0 0 0 1px rgba(255,255,255,.045)}
.master-node.is-active::after{content:"";position:absolute;inset:-8px;border:1px dashed rgba(var(--node),.44);border-radius:50%;animation:masterSpin 14s linear infinite}
.master-node.search{--x:50%;--y:8%;--node:91,180,197}
.master-node.distribution{--x:88%;--y:39%;--node:210,168,79}
.master-node.operator{--x:73%;--y:83%;--node:117,151,181}
.master-node.search-systems{--x:27%;--y:83%;--node:130,168,132}
.master-node.portals{--x:12%;--y:39%;--node:166,132,166}
.master-detail{position:absolute;z-index:9;left:50%;bottom:-2%;transform:translateX(-50%);width:74%;min-height:72px;padding:12px 17px 13px;border:1px solid rgba(210,168,79,.25);background:rgba(3,4,5,.9);box-shadow:0 18px 36px rgba(0,0,0,.34);backdrop-filter:blur(8px)}
.master-detail span{display:block;margin-bottom:6px;font:900 .47rem var(--mono);letter-spacing:.16em;text-transform:uppercase;color:rgb(var(--master-accent))}
.master-detail p{margin:0;font-size:.72rem;line-height:1.5;color:#aaa398}
.master-celestial .field-notes.left{left:-1%;bottom:21%;color:rgba(210,168,79,.64)}
.master-celestial .field-notes.right{right:-2%;top:19%;color:rgba(242,238,228,.44)}

/* The new line deserves room. Keep it editorial, not billboard-chaotic. */
.hero-copy h1{max-width:680px;text-wrap:balance}
.hero-copy .lede{max-width:680px}
.hero-copy .plain{max-width:660px}

@media(max-width:1120px){
  .master-system{width:min(650px,84vw)}
  .master-detail{bottom:0}
}
@media(max-width:760px){
  .master-celestial{min-height:520px!important;margin-top:14px}
  .master-system{width:min(470px,94vw)}
  .master-node{width:74px}
  .master-node::before{top:7px;font-size:.32rem}
  .master-node span{font-size:.37rem;letter-spacing:.075em;max-width:57px}
  .master-core span{font-size:.34rem}.master-core em{font-size:.32rem}.master-core b{font-size:.36rem}
  .master-detail{width:82%;bottom:-2%;padding:9px 11px 10px;min-height:62px}
  .master-detail span{font-size:.38rem;margin-bottom:4px}.master-detail p{font-size:.63rem}
  .master-celestial .field-notes{display:none}
}
@media(max-width:430px){
  .master-celestial{min-height:430px!important}
  .master-system{width:min(390px,96vw)}
  .master-node{width:64px}.master-node span{font-size:.33rem;max-width:50px}
  .master-detail{width:86%;bottom:-5%}
}
@keyframes masterSpin{to{transform:rotate(360deg)}}
@keyframes masterRoute{to{stroke-dashoffset:-78}}
@keyframes masterPulse{0%,100%{transform:scale(.92);filter:brightness(.94)}50%{transform:scale(1.06);filter:brightness(1.18)}}
@media(prefers-reduced-motion:reduce){.master-system::after,.master-map .route.is-active,.master-core::before,.master-core::after,.master-node.is-active::after{animation:none!important}}

/* REL 6.17.58 — homepage geometric reactions */
.master-system{--geo-x:0px;--geo-y:0px;--geo-r:0deg;--core-x:0px;--core-y:0px;--core2-x:0px;--core2-y:0px}
.master-map{translate:var(--geo-x) var(--geo-y);rotate:var(--geo-r);will-change:translate,rotate}
.master-core::before{translate:var(--core-x) var(--core-y);will-change:translate}
.master-core::after{translate:var(--core2-x) var(--core2-y);will-change:translate}
.master-node.is-near:not(.is-active){border-color:rgba(var(--node),.56);color:#f7edda;box-shadow:0 0 0 5px rgba(var(--node),.018),0 0 24px rgba(var(--node),.12),inset 0 0 0 7px rgba(var(--node),.022)}
@media(prefers-reduced-motion:reduce){.master-map,.master-core::before,.master-core::after{translate:0 0!important;rotate:0deg!important}.master-node.is-near:not(.is-active){box-shadow:0 12px 30px rgba(0,0,0,.34),inset 0 0 0 7px rgba(var(--node),.014)}}
