/* Base: tema, barra superior, botões, login. Visual herdado do cronograma legado. */
:root{
  --bg:#0d0f14;--surface:#14171f;--surface2:#1c2030;--border:#252a38;
  --accent:#00d4ff;--accent2:#7b61ff;--green:#22c77a;--yellow:#f5c842;
  --orange:#ff8c42;--text:#e8ecf4;--muted:#6b7591;--red:#ff5470;
  --mono:'Poppins',sans-serif;--sans:'Poppins',sans-serif;
}
body.theme-light{
  --bg:#f7f8fb;--surface:#ffffff;--surface2:#eef0f5;--border:#dde1ea;
  --accent:#0891b2;--accent2:#6d28d9;--green:#16a34a;--yellow:#b45309;
  --orange:#c2410c;--text:#1a1f2b;--muted:#64748b;--red:#dc2626;
}
*{margin:0;padding:0;box-sizing:border-box;}
[hidden]{display:none!important;}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;height:100vh;overflow:hidden;}
.app{height:100vh;display:flex;flex-direction:column;}
.view{flex:1;min-height:0;display:flex;flex-direction:column;}

/* TOP BAR */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:9px 18px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;gap:12px;}
.logo{width:28px;height:28px;background:linear-gradient(135deg,var(--accent),var(--accent2));border-radius:6px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:600;font-size:10px;color:#000;margin-right:10px;flex-shrink:0;}
/* marca: duas versões do logo; o tema escolhe (o preto do logo some no fundo escuro) */
.marca{display:block;width:auto;flex-shrink:0;}
.marca-clara{display:none;}
body.theme-light .marca-clara{display:block;}
body.theme-light .marca-escura{display:none;}
.marca-topo{height:24px;margin-right:12px;padding-right:12px;border-right:1px solid var(--border);box-sizing:content-box;}
.marca-login{height:46px;margin:0 auto 14px;}
.t-title h1{font-size:13px;font-weight:600;}
.t-title p{font-size:9px;color:var(--muted);font-family:var(--mono);margin-top:1px;}
.tl{display:flex;align-items:center;}
.tr{display:flex;gap:6px;align-items:center;flex-shrink:0;}
.user{font-family:var(--mono);font-size:10.5px;color:var(--muted);padding:0 4px;white-space:nowrap;}
.user b{color:var(--text);font-weight:500;}

.btn{padding:6px 13px;border-radius:6px;font-family:var(--mono);font-size:11.5px;cursor:pointer;border:1px solid var(--border);background:var(--surface2);color:var(--muted);transition:all .15s;white-space:nowrap;}
.btn:hover,.btn.on{color:var(--text);border-color:var(--accent);}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.undo-btn{opacity:.4;}.undo-btn.active{opacity:1;}


/* FORMULÁRIOS */
.field{margin-bottom:12px;}
.field label{display:block;font-family:var(--mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px;}
.field input,.field select{width:100%;padding:9px 11px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:var(--sans);font-size:13.5px;}
.field input:focus,.field select:focus{outline:none;border-color:var(--accent);}
.modal-btn{padding:9px 18px;border-radius:6px;font-size:12.5px;cursor:pointer;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-family:var(--mono);}
.modal-btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#000;border-color:transparent;font-weight:600;}
.modal-btn:hover{opacity:.87;}
.modal-btn:disabled{opacity:.5;cursor:wait;}

/* LOGIN */
.login{height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;}
.login-box{width:360px;max-width:100%;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.4);}
.login-head{text-align:center;margin-bottom:22px;}
.login-head h1{font-size:15px;font-weight:600;}
.login-head p{font-size:11px;color:var(--muted);margin-top:2px;}
.login-box .modal-btn{width:100%;margin-top:6px;}
.login-erro{background:rgba(255,84,112,.12);border:1px solid var(--red);color:var(--red);border-radius:6px;padding:8px 10px;font-size:12px;margin-bottom:10px;}

.aviso{background:rgba(245,200,66,.12);border-bottom:1px solid var(--yellow);color:var(--yellow);padding:8px 18px;font-size:12px;flex-shrink:0;}
.carregando{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg);color:var(--muted);font-family:var(--mono);font-size:12px;z-index:3000;}

#errbox{display:none;position:fixed;bottom:0;left:0;right:0;max-height:28vh;overflow:auto;background:#3a0d14;color:#ffb3c0;font:11px/1.5 monospace;padding:9px 14px;z-index:99999;border-top:2px solid var(--red);white-space:pre-wrap;}

::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--muted);}

/* ── Navegação principal: barra fina à esquerda (ícone + nome) ───────────── */
.corpo{flex:1;min-height:0;display:flex;}
.area{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;}
.rail{width:80px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 0 12px;background:var(--surface);border-right:1px solid var(--border);}
.rail button{position:relative;width:76px;white-space:nowrap;display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 2px 8px;border:none;border-radius:10px;background:none;color:var(--muted);font-family:var(--sans);font-size:9.5px;font-weight:500;letter-spacing:-.01em;cursor:pointer;transition:background .15s,color .15s;}
.rail button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.rail button:hover{color:var(--text);background:var(--surface2);}
.rail button.on{color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,transparent);}
.rail button.on::before{content:'';position:absolute;left:-3px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--accent);}
.rail-fim{flex:1;}

/* aviso de início: visível desde o 1º instante (nunca tela preta e muda) */
.inicio{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg);z-index:4000;padding:20px;}
.ini-caixa{max-width:420px;text-align:center;color:var(--muted);font-size:13px;line-height:1.6;}
.ini-acoes{display:flex;gap:8px;justify-content:center;margin-top:14px;}

/* módulos futuros (tela "em breve") */
.embreve{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg);}
.eb-caixa{max-width:440px;text-align:center;}
.eb-tag{display:inline-block;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);border:1px solid var(--accent);border-radius:10px;padding:2px 10px;margin-bottom:12px;}
.eb-caixa h2{font-size:20px;font-weight:600;margin-bottom:8px;}
.eb-caixa p{font-size:13px;color:var(--muted);line-height:1.6;}