:root{
  --ink:#141821; --ink-2:#5A6376; --ink-3:#858DA0;
  --bg:#F4F5F8; --surface:#FFFFFF; --surface-2:#FAFBFC;
  --line:#DDE1E9; --line-2:#EDEFF4;
  --accent:#2C3E63; --accent-2:#4A5F8C; --accent-soft:#EBEEF5;
  --ok:#1A6B4F; --ok-soft:#E6F1EC;
  --no:#9E2B22; --no-soft:#F7E9E7;
  --wait:#8A5A12; --wait-soft:#F7EFE1;
  --mute-soft:#EEF0F4; --ok-bar:#BBDDCB; --bar-soft:#CFD9EC;
  --shadow:0 1px 2px rgba(20,24,33,.05), 0 8px 24px -16px rgba(20,24,33,.25);
  --r:10px;
  --sans:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#E8EAF0; --ink-2:#A7AEBF; --ink-3:#7C8497;
    --bg:#111319; --surface:#181B23; --surface-2:#1D212A;
    --line:#2A2F3B; --line-2:#232833;
    --accent:#93A8D6; --accent-2:#B4C3E5; --accent-soft:#1F2637;
    --ok:#5FBF98; --ok-soft:#16281F;
    --no:#E58A80; --no-soft:#2C1A18;
    --wait:#D4A65A; --wait-soft:#2A2115;
    --mute-soft:#20242E; --ok-bar:#255140; --bar-soft:#2E3852;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.8);
  }
}
:root[data-theme="dark"]{
  --ink:#E8EAF0; --ink-2:#A7AEBF; --ink-3:#7C8497;
  --bg:#111319; --surface:#181B23; --surface-2:#1D212A;
  --line:#2A2F3B; --line-2:#232833;
  --accent:#93A8D6; --accent-2:#B4C3E5; --accent-soft:#1F2637;
  --ok:#5FBF98; --ok-soft:#16281F;
  --no:#E58A80; --no-soft:#2C1A18;
  --wait:#D4A65A; --wait-soft:#2A2115;
  --mute-soft:#20242E; --ok-bar:#255140; --bar-soft:#2E3852;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.8);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--serif); font-weight:600; margin:0; text-wrap:balance; letter-spacing:-.01em}
p{margin:0 0 .7em}
a{color:var(--accent); text-underline-offset:2px}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}
.eyebrow{font-size:10.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); font-weight:600}

/* ---------- shell ---------- */
.topbar{
  position:sticky; top:0; z-index:40; background:var(--surface);
  border-bottom:1px solid var(--line); display:flex; align-items:center; gap:18px;
  padding:14px 22px; flex-wrap:wrap;
}
.brand{display:flex; align-items:center; gap:16px; margin-right:auto}
.brandtxt{display:flex; flex-direction:column; gap:3px}
.logo{display:inline-flex; align-items:center; justify-content:center; flex:none;
  min-height:var(--logo-h,72px); min-width:64px;
  max-width:min(calc(var(--logo-h,72px) * 4.2), 38vw);
  border:1px dashed var(--line); border-radius:8px; background:var(--surface-2);
  cursor:pointer; padding:2px 8px}
.logo.temimg{border:0; background:transparent; padding:0; min-width:0; min-height:0}
.logo:hover{border-color:var(--accent)}
.logo img{max-height:var(--logo-h,72px); max-width:min(calc(var(--logo-h,72px) * 4.2), 38vw);
  width:auto; height:auto; object-fit:contain; display:block}
.logoph{font-family:var(--serif); font-size:12px; font-weight:700; letter-spacing:.06em; color:var(--ink-3); line-height:1.15; text-align:center}

/* ---------- toast ---------- */
#toast{position:fixed; bottom:22px; left:50%; transform:translate(-50%,14px); z-index:90;
  background:var(--ink); color:var(--bg); padding:10px 16px; border-radius:9px; font-size:13px; font-weight:500;
  box-shadow:0 12px 34px -12px rgba(0,0,0,.55); opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease}
#toast.on{opacity:1; transform:translate(-50%,0)}
@media (prefers-reduced-motion: reduce){#toast{transition:none}}

/* ---------- resumo / funil ---------- */
.tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(132px,1fr)); gap:1px; background:var(--line-2);
  border:1px solid var(--line-2); border-radius:9px; overflow:hidden}
.tile{background:var(--surface); padding:13px 14px}
.tile .tl{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
.tile .tv{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:25px; font-weight:600; line-height:1.15; margin-top:5px}
.tile .tn{font-size:11.5px; color:var(--ink-3)}
.funil{display:grid; gap:9px; margin-top:18px}
.fstep{display:grid; grid-template-columns:26px minmax(120px,190px) minmax(0,1fr) auto; align-items:center; gap:10px}
.fstep .fn{font-family:var(--mono); font-size:11px; color:var(--ink-3)}
.fstep .fnome{font-size:13px}
.fstep .ftrack{position:relative; height:22px; border-radius:6px; background:var(--mute-soft); overflow:hidden}
.fstep .fbar{position:absolute; inset:0 auto 0 0; background:var(--bar-soft); border-radius:6px}
.fstep .fbar.ok{background:var(--ok-bar)}
.fstep .fval{font-family:var(--mono); font-size:12.5px; color:var(--ink-2); white-space:nowrap}
.proxima{display:flex; gap:10px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--line-2); font-size:13px}
.proxima:last-child{border-bottom:0}
.proxima .pd{font-family:var(--mono); font-size:12.5px; color:var(--ink)}

/* ---------- lista de provas ---------- */
.plinha{display:grid; grid-template-columns:minmax(150px,1.4fr) repeat(2,minmax(180px,1fr)); gap:12px;
  padding:12px 16px; border-bottom:1px solid var(--line-2); align-items:center}
.plinha:last-child{border-bottom:0}
.plinha.pcab{padding-top:10px; padding-bottom:10px; background:var(--surface-2); border-bottom:1px solid var(--line)}
.plinha.pcab div{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
@media(max-width:820px){.plinha.pcab{display:none}}
.plinha .pnome{font-weight:600}
.plinha .pnome small{display:block; font-weight:400; color:var(--ink-3); font-size:11.5px}
.pprova{display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:8px; padding:8px 10px;
  background:var(--surface-2); cursor:pointer; text-align:left; font:inherit; color:var(--ink); width:100%}
.pprova:hover{border-color:var(--accent)}
.pprova[aria-pressed="true"]{border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 3px 0 0 var(--accent)}
.pprova .pl{font-size:12.5px; margin-right:auto}
.pprova .pl small{display:block; color:var(--ink-3); font-size:11px}
.pprova .pn{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:13px; font-weight:600}
@media(max-width:820px){.plinha{grid-template-columns:1fr}}

/* ---------- fechamento ---------- */
.fichafinal .linha{display:grid; grid-template-columns:minmax(140px,190px) minmax(0,1fr); gap:14px; padding:9px 0; border-bottom:1px solid var(--line-2)}
.fichafinal .linha:last-child{border-bottom:0}
.fichafinal .rot{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600; padding-top:3px}
.fichafinal .val{font-size:13.5px}
@media print{
  body.soprint .view:not(#view-fechamento){display:none!important}
  body.soprint nav.rail, body.soprint .topbar .tools, body.soprint #btnImprimir{display:none!important}
}

.brand .firm{font-size:12px; letter-spacing:.17em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
.brand .ttl{font-family:var(--serif); font-size:23px; font-weight:600; line-height:1.2}
.topbar .tools{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.savestate{font-size:11.5px; margin-right:6px; color:var(--ink-3); display:flex; align-items:center; gap:6px}
.dot{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.dot.warn{background:var(--wait)}

.layout{display:grid; grid-template-columns:214px minmax(0,1fr); gap:0; align-items:start}
nav.rail{position:sticky; top:107px; padding:20px 12px 40px; height:calc(100vh - 107px); overflow:auto; border-right:1px solid var(--line)}
nav.rail button{
  display:flex; width:100%; align-items:baseline; gap:9px; text-align:left; background:none; border:0;
  color:var(--ink-2); font:inherit; font-size:13.5px; padding:8px 10px; border-radius:8px; cursor:pointer;
}
nav.rail button .idx{font-family:var(--mono); font-size:10.5px; color:var(--ink-3)}
nav.rail button:hover{background:var(--mute-soft); color:var(--ink)}
nav.rail button[aria-current="true"]{background:var(--accent-soft); color:var(--accent); font-weight:600}
nav.rail button[aria-current="true"] .idx{color:var(--accent)}
nav.rail .railnote{font-size:11.5px; color:var(--ink-3); padding:14px 10px 0; line-height:1.45; border-top:1px solid var(--line-2); margin-top:14px}

main{padding:26px 30px 90px; max-width:1330px}
section.view{display:none}
section.view.active{display:block}
.viewhead{margin-bottom:20px}
.viewhead h2{font-size:23px}
.viewhead p.sub{color:var(--ink-2); margin:5px 0 0; max-width:66ch}

/* ---------- generic pieces ---------- */
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.card + .card{margin-top:16px}
.card > header{padding:13px 16px; border-bottom:1px solid var(--line-2); display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.card > header h3{font-size:15px}
.card > header .spacer{margin-left:auto}
.card .body{padding:16px}
.grid{display:grid; gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1080px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.layout{grid-template-columns:1fr} nav.rail{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);display:flex;gap:6px;overflow-x:auto;padding:10px} nav.rail .railnote{display:none} main{padding:20px 16px 80px} .g2,.g3,.g4{grid-template-columns:1fr}}

.field{display:flex; flex-direction:column; gap:4px}
.field > label{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
input[type=text], input[type=date], input[type=time], input[type=email], input[type=url], textarea, select{
  font:inherit; color:var(--ink); background:var(--surface-2);
  border:1px solid var(--line); border-radius:7px; padding:7px 9px; width:100%;
}
textarea{resize:vertical; min-height:64px; line-height:1.5}
input:hover, textarea:hover, select:hover{border-color:var(--ink-3)}
input::placeholder, textarea::placeholder{color:var(--ink-3)}
select{cursor:pointer; -webkit-appearance:none; appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 15px) calc(50% + 1px), calc(100% - 10px) calc(50% + 1px);
  background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:28px}

.btn{
  font:inherit; font-size:13px; font-weight:500; cursor:pointer;
  background:var(--surface); color:var(--ink); border:1px solid var(--line);
  border-radius:7px; padding:6px 11px; display:inline-flex; align-items:center; gap:6px;
}
.btn:hover{border-color:var(--ink-3); background:var(--surface-2)}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#fff}
:root[data-theme="dark"] .btn.primary, :root:not([data-theme="light"]) .btn.primary{color:#111319}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .btn.primary{color:#fff}}
.btn.primary:hover{background:var(--accent-2); border-color:var(--accent-2)}
.btn.ghost{background:transparent; border-color:transparent; color:var(--ink-2); padding:5px 8px}
.btn.ghost:hover{background:var(--mute-soft); color:var(--ink)}
.btn.sm{font-size:12px; padding:4px 9px}
.btn:disabled{opacity:.5; cursor:default}
.btn:disabled:hover{border-color:var(--line); background:var(--surface)}
.btn.danger:hover{border-color:var(--no); color:var(--no)}

.pill{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600;
  padding:3px 9px; border-radius:999px; background:var(--mute-soft); color:var(--ink-2); white-space:nowrap}
.pill.ok{background:var(--ok-soft); color:var(--ok)}
.pill.no{background:var(--no-soft); color:var(--no)}
.pill.wait{background:var(--wait-soft); color:var(--wait)}
.pill.acc{background:var(--accent-soft); color:var(--accent)}

table{border-collapse:collapse; width:100%; font-size:13px}
th{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600; text-align:left; padding:9px 10px; border-bottom:1px solid var(--line)}
td{padding:9px 10px; border-bottom:1px solid var(--line-2); vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
.scroller{overflow-x:auto}

.docrow{display:flex; align-items:center; gap:12px; padding:11px 0; border-bottom:1px solid var(--line-2)}
.docrow:last-child{border-bottom:0}
.docrow .ic{width:32px;height:38px;border:1px solid var(--line);border-radius:4px;display:grid;place-items:center;
  font-family:var(--mono); font-size:8.5px; font-weight:600; color:var(--ink-3); background:var(--surface-2); flex:none}
.docrow .meta{min-width:0; margin-right:auto}
.docrow .meta .nm{font-weight:500}
.docrow .meta .ds{font-size:12px; color:var(--ink-3)}
.docrow .acts{display:flex; gap:6px; flex:none}

/* ---------- stage grid ---------- */
.stagegrid td.cell{padding:6px 8px}
.stagegrid .cellwrap{display:flex; flex-direction:column; gap:5px}
.stagegrid select.status{font-size:12.5px; padding:5px 8px; border-left:3px solid var(--line)}
.stagegrid select.status[data-s="Aprovado"]{border-left-color:var(--ok); background:var(--ok-soft); color:var(--ok); font-weight:600}
.stagegrid select.status[data-s="Reprovado"]{border-left-color:var(--no); background:var(--no-soft); color:var(--no); font-weight:600}
.stagegrid select.status[data-s="Desistiu"]{border-left-color:var(--no); background:var(--no-soft); color:var(--no)}
.stagegrid select.status[data-s="Agendado"], .stagegrid select.status[data-s="Realizado"]{border-left-color:var(--wait); background:var(--wait-soft); color:var(--wait)}
.stagegrid select.status:disabled{opacity:1; background:var(--mute-soft); color:var(--ink-3); border-left-color:var(--line); cursor:not-allowed}
.stagegrid .score{font-family:var(--mono); font-size:11.5px; color:var(--ink-2)}
.stagegrid td.nome{font-weight:600; min-width:150px}
.stagegrid td.nome small{display:block; font-weight:400; color:var(--ink-3); font-size:11.5px}
.legend{display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--ink-2); padding-top:12px}
.legend span{display:inline-flex; align-items:center; gap:6px}
.swatch{width:10px;height:10px;border-radius:3px;display:inline-block}

/* ---------- fichas ---------- */
.ficha{margin-bottom:18px}
.ficha{overflow:hidden}
.ficha .fhead{display:flex; gap:16px; align-items:flex-start; padding:16px; border-bottom:1px solid var(--line-2); cursor:pointer; list-style:none}
.ficha .fhead::-webkit-details-marker{display:none}
.ficha:not([open]) .fhead{border-bottom:0}
.ficha .fhead::after{content:"▾"; margin-left:auto; align-self:center; color:var(--ink-3); font-size:13px; flex:none}
.ficha[open] .fhead::after{content:"▴"}
.fotobox{display:flex; flex-direction:column; gap:6px; align-items:center; flex:none}
.fotoacts{display:flex; gap:2px}
.fotoacts .btn{padding:2px 7px; font-size:11px}
.photo.armado{border:2px dashed var(--accent); background:var(--accent-soft); color:var(--accent)}
.photo.armado .ph{color:var(--accent)}
.photo{width:78px; height:78px; border-radius:9px; flex:none; overflow:hidden; position:relative;
  border:1px dashed var(--line); background:var(--surface-2); display:grid; place-items:center; cursor:pointer}
.photo img{width:100%; height:100%; object-fit:cover; display:block}
.photo .ph{font-size:10px; color:var(--ink-3); text-align:center; line-height:1.3; padding:4px}
.photo:hover{border-color:var(--accent); color:var(--accent)}
.photo .rm{position:absolute; top:3px; right:3px; background:var(--surface); border:1px solid var(--line);
  border-radius:5px; font-size:10px; line-height:1; padding:3px 5px; cursor:pointer; display:block; opacity:.65}
.photo:hover .rm{opacity:1}
.fhead .who{min-width:0; flex:1}
.fhead .who h3{font-size:19px}
.fhead .who .role{color:var(--ink-2); font-size:13px; margin-top:2px}
.fhead .who .links{display:flex; gap:8px; margin-top:9px; flex-wrap:wrap}
.chipline{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px}
.subhead{font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); font-weight:600; margin:0 0 8px}
.block{padding:16px; border-bottom:1px solid var(--line-2)}
.block:last-child{border-bottom:0}
ul.tight{margin:0; padding-left:17px}
ul.tight li{margin-bottom:4px}

/* ---------- correção ---------- */
.tabbar{display:flex; gap:6px; flex-wrap:wrap}
.tabbar button{font:inherit; font-size:13px; background:transparent; border:1px solid var(--line); border-radius:999px;
  padding:5px 13px; cursor:pointer; color:var(--ink-2)}
.tabbar button[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600}
:root[data-theme="dark"] .tabbar button[aria-pressed="true"]{color:#111319}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .tabbar button[aria-pressed="true"]{color:#111319}}
.qtable td{padding:5px 10px}
.qtable tbody tr:hover td{background:var(--surface-2)}
.qtable tbody tr.sep td{border-top:1px solid var(--line)}
.qtable td.q{font-family:var(--mono); font-size:12px; color:var(--ink-3); width:34px}
.qtable td.bloco{width:52px}
.qtable td.comp{color:var(--ink-2); font-size:12.5px}
.opts{display:flex; gap:4px}
.opts button{width:29px; height:27px; border-radius:6px; border:1px solid var(--line); background:var(--surface-2);
  font:inherit; font-family:var(--mono); font-size:12.5px; font-weight:500; color:var(--ink-2); cursor:pointer}
.opts button:hover{border-color:var(--accent); color:var(--accent)}
.opts button[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600}
:root[data-theme="dark"] .opts button[aria-pressed="true"]{color:#111319}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .opts button[aria-pressed="true"]{color:#111319}}
.res{font-family:var(--mono); font-size:12.5px; font-weight:600; width:38px; text-align:center}
.res.y{color:var(--ok)} .res.n{color:var(--no)}
.gabcol{font-family:var(--mono); font-size:12.5px; color:var(--ink-3); width:56px; text-align:center}
.tally{position:sticky; bottom:0; background:var(--surface); border-top:1px solid var(--line);
  display:flex; gap:22px; align-items:center; padding:11px 16px; flex-wrap:wrap; border-radius:0 0 var(--r) var(--r)}
.tally .n{font-family:var(--mono); font-size:19px; font-weight:600; line-height:1}
.tally .lbl{font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); font-weight:600}
.tally .item{display:flex; flex-direction:column; gap:3px}
.bar{height:6px; border-radius:3px; background:var(--mute-soft); overflow:hidden; min-width:130px}
.bar i{display:block; height:100%; background:var(--accent); border-radius:3px}

/* ---------- viewer ---------- */
dialog.viewer{border:0; padding:0; width:min(1000px, 94vw); height:min(88vh, 900px); border-radius:12px;
  background:var(--surface); color:var(--ink); box-shadow:0 30px 70px -20px rgba(0,0,0,.5)}
dialog.viewer::backdrop{background:rgba(15,18,26,.6)}
dialog.viewer .vhead{display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line)}
dialog.viewer .vhead .nm{font-weight:600; margin-right:auto}
dialog.viewer iframe{width:100%; height:calc(100% - 53px); border:0; background:var(--surface-2)}
/* ---------- gráfico ---------- */
.viz{--viz-bar:#2a78d6; --viz-abaixo:#9E2B22; --viz-track:var(--mute-soft)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .viz{--viz-bar:#3987e5; --viz-abaixo:#e34948}}
:root[data-theme="dark"] .viz{--viz-bar:#3987e5; --viz-abaixo:#e34948}
.vizwrap{display:grid; gap:26px}
@media(min-width:900px){.vizwrap{grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px}}
.viz .vt{font-family:var(--serif); font-size:14px; font-weight:600}
.viz .vsub{font-size:11.5px; color:var(--ink-3); margin-left:8px}
.vizrows{display:grid; gap:10px; margin-top:12px}
.vrow{display:grid; grid-template-columns:minmax(72px,110px) minmax(0,1fr) 78px; align-items:center; gap:10px; cursor:default}
.vname{font-size:12.5px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.vtrack{position:relative; height:10px; border-radius:5px; background:var(--viz-track)}
.vbar{position:absolute; left:0; top:0; height:10px; border-radius:5px; background:var(--viz-bar); display:block; transition:width .3s ease}
.vbar.abaixo{background:var(--viz-abaixo)}
.vcut{position:absolute; top:-6px; height:22px; width:0; border-left:2px dashed var(--ink-2)}
.vval{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:12.5px; text-align:right}
.vval small{display:block; font-size:10.5px; color:var(--ink-3); font-family:var(--sans)}
.vrow:hover .vtrack{outline:2px solid var(--accent-soft); outline-offset:3px; border-radius:6px}
.vflag{font-size:10.5px; color:var(--viz-abaixo); font-weight:600}
#vizTip{position:fixed; z-index:80; pointer-events:none; display:none; max-width:250px;
  background:var(--ink); color:var(--bg); border-radius:8px; padding:8px 10px; font-size:12px; line-height:1.45;
  box-shadow:0 8px 24px -8px rgba(0,0,0,.5)}
#vizTip b{font-weight:600}
@media (prefers-reduced-motion: reduce){.vbar{transition:none}}

.hint{font-size:12px; color:var(--ink-3); line-height:1.5}
.notice{background:var(--accent-soft); border:1px solid var(--line); border-radius:8px; padding:11px 13px; font-size:12.5px; color:var(--ink-2)}
/* ---------------- agenda ---------------- */
.agtiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px}
.agtile{border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:var(--surface)}
.agtile .et{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3)}
.agtile .nm{font-weight:600; margin:2px 0 8px; font-size:13.5px}
.agtile .barra{display:flex; height:8px; border-radius:99px; overflow:hidden; background:var(--line-2)}
.agtile .barra i{display:block; height:100%}
.agtile .barra i.feito{background:#3f7d5b}
.agtile .barra i.marcado{background:#c79a3f}
.agtile .leg{display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; font-size:11.5px; color:var(--ink-2)}
.agtile .leg b{font-variant-numeric:tabular-nums}
.agtile .pt{display:inline-block; width:8px; height:8px; border-radius:99px; margin-right:4px; vertical-align:baseline}
.pt.feito{background:#3f7d5b} .pt.marcado{background:#c79a3f} .pt.falta{background:var(--line-2); border:1px solid var(--line)}

.cal{display:grid; grid-template-columns:repeat(7,1fr); gap:4px; max-width:430px}
.cal .cab{font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-3);
  text-align:center; padding-bottom:2px}
.cal .dia{position:relative; aspect-ratio:1; display:flex; flex-direction:column; align-items:center;
  justify-content:center; border-radius:8px; font-size:12px; color:var(--ink-2);
  border:1px solid transparent}
.cal .dia.fora{color:var(--line)}
.cal .dia.hoje{border-color:var(--ink-3); font-weight:700; color:var(--ink)}
.cal .dia.tem{background:var(--surface-2); color:var(--ink); font-weight:600}
.cal .pts{display:flex; gap:2px; height:5px; margin-top:2px}
.cal .pts i{width:5px; height:5px; border-radius:99px; display:block}

.tl{border-left:2px solid var(--line-2); margin-left:7px; padding-left:16px}
.tl .grupo{position:relative; padding:10px 0}
.tl .grupo::before{content:""; position:absolute; left:-23px; top:16px; width:12px; height:12px;
  border-radius:99px; background:var(--surface); border:2px solid var(--line)}
.tl .grupo.passado::before{background:#3f7d5b; border-color:#3f7d5b}
.tl .grupo.hoje::before{background:var(--ink); border-color:var(--ink)}
.tl .grupo.futuro::before{background:#c79a3f; border-color:#c79a3f}
.tl .dt{font-size:12px; font-weight:700; letter-spacing:.02em}
.tl .dt small{font-weight:400; color:var(--ink-3); margin-left:6px; letter-spacing:0}
.tl .item{display:flex; align-items:center; gap:10px; padding:7px 0 7px 2px;
  border-bottom:1px solid var(--line-2)}
.tl .item:last-child{border-bottom:0}
.tl .hh{font-variant-numeric:tabular-nums; font-size:12.5px; font-weight:600; min-width:46px;
  color:var(--ink-2)}
.tl .av{width:28px; height:28px; border-radius:99px; object-fit:cover; flex:none;
  border:1px solid var(--line)}
.tl .av.vazio{background:var(--surface-2); display:flex; align-items:center; justify-content:center;
  font-size:11px; color:var(--ink-3); font-weight:600}
.tl .quem{flex:1; min-width:0}
.tl .quem .n{display:block; font-size:13px; font-weight:600; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis}
.tl .quem .o{display:block; font-size:11.5px; color:var(--ink-3); white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis}
.tl .grupo.passado .item{opacity:.62}
.tl .marca{font-size:11px; color:#3f7d5b; font-weight:700}
.agvazio{color:var(--ink-3); font-size:12.5px; padding:6px 0}
:root[data-theme="dark"] .agtile .barra i.feito{background:#5a9e78}
:root[data-theme="dark"] .tl .marca{color:#8ec5a5}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .agtile .barra i.feito{background:#5a9e78}
  :root:not([data-theme="light"]) .tl .marca{color:#8ec5a5}}
.selo{display:inline-block; font-size:10px; font-weight:700; letter-spacing:.04em;
  line-height:1; padding:3px 6px; border-radius:5px; vertical-align:middle; margin-left:2px}
.selo.nova{background:#e8f1ea; color:#2f6b47; border:1px solid #9ec4ae}
.selo.antiga{background:#f3efe6; color:#7a6433; border:1px solid #cbbb96}
:root[data-theme="dark"] .selo.nova{background:#1d3527; color:#a9d8bd; border-color:#3d6b50}
:root[data-theme="dark"] .selo.antiga{background:#332c1d; color:#d8c79b; border-color:#6b5c3d}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .selo.nova{background:#1d3527; color:#a9d8bd; border-color:#3d6b50}
  :root:not([data-theme="light"]) .selo.antiga{background:#332c1d; color:#d8c79b; border-color:#6b5c3d}}
.notice.perigo{background:#fdf1ec; border:1px solid #d9714b; border-left:4px solid #d9714b; color:#7a2d14}
:root[data-theme="dark"] .notice.perigo{background:#3a1d13; border-color:#d9714b; color:#f6d2c4}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .notice.perigo{background:#3a1d13; border-color:#d9714b; color:#f6d2c4}}
.empty{color:var(--ink-3); font-size:13px; padding:10px 0}
@media print{
  nav.rail,.topbar,.tabbar,.btn{display:none!important}
  section.view{display:block!important}
  .card{break-inside:avoid; box-shadow:none}
}