:root{--fundo:#07080c;--texto:#f5f2ec;--fraco:#b4b6c0;--linha:rgba(255,255,255,.1);--brasa:#ff6a1a;--brasa2:#ffb070;--ok:#5fe3d0;--erro:#ff9a7d;--campo:rgba(5,6,10,.55)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--fundo);color:var(--texto);font:300 15px/23px Sora,system-ui,sans-serif}
[hidden]{display:none!important}
h1{margin:0;font:400 18px/22px Sora,sans-serif}h1 b{font-weight:500;background:linear-gradient(100deg,#fff1de,#ffb070 55%,#ff7a2a);-webkit-background-clip:text;background-clip:text;color:transparent}
h2{margin:0;font:400 22px/30px Sora,sans-serif}
.fundo{position:fixed;inset:0;overflow:hidden;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:56px 56px}
.fundo i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;animation:deriva 22s ease-in-out infinite alternate}
.fundo i:nth-child(1){width:560px;height:560px;left:58%;top:-200px;background:#ff5a1a55}
.fundo i:nth-child(2){width:460px;height:460px;left:-140px;top:48%;background:#d6281c33;animation-duration:29s}
.fundo i:nth-child(3){width:380px;height:380px;left:36%;top:74%;background:#3b6dff1f;animation-duration:35s}
@keyframes deriva{to{transform:translate(70px,50px) scale(1.14)}}
@keyframes entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pulsa{0%,100%{box-shadow:0 0 0 0 rgba(95,227,208,.55)}70%{box-shadow:0 0 0 7px rgba(95,227,208,0)}}
.vidro{position:relative;border:1px solid var(--linha);border-radius:18px;background:linear-gradient(155deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 60%);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 30px 70px -34px #000;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.marca{display:flex;align-items:center;gap:12px}.marca small{display:block;font:400 10px/14px 'JetBrains Mono',monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--fraco)}
.chama{width:36px;height:36px;flex:none;background:url(/web/logo.png) center/contain no-repeat;filter:drop-shadow(0 0 12px rgba(255,106,26,.65))}
.grande .chama{width:48px;height:48px}.grande h1{font-size:23px;line-height:28px}
#painel{display:flex;flex-wrap:wrap;min-height:100vh}
aside{flex:0 0 250px;display:flex;flex-direction:column;gap:26px;padding:22px 16px;border-right:1px solid var(--linha);position:sticky;top:0;height:100vh}
nav{display:flex;flex-direction:column;gap:4px;flex:1}
nav button{display:flex;align-items:center;gap:11px;min-height:46px;padding:0 13px;border:1px solid transparent;border-radius:12px;background:none;color:var(--fraco);font:400 13.5px Sora,sans-serif;cursor:pointer;transition:all .2s;text-align:left}
nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
nav button:hover{color:#fff;background:rgba(255,255,255,.05)}
nav button[aria-pressed=true]{color:#ffd9ba;background:rgba(255,106,26,.13);border-color:rgba(255,138,61,.42);box-shadow:0 0 26px -8px rgba(255,106,26,.75)}
main{flex:999 1 620px;min-width:0;max-width:1240px;margin:0 auto;padding:22px;display:flex;flex-direction:column;gap:18px}
.metricas{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.metrica{padding:15px 17px;animation:entra .5s both}.metrica:nth-child(2){animation-delay:.05s}.metrica:nth-child(3){animation-delay:.1s}.metrica:nth-child(4){animation-delay:.15s}.metrica:nth-child(5){animation-delay:.2s}
.metrica span{display:block;font:400 10px/15px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--fraco)}
.metrica b{display:block;margin-top:5px;font:300 25px/32px Sora,sans-serif}
.metrica em{font-style:normal;font-size:12.5px;color:var(--fraco)}
.ligado{color:var(--ok)}.ligado::before{content:"";display:inline-block;width:9px;height:9px;margin:0 9px 3px 0;border-radius:50%;background:var(--ok);animation:pulsa 2s infinite}
.bloco{padding:24px;animation:entra .4s both}
.titulo{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-start;margin-bottom:20px}
.titulo p{margin:4px 0 0;color:var(--fraco);max-width:640px}
.colunas{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-start}
.campos{flex:999 1 400px;min-width:0;display:flex;flex-direction:column;gap:16px}
.dois{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;align-items:end;margin-bottom:20px}.largo{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--fraco)}
input,select,textarea{min-height:46px;padding:10px 13px;border:1px solid var(--linha);border-radius:11px;background:var(--campo);color:var(--texto);font:300 14px Sora,sans-serif;transition:border-color .2s,box-shadow .2s;color-scheme:dark}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brasa);box-shadow:0 0 0 3px rgba(255,106,26,.2)}
small{font-size:12px}
fieldset{margin:0;padding:0;border:0}legend{padding:0;margin-bottom:7px;font-size:12.5px;color:var(--fraco)}
#dias{display:flex;flex-wrap:wrap;gap:8px}
#dias label{cursor:pointer}#dias input{position:absolute;opacity:0}
#dias span{display:flex;align-items:center;justify-content:center;min-width:54px;min-height:44px;padding:0 12px;border:1px solid var(--linha);border-radius:11px;color:var(--fraco);font-size:13px;transition:all .2s}
#dias input:checked+span{color:#1a0b02;font-weight:500;background:linear-gradient(135deg,#ffb070,#ff6a1a 75%);border-color:transparent}
#dias input:focus-visible+span,.segmento input:focus-visible+span,.chave input:focus-visible+span{outline:2px solid var(--brasa2);outline-offset:2px}
.segmento{display:inline-flex;flex-wrap:wrap;align-self:flex-start;gap:3px}.segmento legend{width:100%}
.segmento label{cursor:pointer}.segmento input{position:absolute;opacity:0}
.segmento span{display:flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid var(--linha);border-radius:11px;color:var(--fraco);font-size:13.5px;transition:all .2s}
.segmento input:checked+span{color:#ffd9ba;background:rgba(255,106,26,.16);border-color:rgba(255,138,61,.6)}
.chave{flex-direction:row;align-items:center;gap:11px;min-height:44px;cursor:pointer;color:var(--texto);font-size:14px}.chave input{position:absolute;opacity:0}.chave strong{font-weight:400}
.chave span{width:52px;height:30px;border-radius:99px;background:rgba(255,255,255,.12);position:relative;transition:all .25s}
.chave span::after{content:"";position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .25s cubic-bezier(.3,1.5,.6,1)}
.chave input:checked+span{background:linear-gradient(135deg,#ffb070,#ff6a1a);box-shadow:0 0 20px -3px rgba(255,106,26,.8)}.chave input:checked+span::after{transform:translateX(22px)}
button{cursor:pointer}
.primario{min-height:48px;padding:0 20px;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:linear-gradient(135deg,#ffb070,#ff6a1a 72%);color:#1a0b02;font:500 14px Sora,sans-serif;box-shadow:0 12px 30px -12px rgba(255,106,26,.85);transition:transform .15s,filter .15s}
.primario:hover{transform:translateY(-1px);filter:brightness(1.06)}.primario:active{transform:none}
.fantasma,.tabela button{min-height:44px;padding:0 14px;border:1px solid var(--linha);border-radius:11px;background:transparent;color:var(--texto);font:400 13px Sora,sans-serif}
.fantasma:hover,.tabela button:hover{border-color:var(--brasa)}
button:focus-visible{outline:2px solid var(--brasa2);outline-offset:2px}
.celular{flex:1 1 270px;max-width:320px;margin:0 auto;padding:9px;border:1px solid var(--linha);border-radius:30px;background:#0b0c11;box-shadow:0 30px 60px -28px #000,0 0 50px -24px rgba(255,106,26,.55)}
.tela{min-height:340px;border-radius:22px;overflow:hidden;background:#0d1418}
.tela header{display:flex;align-items:center;gap:10px;padding:13px 14px;background:#1a2329;font-size:13.5px;font-weight:400}.tela i{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#ffb070,#ff6a1a)}
.bolha{margin:16px 12px;padding:9px 11px;border-radius:12px 12px 12px 3px;background:#202c33;font-size:13.5px;line-height:20px;word-break:break-word;animation:entra .3s both}.bolha time{display:block;text-align:right;font-size:11px;color:var(--fraco)}
.tabela{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font:400 10px/15px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--fraco)}th,td{padding:11px 9px;border-bottom:1px solid var(--linha);vertical-align:middle}
tbody tr{transition:background .15s}tbody tr:hover{background:rgba(255,255,255,.035)}td:last-child{white-space:nowrap;text-align:right}
.vazio{padding:22px 0;text-align:center;color:var(--fraco)}
.erro{margin:0;min-height:23px;color:var(--erro);font-size:13px}
#entrada{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
#f-login{width:380px;max-width:100%;padding:30px;display:flex;flex-direction:column;gap:16px;animation:entra .5s both}
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);padding:11px 18px;display:none;max-width:calc(100vw - 24px);z-index:9}
@media (max-width:860px){aside{flex:1 1 100%;position:static;height:auto;border-right:0;border-bottom:1px solid var(--linha);gap:14px}nav{flex-direction:row;flex-wrap:wrap}nav button{flex:1 1 150px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
