:root{
  --bg:#030605;
  --panel:#07100d;
  --panel-2:#0b1712;
  --panel-3:#111d17;
  --line:rgba(142,255,190,.18);
  --line-strong:rgba(165,255,197,.42);
  --text:#e7fff0;
  --muted:#91a99b;
  --dim:#607367;
  --accent:#9dff9d;
  --accent-2:#d4ff62;
  --warning:#ffc857;
  --danger:#ff6b4a;
  --shadow: 0 20px 80px rgba(0,0,0,.55);
  --radius:24px;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  font-family:var(--sans);
  background:
    radial-gradient(circle at 50% 18%, rgba(104,255,134,.14), transparent 25rem),
    radial-gradient(circle at 15% 15%, rgba(255,210,98,.06), transparent 26rem),
    radial-gradient(circle at 85% 70%, rgba(91,255,170,.08), transparent 29rem),
    linear-gradient(135deg,#010302,#07100d 45%,#020504);
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(154,255,185,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(154,255,185,.045) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at center, black 0%, transparent 78%);
}
.noise{
  position:fixed; inset:0; pointer-events:none; opacity:.085; mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.scanline{
  position:fixed; inset:0; pointer-events:none; z-index:2;
  background:linear-gradient(to bottom, transparent, rgba(165,255,197,.045), transparent);
  height:160px; animation:scan 8s linear infinite;
}
@keyframes scan{from{transform:translateY(-180px)}to{transform:translateY(calc(100vh + 180px))}}
.app-shell{position:relative; z-index:3; width:min(1440px, calc(100% - 36px)); margin:0 auto; padding:24px 0 48px}
.topbar{
  display:flex; gap:16px; justify-content:space-between; align-items:center;
  padding:16px 18px; border:1px solid var(--line); border-radius:24px;
  background:linear-gradient(135deg, rgba(7,16,13,.85), rgba(6,12,10,.58));
  box-shadow:var(--shadow); backdrop-filter: blur(18px);
  position:sticky; top:12px; z-index:8;
}
.brand{display:flex; align-items:center; gap:12px; min-width:250px; cursor:pointer; user-select:none}
.brand img{
  width:38px; height:38px; object-fit:contain;
  background:#fff; padding:4px; border-radius:10px;
  filter:drop-shadow(0 0 14px rgba(157,255,157,.35));
}
.brand-title{line-height:1}.brand-title strong{display:block; letter-spacing:.18em; font-family:var(--mono); font-size:15px}.brand-title span{display:block; color:var(--muted); font-size:12px; margin-top:2px}
.breadcrumbs{display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--muted); font-family:var(--mono); font-size:12px}
.crumb{border:1px solid var(--line); color:var(--text); background:rgba(157,255,157,.04); padding:7px 10px; border-radius:999px; cursor:pointer}
.crumb:hover{border-color:var(--line-strong); background:rgba(157,255,157,.1)}
.system-status{display:flex; gap:10px; align-items:center; color:var(--accent); font-family:var(--mono); font-size:12px; white-space:nowrap}
.pulse{width:8px;height:8px;border-radius:999px;background:var(--accent);box-shadow:0 0 18px var(--accent);animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}
.hero{min-height:calc(100vh - 132px); display:grid; grid-template-columns:1fr minmax(360px, 520px) 1fr; gap:24px; align-items:center; padding:32px 0 18px}
.hero-side{display:grid; gap:14px}
.kpi-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px}
.kpi,.panel,.domain-card,.product-card,.mission-tab,.detail-panel{
  border:1px solid var(--line); background:linear-gradient(145deg, rgba(9,22,16,.86), rgba(4,9,7,.72)); border-radius:var(--radius); box-shadow:var(--shadow); backdrop-filter: blur(14px);
}
.kpi{padding:16px; min-height:116px; position:relative; overflow:hidden}
.kpi::after,.product-card::after,.domain-card::after{content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(135deg, rgba(157,255,157,.12), transparent 32%, rgba(255,200,87,.08)); opacity:.65}
.kpi-label{font-family:var(--mono); color:var(--muted); letter-spacing:.12em; font-size:11px; text-transform:uppercase}.kpi-value{font-size:40px; font-weight:800; margin-top:8px}.kpi-sub{color:var(--dim); font-size:12px; margin-top:8px; line-height:1.35}
.logo-core{position:relative; min-height:580px; display:flex; align-items:center; justify-content:center}
.radar-ring{position:absolute; border:1px solid rgba(157,255,157,.12); border-radius:50%; inset:5%; animation:slowspin 26s linear infinite}
.radar-ring.r2{inset:16%; animation-direction:reverse; animation-duration:32s}.radar-ring.r3{inset:28%; animation-duration:38s}
.radar-ring::before{content:""; position:absolute; top:50%; left:50%; width:50%; height:1px; background:linear-gradient(90deg, rgba(157,255,157,.55), transparent); transform-origin:left; animation:spin 4.8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes slowspin{to{transform:rotate(360deg)}}
.center-emblem{position:relative; width:min(90%, 430px); aspect-ratio:1/1; border-radius:50%; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle, rgba(157,255,157,.09), rgba(6,12,10,.4) 48%, rgba(0,0,0,.55) 70%); border:1px solid var(--line-strong); box-shadow:0 0 60px rgba(157,255,157,.13), inset 0 0 60px rgba(157,255,157,.06)}
.center-emblem img{
  width:52%; max-height:38%; object-fit:contain;
  background:#fff; padding:18px; border-radius:20px;
  box-shadow:0 0 0 1px rgba(255,255,255,.65), 0 18px 60px rgba(0,0,0,.35);
  filter:drop-shadow(0 0 32px rgba(157,255,157,.5));
}
.center-title{position:absolute; bottom:82px; text-align:center}.center-title h1{font-family:var(--mono); letter-spacing:.36em; font-size:26px; margin:0 0 8px; padding-left:.36em}.center-title p{margin:0; color:var(--muted); font-size:13px; letter-spacing:.08em}
.launch-actions{position:absolute; bottom:18px; display:flex; gap:12px; flex-wrap:wrap; justify-content:center}
.btn{border:1px solid var(--line-strong); color:var(--text); background:linear-gradient(135deg, rgba(157,255,157,.1), rgba(255,200,87,.05)); padding:12px 16px; border-radius:999px; cursor:pointer; font-family:var(--mono); letter-spacing:.08em; transition:.18s ease; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:8px}
.btn:hover{transform:translateY(-2px); box-shadow:0 12px 30px rgba(157,255,157,.12); background:rgba(157,255,157,.13)}
.btn.secondary{border-color:var(--line); color:var(--muted); background:rgba(255,255,255,.03)}
.node-card{position:relative; padding:20px; min-height:180px; overflow:hidden; cursor:pointer}
.node-card h2{font-family:var(--mono); letter-spacing:.14em; margin:0 0 10px; font-size:28px}.node-card p{color:var(--muted); line-height:1.5; margin:0 0 18px}.node-meta{display:flex; gap:8px; flex-wrap:wrap}.chip{font-family:var(--mono); color:var(--accent); background:rgba(157,255,157,.08); border:1px solid var(--line); padding:7px 9px; border-radius:999px; font-size:11px}.chip.warn{color:var(--warning); background:rgba(255,200,87,.07)}
.view{padding:24px 0}.section-head{display:flex; gap:18px; align-items:flex-end; justify-content:space-between; margin:24px 0 18px}.section-head h1{font-family:var(--mono); letter-spacing:.16em; font-size:clamp(26px,4vw,52px); margin:0}.section-head p{max-width:720px; color:var(--muted); line-height:1.55; margin:8px 0 0}.section-actions{display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end}
.domain-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}.domain-card{position:relative; padding:20px; min-height:230px; cursor:pointer; overflow:hidden; transition:.18s ease}.domain-card:hover,.product-card:hover{transform:translateY(-4px); border-color:var(--line-strong)}.domain-icon{font-size:38px; margin-bottom:14px}.domain-card h2{margin:0; font-size:22px}.domain-card p{color:var(--muted); line-height:1.45; min-height:60px}.meter{height:8px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden;margin-top:18px}.meter span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:inherit}.domain-count{font-family:var(--mono); color:var(--accent); font-size:28px; font-weight:800; margin-top:18px}.domain-code{position:absolute; right:18px; top:18px; color:var(--dim); font-family:var(--mono)}
.toolbar{display:flex; gap:12px; justify-content:space-between; align-items:center; margin:18px 0; flex-wrap:wrap}.search{flex:1; min-width:260px; position:relative}.search input{width:100%; border:1px solid var(--line); background:rgba(3,6,5,.65); color:var(--text); border-radius:999px; padding:14px 16px 14px 42px; outline:none}.search::before{content:"⌕"; position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--accent); font-family:var(--mono)}.tabs{display:flex; gap:10px; flex-wrap:wrap}.mission-tab{padding:10px 13px; cursor:pointer; color:var(--muted); font-family:var(--mono); font-size:12px}.mission-tab.active{border-color:var(--line-strong); color:var(--text); background:rgba(157,255,157,.1)}
.product-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}.product-card{position:relative; overflow:hidden; cursor:pointer; min-height:310px; display:flex; flex-direction:column}.photo-frame{height:150px; border-bottom:1px solid var(--line); position:relative; background:radial-gradient(circle at 30% 20%, rgba(157,255,157,.16), transparent 28%), linear-gradient(145deg, rgba(15,30,22,.92), rgba(1,3,2,.94)); overflow:hidden}.photo-frame img{width:100%; height:100%; object-fit:cover; display:block}.photo-fallback{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:18px; background-image:linear-gradient(30deg,rgba(157,255,157,.08) 12%,transparent 12%,transparent 50%,rgba(157,255,157,.08) 50%,rgba(157,255,157,.08) 62%,transparent 62%,transparent); background-size:18px 18px}.fallback-id{font-family:var(--mono); font-size:22px; letter-spacing:.12em; color:var(--accent)}.fallback-text{font-size:11px; color:var(--muted); margin-top:8px; max-width:210px}.product-body{padding:15px; flex:1; display:flex; flex-direction:column; gap:10px}.product-id{font-family:var(--mono); color:var(--accent); font-size:12px}.product-card h3{font-size:17px; line-height:1.2; margin:0}.product-role{color:var(--muted); font-size:13px; line-height:1.35}.spec-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:auto}.mini{font-family:var(--mono); font-size:10px; color:var(--dim); border:1px solid rgba(255,255,255,.08); padding:6px 7px; border-radius:8px; background:rgba(0,0,0,.16)}
.detail-layout{display:grid; grid-template-columns:minmax(320px, .9fr) minmax(400px, 1.1fr); gap:18px; align-items:start}.detail-panel{padding:18px}.detail-photo .photo-frame{height:420px; border:1px solid var(--line); border-radius:22px}.detail-title{font-family:var(--mono); color:var(--accent); margin:0 0 8px}.detail-panel h1{margin:0; font-size:clamp(28px,4vw,46px); line-height:1.05}.detail-panel h2{font-family:var(--mono); letter-spacing:.08em; font-size:14px; color:var(--accent); margin:24px 0 10px}.detail-text{color:#cce9d6; line-height:1.58}.spec-table{display:grid; grid-template-columns:170px 1fr; border:1px solid var(--line); border-radius:18px; overflow:hidden}.spec-table div{padding:11px 12px; border-bottom:1px solid rgba(157,255,157,.08)}.spec-table div:nth-child(odd){font-family:var(--mono); color:var(--muted); background:rgba(255,255,255,.025)}.spec-table div:nth-child(even){color:var(--text)}.spec-table div:nth-last-child(-n+2){border-bottom:0}.detail-nav{display:flex; justify-content:space-between; gap:10px; margin-top:16px}.empty{padding:48px; text-align:center; color:var(--muted); border:1px dashed var(--line); border-radius:var(--radius); background:rgba(255,255,255,.03)}
.footer-note{color:var(--dim); font-size:12px; line-height:1.5; margin-top:28px; text-align:center}.mil-label{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); color:var(--accent-2); border:1px solid rgba(212,255,98,.24); background:rgba(212,255,98,.06); border-radius:999px; padding:8px 11px; font-size:11px; letter-spacing:.08em}
@media (max-width:1180px){.hero{grid-template-columns:1fr}.logo-core{order:-1; min-height:470px}.domain-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-layout{grid-template-columns:1fr}.topbar{position:relative; top:auto}.system-status{display:none}}
@media (max-width:680px){.app-shell{width:min(100% - 20px, 1440px); padding-top:10px}.topbar{align-items:flex-start; flex-direction:column}.hero{padding-top:14px}.kpi-grid,.domain-grid,.product-grid{grid-template-columns:1fr}.section-head{align-items:flex-start; flex-direction:column}.detail-photo .photo-frame{height:300px}.spec-table{grid-template-columns:1fr}.spec-table div:nth-child(odd){padding-bottom:3px}.spec-table div:nth-child(even){padding-top:3px}.center-title h1{font-size:20px}.launch-actions{position:relative; bottom:auto; margin-top:24px}.center-title{bottom:58px}}