:root, [data-tema="escuro"]{
  color-scheme: dark;
  --bg:#14161a;
  --surface:#1b1e24;
  --surface-2:#22262d;
  --line:#2b2f37;
  --text:#f3f1ec;
  --text-dim:#8b909a;
  --text-faint:#5c6169;
  --red:#e63946;
  --red-dim:#ff8a93;
  --red-bg:rgba(230,57,70,.14);
  --perigo:#e63946;
  --perigo-dim:#ff8a93;
  --perigo-bg:rgba(230,57,70,.14);
  --amber:#ffb627;
  --amber-bg:rgba(255,182,39,.14);
  --green:#49c97d;
  --green-bg:rgba(73,201,125,.14);
  --font-display:'Rajdhani',sans-serif;
  --font-body:'IBM Plex Sans',sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
}
[data-tema="claro"]{
  color-scheme: light;
  --bg:#fafafa;
  --surface:#ffffff;
  --surface-2:#f2f2f2;
  --line:#e4e4e4;
  --text:#171717;
  --text-dim:#61636a;
  --text-faint:#9a9ca3;
  --red:#d62839;
  --red-dim:#b81f2e;
  --red-bg:#fdecee;
  --perigo:#d62839;
  --perigo-dim:#b81f2e;
  --perigo-bg:#fdecee;
  --amber:#b6720a;
  --amber-bg:#fdf3e2;
  --green:#1a9c62;
  --green-bg:#e7f7f0;
}
/* Nord (nordtheme.com) modo escuro oficial — fundo "polar night", texto
   "snow storm", acento "frost" (azul-esverdeado) em vez de vermelho, e as
   cores "aurora" completas pros estados de sucesso/aviso/perigo. */
[data-tema="classico"]{
  color-scheme: dark;
  --bg:#2e3440;
  --surface:#3b4252;
  --surface-2:#434c5e;
  --line:#4c566a;
  --text:#eceff4;
  --text-dim:#d8dee9;
  --text-faint:#8b95a8;
  --red:#5e81ac;
  --red-dim:#6d93b0;
  --red-bg:rgba(94,129,172,.16);
  --perigo:#bf616a;
  --perigo-dim:#d18892;
  --perigo-bg:rgba(191,97,106,.18);
  --amber:#ebcb8b;
  --amber-bg:rgba(235,203,139,.16);
  --green:#a3be8c;
  --green-bg:rgba(163,190,140,.16);
}
*{box-sizing:border-box;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font-body);-webkit-font-smoothing:antialiased;
}
a{color:inherit;}
.kerb{height:6px;background:repeating-linear-gradient(115deg,var(--red) 0 18px,var(--text) 18px 36px);opacity:.9;}
.kerb.thin{height:3px;opacity:.6;}

.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;border-bottom:1px solid var(--line);background:var(--surface);
}
.brand{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:.06em;display:flex;align-items:center;gap:10px;}
.brand .dot{width:9px;height:9px;background:var(--red);border-radius:1px;transform:rotate(45deg);}
.nav{display:flex;gap:4px;align-items:center;}
.tema-switch{display:flex;gap:4px;background:var(--surface-2);border:1px solid var(--line);border-radius:7px;padding:3px;margin:0 6px;}
.tema-switch button{
  border:none;background:none;padding:5px 11px;border-radius:5px;cursor:pointer;
  font-family:var(--font-display);font-weight:600;font-size:11.5px;color:var(--text-dim);
}
.tema-switch button.ativo{background:var(--red);color:#fff;}
.nav a{
  font-family:var(--font-display);font-weight:600;letter-spacing:.03em;font-size:14px;
  padding:8px 16px;border-radius:6px;color:var(--text-dim);text-decoration:none;
}
.nav a.active, .nav a:hover{background:var(--surface-2);color:var(--text);}
.nav .sair{color:var(--red);}

.wrap{max-width:1080px;margin:0 auto;padding:28px 20px 60px;}

.tabs{display:flex;gap:4px;background:var(--surface-2);padding:4px;border-radius:8px;margin-bottom:20px;flex-wrap:wrap;}
.tab{
  font-family:var(--font-display);font-weight:600;letter-spacing:.03em;font-size:13.5px;
  padding:8px 14px;border-radius:6px;cursor:pointer;color:var(--text-dim);border:none;background:none;
}
.tab.active{background:var(--red);color:#fff;}
.painel-secao{display:none;}
.painel-secao.active{display:block;}

.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;margin-bottom:24px;overflow:hidden;}
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:10px;}
.panel-head h2{font-family:var(--font-display);font-weight:600;font-size:17px;margin:0;letter-spacing:.02em;}
.panel-head .hint{font-size:12px;color:var(--text-faint);}
.panel-body{padding:20px 22px;}

.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:20px 0 28px;}
.stat-card{background:var(--surface);padding:18px 20px;}
.stat-card .val{font-family:var(--font-mono);font-weight:700;font-size:32px;line-height:1;color:var(--text);}
.stat-card .val span{font-size:15px;color:var(--text-faint);font-weight:400;}
.stat-card .lbl{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-top:8px;}
.stat-card.accent .val{color:var(--amber);}

table{width:100%;border-collapse:collapse;font-size:13.5px;}
th{text-align:left;font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.07em;font-weight:600;padding:0 10px 10px;}
td{padding:10px;border-top:1px solid var(--line);color:var(--text);}
tr:hover td{background:var(--surface-2);}
.mono{font-family:var(--font-mono);}
.time{font-family:var(--font-mono);font-weight:600;}
.time.best{color:var(--amber);}
.pos{font-family:var(--font-mono);color:var(--text-faint);width:22px;display:inline-block;}
.pos.p1{color:var(--amber);}

.big-time{font-family:var(--font-mono);font-weight:700;font-size:56px;color:var(--amber);letter-spacing:-.01em;line-height:1;}
.big-time small{font-size:22px;color:var(--text-faint);font-weight:500;}

form.inline{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:18px;}
form.inline label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--text-dim);}
input, select, textarea{
  background:var(--surface-2);border:1px solid var(--line);color:var(--text);
  padding:9px 11px;border-radius:6px;font-family:var(--font-body);font-size:13.5px;
}
input:focus, select:focus, textarea:focus{outline:1px solid var(--red);}
button, .btn{
  font-family:var(--font-display);font-weight:600;letter-spacing:.02em;font-size:13.5px;
  background:var(--red);color:#fff;border:none;padding:10px 18px;border-radius:6px;cursor:pointer;
}
button.secundario{background:var(--surface-2);color:var(--text);border:1px solid var(--line);}
button.pequeno{padding:6px 12px;font-size:12px;}
button:disabled{opacity:.5;cursor:not-allowed;}

.msg{padding:10px 14px;border-radius:6px;font-size:13px;margin-bottom:14px;}
.msg.erro{background:var(--perigo-bg);color:var(--perigo-dim);border:1px solid var(--perigo-bg);}
.msg.ok{background:var(--green-bg);color:var(--green);border:1px solid var(--green-bg);}

.legend{display:flex;gap:18px;margin-top:14px;font-size:12px;color:var(--text-dim);}
.legend span{display:inline-flex;align-items:center;gap:6px;}
.legend i{width:10px;height:10px;border-radius:2px;display:inline-block;}

.status-pill{font-family:var(--font-display);font-weight:600;font-size:12px;padding:4px 10px;border-radius:20px;letter-spacing:.02em;}
.status-pill.pendente{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-bg);}
.status-pill.aprovado{background:var(--green-bg);color:var(--green);border:1px solid var(--green-bg);}
.status-pill.rejeitado{background:var(--perigo-bg);color:var(--perigo-dim);border:1px solid var(--perigo-bg);}

.login-box{max-width:380px;margin:60px auto;}
.login-tabs{display:flex;gap:4px;background:var(--surface-2);padding:4px;border-radius:8px;margin-bottom:20px;}
.login-form{display:none;flex-direction:column;gap:12px;}
.login-form.active{display:flex;}
.login-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--text-dim);}

@media (max-width:720px){
  .stat-row{grid-template-columns:repeat(2,1fr);}
  .topbar{flex-direction:column;gap:12px;align-items:flex-start;}
  .nav{flex-wrap:wrap;row-gap:8px;}
  .panel-body{padding:16px;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .panel-body table{min-width:520px;}
  .panel-head{flex-wrap:wrap;gap:8px;}
  h1{font-size:20px !important;}
  .wrap{padding-left:14px;padding-right:14px;}
}
