:root{
  --ground:#F7F9FC;
  --surface:#FFFFFF;
  --surface-2:#EDF1F6;
  --ink:#16212F;
  --ink-soft:#4C5A6B;
  --ink-faint:#85919F;
  --line:#E1E6ED;
  --line-strong:#C7D0DA;
  --primary:#1E5A96;
  --primary-deep:#153F6B;
  --primary-soft:#E7F0F9;
  --primary-ink:#ffffff;
  --accent:#4B8FC4;
  --accent-soft:#E5F0FA;
  --danger:#C1432E;
  --danger-soft:#F8E5E0;
  --st-pend:#8E6E1A; --st-pend-soft:#F7F0DC;
  --st-analise:#52708F; --st-analise-soft:#E9EEF3;
  --st-aguard:#A85024; --st-aguard-soft:#F7EBE1;
  --st-concl:#1E5A96; --st-concl-soft:#E7F0F9;
  --chart-a:#8E6E1A;
  --chart-b:#1E5A96;
  --shadow: 0 12px 32px -12px rgb(22 33 47 / 0.22);
  --shadow-sm: 0 2px 8px -2px rgb(22 33 47 / 0.14);
  --font-display:'Archivo', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, 'SFMono-Regular', Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#10141B;
    --surface:#171C24;
    --surface-2:#1E2530;
    --ink:#E7EBF0;
    --ink-soft:#A5B0BE;
    --ink-faint:#68727F;
    --line:#2A313D;
    --line-strong:#3A4350;
    --primary:#5B9BD9;
    --primary-deep:#82BEEA;
    --primary-soft:#1B2E42;
    --primary-ink:#0E1A26;
    --accent:#7FB3DD;
    --accent-soft:#1E3446;
    --danger:#E08A7A;
    --danger-soft:#3B2420;
    --st-pend:#E0BD63; --st-pend-soft:#352C15;
    --st-analise:#8FA9BD; --st-analise-soft:#202A34;
    --st-aguard:#E0A57C; --st-aguard-soft:#3A2718;
    --st-concl:#5B9BD9; --st-concl-soft:#1B2E42;
    --chart-a:#C98500;
    --chart-b:#3987E5;
    --shadow: 0 12px 32px -12px rgb(0 0 0 / 0.5);
    --shadow-sm: 0 2px 8px -2px rgb(0 0 0 / 0.4);
  }
}
:root[data-theme="dark"]{
  --ground:#10141B;
  --surface:#171C24;
  --surface-2:#1E2530;
  --ink:#E7EBF0;
  --ink-soft:#A5B0BE;
  --ink-faint:#68727F;
  --line:#2A313D;
  --line-strong:#3A4350;
  --primary:#5B9BD9;
  --primary-deep:#82BEEA;
  --primary-soft:#1B2E42;
  --primary-ink:#0E1A26;
  --accent:#7FB3DD;
  --accent-soft:#1E3446;
  --danger:#E08A7A;
  --danger-soft:#3B2420;
  --st-pend:#E0BD63; --st-pend-soft:#352C15;
  --st-analise:#8FA9BD; --st-analise-soft:#202A34;
  --st-aguard:#E0A57C; --st-aguard-soft:#3A2718;
  --st-concl:#5B9BD9; --st-concl-soft:#1B2E42;
  --chart-a:#C98500;
  --chart-b:#3987E5;
  --shadow: 0 12px 32px -12px rgb(0 0 0 / 0.5);
  --shadow-sm: 0 2px 8px -2px rgb(0 0 0 / 0.4);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--ground);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.serif{font-family:var(--font-display); text-wrap:balance; letter-spacing:-0.01em;}
.mono, .num{font-family:var(--font-mono); font-variant-numeric:tabular-nums;}
button{font-family:inherit;}
a{color:var(--primary);}
[hidden]{display:none!important;}

:focus-visible{outline:2px solid var(--primary); outline-offset:2px; border-radius:4px;}

.btn{
  display:inline-flex; align-items:center; gap:9px; justify-content:center;
  border-radius:6px; border:1px solid transparent; cursor:pointer;
  font-family:var(--font-body); font-weight:600; font-size:16px;
  padding:12px 20px; transition:background .12s ease, border-color .12s ease, color .12s ease, transform .06s ease;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--primary); color:var(--primary-ink);}
.btn-primary:hover{background:var(--primary-deep);}
.btn-primary[disabled]{opacity:.6; cursor:not-allowed;}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line-strong);}
.btn-ghost:hover{background:var(--surface-2);}
.btn-sm{padding:9px 14px; font-size:14.5px;}

.badge{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; font-weight:700; padding:4px 10px; border-radius:4px;
  border:1px solid currentColor; white-space:nowrap; line-height:1.3;
  text-transform:uppercase; letter-spacing:.03em;
}
.tag-text{display:inline-flex; align-items:center; gap:7px; font-size:14px; font-weight:600; white-space:nowrap;}
.sq-dot{width:7px; height:7px; border-radius:1.5px; background:currentColor; flex:none;}
.tone-pend{color:var(--st-pend);}
.tone-analise{color:var(--st-analise);}
.tone-aguard{color:var(--st-aguard);}
.tone-concl{color:var(--st-concl);}
.tone-urgente{color:var(--danger);}
.tone-normal{color:var(--ink-soft);}

.field{display:flex; flex-direction:column; gap:7px;}
.field label{font-size:13.5px; font-weight:600; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.04em;}
.field input[type=text], .field input[type=date], .field input[type=email], .field input[type=password], .field select, .field textarea{
  font-family:var(--font-body); font-size:16px; color:var(--ink);
  background:var(--surface); border:1px solid var(--line-strong); border-radius:8px;
  padding:12px 14px; width:100%;
}
.field textarea{resize:vertical; min-height:84px; font-family:inherit;}
.field input:focus, .field select:focus, .field textarea:focus{outline:2px solid var(--primary); outline-offset:-1px; border-color:var(--primary);}
.field .hint{font-size:13px; color:var(--ink-faint);}

.hairline{border:none; border-top:1px solid var(--line); margin:0;}

/* ---------- login ---------- */
#view-login{
  min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:48px 20px; gap:30px;
}
.login-brand{text-align:center;}
.login-brand .mark{font-family:var(--font-display); font-weight:800; font-size:36px; color:var(--ink); letter-spacing:-0.01em;}
.login-brand .mark em{color:var(--primary); font-style:normal;}
.login-brand .sub{margin-top:7px; font-size:14px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.08em;}
.login-tagline{margin-top:14px; font-size:16px; color:var(--ink-soft); max-width:380px; margin-inline:auto;}
.login-card{
  width:min(420px, 100%); background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--primary); border-radius:8px; padding:32px 32px 28px;
  display:flex; flex-direction:column; gap:18px;
}
.login-card .btn-primary{width:100%; padding:13px 18px;}
.login-foot{text-align:center; font-size:14px;}

/* ---------- app shell ---------- */
#app{min-height:100vh; display:flex; flex-direction:column;}
.staging-banner{
  background:var(--st-aguard); color:#fff; text-align:center;
  font-size:12.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:7px 16px;
}
.topbar{
  position:sticky; top:0; z-index:20; background:var(--surface); border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:15px 32px;
}
.topbar-brand{display:flex; align-items:baseline; gap:11px;}
.topbar-brand .mark{font-family:var(--font-display); font-weight:800; font-size:23px; letter-spacing:-0.01em;}
.topbar-brand .mark em{color:var(--primary); font-style:normal;}
.topbar-brand .tag{font-size:12px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.08em; border-left:1px solid var(--line); padding-left:11px;}

.user-chip{display:flex; align-items:center; gap:11px;}
.avatar{
  width:37px; height:37px; border-radius:50%; background:var(--primary-soft); color:var(--primary);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13.5px; flex:none;
}
.user-chip .who{line-height:1.25;}
.user-chip .who .name{font-size:14.5px; font-weight:600;}
.user-chip .who .setor{font-size:12.5px; color:var(--ink-faint);}
.icon-btn{
  width:38px; height:38px; border-radius:5px; border:1px solid var(--line); background:var(--surface);
  display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--ink-soft);
}
.icon-btn:hover{background:var(--surface-2); color:var(--ink);}
.icon-btn svg{width:18px; height:18px;}

main{flex:1; padding:36px 32px 72px;}
.wrap{max-width:1180px; margin:0 auto;}

.view-tabs{display:flex; gap:24px; border-bottom:1px solid var(--line); margin-bottom:26px;}
.view-tabs button{
  border:none; background:none; padding:0 0 12px; font-size:14.5px; font-weight:600;
  color:var(--ink-faint); cursor:pointer; font-family:var(--font-body); border-bottom:2px solid transparent;
  margin-bottom:-1px;
}
.view-tabs button.active{color:var(--ink); border-bottom-color:var(--primary);}
.view-tabs button:hover:not(.active){color:var(--ink);}

.dash-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:24px;}
.dash-head h1{font-size:30px; margin:0; font-weight:600;}
.dash-head .desc{margin:5px 0 0; color:var(--ink-soft); font-size:15.5px;}

.ledger-bar{display:flex; gap:30px; flex-wrap:wrap; margin-bottom:0;}
.ledger-item{
  display:flex; align-items:baseline; gap:8px; padding:0 0 14px; margin:0;
  border:none; border-bottom:2px solid transparent; background:none; cursor:pointer; font-family:var(--font-body);
}
.ledger-item .n{font-family:var(--font-mono); font-size:20px; font-weight:600; color:var(--ink);}
.ledger-item .l{font-size:14px; color:var(--ink-soft); font-weight:600;}
.ledger-item.active{border-bottom-color:var(--primary);}
.ledger-item.active .n, .ledger-item.active .l{color:var(--primary-deep);}
.ledger-item:hover:not(.active) .l{color:var(--ink);}

.toolbar{display:flex; gap:11px; margin-bottom:20px; flex-wrap:wrap; align-items:center;}
.toolbar input[type=search], .toolbar select{
  font-family:var(--font-body); font-size:15px; border:1px solid var(--line-strong); border-radius:8px;
  padding:10px 14px; background:var(--surface); color:var(--ink);
}
.toolbar input[type=search]{flex:1; min-width:200px;}

.display-switch{display:flex; gap:2px; border:1px solid var(--line-strong); border-radius:8px; padding:3px; background:var(--surface); flex:none;}
.display-switch button{
  display:flex; align-items:center; gap:6px; border:none; background:none; padding:7px 11px; border-radius:6px;
  font-size:13px; font-weight:600; color:var(--ink-faint); cursor:pointer; font-family:var(--font-body);
}
.display-switch button svg{width:15px; height:15px; flex:none;}
.display-switch button.active{background:var(--primary-soft); color:var(--primary-deep);}
.display-switch button:hover:not(.active){background:var(--surface-2); color:var(--ink);}

.list{border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--surface);}
.list-header, .row-item{display:grid; align-items:center; gap:16px; padding:16px 20px;}
.cols-queue{grid-template-columns: 118px 108px 1fr 130px 96px 150px 100px;}
.list-header{background:var(--surface-2); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint);}
.row-item{border-top:1px solid var(--line); cursor:pointer; background:var(--surface); transition:background .1s ease;}
.row-item:hover{background:var(--surface-2);}
.row-item .protocolo{font-family:var(--font-mono); font-size:14px; color:var(--ink-soft);}
.row-item .setor-tag{font-size:13.5px; color:var(--ink-soft);}
.row-item .titulo{font-size:16px; font-weight:600; color:var(--ink);}
.row-item .titulo .forn{display:block; font-size:13px; font-weight:400; color:var(--ink-faint); margin-top:3px;}
.row-item .solicitante{font-size:14.5px; color:var(--ink-soft);}
.row-item .aberto-ha{font-size:14px; color:var(--ink-faint); font-family:var(--font-mono);}
.row-item .aberto-ha.warn{color:var(--danger); font-weight:600;}
.empty-row{padding:44px 20px; text-align:center; color:var(--ink-faint); font-size:15.5px;}

.kanban-board{display:flex; gap:16px; overflow-x:auto; padding-bottom:6px; align-items:flex-start;}
.kb-col{flex:1 0 220px; min-width:220px; max-width:280px;}
.kb-col-head{display:flex; align-items:center; justify-content:space-between; padding:0 2px 12px; font-size:13.5px; font-weight:600; color:var(--ink);}
.kb-col-head .cnt{font-family:var(--font-mono); color:var(--ink-faint); font-size:12.5px; font-weight:600;}
.kb-cards{display:flex; flex-direction:column; gap:10px;}
.kb-card{border:1px solid var(--line); border-left:3px solid transparent; border-radius:7px; padding:12px 14px; background:var(--surface); cursor:pointer; transition:border-color .1s ease, box-shadow .1s ease;}
.kb-card:hover{border-color:var(--line-strong); box-shadow:var(--shadow-sm);}
.kb-card.prio-urgente{border-left-color:var(--danger);}
.kb-proto{font-family:var(--font-mono); font-size:11.5px; color:var(--ink-faint);}
.kb-title{font-size:14.5px; font-weight:600; color:var(--ink); margin:4px 0 5px;}
.kb-meta{font-size:12.5px; color:var(--ink-faint); margin-bottom:10px;}
.kb-foot{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.kb-days{font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); flex:none;}
.kb-days.warn{color:var(--danger); font-weight:700;}
.kb-empty{border:1.5px dashed var(--line); border-radius:7px; padding:22px 14px; text-align:center; font-size:13px; color:var(--ink-faint);}

.cal-head{margin-bottom:14px;}
.cal-head h4{margin:0; font-size:17px; font-weight:600;}
.cal-table{border:1px solid var(--line); border-radius:8px; overflow:hidden;}
.cal-dow-row{display:grid; grid-template-columns:repeat(7,1fr); background:var(--line); gap:1px;}
.cal-dow{background:var(--surface-2); padding:8px; font-size:11px; font-weight:700; text-transform:uppercase; color:var(--ink-faint); text-align:center;}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--line);}
.cal-cell{background:var(--surface); min-height:92px; padding:8px; display:flex; flex-direction:column; gap:4px;}
.cal-cell.empty{background:var(--ground);}
.cal-cell.today{background:var(--primary-soft);}
.cal-daynum{font-family:var(--font-mono); font-size:12.5px; color:var(--ink-faint); font-weight:600;}
.cal-cell.today .cal-daynum{color:var(--primary-deep); font-weight:700;}
.cal-pill{display:flex; align-items:center; gap:5px; font-size:11px; font-weight:600; padding:3px 7px; border-radius:4px; background:var(--surface-2); cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cal-pill:hover{background:var(--line);}

.stat-tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:16px; margin-bottom:24px;}
.stat-tile{border:1px solid var(--line); border-radius:8px; padding:18px 20px; background:var(--surface);}
.stat-tile .v{font-size:30px; font-weight:700; color:var(--ink); line-height:1;}
.stat-tile .v .unit{font-size:16px; font-weight:600; color:var(--ink-faint); margin-left:2px;}
.stat-tile .l{font-size:13.5px; color:var(--ink-soft); margin-top:7px;}

.status-tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:14px;}
.status-tile{border:1px solid var(--line); border-radius:7px; padding:13px 15px; background:var(--ground);}
.status-tile .n{font-family:var(--font-mono); font-size:22px; font-weight:600; color:var(--ink);}
.status-tile .l{display:flex; align-items:center; gap:6px; font-size:13px; color:var(--ink-soft); margin-top:5px;}

.rep-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:20px; margin-bottom:20px;}
.rep-card{border:1px solid var(--line); border-radius:8px; padding:22px 24px; background:var(--surface);}
.rep-card h3{margin:0 0 18px; font-size:16.5px; font-weight:600;}
.rep-card .rep-sub{font-size:12.5px; font-weight:400; color:var(--ink-faint); margin-left:6px;}

.bar-chart{display:flex; flex-direction:column; gap:14px;}
.bar-row{display:grid; grid-template-columns:104px 1fr 34px; align-items:center; gap:12px;}
.bar-row .lbl{font-size:14px; color:var(--ink-soft);}
.bar-track{height:18px; background:var(--surface-2); border-radius:4px; overflow:hidden;}
.bar-fill{height:100%; background:var(--primary); border-radius:0 4px 4px 0;}
.bar-row .val{font-family:var(--font-mono); font-size:14px; text-align:right; color:var(--ink); font-weight:600;}

.chart-legend{display:flex; gap:20px; margin-bottom:16px;}
.chart-legend .lk{display:flex; align-items:center; gap:7px; font-size:13.5px; color:var(--ink-soft);}
.chart-legend .lk i{display:block; width:16px; height:2px; border-radius:1px;}
.trend-svg{width:100%; height:auto; display:block;}

.sla-row{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 4px; border-top:1px solid var(--line); cursor:pointer; border-radius:6px;}
.sla-row:first-child{border-top:none;}
.sla-row:hover{background:var(--surface-2);}
.sla-row .main{min-width:0;}
.sla-row .main .t{font-size:14.5px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sla-row .main .s{font-size:12.5px; color:var(--ink-faint); margin-top:2px; font-family:var(--font-mono);}
.sla-row .days{flex:none; font-family:var(--font-mono); font-size:14px; font-weight:700; color:var(--danger);}

.chart-tip{position:fixed; z-index:70; background:var(--ink); color:var(--ground); border-radius:6px; padding:10px 13px; font-size:12.5px; pointer-events:none; box-shadow:var(--shadow); min-width:150px;}
.chart-tip .ct-date{font-weight:600; margin-bottom:7px; font-family:var(--font-mono); font-size:11px; opacity:.75;}
.chart-tip .ct-row{display:flex; align-items:center; gap:7px; padding:2px 0;}
.chart-tip .ct-key{width:10px; height:2px; border-radius:1px; flex:none;}
.chart-tip .ct-label{flex:1; opacity:.85;}
.chart-tip .ct-val{font-family:var(--font-mono); font-weight:700;}

/* ---------- overlay / panel ---------- */
.overlay{position:fixed; inset:0; background:rgb(10 16 13 / .38); z-index:40; opacity:0; pointer-events:none; transition:opacity .16s ease;}
.overlay.open{opacity:1; pointer-events:auto;}
.panel{
  position:fixed; top:0; right:0; height:100%; width:min(560px, 94vw);
  background:var(--surface); border-left:1px solid var(--line); box-shadow:var(--shadow);
  z-index:41; transform:translateX(100%); transition:transform .2s ease;
  display:flex; flex-direction:column;
}
.panel.open{transform:translateX(0);}
.panel-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:24px 26px; border-bottom:1px solid var(--line);}
.panel-head h2{margin:0; font-size:22px; font-weight:600;}
.panel-head .sub{margin:4px 0 0; font-size:14px; color:var(--ink-faint); font-family:var(--font-mono);}
.panel-body{padding:24px 26px; overflow-y:auto; flex:1; display:flex; flex-direction:column; gap:20px;}
.panel-foot{padding:18px 26px; border-top:1px solid var(--line); display:flex; gap:11px; justify-content:flex-end;}

.dropzone{border:1.5px dashed var(--line-strong); border-radius:8px; padding:20px; text-align:center; background:var(--surface-2); font-size:14.5px; color:var(--ink-soft); cursor:pointer; position:relative;}
.dropzone:hover{border-color:var(--primary); background:var(--primary-soft);}
.dropzone svg{display:block; margin:0 auto 9px; width:23px; height:23px; color:var(--ink-faint);}
.dropzone input[type=file]{position:absolute; inset:0; opacity:0; cursor:pointer;}
.dropzone strong{color:var(--ink);}

.file-chip{display:flex; align-items:center; gap:12px; border:1px solid var(--line); border-radius:6px; padding:12px 14px; background:var(--surface-2);}
.file-chip .ic{width:20px; height:20px; color:var(--ink-faint); display:flex; align-items:center; justify-content:center; flex:none;}
.file-chip .meta{flex:1; min-width:0;}
.file-chip .name{font-size:14.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.file-chip .sz{font-size:12.5px; color:var(--ink-faint);}
.file-chip.returned .ic{color:var(--st-concl);}

.kv{display:grid; grid-template-columns:138px 1fr; gap:10px 16px; font-size:15px;}
.kv dt{color:var(--ink-faint);}
.kv dd{margin:0; color:var(--ink); font-weight:500;}

.seal{width:38px; height:38px; border-radius:50%; border:1.5px dashed var(--st-concl); flex:none; display:flex; align-items:center; justify-content:center; color:var(--st-concl); transform:rotate(-8deg);}
.seal svg{width:18px; height:18px;}

.timeline{list-style:none; margin:0; padding:0; display:flex; flex-direction:column;}
.timeline li{position:relative; padding:0 0 20px 24px; border-left:1.5px solid var(--line);}
.timeline li:last-child{border-color:transparent; padding-bottom:0;}
.timeline li::before{content:''; position:absolute; left:-5px; top:2px; width:9px; height:9px; border-radius:50%; background:var(--primary); border:2px solid var(--surface);}
.timeline .when{font-size:12.5px; color:var(--ink-faint); font-family:var(--font-mono);}
.timeline .what{font-size:15px; margin-top:3px;}
.timeline .what b{font-weight:600;}

.notice{border-radius:6px; padding:14px 16px; font-size:15px; display:flex; gap:11px; align-items:flex-start;}
.notice svg{width:18px; height:18px; flex:none; margin-top:1px;}
.notice-aguard{background:var(--st-aguard-soft); color:var(--st-aguard);}
.notice p{margin:0;}

.segmented{display:flex; border:1px solid var(--line-strong); border-radius:6px; overflow:hidden; width:fit-content;}
.segmented button{border:none; background:var(--surface); color:var(--ink-soft); font-size:14.5px; font-weight:600; padding:10px 18px; cursor:pointer; font-family:var(--font-body);}
.segmented button + button{border-left:1px solid var(--line-strong);}
.segmented button.active{background:var(--primary); color:var(--primary-ink);}

.toast{
  position:fixed; bottom:22px; right:22px; z-index:60; background:var(--ink); color:var(--ground);
  padding:14px 20px; border-radius:7px; font-size:14.5px; box-shadow:var(--shadow);
  display:flex; align-items:center; gap:11px; transform:translateY(12px); opacity:0; pointer-events:none;
  transition:transform .18s ease, opacity .18s ease; max-width:380px;
}
.toast.show{transform:translateY(0); opacity:1;}
.toast .dot{width:8px;height:8px;border-radius:50%;background:var(--primary); flex:none;}

@media (max-width:760px){
  .cols-queue{grid-template-columns: 1fr; }
  .list-header{display:none;}
  .row-item{grid-template-columns:1fr; gap:6px;}
  .topbar{padding:10px 16px;}
  main{padding:20px 14px 48px;}
  .rep-grid{grid-template-columns:1fr;}
  .display-switch button .lbl{display:none;}
  .display-switch button{padding:8px;}
  .cal-cell{min-height:60px; padding:5px;}
}
@media (prefers-reduced-motion: reduce){
  *{transition-duration:.001ms !important;}
}