:root{--ink:#060d2e;--deep:#0a1647;--line:#1c2f6b;--ice:#eaf6fb;--mute:#9fb4d9;--cyan:#2fb0d8;--blue:#1e6fc0;--aqua:#8fe0f2;
--head:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;--body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,Consolas,monospace}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--ice);font:400 1.0625rem/1.6 var(--body)}
a{color:inherit}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--head);line-height:1.05;letter-spacing:-.02em}
header{position:sticky;top:0;z-index:5;background:#fff;border-bottom:3px solid var(--cyan)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:76px}
.logo img{height:52px;width:auto;display:block}
nav{display:flex;gap:28px;align-items:center}
nav a{text-decoration:none;color:#34457a;font-size:.98rem}
nav a:hover{color:var(--deep)}
.btn{display:inline-block;background:var(--cyan);color:#04122e;font:500 1rem var(--body);padding:13px 22px;border-radius:4px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:#6fd0ee}
.btn.ghost{background:none;color:var(--ice);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--mute)}
nav .btn{padding:9px 16px}

.hero{padding:72px 24px 56px;background:radial-gradient(ellipse 60% 50% at 85% 0%,rgba(30,111,192,.35),transparent)}
.hero h1{font-size:clamp(2.6rem,6.4vw,5.2rem);max-width:15ch}
.hero p.lead{max-width:56ch;color:var(--mute);margin:24px 0 32px;font-size:1.15rem}
.cta{display:flex;gap:14px;flex-wrap:wrap}
.trace{margin-top:56px;border:1px solid var(--line);border-radius:6px;background:linear-gradient(var(--deep),var(--ink));padding:20px 20px 12px}
.trace svg{width:100%;height:auto;display:block}
.trace .node{fill:var(--ink);stroke:var(--cyan);stroke-width:2}
.trace .lbl{fill:var(--ice);font:500 15px var(--body)}
.trace .sub{fill:var(--mute);font:400 12px var(--mono)}
.trace .path{stroke:var(--blue);stroke-width:3;fill:none}
.trace .pkt{fill:var(--cyan)}
.stats{display:flex;gap:36px;flex-wrap:wrap;font:400 .9rem var(--mono);color:var(--mute);padding:10px 4px 6px;border-top:1px solid var(--line);margin-top:6px}
.stats b{color:var(--cyan);font-weight:400}

section{padding:88px 0;border-top:1px solid var(--line)}
section h2{font-size:clamp(2rem,4vw,3.1rem);max-width:20ch;margin-bottom:14px}
section .intro{color:var(--mute);max-width:60ch;margin-bottom:44px}

.rack{display:grid;grid-template-columns:minmax(240px,340px) 1fr;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.rack ul{list-style:none;padding:0;background:var(--deep)}
.rack li button{all:unset;box-sizing:border-box;display:flex;gap:14px;align-items:center;width:100%;padding:17px 20px;cursor:pointer;border-bottom:1px solid var(--line);color:var(--mute);font:500 1.05rem var(--body)}
.rack li:last-child button{border-bottom:0}
.rack li button::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--line);flex:none}
.rack li button:hover{color:var(--ice)}
.rack li button[aria-selected=true]{color:var(--ice);background:var(--ink)}
.rack li button[aria-selected=true]::before{background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.panel{padding:40px;min-height:330px}
.panel h3{font-size:2.1rem;margin-bottom:14px}
.panel p{max-width:52ch;color:var(--mute)}
.panel ul{list-style:none;padding:0;margin-top:22px;font:400 .95rem var(--mono);color:var(--ice)}
.panel li{padding:7px 0;border-top:1px dashed var(--line)}
@media(max-width:760px){.rack{grid-template-columns:1fr}.panel{padding:26px}}

.why{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.why p+p{margin-top:16px}
.since{font:700 clamp(5rem,16vw,11rem)/.9 var(--head);color:transparent;-webkit-text-stroke:2px var(--cyan);letter-spacing:-.05em}
.since small{display:block;font:400 1rem var(--body);-webkit-text-stroke:0;color:var(--mute);letter-spacing:0;margin-top:12px}
@media(max-width:760px){.why{grid-template-columns:1fr;gap:28px}}
blockquote{margin-top:36px;padding-left:20px;border-left:3px solid var(--cyan);font:500 1.4rem/1.35 var(--head)}
blockquote cite{display:block;margin-top:10px;font:400 .95rem var(--body);color:var(--mute);font-style:normal}

.contact{display:grid;grid-template-columns:1.2fr 1fr;gap:56px}
form{display:grid;gap:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{display:grid;gap:6px;font-size:.92rem;color:var(--mute)}
input,textarea{font:inherit;color:var(--ice);background:var(--deep);border:1px solid var(--line);border-radius:4px;padding:12px}
input:focus,textarea:focus{outline:2px solid var(--cyan);border-color:transparent}
textarea{min-height:130px;resize:vertical}
.details dt{color:var(--mute);font-size:.9rem;margin-top:22px}
.details dd{margin:2px 0 0;font-size:1.1rem}
.details a{text-decoration:none;border-bottom:1px solid var(--line)}
@media(max-width:760px){.contact{grid-template-columns:1fr;gap:36px}.two{grid-template-columns:1fr}}
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--mute);font-size:.9rem}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

#boot{display:none;position:fixed;inset:0;z-index:50;background:var(--ink);place-items:center;transition:opacity .6s}
#boot.out{opacity:0;pointer-events:none}
#boot pre{font:400 1rem/2 var(--mono);color:var(--mute);min-height:11em;white-space:pre-wrap}
#boot pre b{color:var(--cyan);font-weight:400}
#boot .m{font:700 clamp(2rem,6vw,3.6rem) var(--head);color:var(--ice);opacity:0;transition:opacity .6s;margin-top:18px;letter-spacing:-.02em}
#boot .m.on{opacity:1}
#boot button{position:absolute;right:24px;bottom:24px;background:none;border:1px solid var(--line);color:var(--mute);padding:8px 14px;border-radius:4px;font:inherit;cursor:pointer}
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(47,176,216,.08) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(47,176,216,.08) 1px,transparent 1px) 0 0/48px 48px;-webkit-mask-image:radial-gradient(ellipse at 50% 25%,#000,transparent 72%);mask-image:radial-gradient(ellipse at 50% 25%,#000,transparent 72%)}
.pledge{display:grid;grid-template-columns:1fr 1.3fr;gap:56px;align-items:start}
.pledge dl{border-top:1px dashed var(--line)}
.pledge dt{font:700 1.3rem var(--head);padding-top:20px}
.pledge dd{margin:4px 0 0;padding-bottom:20px;color:var(--mute);border-bottom:1px dashed var(--line)}
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line)}
.brands div{padding:22px 20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .2s}
.brands div:hover{background:var(--deep)}
.brands b{display:block;font:700 1.25rem var(--head);letter-spacing:-.01em}
.brands span{display:block;margin-top:6px;font:400 .85rem/1.45 var(--mono);color:var(--mute)}
.posts{border-top:1px solid var(--line)}
.posts a{display:grid;grid-template-columns:170px 1fr;gap:24px;padding:24px 4px;border-bottom:1px solid var(--line);text-decoration:none}
.posts a:hover h3{color:var(--cyan)}
.posts small{font:400 .85rem var(--mono);color:var(--cyan);padding-top:6px}
.posts h3{font-size:1.5rem;transition:color .2s}
.posts p{color:var(--mute);margin-top:6px}
.more{display:inline-block;margin-top:24px;color:var(--cyan)}
.hp{position:absolute;left:-9999px}
#fs{min-height:1.5em;color:var(--aqua);font-size:.95rem}
@media(max-width:760px){.pledge{grid-template-columns:1fr;gap:28px}.posts a{grid-template-columns:1fr;gap:4px}}
.mb{display:none;background:none;border:1px solid #c9d8e6;border-radius:4px;width:46px;height:46px;cursor:pointer;color:var(--deep);align-items:center;justify-content:center}
@media(max-width:760px){.mb{display:inline-flex}
nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:6px 24px 20px;border-bottom:3px solid var(--cyan)}
nav.open{display:flex}
nav a:not(.btn){padding:15px 0;border-bottom:1px solid #e1ebf3}
nav .btn{margin-top:16px;text-align:center;padding:14px}
.trace .lbl{font-size:34px}.trace .sub{display:none}.trace svg{margin-bottom:6px}}
.ic{width:1.35em;height:1.35em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.rack li button::before{display:none}
.rack li button[aria-selected=true] .ic{color:var(--cyan);filter:drop-shadow(0 0 6px rgba(47,176,216,.7))}
.panel{display:grid;grid-template-columns:1fr 190px;gap:28px;align-items:start}
.art{width:170px;height:170px;border-radius:50%;display:grid;place-items:center;position:relative;color:var(--cyan);background:radial-gradient(circle,rgba(47,176,216,.22),transparent 66%);border:1px dashed var(--line)}
.art::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid var(--line)}
.art .ic{width:70px;height:70px;stroke-width:1.1;filter:drop-shadow(0 0 10px rgba(47,176,216,.6))}
.pledge dt{display:flex;gap:12px;align-items:center}.pledge dt .ic{color:var(--cyan)}
.rackart{width:100%;max-width:360px;margin-top:36px;display:block}
.led{animation:blink 2.6s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:.2}50%{opacity:1}}
.brands .ic{display:block;color:var(--cyan);width:28px;height:28px;margin-bottom:12px}
.posts small{display:flex;gap:8px;align-items:flex-start}.posts small .ic{width:1.3em;height:1.3em;margin-top:-1px}
@media(max-width:760px){.panel{grid-template-columns:1fr}.art{order:-1;width:110px;height:110px}.art .ic{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.led{animation:none;opacity:.8}}
.panel ul{background:none}
.brands a{display:block;padding:22px 20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-decoration:none;transition:background .2s}
.brands a:hover{background:var(--deep)}
.brands a:hover b{color:var(--cyan)}

.tron{--ink:#01060c;--deep:#03121c;--line:#0e6a86;--ice:#e8fdff;--mute:#8fd3e0;--cyan:#52f2ff;--blue:#1b9bff;--aqua:#b6fbff}
#trc{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;display:none}
.tron header{background:#01060c;border-bottom:1px solid var(--cyan);box-shadow:0 0 18px rgba(82,242,255,.45)}
.tron .logo img{filter:invert(1) hue-rotate(180deg) brightness(1.15)}
.tron nav a:not(.btn){color:var(--mute)}.tron nav a:not(.btn):hover{color:var(--cyan)}
.tron .mb{background:none;border-color:var(--line);color:var(--cyan)}
.tron h1,.tron h2{text-shadow:0 0 14px rgba(82,242,255,.4)}
.tron .hero h1{animation:neon 3.2s ease-in-out infinite}
@keyframes neon{0%,100%{text-shadow:0 0 10px rgba(82,242,255,.5),0 0 28px rgba(82,242,255,.25)}50%{text-shadow:0 0 16px rgba(82,242,255,.95),0 0 46px rgba(82,242,255,.5)}}
.tron .rack,.tron .trace,.tron .brands{box-shadow:0 0 0 1px rgba(82,242,255,.22),0 0 28px rgba(82,242,255,.12)}
.tron .btn{box-shadow:0 0 18px rgba(82,242,255,.55)}.tron .btn.ghost{box-shadow:none}
.tron section{border-top-color:rgba(82,242,255,.28)}
.tron .hero::before{opacity:0}
.tron .since{filter:drop-shadow(0 0 10px rgba(82,242,255,.6))}
#tr{position:fixed;inset:0;z-index:70;display:grid;place-items:center;text-align:center;background:rgba(1,6,12,.94);transition:opacity .6s;cursor:pointer;padding:24px}
#tr[hidden],#trhud[hidden]{display:none}
#tr.out{opacity:0;pointer-events:none}
#tr .a{font:400 .95rem var(--mono);letter-spacing:.2em;color:var(--mute)}
#tr .t{font:700 clamp(2.2rem,8vw,5.2rem)/1.05 var(--head);letter-spacing:-.02em;margin:18px 0;max-width:14ch}
#tr .t i{font-style:normal;opacity:0;animation:lit .55s forwards}
@keyframes lit{0%{opacity:0}55%{opacity:1;color:#fff;text-shadow:0 0 34px #52f2ff,0 0 70px #52f2ff}100%{opacity:1;color:#52f2ff;text-shadow:0 0 16px rgba(82,242,255,.85)}}
#trhud{position:fixed;right:16px;bottom:16px;z-index:40;display:flex;gap:12px;align-items:center;font:400 .8rem var(--mono);color:var(--cyan);border:1px solid var(--cyan);background:rgba(1,6,12,.88);padding:8px 12px;border-radius:4px;box-shadow:0 0 16px rgba(82,242,255,.4)}
#trhud button{font:inherit;color:var(--ice);background:none;border:1px solid var(--line);border-radius:3px;padding:4px 8px;cursor:pointer}
@media(max-width:760px){.tron nav{background:#01060c;border-bottom-color:var(--cyan)}.tron nav a:not(.btn){border-bottom-color:var(--line)}}
@media(prefers-reduced-motion:reduce){.tron .hero h1{animation:none}#tr .t i{animation-duration:.01s;animation-delay:0s!important}}
.tron .logo img{mix-blend-mode:screen}
.tron .hero{background:none}

.thero{padding:64px 24px 36px}.thero h1{font-size:clamp(2.4rem,5.5vw,4.2rem);max-width:16ch}.thero p{max-width:60ch;color:var(--mute);margin-top:18px;font-size:1.12rem}
.tpanel{padding:34px;min-height:440px}
.tool h2{font-size:2rem;margin-bottom:10px}.tool h3{font-size:1.25rem;margin:34px 0 8px}
.tool .intro{color:var(--mute);max-width:62ch;margin-bottom:24px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
select{font:inherit;color:var(--ice);background:var(--deep);border:1px solid var(--line);border-radius:4px;padding:12px}
select:focus,input:focus,textarea:focus{outline:2px solid var(--cyan);border-color:transparent}
input[type=checkbox]{width:18px;height:18px;padding:0;accent-color:var(--cyan)}
.chk{display:flex;gap:10px;align-items:center;color:var(--ice);font-size:1rem}
.res{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:22px}
.res>div{border:1px solid var(--line);background:var(--deep);border-radius:6px;padding:14px;display:flex;flex-direction:column;gap:4px;justify-content:center}
.res b{font:700 1.35rem var(--head);color:var(--cyan);word-break:break-word}.res span{font:.82rem var(--mono);color:var(--mute)}
.note{color:var(--mute);font-size:.92rem;margin-top:16px;max-width:70ch}
.rec{font:.95rem/1.5 var(--mono);background:var(--ink);border:1px solid var(--line);border-radius:4px;padding:12px;word-break:break-all;margin:10px 0}
.msgs{list-style:none;padding:0;margin-top:12px;display:grid;gap:6px;background:none!important}.msgs li{font-size:.95rem}.msgs .w{color:#ffcf6b}.msgs .g{color:var(--aqua)}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:10px 0 6px}
.three div{border-top:2px solid var(--cyan);padding-top:10px;color:var(--mute);font-size:.95rem}.three b{display:block;color:var(--ice);font:700 1.1rem var(--head)}
.splitl{font:.9rem/1.7 var(--mono);color:var(--ice);margin-top:14px}
.cp{padding:8px 14px}
@media(max-width:760px){.tpanel{padding:22px}}
label>input:not([type=checkbox]),label>select,label>textarea{width:100%;min-width:0}