/* Nebix · sistema de diseño compartido (kiosco + panel) */
:root{
  --bg:#060a1a;--bg2:#0a1024;--c1:#6ee7f9;--c2:#6d4aff;--c3:#b794ff;
  --ink:#e9eeff;--mut:#8f9bc8;--dim:#5b678f;
  --line:rgba(130,150,255,.16);--line2:rgba(130,150,255,.3);
  --glass:rgba(14,20,46,.66);--glass2:rgba(22,30,64,.72);
  --ok:#34d399;--bad:#fb7185;--warn:#fbbf24;
  --grad:linear-gradient(120deg,var(--c1),var(--c2));
  --mono:ui-monospace,"JetBrains Mono","SF Mono",Menlo,Consolas,monospace;
  --sans:"Inter","Segoe UI Variable",system-ui,-apple-system,Roboto,sans-serif;
}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;font-family:var(--sans);background:var(--bg);color:var(--ink);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{ /* grilla tech */
  content:"";position:fixed;inset:-40px;z-index:0;pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:44px 44px;opacity:.35;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 20%,transparent 75%);
  animation:gridmove 24s linear infinite}
@keyframes gridmove{to{background-position:44px 44px,44px 44px}}
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.38;will-change:transform}
.aurora i:nth-child(1){width:46vw;height:46vw;left:-10vw;top:-14vw;background:var(--c2);animation:drift1 22s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:38vw;height:38vw;right:-8vw;top:8vh;background:#0891b2;opacity:.28;animation:drift2 26s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:30vw;height:30vw;left:30vw;bottom:-16vw;background:#4f46e5;opacity:.3;animation:drift1 30s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(8vw,6vh) scale(1.15)}}
@keyframes drift2{to{transform:translate(-9vw,10vh) scale(.9)}}
#fx{position:fixed;inset:0;z-index:0;pointer-events:none}
.wrap{position:relative;z-index:1}

/* tarjetas de vidrio con borde luminoso */
.card{position:relative;background:var(--glass);border:1px solid var(--line);border-radius:20px;padding:24px;
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 10px 40px -12px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05);margin-bottom:16px}
.card.glow::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--a,0deg),transparent 0 62%,var(--c1) 80%,var(--c2) 92%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:spin 6s linear infinite}
@property --a{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes spin{to{--a:360deg}}
h1,h2,h3{font-weight:700;letter-spacing:-.01em}
h2{margin:0 0 16px;font-size:20px}h3{margin:16px 0 8px;font-size:16px}
a{color:var(--c1)}

/* formularios */
label{display:block;font-weight:600;margin:16px 0 8px;font-size:13px;color:var(--mut);letter-spacing:.04em;text-transform:uppercase;font-family:var(--mono)}
input,select,textarea{font-family:inherit;font-size:16px;color:var(--ink);background:rgba(8,12,32,.7);border:1px solid var(--line2);border-radius:12px;padding:12px 16px;max-width:100%;transition:border-color .2s,box-shadow .2s,background .2s}
input::placeholder,textarea::placeholder{color:var(--dim)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--c1);box-shadow:0 0 0 3px rgba(110,231,249,.18),0 0 24px -6px rgba(110,231,249,.5);background:rgba(8,12,32,.92)}
select option{background:#0a1024;color:var(--ink)}
input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.8)}
input[type=color]{padding:2px;height:44px;width:72px;cursor:pointer}
input[type=checkbox]{accent-color:var(--c1)}
textarea{width:100%;min-height:96px}

/* botones */
.btn{position:relative;overflow:hidden;display:inline-block;padding:10px 18px;border:0;border-radius:12px;background:var(--grad);color:#04101f;font-weight:700;cursor:pointer;font-size:14px;font-family:inherit;
  box-shadow:0 8px 24px -8px rgba(109,74,255,.7);transition:transform .15s,box-shadow .2s,filter .2s}
.btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .6s}
.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 32px -8px rgba(110,231,249,.55)}
.btn:hover:not(:disabled)::after{left:130%}
.btn:active:not(:disabled){transform:translateY(0) scale(.98)}
.btn.sec{background:rgba(130,150,255,.12);color:var(--ink);border:1px solid var(--line2);box-shadow:none}
.btn.bad{background:linear-gradient(120deg,#fb7185,#e11d48);color:#fff}.btn.ok{background:linear-gradient(120deg,#34d399,#10b981);color:#03150e}
.btn:disabled{opacity:.35;cursor:not-allowed}

/* tablas y píldoras */
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11px;color:var(--mut);font-weight:600;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em}
tr.click{cursor:pointer;transition:background .15s}tr.click:hover{background:rgba(110,231,249,.07)}
.pill{display:inline-block;padding:3px 12px;border-radius:999px;font-weight:700;font-size:12px;font-family:var(--mono);letter-spacing:.04em;border:1px solid transparent}
.pill.aprobado,.pill.resuelto{background:rgba(52,211,153,.12);color:var(--ok);border-color:rgba(52,211,153,.35)}
.pill.revision{background:rgba(251,191,36,.12);color:var(--warn);border-color:rgba(251,191,36,.35)}
.pill.rechazado,.pill.abierto{background:rgba(251,113,133,.12);color:var(--bad);border-color:rgba(251,113,133,.35)}
.muted{color:var(--mut);font-size:13px}.err{color:var(--bad)}.hidden{display:none!important}
.mono{font-family:var(--mono)}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(52,211,153,.7);animation:ping 2s infinite;vertical-align:middle;margin-right:6px}
.dot.off{background:var(--warn);animation:none}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:rgba(130,150,255,.25);border-radius:8px}::-webkit-scrollbar-track{background:transparent}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
