:root { --navy:#010828; --cream:#EFF4FF; --neon:#6FFF00; --muted:rgba(239,244,255,.62); --line:rgba(239,244,255,.16); --danger:#ff4d4d; --panel:#070f34; }
@font-face { font-family:Anton; src:url('/assets/fonts/anton.ttf') format('truetype'); font-style:normal; font-weight:400; font-display:swap; }
@font-face { font-family:Condiment; src:url('/assets/fonts/condiment.ttf') format('truetype'); font-style:normal; font-weight:400; font-display:swap; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:var(--navy); color:var(--cream); font-family:"SFMono-Regular",Consolas,"PingFang SC","Microsoft YaHei",monospace; }
body { overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; border:1px solid var(--line); background:transparent; color:var(--cream); padding:.72rem 1rem; }
button:hover,button:focus-visible { border-color:var(--neon); outline:2px solid rgba(111,255,0,.24); outline-offset:2px; }
button.primary { background:var(--neon); color:var(--navy); border-color:var(--neon); font-weight:700; }
button.danger { color:#fff; border-color:var(--danger); }
.hero { position:relative; min-height:100vh; overflow:hidden; background:var(--navy); }
.hero video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.82; }
.hero .shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(1,8,40,.7),rgba(1,8,40,.12)); }
.topbar { position:absolute; top:0; inset-inline:0; z-index:2; height:56px; display:flex; align-items:center; justify-content:space-between; max-width:1831px; margin:auto; padding:0 1rem; font-size:14px; text-transform:uppercase; }
.brand { display:flex; gap:.7rem; align-items:center; font-weight:700; letter-spacing:.04em; }
.brand-logo { width:28px; height:28px; object-fit:contain; display:block; }
.brand-mark { width:28px; height:28px; border:1px solid var(--neon); display:grid; place-items:center; color:var(--neon); font-size:11px; }
.topbar nav { display:flex; gap:1.3rem; }
.topbar nav a:last-child { color:var(--neon); }
.hero-content { position:relative; z-index:1; max-width:1831px; margin:auto; padding:9rem 1rem 4rem; min-height:100vh; display:flex; flex-direction:column; justify-content:space-between; }
.hero-row { display:flex; flex-direction:column; gap:3rem; }
.hero h1 { margin:0; font-family:Anton,"Arial Narrow",sans-serif; font-size:clamp(3rem,7vw,6.25rem); line-height:1; text-transform:uppercase; font-weight:400; position:relative; letter-spacing:.02em; }
.script { display:block; font-family:Condiment,cursive; color:var(--neon); font-size:.8em; text-transform:none; mix-blend-mode:exclusion; position:absolute; right:-8px; bottom:-.55em; transform:rotate(-1deg); opacity:.9; }
.hero p { max-width:335px; line-height:1.6; text-transform:uppercase; font-size:14px; }
.ghost { opacity:.1; color:var(--cream); }
.hero-bottom { display:flex; justify-content:space-between; gap:2rem; }
.card-shell { min-height:100vh; padding:1.5rem; }
.panel { max-width:1180px; margin:0 auto; }
.page-head { border-bottom:1px solid var(--line); padding:1rem 0; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.page-head .brand-mark { display:inline-grid; margin-right:.65rem; vertical-align:middle; }
.page-head h1 { margin:0; font-family:Anton,sans-serif; font-size:2rem; font-weight:400; letter-spacing:.03em; }
.page-head .actions { display:flex; gap:.6rem; align-items:center; }
.grid { display:grid; gap:1rem; }
.grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.stat,.box,.form-card { border:1px solid var(--line); background:rgba(7,15,52,.74); padding:1rem; }
.stat small,.muted { color:var(--muted); }
.stat strong { display:block; color:var(--neon); font-family:Anton,sans-serif; font-size:2rem; margin-top:.35rem; }
.form-card { max-width:520px; margin:4rem auto; }
.form-card h2 { font-family:Anton,sans-serif; letter-spacing:.05em; font-weight:400; font-size:2rem; margin:.2rem 0 1.5rem; }
.field { display:flex; flex-direction:column; gap:.4rem; margin:1rem 0; }
.field label { color:var(--muted); font-size:13px; }
.field input,.field textarea,.field select { width:100%; padding:.78rem; color:var(--cream); background:#030a27; border:1px solid var(--line); }
.field textarea { min-height:90px; resize:vertical; }
.form-actions { display:flex; gap:.65rem; align-items:center; flex-wrap:wrap; margin-top:1.2rem; }
.notice { margin:1rem 0; border-left:3px solid var(--neon); padding:.8rem 1rem; background:rgba(111,255,0,.07); }
.notice.error { border-left-color:var(--danger); background:rgba(255,77,77,.08); }
.table-wrap { overflow:auto; border:1px solid var(--line); }
table { width:100%; border-collapse:collapse; min-width:760px; }
th,td { text-align:left; padding:.75rem; border-bottom:1px solid var(--line); font-size:13px; vertical-align:top; }
th { color:var(--muted); font-weight:400; }
.pill { display:inline-block; padding:.18rem .45rem; border:1px solid var(--line); font-size:12px; }
.pill.active { color:var(--neon); border-color:var(--neon); }
.pill.danger { color:var(--danger); border-color:var(--danger); }
.sub-box { word-break:break-all; background:#030a27; border:1px dashed var(--line); padding:.8rem; }
.progress { height:8px; background:#101936; margin-top:.7rem; }
.progress i { display:block; height:100%; background:var(--neon); }
.section-title { font-family:Anton,sans-serif; font-size:1.5rem; font-weight:400; letter-spacing:.04em; margin:2rem 0 .8rem; }
.spacer { height:1rem; }
.workspace { min-height:100vh; display:flex; background:var(--navy); }
.sidebar { width:250px; flex:0 0 250px; border-right:1px solid var(--line); padding:1.25rem; display:flex; flex-direction:column; background:#020a29; }
.side-brand { padding:.25rem 0 1.4rem; border-bottom:1px solid var(--line); }
.side-nav { display:flex; flex-direction:column; gap:.35rem; padding-top:1.25rem; }
.side-link { text-align:left; border-color:transparent; color:var(--muted); padding:.75rem .8rem; }
.side-link:hover,.side-link.active { color:var(--navy); background:var(--neon); border-color:var(--neon); outline:none; }
.side-footer { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding-top:1rem; border-top:1px solid var(--line); font-size:12px; }
.workspace-main { flex:1; min-width:0; padding:1.5rem clamp(1rem,3vw,3rem); }
.workspace-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; padding-bottom:1.4rem; border-bottom:1px solid var(--line); margin-bottom:1.4rem; }
.workspace-head h1 { margin:.35rem 0 0; font-family:Anton,sans-serif; font-size:clamp(2rem,4vw,3.2rem); font-weight:400; letter-spacing:.04em; }
.eyebrow { color:var(--neon); font-size:12px; letter-spacing:.1em; }
.overview-box { margin-top:1rem; }

/* Static Hero classes mirror the design appendix without a runtime Tailwind build. */
.font-grotesk { font-family:Anton,sans-serif; }
.font-condiment { font-family:Condiment,cursive; }
.text-cream { color:var(--cream); }
.text-neon { color:var(--neon); }
.relative { position:relative; }
.absolute { position:absolute; }
.inset-x-0 { left:0; right:0; }
.inset-0 { inset:0; }
.top-0 { top:0; }
.z-10 { z-index:10; }
.z-20 { z-index:20; }
.overflow-hidden { overflow:hidden; }
.min-h-screen { min-height:100vh; }
.w-full { width:100%; }
.h-full { height:100%; }
.object-cover { object-fit:cover; }
.mx-auto { margin-left:auto; margin-right:auto; }
.flex { display:flex; }
.hidden { display:none; }
.items-center { align-items:center; }
.items-start { align-items:flex-start; }
.justify-between { justify-content:space-between; }
.flex-col { flex-direction:column; }
.gap-3 { gap:.75rem; }
.gap-5 { gap:1.25rem; }
.gap-8 { gap:2rem; }
.uppercase { text-transform:uppercase; }
.normal-case { text-transform:none; }
.font-normal { font-weight:400; }
.leading-relaxed { line-height:1.625; }
.leading-\[0\.79\] { line-height:.79; }
.tracking-\[0\.03em\] { letter-spacing:.03em; }
.opacity-10 { opacity:.1; }
.opacity-90 { opacity:.9; }
.mix-blend-exclusion { mix-blend-mode:exclusion; }
.max-w-\[1831px\] { max-width:1831px; }
.max-w-\[335px\] { max-width:335px; }
.max-w-\[266px\] { max-width:266px; }
.px-4 { padding-left:1rem; padding-right:1rem; }
.py-16 { padding-top:4rem; padding-bottom:4rem; }
.h-14 { height:3.5rem; }
.h-7 { height:1.75rem; }
.w-auto { width:auto; }
.right-\[-8px\] { right:-8px; }
.bottom-\[-20px\] { bottom:-20px; }
.text-\[14px\] { font-size:14px; }
.text-\[32px\] { font-size:32px; }
.text-\[36px\] { font-size:36px; }
.text-\[60px\] { font-size:60px; }
.text-\[68px\] { font-size:68px; }
.leading-\[1\.05\] { line-height:1.05; }
.text-\[\#010828\] { color:#010828; }
.rotate-1 { transform:rotate(1deg); }
.\-rotate-1 { transform:rotate(-1deg); }
.mb-12 { margin-bottom:3rem; }
.sm\:inline { display:none; }
.sm\:px-6 { padding-left:1.5rem; padding-right:1.5rem; }
.sm\:py-20 { padding-top:5rem; padding-bottom:5rem; }
.sm\:text-\[48px\] { font-size:48px; }
.sm\:text-\[52px\] { font-size:52px; }
.sm\:text-\[15px\] { font-size:15px; }
.sm\:bottom-\[-30px\] { bottom:-30px; }
.md\:px-8 { padding-left:2rem; padding-right:2rem; }
.md\:py-24 { padding-top:6rem; padding-bottom:6rem; }
.md\:text-\[60px\] { font-size:60px; }
.md\:text-\[68px\] { font-size:68px; }
.md\:text-\[16px\] { font-size:16px; }
.md\:bottom-\[-40px\] { bottom:-40px; }
@media (min-width:640px) {
  .sm\:inline { display:inline; }
}
@media (min-width:1024px) {
  .lg\:flex-row { flex-direction:row; }
  .lg\:flex { display:flex; }
  .lg\:gap-12 { gap:3rem; }
  .lg\:text-cream { color:var(--cream); }
}
@media (min-width:640px) {
  .sm\:mb-16 { margin-bottom:4rem; }
}
@media (min-width:768px) {
  .md\:mb-20 { margin-bottom:5rem; }
}
@media (max-width:1023px) {
  .lg\:text-cream { color:var(--cream); }
}
@media (min-width: 800px) { .hero-row { flex-direction:row; justify-content:space-between; align-items:flex-start; } .hero-content { padding-inline:2rem; } .hero-bottom { gap:4rem; } }
@media (min-width: 1024px) { .hero-content { padding-top:10rem; padding-bottom:6rem; } .hero-row { margin-bottom:4rem; } }
@media (max-width: 640px) { .topbar .brand-name { display:none; } .card-shell { padding:.8rem; } .grid.two,.grid.three { grid-template-columns:1fr; } .page-head { align-items:flex-start; flex-direction:column; } .page-head .actions { width:100%; justify-content:space-between; } .hero-bottom .ghost { display:none; } .sidebar { width:82px; flex-basis:82px; padding:.75rem .5rem; } .side-brand { justify-content:center; } .side-brand .brand-name,.side-footer .muted { display:none; } .side-link { padding:.7rem .35rem; font-size:11px; text-align:center; } .side-footer { justify-content:center; } .side-footer button { padding:.45rem .25rem; font-size:11px; } .workspace-main { padding:.9rem .7rem; } .workspace-head { align-items:flex-end; } }