/* tn-core.css - Terra Nullius shared design system (both sites). Keep identical copies. */
:root{--bg:#03070d;--bg2:#02050a;--ink:#dfe9f1;--dim:#c3d5df;--mute:#7fb8cc;--cyan:#5ff0ff;--cy2:#7fdcff;--cy3:#8fe0ff;--deep:#06202c;--btn:#288cbe;--edge:#96e6ff;
--line:rgba(150,230,255,.3);--line2:rgba(150,230,255,.6);--panel:rgba(228,238,245,.06);--glow:0 0 22px rgba(80,210,255,.3);
--sans:"DejaVu Sans",Arial,sans-serif;--mono:"DejaVu Sans Mono",Consolas,monospace;--cut:14px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.55 var(--sans)}
a{color:var(--cy2);font-weight:bold}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
[id]{scroll-margin-top:5.5rem}
.skip{position:absolute;left:-999px;top:0;z-index:50;background:var(--btn);color:#fff;padding:.5rem 1rem}.skip:focus{left:1rem}
/* scanline overlay, whole page */
body::after{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(150,230,255,.03) 0 1px,transparent 1px 4px)}
/* HUD nav */
.nav{position:sticky;top:0;z-index:30;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1.5rem;padding:.6rem 4%;background:rgba(3,8,14,.82);border-bottom:1px solid var(--line);backdrop-filter:blur(6px)}
.home .nav{position:fixed;left:0;right:0}
.brand{color:#fff;text-decoration:none;font-size:1.15rem;font-weight:bold;letter-spacing:.03em}
.brand small{display:block;font-size:.62rem;font-weight:normal;color:#9fd8ee;letter-spacing:0}
.nav nav{display:flex;flex-wrap:wrap;align-items:stretch;gap:.3rem}
.nav nav a{display:flex;flex-direction:column;justify-content:center;padding:.3rem .7rem;color:var(--cy3);text-decoration:none;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;border:1px solid transparent;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.nav nav a .sec{font:normal .55rem/1.2 var(--mono);letter-spacing:.14em;color:var(--mute)}
.nav nav a:hover,.nav nav a:focus-visible,.nav nav a[aria-current]{color:#fff;background:rgba(40,140,190,.22);border-color:var(--line2)}
.nav nav a[aria-current] .sec{color:var(--cyan)}
.tn-sfx{font:bold .6rem var(--mono);letter-spacing:.12em;color:var(--mute);background:none;border:1px solid var(--line);padding:.3rem .5rem;cursor:pointer}
.tn-sfx[aria-pressed=true]{color:var(--cyan);border-color:var(--cyan)}
/* HUD text */
.hud-tag{margin:0 0 1rem;font:bold .74rem/1.3 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--cy2)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);margin-right:.6rem;vertical-align:middle}
.kicker,.sec-title span,.tp-k{display:block;font:bold .72rem/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:#5fd8f5;margin:0 0 .3rem}
.sec-title{color:#fff;font-size:1.9rem;margin:0 0 1.4rem;letter-spacing:.04em}
/* hero corner brackets */
.hud-frame{position:absolute;inset:5.5rem 2.2% 2.2rem;z-index:2;pointer-events:none}
.hud-frame .c{position:absolute;width:38px;height:38px;border:2px solid rgba(127,220,255,.55)}
.hud-frame .tl{top:0;left:0;border-right:0;border-bottom:0}.hud-frame .tr{top:0;right:0;border-left:0;border-bottom:0}
.hud-frame .bl{bottom:0;left:0;border-right:0;border-top:0}.hud-frame .br{bottom:0;right:0;border-left:0;border-top:0}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(150,230,255,.035) 0 1px,transparent 1px 4px)}
/* buttons */
.btn{display:inline-block;background:linear-gradient(180deg,#2f9fd3,var(--btn));color:#fff;text-decoration:none;font:bold .85rem var(--sans);text-transform:uppercase;letter-spacing:.06em;padding:.75rem 1.4rem;border:0;box-shadow:inset 0 0 0 1px var(--edge);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn:hover,.btn:focus-visible{background:#3bb4ea}
.btn[aria-disabled=true]{background:rgba(40,140,190,.35);cursor:default}
/* panels: clipped corners + corner brackets */
.panel{position:relative;background:var(--panel);color:var(--ink);border:1px solid var(--line);padding:1.2rem 1.4rem;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
.panel::before,.panel::after{content:"";position:absolute;width:16px;height:16px;pointer-events:none;border:2px solid var(--cyan);opacity:.75}
.panel::before{top:0;right:0;border-left:0;border-bottom:0}
.panel::after{bottom:0;left:0;border-right:0;border-top:0}
.panel:hover{border-color:var(--line2)}
.panel h2,.panel h3{margin-top:0;color:#fff}
.panel a{overflow-wrap:anywhere}
/* dev strip */
.devstrip{background:var(--deep);color:#bff0ff;text-align:center;padding:.45rem 1rem;font:bold .9rem var(--sans);letter-spacing:.03em;border-top:1px solid var(--btn);border-bottom:1px solid var(--btn)}
.devstrip::before{content:"\25B2  ";color:var(--cyan)}
/* videos */
.videos{margin:2.5rem 0}
.videos .vh{color:#fff;letter-spacing:.06em;text-transform:uppercase;font-size:1.3rem;margin:0 0 1rem}
.vgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:1.4rem}
.vcard{padding:1rem 1rem 1.1rem}
.vcard h3{margin:.1rem 0 .5rem;color:#fff;font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase}
.vlabel{margin:0 0 .6rem;padding:.3rem .6rem;background:var(--deep);color:#bff0ff;font-size:.8rem;font-weight:bold;letter-spacing:.03em;border-left:3px solid var(--cyan)}
.vcard video{display:block;width:100%;aspect-ratio:16/9;background:#000;border:1px solid var(--btn)}
/* footer */
.footer{text-align:center;padding:1.4rem 1rem;background:var(--bg2);border-top:1px solid var(--line);font-size:.9rem;color:#9fb4c2}
.footer p{margin:.3rem 0}.footer .small{font-size:.75rem}.footer .small a{font-weight:normal}
.footer .fsig{font:.62rem var(--mono);letter-spacing:.2em;color:var(--mute);text-transform:uppercase}
/* scan-in on scroll */
.tn-anim [data-scan]{opacity:0}
.tn-anim [data-scan].tn-in{animation:tn-scan .6s ease-out both}
@keyframes tn-scan{0%{opacity:0;transform:translateY(16px) scaleY(.94);filter:brightness(2.4) saturate(0)}35%{opacity:.6}70%{opacity:1;filter:brightness(1.3)}100%{opacity:1;transform:none;filter:none}}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .tn-anim [data-scan]{opacity:1;animation:none!important}
}
@media(max-width:760px){
 .nav{position:relative}.home .nav{position:absolute;left:0;right:0}
 .nav{padding:.5rem .6rem;justify-content:center;text-align:center}
 .nav nav{justify-content:center;gap:.15rem}
 .nav nav a{padding:.25rem .45rem;font-size:.68rem}.nav nav a .sec{font-size:.48rem;letter-spacing:.06em}
 .hud-frame{inset:9.6rem .6rem 1.7rem}.hud-frame .c{width:24px;height:24px}
 .panel{padding:1rem 1.1rem}
}
/* Star field + occasional Milky Way drift (behind all content) */
.tn-sky{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.tn-sky::before{content:"";position:absolute;inset:0;opacity:.55;background-image:radial-gradient(1px 1px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 27% 72%,#cfe8ff,transparent),radial-gradient(1.5px 1.5px at 41% 33%,#fff,transparent),radial-gradient(1px 1px at 58% 84%,#dfe0ff,transparent),radial-gradient(1px 1px at 66% 12%,#fff,transparent),radial-gradient(1.5px 1.5px at 79% 51%,#cfe8ff,transparent),radial-gradient(1px 1px at 88% 27%,#fff,transparent),radial-gradient(1px 1px at 93% 77%,#e6dcff,transparent),radial-gradient(1px 1px at 6% 61%,#fff,transparent),radial-gradient(1px 1px at 34% 94%,#cfe8ff,transparent);background-size:420px 420px;animation:tn-twinkle 7s ease-in-out infinite alternate,tn-drift 90s linear infinite}
.tn-sky::after{content:"";position:absolute;inset:0;opacity:.35;background-image:radial-gradient(1px 1px at 8% 40%,#fff,transparent),radial-gradient(1px 1px at 47% 9%,#cfe8ff,transparent),radial-gradient(1px 1px at 71% 66%,#fff,transparent),radial-gradient(1px 1px at 22% 88%,#e6dcff,transparent),radial-gradient(1px 1px at 90% 45%,#fff,transparent);background-size:260px 260px;animation:tn-drift2 55s linear infinite}
@keyframes tn-drift{from{background-position:0 0}to{background-position:-420px 210px}}
@keyframes tn-drift2{from{background-position:0 0}to{background-position:-520px 260px}}
@keyframes tn-twinkle{from{opacity:.4}to{opacity:.65}}
.tn-mw{position:absolute;top:-40%;left:-60%;width:70%;height:180%;opacity:0;transform:rotate(-28deg) translateX(0);filter:blur(28px);background:linear-gradient(90deg,transparent 0%,rgba(150,170,255,.35) 22%,rgba(235,235,255,.6) 45%,rgba(190,150,255,.45) 62%,rgba(120,170,230,.3) 78%,transparent 100%)}
.tn-mw::after{content:"";position:absolute;inset:10% 20%;filter:blur(.4px);background-image:radial-gradient(1px 1px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 55% 60%,#fff,transparent),radial-gradient(1px 1px at 75% 20%,#e6dcff,transparent),radial-gradient(1px 1px at 35% 80%,#cfe8ff,transparent);background-size:60px 60px;opacity:.8}
.tn-mw.go{animation:tn-mw var(--mw-dur,25s) linear forwards}
@keyframes tn-mw{0%{opacity:0;transform:rotate(-28deg) translateX(0)}12%{opacity:.32}88%{opacity:.32}100%{opacity:0;transform:rotate(-28deg) translateX(190%)}}
@media (prefers-reduced-motion:reduce){.tn-sky,.tn-sky::before,.tn-sky::after{animation:none!important}}

/* Milky Way photo loop (seamless mirrored tile) */
.tn-sky{background:url(../img/milkyway-loop.jpg) 0 50%/auto 100% repeat-x;opacity:.45;animation:tn-mwloop 240s linear infinite}
@keyframes tn-mwloop{from{background-position:0 50%}to{background-position:-355.56vh 50%}}
.tn-mw{display:none!important}