@import url("https://fonts.googleapis.com/css2?family=Audiowide&family=Share+Tech+Mono&display=swap");

:root{
  --font-body:"Share Tech Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --font-headings:"Audiowide",system-ui,sans-serif;
  --neon-pink:341 100% 58%;
  --neon-blue:184 96% 46%;
  --neon-green:112 100% 54%;
  --very-light-blue:190 100% 91%;
  --dark-blue:240 95% 9%;
  --dark-panel:236 72% 12%;
  --yellow:44 97% 72%;
  --danger:349 100% 64%;
  --warning:44 100% 62%;
  --ok:142 76% 52%;
  --muted:201 35% 72%;
  --border-image:linear-gradient(-45deg,hsl(var(--neon-blue)),hsl(var(--neon-pink)),hsl(var(--neon-blue))) 10% stretch;
  --grid-lines:linear-gradient(hsla(184,96%,46%,0) 90%,hsla(184,96%,46%,.16) 95%) top left/100% .55rem;
  color-scheme:dark;
}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:1rem}
body{min-height:100vh;padding:1rem;background:hsl(var(--dark-blue)) var(--grid-lines);color:hsl(var(--very-light-blue));font-family:var(--font-body);font-size:clamp(1rem,.83rem + .32vw,1.25rem);line-height:1.45;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 15% 10%,hsla(var(--neon-pink),.13),transparent 28%),radial-gradient(circle at 85% 40%,hsla(var(--neon-blue),.14),transparent 32%)}
body.nav-open{overflow:hidden}
@media(min-width:64rem){body{margin-left:15rem;padding:1.25rem 1.5rem}}
a{color:hsl(var(--neon-pink));text-underline-offset:.18em}a:hover{color:hsl(var(--very-light-blue));filter:drop-shadow(0 0 .35rem hsla(var(--neon-pink),.75))}
button,input,select,textarea{font:inherit}button{color:inherit}li{list-style:none}code{font-family:var(--font-body);overflow-wrap:anywhere}p+p{margin-top:1rem}
::selection{background:hsl(var(--yellow));color:hsl(var(--dark-blue))}
:focus{outline:2px solid transparent}:focus-visible{outline:3px solid hsl(var(--neon-pink));outline-offset:3px}
.skip-link:not(:focus){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);overflow:hidden;white-space:nowrap}.skip-link{position:fixed;z-index:1000;top:.5rem;left:.5rem;padding:.7rem 1rem;background:hsl(var(--dark-blue));border:.2rem solid hsl(var(--neon-blue))}
#scroll-progress{position:fixed;z-index:999;top:0;left:0;height:.28rem;width:0;background:linear-gradient(90deg,hsl(var(--neon-blue)),hsl(var(--neon-pink)));box-shadow:0 0 1rem hsl(var(--neon-blue))}
.cyber-nav{margin-bottom:1rem;border:.28rem solid hsl(var(--neon-blue));border-image:var(--border-image);background:hsl(var(--dark-blue));z-index:80}
.cyber-nav ul{display:flex;flex-wrap:wrap}.cyber-nav li{flex:1 1 33%;border:1px solid hsl(var(--neon-blue));text-align:center}.cyber-nav a,.cyber-nav button{display:block;width:100%;padding:.75rem .55rem;border:0;background:transparent;color:hsl(var(--neon-pink));text-decoration:none;text-transform:uppercase;font-weight:900;letter-spacing:.07em;cursor:pointer}.cyber-nav a:hover,.cyber-nav button:hover{background:hsla(var(--neon-blue),.12);color:hsl(var(--very-light-blue));filter:none}
.menu-toggle{display:none}
@media(min-width:64rem){.cyber-nav{position:fixed;left:1rem;top:2rem;width:13rem;margin:0}.cyber-nav ul{display:flex;flex-direction:column}.cyber-nav li{flex-basis:auto}.menu-toggle{display:none!important}}
@media(max-width:63.99rem){.menu-toggle{display:block;position:sticky;top:.5rem;z-index:91;width:100%;padding:.8rem;border:.25rem solid hsl(var(--neon-blue));background:hsl(var(--dark-blue));color:hsl(var(--yellow));font-family:var(--font-headings);text-transform:uppercase;cursor:pointer}.cyber-nav{position:fixed;inset:4.4rem .75rem auto;transform:translateY(-130%);opacity:0;pointer-events:none;transition:.22s;box-shadow:0 0 2rem #000;max-height:calc(100vh - 5.5rem);overflow:auto}.cyber-nav.open{transform:none;opacity:1;pointer-events:auto}.nav-backdrop{position:fixed;inset:0;background:#000b;backdrop-filter:blur(4px);z-index:75;opacity:0;pointer-events:none;transition:.2s}.nav-backdrop.open{opacity:1;pointer-events:auto}}
.cyber-header,.cyber-panel,.profile,.featured,.page-footer{width:100%;border:.28rem solid hsl(var(--neon-blue));border-image:var(--border-image);padding:clamp(1rem,3vw,2rem);background:hsla(var(--dark-panel),.94);box-shadow:0 0 1.4rem hsla(var(--neon-blue),.12)}
.cyber-header{position:relative;overflow:hidden;text-align:center}.cyber-header:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 0 48%,hsla(var(--neon-blue),.06) 50%,transparent 52%) 0 0/18px 100%}
.eyebrow{position:relative;z-index:2;display:inline-flex;gap:.6rem;align-items:center;border:.15rem solid hsl(var(--neon-blue));padding:.4rem .65rem;color:hsl(var(--neon-blue));text-transform:uppercase;letter-spacing:.11em;font-size:.78rem}
h1,h2,h3,h4{position:relative;z-index:2;color:hsl(var(--yellow));font-family:var(--font-headings);text-transform:uppercase;text-align:center;overflow-wrap:anywhere}
h1{max-width:15ch;margin:1rem auto .75rem;font-size:clamp(2.7rem,8vw,7rem);line-height:.92;opacity:.95}h2{font-size:clamp(1.65rem,3.7vw,3.7rem)}h3{font-size:clamp(1.15rem,2vw,1.75rem)}h4{font-size:1rem}
.glitch:before,.glitch:after{content:attr(data-text);position:absolute;inset:0;z-index:-1;opacity:.72;pointer-events:none}.glitch:before{color:hsl(var(--neon-pink));transform:translate(-.14rem,.11rem);animation:glitch .35s linear infinite alternate-reverse}.glitch:after{color:hsl(var(--neon-blue));transform:translate(.14rem,.06rem);clip-path:polygon(3% 100%,14% 28%,67% 15%,103% 67%);animation:glitch .35s .1s linear infinite alternate-reverse}
.subtitle{position:relative;z-index:2;max-width:70ch;margin:.8rem auto 0;font-size:clamp(1rem,1rem + .6vw,1.45rem)}.header-actions{position:relative;z-index:2;display:flex;justify-content:center;flex-wrap:wrap;gap:.75rem;margin-top:1.3rem}.hero-metrics{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin-top:1.4rem}.hero-metric{border:.13rem solid hsl(var(--neon-blue));padding:.8rem;background:hsla(var(--dark-blue),.72);box-shadow:inset 0 0 1rem hsla(var(--neon-blue),.13)}.hero-metric b{display:block;color:hsl(var(--yellow));font-family:var(--font-headings);font-size:clamp(1.2rem,3vw,2rem)}.hero-metric span{display:block;color:hsl(var(--muted));font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
main{outline:none}.cyber-panel,.profile,.featured,.page-footer{margin-top:1.2rem}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.2rem}.section-head h2{text-align:left}.section-head p{max-width:62ch;color:hsl(var(--muted))}.chip{display:inline-flex;border:.13rem solid hsl(var(--neon-blue));padding:.3rem .55rem;color:hsl(var(--neon-blue));text-transform:uppercase;font-size:.72rem;letter-spacing:.09em;margin-bottom:.5rem}
.btn,.profile a[class],a.btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.8rem;border:.16rem solid hsl(var(--yellow));padding:.6rem 1rem;background:transparent;color:hsl(var(--neon-blue));text-decoration:none;text-align:center;font-weight:900;text-transform:uppercase;letter-spacing:.055em;cursor:pointer;transition:.16s;box-shadow:0 0 .5rem hsla(var(--yellow),.08)}.btn:hover,.profile a[class]:hover,a.btn:hover{transform:translate(-.1rem,-.1rem);filter:none;box-shadow:0 0 1.4rem hsl(var(--yellow));border-color:hsl(var(--very-light-blue));color:hsl(var(--very-light-blue))}.btn.primary{background:hsla(var(--neon-blue),.14);color:hsl(var(--very-light-blue));border-color:hsl(var(--neon-blue))}.btn.secondary{border-color:hsl(var(--neon-pink));color:hsl(var(--neon-pink))}.btn.danger{border-color:hsl(var(--danger));color:hsl(var(--danger))}.btn.small{min-height:2.1rem;padding:.3rem .55rem;font-size:.72rem}.btn.active{background:hsl(var(--neon-blue));color:hsl(var(--dark-blue));box-shadow:0 0 1.1rem hsla(var(--neon-blue),.65)}
.tabs,.toolbar,.actions,.pill-row{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem}.tabs{margin-bottom:1rem}.workspace-panel{display:none}.workspace-panel.active{display:block;animation:panel-in .28s ease-out}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem}.card{grid-column:span 4;min-width:0;border:.17rem solid hsl(var(--neon-blue));padding:1rem;background:hsla(var(--dark-blue),.72);box-shadow:0 0 1.2rem hsla(var(--neon-blue),.12),inset 0 0 1.4rem hsla(var(--neon-blue),.05)}.card.wide{grid-column:span 8}.card.half{grid-column:span 6}.card.full{grid-column:1/-1}.card h3,.card h4{text-align:left;margin-bottom:.7rem}.muted{color:hsl(var(--muted))}.stack{display:grid;gap:.65rem}.split{display:grid;grid-template-columns:1.05fr .95fr;gap:1rem}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}.metric-card{border:.14rem solid hsl(var(--very-light-blue));padding:.85rem;background:hsla(var(--dark-blue),.82);box-shadow:0 0 1rem hsla(var(--neon-blue),.2)}.metric-card b{display:block;color:hsl(var(--yellow));font-family:var(--font-headings);font-size:clamp(1.35rem,3vw,2.5rem)}.metric-card span{display:block;color:hsl(var(--muted));font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.input,select,textarea{width:100%;min-height:2.8rem;border:.15rem solid hsl(var(--neon-blue));padding:.65rem .75rem;background:hsl(var(--dark-blue));color:hsl(var(--very-light-blue));border-radius:0;box-shadow:inset 0 0 .8rem hsla(var(--neon-blue),.08)}.input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 1rem hsla(var(--neon-blue),.5)}textarea{min-height:7rem;resize:vertical}.toolbar>.input,.toolbar>select{flex:1 1 12rem}.field{display:grid;gap:.35rem}.field label{color:hsl(var(--yellow));text-transform:uppercase;font-size:.72rem;letter-spacing:.08em}
.table-wrap{overflow:auto;border:.15rem solid hsl(var(--neon-blue));max-width:100%;background:hsl(var(--dark-blue))}table{width:100%;min-width:760px;border-collapse:collapse}th,td{padding:.72rem;border-bottom:1px solid hsla(var(--neon-blue),.28);text-align:left;vertical-align:top}th{position:sticky;top:0;z-index:2;background:hsl(var(--dark-blue));color:hsl(var(--yellow));text-transform:uppercase;font-size:.72rem;letter-spacing:.07em}tbody tr:hover{background:hsla(var(--neon-blue),.08)}
.badge{display:inline-flex;align-items:center;border:.12rem solid currentColor;padding:.22rem .45rem;text-transform:uppercase;font-size:.68rem;font-weight:900}.badge.ok{color:hsl(var(--ok))}.badge.warn{color:hsl(var(--warning))}.badge.danger{color:hsl(var(--danger))}.badge.info{color:hsl(var(--neon-blue))}
.terminal{min-height:10rem;max-height:22rem;overflow:auto;white-space:pre-wrap;border:.15rem solid hsl(var(--neon-blue));padding:.8rem;background:#02030b;color:#9cffd1;text-shadow:0 0 .4rem rgba(35,255,190,.35);line-height:1.55}.canvas-wrap,.chart{height:15rem;border:.15rem solid hsl(var(--neon-blue));background:repeating-linear-gradient(90deg,hsla(var(--neon-blue),.09) 0 1px,transparent 1px 18px),repeating-linear-gradient(0deg,hsla(var(--neon-blue),.09) 0 1px,transparent 1px 18px)}canvas{width:100%;height:100%;display:block}.chart{display:flex;align-items:flex-end;gap:.45rem;padding:1rem}.chart i{flex:1;min-width:.6rem;border:.1rem solid hsl(var(--very-light-blue));background:linear-gradient(hsl(var(--neon-pink)),hsl(var(--neon-blue)));box-shadow:0 0 .8rem hsla(var(--neon-blue),.3)}
.kanban{display:grid;grid-template-columns:repeat(3,minmax(15rem,1fr));gap:.8rem;overflow:auto}.column{min-height:14rem;border:.15rem solid hsl(var(--neon-blue));padding:.7rem;background:hsla(var(--dark-blue),.62)}.column h4{text-align:left;margin-bottom:.7rem}.ticket,.list-item,.queue-card,.macro-card{border:.12rem solid hsl(var(--very-light-blue));padding:.7rem;margin-bottom:.6rem;background:hsla(var(--dark-panel),.82)}.ticket p{margin-top:.35rem}.empty{border:.12rem dashed hsl(var(--muted));padding:1.2rem;text-align:center;color:hsl(var(--muted))}.schema-pill{display:inline-flex;margin:.25rem;border:.11rem solid hsl(var(--neon-blue));padding:.32rem .48rem;color:hsl(var(--neon-blue));font-size:.75rem}.progress-bar{height:.7rem;border:.1rem solid hsl(var(--neon-blue));background:hsl(var(--dark-blue));overflow:hidden}.progress-bar i{display:block;height:100%;background:linear-gradient(90deg,hsl(var(--neon-blue)),hsl(var(--neon-pink)))}
.profile{text-align:center}.profile ul{display:grid;gap:.6rem;margin:.8rem 0}.profile li{display:flex;justify-content:center;gap:.45rem;flex-wrap:wrap}.profile li span:first-child{color:hsl(var(--yellow))}.featured ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:1rem}.featured li{border:.12rem solid hsl(var(--neon-blue));padding:.8rem}.featured li span{display:block;color:hsl(var(--muted));font-size:.8rem;margin-top:.25rem}.page-footer{text-align:center}.page-footer ul{display:flex;justify-content:center;flex-wrap:wrap;gap:.7rem;margin:1rem 0}.install-fab{position:fixed;right:1rem;bottom:1rem;z-index:90;display:none}.install-fab.show{display:inline-flex}.toast-wrap{position:fixed;right:1rem;bottom:1rem;z-index:120;display:grid;gap:.5rem}.toast{max-width:min(24rem,calc(100vw - 2rem));border:.15rem solid hsl(var(--neon-blue));padding:.7rem .9rem;background:hsl(var(--dark-blue));color:hsl(var(--very-light-blue));box-shadow:0 0 1rem hsl(var(--neon-blue))}
@media(max-width:62rem){.section-head{align-items:flex-start;flex-direction:column}.card,.card.wide,.card.half{grid-column:1/-1}.split{grid-template-columns:1fr}.hero-metrics,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.featured ul{grid-template-columns:1fr}.kanban{grid-template-columns:repeat(3,minmax(14rem,1fr))}}
@media(max-width:36rem){body{padding:.55rem}.cyber-header,.cyber-panel,.profile,.featured,.page-footer{padding:1rem}.hero-metrics,.metric-grid{grid-template-columns:1fr 1fr}.header-actions .btn,.tabs .btn,.toolbar .btn{flex:1 1 9rem}.cyber-nav li{flex-basis:50%}.section-head h2{font-size:clamp(1.6rem,10vw,2.6rem)}h1{font-size:clamp(2.35rem,15vw,4.4rem)}.card{padding:.8rem}.table-wrap{margin-inline:-.2rem}.toast-wrap{left:.7rem;right:.7rem}.toast{max-width:none}}
@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-.12rem,-.1rem)}40%{transform:translate(-.08rem,.1rem)}60%{transform:translate(.1rem,.08rem)}80%{transform:translate(.12rem,-.08rem)}to{transform:translate(0)}}@keyframes panel-in{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(forced-colors:active){*{border-color:CanvasText!important}.glitch:before,.glitch:after{display:none}}
body.spectrum{--neon-blue:112 100% 54%;--neon-pink:44 100% 62%;--yellow:184 96% 70%}