/* SmartLED — tema tecnológico (v6). Carregado DEPOIS do <style> de cada página: só sobrescreve. */
:root{
  color-scheme:dark;
  --t-bg0:#04060b; --t-bg1:#0a1020; --t-panel:rgba(13,21,38,.78); --t-panel2:rgba(20,32,56,.55);
  --t-line:rgba(86,150,255,.20); --t-line2:rgba(86,150,255,.42);
  --t-blue:#3a9bff; --t-cyan:#22d3ee; --t-green:#3ddc6a;
  --t-tx:#e7eefc; --t-mut:#8d9bb8;
  --t-grad:linear-gradient(135deg,#2f8fff 0%,#22d3ee 45%,#3ddc6a 100%);
  --t-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
  --t-font:'Space Grotesk',Outfit,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;

  /* portal do cliente */
  --or:var(--t-green); --bl:var(--t-blue); --bg:var(--t-bg0); --card:var(--t-panel); --tx:var(--t-tx); --mut:var(--t-mut); --bd:var(--t-line);
  --ok:#5cf09a; --okb:rgba(61,220,106,.12); --warn:#ffcb57; --warnb:rgba(255,190,60,.12); --err:#ff7b72; --errb:rgba(255,90,80,.13);
  /* painel */
  --ink:var(--t-tx); --mute:var(--t-mut); --line:var(--t-line); --brand:#2f8fff; --brand-d:#1f78e6; --bad:#ff7b72;
}
@media (prefers-color-scheme:light){:root{--bg:var(--t-bg0);--card:var(--t-panel);--tx:var(--t-tx);--mut:var(--t-mut);--bd:var(--t-line)}}

html{background:var(--t-bg0)}
body{font-family:var(--t-font)!important;color:var(--t-tx)!important;background:var(--t-bg0)!important;min-height:100vh;position:relative;overflow-x:hidden;-webkit-font-smoothing:antialiased}
/* grade + brilhos de fundo */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 500px at 12% -8%,rgba(47,143,255,.22),transparent 60%),
    radial-gradient(800px 500px at 100% 0%,rgba(61,220,106,.14),transparent 60%),
    radial-gradient(700px 600px at 50% 120%,rgba(34,211,238,.10),transparent 60%),
    linear-gradient(rgba(86,150,255,.07) 1px,transparent 1px) 0 0/44px 44px,
    linear-gradient(90deg,rgba(86,150,255,.07) 1px,transparent 1px) 0 0/44px 44px;
  -webkit-mask-image:linear-gradient(#000 40%,rgba(0,0,0,.55));mask-image:linear-gradient(#000 40%,rgba(0,0,0,.55))}
body::after{content:"";position:fixed;left:0;right:0;top:-120px;height:120px;z-index:0;pointer-events:none;
  background:linear-gradient(transparent,rgba(34,211,238,.07),transparent);animation:t-scan 9s linear infinite}
@keyframes t-scan{to{transform:translateY(calc(100vh + 240px))}}
header,main,footer,#login,#app{position:relative;z-index:1}
::selection{background:rgba(47,143,255,.45);color:#fff}
*{scrollbar-width:thin;scrollbar-color:#27406b transparent}

/* ---------- cabeçalho ---------- */
header{background:rgba(6,10,20,.72)!important;border-bottom:1px solid var(--t-line)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--t-tx)!important;position:sticky!important;top:0;z-index:20}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--t-grad);opacity:.8;box-shadow:0 0 14px rgba(34,211,238,.7)}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand .sl{height:38px;width:auto;display:block;filter:drop-shadow(0 0 10px rgba(58,155,255,.35))}
.brand .by{display:flex;align-items:center;gap:6px;padding-left:12px;border-left:1px solid var(--t-line2);font:500 9px/1 var(--t-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--t-mut)}
.brand .by img{height:13px;width:auto;opacity:.8;display:block}
@media(max-width:420px){.brand .sl{height:30px}.brand .by{display:none}}
#who{font:500 12px var(--t-mono)!important;color:var(--t-mut)!important}
#hdrBal{font:500 13px var(--t-mono)}#hdrBal b{color:var(--t-cyan);text-shadow:0 0 12px rgba(34,211,238,.55)}

/* ---------- cartões (estilo HUD) ---------- */
.card{background:var(--t-panel)!important;border:1px solid var(--t-line)!important;border-radius:14px!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative;box-shadow:0 10px 40px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04)}
.card::before,.card::after{content:"";position:absolute;width:14px;height:14px;pointer-events:none;border:2px solid var(--t-cyan);opacity:.75;filter:drop-shadow(0 0 4px var(--t-cyan))}
.card::before{top:-1px;left:-1px;border-right:0;border-bottom:0;border-top-left-radius:14px}
.card::after{bottom:-1px;right:-1px;border-left:0;border-top:0;border-bottom-right-radius:14px;border-color:var(--t-green);filter:drop-shadow(0 0 4px var(--t-green))}
h2,h3,h4{font-family:var(--t-font);letter-spacing:-.01em}
h2{font-weight:700}
h3{font:600 12px var(--t-mono)!important;letter-spacing:.12em;text-transform:uppercase;color:var(--t-cyan)!important}
h3::before{content:"// ";color:var(--t-green)}
label{color:#b9c6e2!important}
.mut,.meta{color:var(--t-mut)!important}

/* ---------- formulários ---------- */
input,select,textarea,input[type=text],input[type=password],input[type=number],input[type=date],input[type=time]{
  background:rgba(4,8,18,.75)!important;color:var(--t-tx)!important;border:1px solid var(--t-line)!important;border-radius:10px!important;transition:border-color .15s,box-shadow .15s}
input::placeholder,textarea::placeholder{color:#58678a}
input:focus,select:focus,textarea:focus{outline:0!important;border-color:var(--t-cyan)!important;box-shadow:0 0 0 3px rgba(34,211,238,.18),0 0 18px rgba(34,211,238,.18)}
input[type=checkbox],input[type=radio]{accent-color:var(--t-green);width:auto!important}
select option{background:#0a1020;color:var(--t-tx)}

/* ---------- botões ---------- */
button,.btn{font-family:var(--t-font);letter-spacing:.01em;transition:transform .12s,box-shadow .18s,filter .18s,border-color .18s}
button:where(:not(.sec):not(.ghost):not(.dng):not(.danger):not(.on)),.btn:where(:not(.sec):not(.danger)){
  background:var(--t-grad)!important;background-size:140% 140%;color:#03121c!important;font-weight:700;border:0!important;box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 6px 22px rgba(47,143,255,.35)}
button:where(:not(.sec):not(.ghost):not(.dng):not(.danger):not(.on)):hover:not(:disabled),.btn:where(:not(.sec):not(.danger)):hover:not(:disabled){filter:brightness(1.12);box-shadow:0 0 0 1px rgba(255,255,255,.1) inset,0 8px 30px rgba(34,211,238,.45);transform:translateY(-1px)}
button:active:not(:disabled){transform:translateY(0) scale(.985)}
button.sec,.btn.sec{background:rgba(47,143,255,.08)!important;color:var(--t-blue)!important;border:1px solid rgba(58,155,255,.55)!important;box-shadow:none}
button.sec:hover:not(:disabled),.btn.sec:hover:not(:disabled){background:rgba(47,143,255,.18)!important;box-shadow:0 0 18px rgba(47,143,255,.3)}
button.ghost{background:transparent!important;color:var(--t-mut)!important;border:1px solid var(--t-line)!important}
button.ghost:hover{color:var(--t-tx)!important;border-color:var(--t-line2)!important}
button.dng,.btn.danger{background:rgba(255,90,80,.08)!important;color:#ff8d85!important;border:1px solid rgba(255,110,100,.45)!important}
button:disabled,.btn:disabled{opacity:.45!important}
button:focus-visible,a:focus-visible{outline:2px solid var(--t-cyan);outline-offset:2px}
a{color:var(--t-cyan)}

/* ---------- abas ---------- */
.tabs{border-bottom:1px solid var(--t-line)!important}
.tabs button{background:none!important;box-shadow:none!important;color:var(--t-mut)!important;font:600 12px var(--t-mono);letter-spacing:.1em;text-transform:uppercase;border-bottom:2px solid transparent!important;filter:none!important;transform:none!important}
.tabs button:hover{color:var(--t-tx)!important}
.tabs button.on{color:var(--t-green)!important;border-bottom-color:var(--t-green)!important;text-shadow:0 0 14px rgba(61,220,106,.6);box-shadow:0 8px 14px -10px rgba(61,220,106,.8)!important}

/* ---------- selos, números, blocos ---------- */
.chip,.badge{font:600 11px var(--t-mono)!important;letter-spacing:.06em;text-transform:uppercase;background:rgba(141,155,184,.14)!important;color:var(--t-mut)!important;border:1px solid rgba(141,155,184,.22)}
.chip.ok,.badge.ok{background:var(--okb)!important;color:var(--ok)!important;border-color:rgba(61,220,106,.35)}
.chip.warn,.badge.warn{background:var(--warnb)!important;color:var(--warn)!important;border-color:rgba(255,190,60,.35)}
.chip.err,.badge.bad{background:var(--errb)!important;color:var(--err)!important;border-color:rgba(255,110,100,.35)}
.badge::before{box-shadow:0 0 8px currentColor}
.badge.ok::before{animation:t-pulse 1.8s ease-in-out infinite}
@keyframes t-pulse{50%{opacity:.35}}
.big{font-family:var(--t-mono)!important;font-weight:600;background:var(--t-grad);-webkit-background-clip:text;background-clip:text;color:transparent!important;filter:drop-shadow(0 0 14px rgba(34,211,238,.35))}
.msg{border:1px solid transparent;font-size:14px}
.msg.err{border-color:rgba(255,110,100,.35)}.msg.ok{border-color:rgba(61,220,106,.35)}.msg.info{border-color:rgba(255,190,60,.35)}
.banner{background:var(--warnb)!important;color:var(--warn)!important;border:1px solid rgba(255,190,60,.35)!important}
.cats label{background:rgba(4,8,18,.55);border-color:var(--t-line)!important;transition:all .15s}
.cats label:hover{border-color:var(--t-line2)!important}
.cats label.on{border-color:var(--t-green)!important;background:rgba(61,220,106,.12)!important;box-shadow:0 0 14px rgba(61,220,106,.2)}
.pk,.scr,.ad{background:var(--t-panel2);border:1px solid var(--t-line)!important;transition:border-color .18s,box-shadow .18s,transform .18s}
.pk:hover,.scr:not(.off):hover,.ad:hover{border-color:var(--t-line2)!important;box-shadow:0 0 24px rgba(47,143,255,.18)}
.pk{border-radius:14px!important}.pk .pr{font-family:var(--t-mono);color:var(--t-cyan);text-shadow:0 0 14px rgba(34,211,238,.4)}
.thumb{border:1px solid var(--t-line2)!important;background:#02040a!important}
.terms{background:rgba(4,8,18,.75)!important;border-color:var(--t-line)!important;color:#b9c6e2;font-family:var(--t-mono);font-size:12px!important}
progress{accent-color:var(--t-cyan);height:8px;border-radius:99px;overflow:hidden}
progress::-webkit-progress-bar{background:rgba(141,155,184,.18);border-radius:99px}
progress::-webkit-progress-value{background:var(--t-grad);border-radius:99px;box-shadow:0 0 12px rgba(34,211,238,.6)}
progress::-moz-progress-bar{background:var(--t-cyan);border-radius:99px}

/* ---------- abertura (login / cadastro) ---------- */
.hero{text-align:center;padding:26px 10px 20px}
.hero img.big-logo{width:min(380px,82%);height:auto;filter:drop-shadow(0 0 26px rgba(58,155,255,.45));animation:t-float 6s ease-in-out infinite}
@keyframes t-float{50%{transform:translateY(-4px)}}
.hero .tag{margin:14px auto 0;max-width:460px;font-size:16px;color:#b9c6e2}
.hero .steps{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:14px;font:500 10.5px var(--t-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--t-mut)}
.hero .steps span{padding:5px 10px;border:1px solid var(--t-line);border-radius:99px;background:rgba(4,8,18,.5)}
.hero .steps span i{font-style:normal;color:var(--t-green);margin-right:6px}
.hero .by{margin-top:16px;display:inline-flex;align-items:center;gap:8px;font:500 9px var(--t-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--t-mut)}
.hero .by img{height:14px;opacity:.8}

/* ---------- rodapé ---------- */
.foot{max-width:860px;margin:10px auto 0;padding:22px 16px 34px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center;font:500 10px var(--t-mono);letter-spacing:.12em;text-transform:uppercase;color:#5f6e8e;border-top:1px solid var(--t-line)}
.foot img{height:15px;width:auto;opacity:.85}
.foot .dot{width:6px;height:6px;border-radius:50%;background:var(--t-green);box-shadow:0 0 10px var(--t-green);animation:t-pulse 2s ease-in-out infinite}

/* ================= PAINEL (index.html) ================= */
#login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
#login form{background:var(--t-panel)!important;border:1px solid var(--t-line);backdrop-filter:blur(12px);box-shadow:0 20px 70px rgba(0,0,0,.55),0 0 60px rgba(47,143,255,.12)!important;border-radius:18px!important;position:relative;text-align:center}
#login form label{text-align:left}
#login form input{text-align:left}
#login h1{font:600 12px var(--t-mono)!important;letter-spacing:.16em;text-transform:uppercase;color:var(--t-cyan);margin:14px 0 4px!important}
#login p{color:var(--t-mut)!important}
#login .big-logo{width:230px;max-width:80%;filter:drop-shadow(0 0 22px rgba(58,155,255,.45))}
#login .by{margin-top:18px;display:inline-flex;align-items:center;gap:8px;font:500 9px var(--t-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--t-mut)}
#login .by img{height:13px;opacity:.8}
header nav button{color:var(--t-mut)!important;font:600 11px var(--t-mono)!important;letter-spacing:.05em;padding-left:10px!important;padding-right:10px!important;text-transform:uppercase;background:none!important;box-shadow:none!important;filter:none!important;transform:none!important;border-radius:0!important}
header nav button:hover{color:var(--t-tx)!important}
header nav button.on{color:var(--t-green)!important;border-bottom-color:var(--t-green)!important;text-shadow:0 0 12px rgba(61,220,106,.55)}
header .out{background:transparent!important;border:1px solid var(--t-line2)!important;color:var(--t-mut)!important;box-shadow:none!important}
.nb:not(:empty){background:#ff5a50;box-shadow:0 0 10px rgba(255,90,80,.7)}
.link{background:rgba(4,8,18,.75)!important;border:1px solid var(--t-line);color:var(--t-cyan)}
.drop{background:rgba(4,8,18,.5)!important;border:2px dashed rgba(58,155,255,.4)!important;color:var(--t-mut)}
.drop.over{border-color:var(--t-green)!important;background:rgba(61,220,106,.08)!important;box-shadow:0 0 30px rgba(61,220,106,.2)}
.prog{background:rgba(141,155,184,.18)!important}.prog>div{background:var(--t-grad)!important;box-shadow:0 0 12px rgba(34,211,238,.6)}
.upl,.item{border-color:var(--t-line)!important}
.plist button{background:var(--t-panel2)!important;color:var(--t-tx)!important;border:1px solid var(--t-line)!important;box-shadow:none!important;font-weight:500;filter:none!important;transform:none!important}
.plist button.on{border-color:var(--t-green)!important;background:rgba(61,220,106,.1)!important}
.rules{background:rgba(4,8,18,.6)!important;border:1px solid var(--t-line)}
.days label{background:rgba(4,8,18,.6)!important;border-color:var(--t-line)!important;color:var(--t-tx)!important}
table{background:var(--t-panel)!important;border:1px solid var(--t-line)!important;backdrop-filter:blur(8px)}
th{background:rgba(47,143,255,.10)!important;color:var(--t-cyan)!important;font-family:var(--t-mono)!important;letter-spacing:.1em!important}
td,th{border-bottom:1px solid var(--t-line)!important}
tr.sub td{background:rgba(47,143,255,.07)!important}
tbody tr:hover td{background:rgba(47,143,255,.06)}
dialog{background:#0a1226!important;color:var(--t-tx)!important;border:1px solid var(--t-line2)!important;box-shadow:0 30px 90px rgba(0,0,0,.7),0 0 50px rgba(47,143,255,.18)!important}
dialog::backdrop{background:rgba(2,4,10,.72)!important;backdrop-filter:blur(4px)}
#toast{background:#0a1226!important;border:1px solid var(--t-line2);color:var(--t-tx)!important;box-shadow:0 0 30px rgba(34,211,238,.25)}
#toast.err{background:#3a1512!important;border-color:rgba(255,110,100,.5)}
.empty{color:var(--t-mut)!important}
video{background:#000!important}

@media (prefers-reduced-motion:reduce){body::after,.hero img.big-logo,.badge.ok::before,.foot .dot{animation:none!important}}
@media print{body::before,body::after{display:none}}