/* velocidade-de-trabalho.css -- página /velocidade-de-trabalho. Tom âmbar de "oficina" sobre os tokens do codex. */
.vt{ --vt-cor:#e0a64a; }

.vt-painel{
  margin-bottom:1.5rem; padding:1.25rem; border-radius:18px; border:1px solid var(--hairline);
  background: linear-gradient(160deg, var(--panel) 0%, var(--panel-2) 100%); box-shadow: 0 10px 30px rgba(0,0,0,.3);
}
.vt-painel-topo{ margin-bottom:1rem; }
.vt-painel-topo h2{ display:flex; align-items:center; gap:.6rem; margin:0; font-size:1.05rem; font-weight:700; color: var(--text-bright); text-wrap:balance; }
.vt-painel-topo h2 i{ color: var(--vt-cor); }
.vt-painel-topo p{ margin:.4rem 0 0; font-size:.85rem; color: var(--text-dim); max-width:75ch; }
.vt-nota{ margin:.85rem 0 0; font-size:.78rem; color: var(--text-dim); }
.vt-nota code, .montador-notas code{ font-family: var(--font-mono); font-size:.92em; color: var(--text); }

/* Calculadora */
.vt-calc{ border-color: color-mix(in srgb, var(--vt-cor) 35%, var(--hairline)); background:
  radial-gradient(110% 80% at 0% 0%, color-mix(in srgb, var(--vt-cor) 12%, transparent), transparent 60%),
  linear-gradient(160deg, var(--panel) 0%, var(--panel-2) 100%); }
.vt-calc-campos{ display:grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap:.9rem; margin-bottom:1.1rem; }
.vt-calc-campos label{ display:flex; flex-direction:column; gap:.35rem; min-width:0; }
.vt-calc-campos span{ font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: var(--text-dim); }
.vt-calc-campos input:focus-visible, .vt-calc-campos select:focus-visible{ outline:2px solid var(--vt-cor); outline-offset:1px; }
.vt-calc-resultado{ display:grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; }
.vt-res-num{ display:flex; flex-direction:column; padding:.7rem .9rem; border-radius:12px; background: rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.05); }
.vt-res-num:first-child{ border-color: color-mix(in srgb, var(--vt-cor) 45%, transparent); }
.vt-res-num b{ font-size:1.5rem; font-weight:800; color: var(--text-bright); font-variant-numeric: tabular-nums; line-height:1.15; }
.vt-res-num:first-child b{ color: var(--vt-cor); }
.vt-res-num small{ font-size:.75rem; color: var(--text-dim); }
.vt-res-nota{ grid-column: 1 / -1; margin:0; font-size:.75rem; color: var(--text-dim); }

/* Tabelas */
.vt-tabela-wrap{ overflow-x:auto; }
.vt-tabela{ width:100%; border-collapse:separate; border-spacing:0; min-width:720px; font-size:.85rem; }
.vt-tabela th, .vt-tabela td{ padding:.5rem .6rem; border-bottom:1px solid var(--hairline); text-align:right; font-variant-numeric: tabular-nums; }
.vt-tabela thead th{ font-size:.68rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: var(--text-dim); }
.vt-tabela tbody th, .vt-tabela thead th:first-child{ text-align:left; }
.vt-tabela tbody th{ font-weight:600; color: var(--text-bright); position:sticky; left:0; background: var(--panel); }
.vt-tabela td{ color: var(--text); }
.vt-tabela td.is-max{ color: var(--vt-cor); font-weight:700; }
.vt-tabela tr.is-outra td{ color: var(--text-dim); font-style:italic; }
.vt-tabela tbody tr:last-child > *{ border-bottom:0; }
.vt-tabela tbody tr:hover > *{ background: rgba(255,255,255,.02); }
.vt-ritmos{ min-width:560px; }
.vt-ritmos td.is-ruim{ color:#ef6b6b; font-weight:600; }
.vt-ritmos td.is-bom{ color:#4cc38a; font-weight:600; }
.vt-apt{ display:inline-flex; align-items:center; gap:.5rem; }
.vt-apt img{ width:24px; height:24px; flex-shrink:0; }
.vt-notas{ margin:.9rem 0 0; padding-left:1.1rem; display:flex; flex-direction:column; gap:.3rem; font-size:.8rem; color: var(--text-dim); }
.vt-notas b{ color: var(--text); }

/* SAN */
.vt-san{ display:flex; flex-direction:column; gap:.45rem; }
.vt-san-item{ border:1px solid var(--hairline); border-radius:12px; background: var(--panel-2); }
.vt-san-item[open]{ border-color: color-mix(in srgb, var(--vt-cor) 40%, var(--hairline)); }
.vt-san-item summary{
  display:grid; grid-template-columns: minmax(170px, 1.2fr) repeat(3, minmax(0, 1fr)); gap:.75rem; align-items:center;
  padding:.6rem .85rem; cursor:pointer; list-style:none;
}
.vt-san-item summary::-webkit-details-marker{ display:none; }
.vt-san-item summary:focus-visible{ outline:2px solid var(--vt-cor); outline-offset:2px; border-radius:12px; }
.vt-san-item .vt-apt{ font-weight:600; color: var(--text-bright); }
.vt-san-num{ display:flex; flex-direction:column; min-width:0; }
.vt-san-num b{ color: var(--text-bright); font-variant-numeric: tabular-nums; }
.vt-san-num small{ font-size:.7rem; color: var(--text-dim); }
.vt-san-estruturas{ display:grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap:.4rem; padding:0 .85rem .85rem; }
.vt-san-estruturas a{
  display:flex; align-items:center; gap:.5rem; padding:.35rem .5rem; border-radius:9px; text-decoration:none;
  color: var(--text); background: rgba(0,0,0,.2); border:1px solid transparent;
}
.vt-san-estruturas a:hover, .vt-san-estruturas a:focus-visible{ border-color: color-mix(in srgb, var(--vt-cor) 50%, transparent); color: var(--text-bright); }
.vt-san-estruturas img{ width:28px; height:28px; object-fit:contain; flex-shrink:0; }
.vt-san-estruturas span{ flex:1; min-width:0; font-size:.82rem; overflow-wrap:anywhere; }
.vt-san-estruturas b{ font-size:.82rem; font-variant-numeric: tabular-nums; color: var(--vt-cor); }

.vt-regras{ margin:0; padding-left:1.1rem; display:flex; flex-direction:column; gap:.45rem; font-size:.88rem; color: var(--text); }
.vt-regras b{ color: var(--text-bright); }

@media (max-width:640px){
  .vt-san-item summary{ grid-template-columns: 1fr 1fr; }
  .vt-san-item .vt-apt{ grid-column: 1 / -1; }
}