:root{
  --bg: #12161c;
  --panel: #1a2028;
  --panel-2: #202834;
  --border: #2b3542;
  --border-soft: #232b36;
  --text: #e9edf2;
  --muted: #8b98a8;
  --muted-2: #62707f;
  --yellow: #f5b400;
  --yellow-dim: #6b5417;
  --green: #35d68f;
  --green-dim: #123626;
  --blue: #4fa8f7;
  --blue-dim: #14293b;
  --orange: #ff9b45;
  --orange-dim: #3a2513;
  --red: #ef5a5a;
  --red-dim: #3a1414;
  --radius: 10px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:
    radial-gradient(1200px 500px at 15% -10%, #1c2430 0%, transparent 60%),
    var(--bg);
  color:var(--text);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  padding-bottom:60px;
}
.wrap{max-width:1320px;margin:0 auto;padding:0 20px;}
a{color:inherit;}

/* ===== LOGIN ===== */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;}
.login-card{
  width:100%;max-width:400px;background:var(--panel);border:1px solid var(--border);
  border-radius:14px;padding:32px 30px;box-shadow:0 20px 60px rgba(0,0,0,.4);
}
.login-plate{margin-bottom:22px;}
.login-sub{color:var(--muted);font-size:13.5px;margin:6px 0 0;line-height:1.5;}
.login-error{
  background:var(--red-dim);border:1px solid #5a2323;color:#ff9b9b;font-size:13px;
  padding:10px 14px;border-radius:8px;margin-bottom:16px;
}
.login-form{display:flex;flex-direction:column;gap:14px;}
.login-form label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--muted);}
.login-form input{
  background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);
  padding:11px 13px;font-size:14px;font-family:'Inter',sans-serif;outline:none;
}
.login-form input:focus{border-color:var(--yellow);}
.btn.full{width:100%;justify-content:center;margin-top:6px;}
.login-foot{margin-top:22px;text-align:center;font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--muted-2);letter-spacing:.04em;}

/* ===== HEADER / BOARD PLATE ===== */
header.board{
  border-bottom:1px solid var(--border);
  background:
    repeating-linear-gradient(135deg, rgba(245,180,0,0.035) 0 14px, transparent 14px 28px),
    linear-gradient(180deg,#161c24,#12161c);
  padding:22px 0 22px;
}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0 0;flex-wrap:wrap;}
.user-chip{
  display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted);
  background:var(--panel);border:1px solid var(--border);border-radius:20px;padding:6px 8px 6px 14px;
}
.user-chip b{color:var(--text);font-weight:600;}
.user-chip .role{
  font-family:'IBM Plex Mono',monospace;font-size:10px;text-transform:uppercase;color:var(--yellow);
  background:#211a08;border:1px solid var(--yellow-dim);border-radius:12px;padding:2px 8px;
}
.user-chip a{
  color:var(--muted);text-decoration:none;font-size:12px;border-left:1px solid var(--border);
  padding-left:10px;margin-left:2px;
}
.user-chip a:hover{color:var(--red);}

.board-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:18px;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;letter-spacing:.14em;color:var(--yellow);
  text-transform:uppercase;display:flex;align-items:center;gap:8px;margin-bottom:6px;
}
.eyebrow::before{content:"";width:7px;height:7px;background:var(--yellow);display:inline-block;transform:rotate(45deg);}
h1{
  font-family:'Barlow Condensed',sans-serif;
  font-weight:800;font-size:42px;line-height:1;letter-spacing:.01em;
  margin:0 0 8px;text-transform:uppercase;
}
h1 span{color:var(--yellow);}
.sub{color:var(--muted);font-size:14.5px;max-width:560px;line-height:1.5;}
.plate{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;color:var(--muted);
  background:var(--panel);border:1px solid var(--border);border-radius:8px;
  padding:10px 16px;min-width:210px;
}
.plate b{display:block;color:var(--text);font-size:13.5px;letter-spacing:.03em;margin-top:2px;}
.plate .row{display:flex;justify-content:space-between;gap:14px;padding:3px 0;border-bottom:1px dashed var(--border-soft);}
.plate .row:last-child{border-bottom:none;}

/* ===== STATS ===== */
.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:22px 0 0;}
.stat{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;position:relative;overflow:hidden;}
.stat .n{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:30px;line-height:1;}
.stat .l{font-size:11.5px;color:var(--muted);margin-top:6px;text-transform:uppercase;letter-spacing:.06em;}
.stat.accent{border-color:#3a2f10;background:linear-gradient(180deg,#211a08,var(--panel));}
.stat.accent .n{color:var(--yellow);}
.stat .n.green{color:var(--green);}
.stat .n.blue{color:var(--blue);}
.stat .n.orange{color:var(--orange);}

/* ===== CONTROLS ===== */
.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:22px 0 16px;padding:14px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);}
.search-box{flex:1 1 260px;display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:9px 12px;}
.search-box svg{flex:none;opacity:.5;}
.search-box input{background:transparent;border:none;outline:none;color:var(--text);font-size:14px;width:100%;font-family:'Inter',sans-serif;}
.search-box input::placeholder{color:var(--muted-2);}
select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:9px 12px;font-size:13.5px;font-family:'Inter',sans-serif;outline:none;cursor:pointer;}
select:hover{border-color:var(--muted-2);}
.btn{background:var(--bg);color:var(--muted);border:1px solid var(--border);border-radius:8px;padding:9px 14px;font-size:13px;cursor:pointer;font-family:'Inter',sans-serif;font-weight:500;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.btn:hover{color:var(--text);border-color:var(--muted-2);}
.btn.primary{background:var(--yellow);color:#1c1503;border-color:var(--yellow);font-weight:600;}
.btn.primary:hover{background:#ffc633;}
.btn.danger{color:var(--red);border-color:#4a2323;}
.btn.danger:hover{background:var(--red-dim);border-color:var(--red);}
.btn.active{color:var(--yellow);border-color:var(--yellow-dim);background:#211a08;}
.btn:disabled{opacity:.4;cursor:not-allowed;}
.view-toggle{display:flex;gap:2px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:2px;}
.view-toggle .btn{border:none;background:transparent;padding:7px 12px;}
.view-toggle .btn.active{background:var(--panel-2);color:var(--yellow);}

.result-line{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px;color:var(--muted);font-size:13px;flex-wrap:wrap;gap:8px;}
.result-line b{color:var(--text);}

/* ===== GROUP VIEW ===== */
.group{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;overflow:hidden;}
.group-head{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;cursor:pointer;user-select:none;}
.group-head:hover{background:var(--panel-2);}
.group-title{display:flex;align-items:center;gap:10px;min-width:0;}
.group-title .chev{transition:transform .15s ease;color:var(--muted-2);flex:none;}
.group.open .chev{transform:rotate(90deg);}
.group-title .name{font-weight:600;font-size:14.5px;letter-spacing:.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.group-title .tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--yellow);border:1px solid var(--yellow-dim);background:#201a08;padding:2px 7px;border-radius:20px;flex:none;}
.group-count{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--muted);flex:none;padding-left:10px;}
.group-body{display:none;border-top:1px solid var(--border-soft);}
.group.open .group-body{display:block;}

table{width:100%;border-collapse:collapse;}
thead th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-2);padding:9px 16px;font-weight:600;border-bottom:1px solid var(--border-soft);background:#161b22;}
tbody td{padding:10px 16px;font-size:13.5px;border-bottom:1px solid var(--border-soft);vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:#1e2530;}
.re{font-family:'IBM Plex Mono',monospace;color:var(--muted);font-size:12.5px;}
.nome{font-weight:500;}
.nome .flag{color:var(--yellow);margin-left:6px;font-size:11px;}
.funcao{font-size:12.5px;color:var(--muted);}
.funcao.enc{color:var(--yellow);font-weight:500;}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:20px;letter-spacing:.02em;white-space:nowrap;}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;}
.badge.ativo{color:var(--green);background:var(--green-dim);}
.badge.ativo::before{background:var(--green);}
.badge.afastado{color:var(--blue);background:var(--blue-dim);}
.badge.afastado::before{background:var(--blue);}
.badge.ferias{color:var(--orange);background:var(--orange-dim);}
.badge.ferias::before{background:var(--orange);}
.badge.indef{color:var(--muted);background:#232b36;}
.badge.indef::before{background:var(--muted-2);}

.row-actions{display:flex;gap:6px;justify-content:flex-end;}
.icon-btn{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:6px;padding:5px 7px;cursor:pointer;display:inline-flex;}
.icon-btn:hover{color:var(--text);border-color:var(--muted-2);}
.icon-btn.danger:hover{color:var(--red);border-color:#4a2323;background:var(--red-dim);}

.empty{padding:40px 20px;text-align:center;color:var(--muted);font-size:14px;}
.loading{padding:40px 20px;text-align:center;color:var(--muted-2);font-size:13px;font-family:'IBM Plex Mono',monospace;}

footer{margin-top:30px;padding-top:16px;border-top:1px solid var(--border-soft);color:var(--muted-2);font-size:11.5px;font-family:'IBM Plex Mono',monospace;text-align:center;}

/* ===== MODAL ===== */
.modal-overlay{
  position:fixed;inset:0;background:rgba(8,10,14,.65);backdrop-filter:blur(2px);
  display:none;align-items:center;justify-content:center;z-index:100;padding:20px;
}
.modal-overlay.open{display:flex;}
.modal{
  background:var(--panel);border:1px solid var(--border);border-radius:14px;width:100%;max-width:480px;
  max-height:90vh;overflow-y:auto;box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border-soft);}
.modal-head h3{margin:0;font-family:'Barlow Condensed',sans-serif;font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.01em;}
.modal-close{background:none;border:none;color:var(--muted);font-size:20px;cursor:pointer;line-height:1;padding:4px;}
.modal-close:hover{color:var(--text);}
.modal-body{padding:20px 22px;}
.modal-foot{padding:16px 22px;border-top:1px solid var(--border-soft);display:flex;justify-content:flex-end;gap:10px;}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.field label{font-size:12px;color:var(--muted);}
.field input, .field select, .field textarea{
  background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);
  padding:10px 12px;font-size:14px;font-family:'Inter',sans-serif;outline:none;width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--yellow);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.field-check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);}
.form-error{background:var(--red-dim);border:1px solid #5a2323;color:#ff9b9b;font-size:13px;padding:9px 12px;border-radius:8px;margin-bottom:14px;display:none;}
.form-error.show{display:block;}

.toast-stack{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:200;}
.toast{background:var(--panel);border:1px solid var(--border);border-left:3px solid var(--green);border-radius:8px;padding:12px 16px;font-size:13.5px;box-shadow:0 10px 30px rgba(0,0,0,.4);min-width:240px;animation:slidein .2s ease;}
.toast.error{border-left-color:var(--red);}
@keyframes slidein{from{transform:translateX(20px);opacity:0;}to{transform:translateX(0);opacity:1;}}

.log-list{display:flex;flex-direction:column;gap:8px;}
.log-item{font-size:12.5px;color:var(--muted);border-bottom:1px dashed var(--border-soft);padding-bottom:8px;}
.log-item b{color:var(--text);}
.log-item .when{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--muted-2);}

@media (max-width:900px){
  .stats{grid-template-columns:repeat(3,1fr);}
  h1{font-size:32px;}
  .board-top{flex-direction:column;}
  .plate{width:100%;}
  .field-row{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .stats{grid-template-columns:repeat(2,1fr);}
  thead{display:none;}
  tbody td{display:block;padding:4px 16px;border-bottom:none;}
  tbody tr{display:block;padding:10px 0;border-bottom:1px solid var(--border-soft);}
  tbody td.re::before{content:"RE ";color:var(--muted-2);}
  .controls{flex-direction:column;align-items:stretch;}
  .view-toggle{align-self:flex-start;}
  .row-actions{justify-content:flex-start;margin-top:6px;}
  .topbar{flex-direction:column;align-items:flex-start;}
}