/* Aegis — cyberpunk identity: near-black chassis, neon green × electric
   purple glows, glitch effects, terminal type. Loaded after Tailwind.
   Deliberately NOT the typical AI palette (no indigo/pink/cyan pastels). */
:root{
  --bg:#000000; --bg-2:#020209;
  --panel:linear-gradient(165deg,rgba(255,255,255,.10) 0%,rgba(22,18,36,.42) 22%,rgba(5,3,12,.78) 58%,rgba(24,20,42,.50) 100%);
  --panel-solid:linear-gradient(165deg,rgba(26,22,48,.97) 0%,rgba(8,5,18,.98) 50%,rgba(18,14,36,.96) 100%);
  --line:rgba(255,255,255,.14); --line-strong:rgba(255,255,255,.26);
  --txt:#ffffff; --txt-dim:#c6c2e8;
  --acc1:#00ff9d;   /* neon green — primary action */
  --acc2:#0a0a12;   /* black — replaces electric purple accent */
  --acc3:#7fffbd;   /* mint — focus */
  --ok:#34d399; --bad:#ff4d6d; --warn:#ffb454;
  --shadow-soft:0 24px 70px -24px rgba(0,0,0,.9);
  --font:"Inter",system-ui,sans-serif; --font-display:"Orbitron","Inter",sans-serif;
}
html{color-scheme:dark}
body{font-family:var(--font);color:var(--txt);min-height:100vh;
  background:
    radial-gradient(ellipse 55% 38% at 82% -6%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(ellipse 45% 32% at 10% 110%, rgba(56,52,88,.10), transparent 62%),
    radial-gradient(ellipse 34% 26% at 94% 84%, rgba(255,255,255,.04), transparent 65%),
    linear-gradient(180deg,#000000 0%,#010107 45%,#03030b 100%);
  background-attachment:fixed}

/* cyber grid backdrop */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:52px 52px}
/* CRT scanlines + bottom edge glow */
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px),
    radial-gradient(ellipse 70% 60% at 50% 110%, rgba(255,255,255,.06), transparent 60%)}

body.bg-\[#05060f\]{background:transparent}
body.text-slate-200{color:var(--txt)}
.font-display{font-family:var(--font-display);font-weight:600;letter-spacing:.04em}
/* panels — armored glass, neon hairline, deep gloss */
.glass{position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.10),transparent 22%),var(--panel);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 2px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(255,255,255,.05),var(--shadow-soft)}
.glass::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,rgba(255,255,255,.10),transparent 32%,transparent 68%,rgba(255,255,255,.04));
  mix-blend-mode:screen}
.glass-strong{position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.12),transparent 26%),var(--panel-solid);
  backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);
  border:1px solid var(--line-strong);box-shadow:inset 0 2px 0 rgba(255,255,255,.24),0 34px 80px -34px rgba(0,0,0,.92)}
.glass-strong::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 30%,transparent 70%,rgba(255,255,255,.05));
  mix-blend-mode:screen}
.card{position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.10),transparent 22%),var(--panel);
  border:1px solid rgba(255,255,255,.16);border-radius:14px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(255,255,255,.05),var(--shadow-soft)}
.card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,rgba(255,255,255,.09),transparent 34%,transparent 66%,rgba(255,255,255,.04));
  mix-blend-mode:screen}
.glow-ring{border:1.5px solid rgba(255,255,255,.5);box-shadow:0 0 0 1px rgba(255,255,255,.14),
  0 0 44px -8px rgba(255,255,255,.35),inset 0 0 26px rgba(0,0,0,.35)}

/* text accents — clean white glow */
.grad-text{background:linear-gradient(92deg,#ffffff 0%,#f0f0f8 45%,#c9c9e0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.text-glow{text-shadow:0 0 6px rgba(255,255,255,.95),0 0 16px rgba(255,255,255,.45),0 0 32px rgba(255,255,255,.18)}
/* shine — classic metallic sweep over any element */
.shine{position:relative;overflow:hidden;isolation:isolate}
.shine::after{content:"";position:absolute;top:0;bottom:0;width:38%;left:-60%;
  z-index:-1;transform:skewX(-20deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  animation:shine-sweep 3.4s ease-in-out infinite}
@keyframes shine-sweep{0%{left:-60%}60%,100%{left:135%}}

/* glitch — chromatic split on green/purple, erratic slice jumps */
.glitch{position:relative;display:inline-block;animation:glitch-skew 3.4s infinite}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;inset:0;
  pointer-events:none;opacity:.85}
.glitch::before{color:#ffffff;animation:glitch-slice-a 3.4s infinite steps(1)}
.glitch::after{color:#ffffff;animation:glitch-slice-b 3.4s infinite steps(1)}
@keyframes glitch-skew{0%,85%,100%{transform:none}
  87%{transform:skewX(1.2deg)}89%{transform:skewX(-1.2deg)}
  91%{transform:skewX(.6deg)}93%{transform:skewX(-.4deg)}
  95%{transform:translateX(2px) skewX(.8deg)}97%{transform:translateX(-1px)}}
@keyframes glitch-slice-a{0%,84%,100%{clip-path:inset(0 0 100% 0);transform:none}
  86%{clip-path:inset(12% 0 62% 0);transform:translate(-3px,-2px)}
  89%{clip-path:inset(55% 0 8% 0);transform:translate(3px,1px)}
  92%{clip-path:inset(30% 0 45% 0);transform:translate(-2px,2px)}
  95%{clip-path:inset(78% 0 4% 0);transform:translate(2px,-1px)}
  97%{clip-path:inset(8% 0 80% 0);transform:translate(-1px,1px)}}
@keyframes glitch-slice-b{0%,84%,100%{clip-path:inset(0 0 100% 0);transform:none}
  87%{clip-path:inset(60% 0 15% 0);transform:translate(3px,2px)}
  90%{clip-path:inset(10% 0 68% 0);transform:translate(-3px,-1px)}
  93%{clip-path:inset(42% 0 30% 0);transform:translate(2px,-2px)}
  96%{clip-path:inset(72% 0 6% 0);transform:translate(-2px,1px)}
  98%{clip-path:inset(20% 0 55% 0);transform:translate(1px,-1px)}}

/* buttons — dark chassis, neon trim, charged hover */
.btn-primary{position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(135deg,#101018 0%,#0a0a12 55%,#05050a 100%);color:#fff;
  text-shadow:0 0 10px rgba(255,255,255,.5);
  border:1px solid rgba(255,255,255,.4);
  box-shadow:0 0 18px -6px rgba(255,255,255,.5),inset 0 0 14px rgba(255,255,255,.08);
  transition:transform .15s ease,box-shadow .18s ease,border-color .18s ease}
.btn-primary::after{content:"";position:absolute;top:0;bottom:0;width:36%;left:-60%;
  z-index:-1;transform:skewX(-20deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
  animation:shine-sweep 3.6s ease-in-out infinite}
.btn-primary:disabled::after{display:none}
.btn-primary:hover{border-color:#ffffff;transform:translateY(-1px);
  box-shadow:0 0 30px -4px rgba(255,255,255,.85),0 0 46px -12px rgba(255,255,255,.35),
    inset 0 0 18px rgba(255,255,255,.16)}
.btn-primary:active{transform:translateY(0) scale(.98)}
.btn-primary:focus-visible,.btn-ghost:focus-visible{outline:2px solid var(--acc3);outline-offset:2px}
.btn-ghost{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  color:var(--txt-dim);transition:all .15s ease}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);color:var(--txt);
  box-shadow:0 0 22px -8px rgba(255,255,255,.5)}
.btn{cursor:pointer;user-select:none}

/* inputs — datastream slots, white focus */
.input-dark{background:rgba(2,1,10,.55);border:1.5px solid rgba(255,255,255,.14);
  color:var(--txt);transition:border-color .15s ease,box-shadow .15s ease}
.input-dark::placeholder{color:rgba(160,157,184,.55)}
.input-dark:hover{border-color:rgba(255,255,255,.24)}
.input-dark:focus{outline:none;border-color:rgba(255,255,255,.9);
  box-shadow:0 0 0 3px rgba(255,255,255,.18),0 0 24px -8px rgba(255,255,255,.55)}
select.input-dark option{background:#0c0520;color:#eceaf6}

/* code chips — white glow */
.code-chip{background:rgba(2,1,10,.6);border:1px solid rgba(255,255,255,.25);
  color:#ffffff;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 22px -12px rgba(255,255,255,.5)}

/* surfaces */
.card-lift{transition:transform .18s ease,box-shadow .22s ease,border-color .18s ease}
.card-lift:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.45);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px -28px rgba(255,255,255,.35),
    0 0 34px -14px rgba(255,255,255,.22)}
tbody tr{transition:background .12s ease}
tbody tr:hover{background:rgba(255,255,255,.06)}
th{font-weight:600;letter-spacing:.07em}

/* toast */
.toast{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:0 20px 48px -20px rgba(0,0,0,.7),0 0 30px -10px rgba(255,255,255,.45);
  animation:toast-in .26s cubic-bezier(.22,1,.36,1)}
@keyframes toast-in{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}

/* misc */
::selection{background:rgba(255,255,255,.4)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.35);border-radius:999px;
  border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.6);background-clip:content-box}
a{transition:color .15s ease}
code,.font-mono{font-family:"Share Tech Mono",ui-monospace,SFMono-Regular,Menlo,monospace}
.grid-bg{background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px}
/* tailwind utility remap — neon green / electric purple / neutral */
.text-white{color:#fff!important}
.text-slate-50,.text-slate-100{color:#ffffff!important}
.text-slate-200{color:#f4f2ff!important}
.text-slate-300{color:#e8e6fa!important}
.text-slate-400{color:#d3d0ec!important}
.text-slate-500,.text-slate-600{color:#aba7cd!important}
.text-cyan-200,.text-cyan-300{color:#e9ebf7!important}
.text-indigo-300,.text-indigo-400{color:#dcd9ee!important}
.text-violet-300,.text-violet-400{color:#dcd9ee!important}
.text-fuchsia-300,.text-fuchsia-400{color:#e4dcf2!important}
.text-emerald-300{color:#6ee7b7!important}
.text-emerald-400{color:#34d399!important}
.text-rose-300{color:#ff9daf!important}
.text-amber-200,.text-amber-300{color:#ffcf7d!important}
.text-sky-300,.text-sky-400{color:#dcdbee!important}
.text-blue-300,.text-blue-400{color:#dcdbee!important}
.text-pink-300,.text-pink-400{color:#e9e2f4!important}
.text-purple-300,.text-purple-400{color:#dcd8ee!important}
.placeholder-slate-500::placeholder,.placeholder-slate-400::placeholder{color:rgba(211,208,236,.65)!important}
.text-indigo-500{color:#b6b0d9!important}
.text-fuchsia-500{color:#c9c2e4!important}
.text-emerald-600,.text-emerald-500{color:#34d399!important}
.text-rose-500,.text-rose-400{color:#ff4d6d!important}
.text-cyan-500,.text-cyan-400{color:#c9cfe8!important}
.text-violet-500{color:#b6b0d9!important}
.text-purple-500{color:#cbc4e8!important}
.text-pink-500{color:#cfc8e8!important}
.text-sky-500,.text-sky-400{color:#56ffc0!important}
.text-blue-500,.text-blue-400{color:#56ffc0!important}
.text-white\/90{color:rgba(255,255,255,.9)!important}
.text-\[#1a120b\]{color:#eafff4!important}

/* keep white text on solid colored surfaces (badges/icons/chips) */
[class*="bg-indigo-500"].text-white,[class*="bg-indigo-600"].text-white,
[class*="bg-indigo-400"].text-white,[class*="bg-indigo-700"].text-white,
[class*="bg-fuchsia-500"].text-white,[class*="bg-fuchsia-600"].text-white,
[class*="bg-emerald-500"].text-white,[class*="bg-emerald-600"].text-white,
[class*="bg-emerald-400"].text-white,[class*="bg-rose-500"].text-white,
[class*="bg-rose-600"].text-white,[class*="bg-cyan-500"].text-white,
[class*="bg-cyan-600"].text-white,[class*="bg-violet-500"].text-white,
[class*="bg-violet-600"].text-white,[class*="bg-purple-500"].text-white,
[class*="bg-purple-600"].text-white,[class*="bg-sky-500"].text-white,
[class*="bg-sky-600"].text-white,[class*="bg-blue-500"].text-white,
[class*="bg-blue-600"].text-white,[class*="bg-pink-500"].text-white,
[class*="bg-pink-600"].text-white,[class*="bg-amber-400"].text-white,
[class*="bg-amber-500"].text-white,[class*="bg-lime-400"].text-white,
[class*="bg-lime-500"].text-white,[class*="bg-teal-500"].text-white,
[class*="bg-teal-600"].text-white,[class*="bg-orange-500"].text-white,
[class*="bg-orange-600"].text-white,.btn-primary.text-white,.btn-primary .text-white{color:#fff!important}

/* backgrounds — translucent dark chassis */
.bg-slate-800{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04))!important;border-color:rgba(255,255,255,.24)!important;color:var(--txt)!important}
.bg-slate-700{background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.06))!important;border-color:rgba(255,255,255,.28)!important;color:#fff!important}
.hover\:bg-slate-600:hover,.hover\:bg-slate-500:hover{background:rgba(255,255,255,.12)!important}
.bg-white\/5{background:rgba(255,255,255,.05)!important}
.bg-white\/10{background:rgba(255,255,255,.1)!important}
.bg-black\/70{background:rgba(4,2,12,.8)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
/* purple-family surface colors -> glossy black (white glow text) */
.bg-indigo-600,.bg-indigo-500,.bg-indigo-700,.bg-indigo-400,
.bg-purple-600,.bg-purple-500,.bg-violet-600,.bg-violet-500,
.bg-fuchsia-600,.bg-fuchsia-500,.bg-pink-600,.bg-pink-500{
  background:linear-gradient(180deg,#17171f 0%,#0b0b12 55%,#050507 100%)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  text-shadow:0 0 10px rgba(255,255,255,.45);color:#fff!important}
.bg-black\/40{background:rgba(4,2,12,.62)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.bg-black\/50{background:rgba(4,2,12,.7)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
/* background blobs — neon field tints */
.bg-indigo-600\/25{background:rgba(255,255,255,.07)!important}
.bg-fuchsia-600\/20{background:rgba(255,255,255,.07)!important}
.bg-cyan-500\/15{background:rgba(255,255,255,.07)!important}
.bg-violet-500\/20{background:rgba(255,255,255,.07)!important}
.bg-purple-500\/20{background:rgba(255,255,255,.07)!important}
.bg-pink-500\/20{background:rgba(255,255,255,.07)!important}

/* borders */
.border-slate-600{border-color:rgba(255,255,255,.18)!important}
.border-slate-700,.border-slate-800{border-color:rgba(255,255,255,.14)!important}
.border-white\/10{border-color:rgba(255,255,255,.12)!important}
.border-white\/5{border-color:rgba(255,255,255,.08)!important}
.border-white\/20{border-color:rgba(255,255,255,.18)!important}
.divide-slate-700 > :not([hidden]) ~ :not([hidden]){border-color:rgba(255,255,255,.1)!important}

/* animation */
body > .max-w-6xl,body > .max-w-7xl,header,main{animation:page-in .4s cubic-bezier(.22,1,.36,1)}
@keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media (prefers-reduced-motion:reduce){.glitch::before,.glitch::after{display:none}}
@media (max-width:640px){.glass,.glass-strong,.toast,.bg-black\/70,.bg-black\/40,.bg-black\/50{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}