/* Mockup v6 · 11/11/26 · linguagem visual inspirada no front do Seller Station (pedido do Pedro). Código independente. */
:root{
  --bg:#eeeff4; --bg2:#f5f6fa; --panel:#fff; --panel2:#f2f3f8; --line:#e6e8ef; --line2:#d5d8e3;
  --ink:#12131a; --ink2:#565a6b; --ink3:#7d8194;
  --acc:#0f8fe5; --acc2:#1cc6f0; --ok:#12a877; --warn:#e08a00; --bad:#e8456f; --violet:#8B6BFF; --mint:#2fc79a;
  --grid:rgba(18,19,26,.07); --tip:#fff;
  --font:"Plus Jakarta Sans",ui-sans-serif,system-ui,sans-serif;
}
:root[data-theme=dark]{
  --bg:#050507; --bg2:#0b0b0f; --panel:#111218; --panel2:#191a22; --line:#22232d; --line2:#30323f;
  --ink:#f2f2f7; --ink2:#aaadbd; --ink3:#8a8da0;
  --acc:#1a9df0; --acc2:#3fd3f5; --ok:#35d39c; --warn:#ffb347; --bad:#ff5f8a;
  --grid:rgba(255,255,255,.06); --tip:#191a22;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:var(--font);font-size:15px;color:var(--ink);-webkit-font-smoothing:antialiased;
  background:radial-gradient(1200px 600px at 10% -10%,#fff 0%,transparent 60%),radial-gradient(900px 500px at 100% 0%,#dcefff 0%,transparent 55%),var(--bg);background-attachment:fixed}
:root[data-theme=dark] body{background:radial-gradient(900px 500px at 0% 0%,rgba(28,198,240,.10) 0%,transparent 55%),radial-gradient(1000px 600px at 100% 0%,rgba(10,127,224,.22) 0%,transparent 55%),var(--bg);background-attachment:fixed}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.num{font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:-.02em}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--line2);border-radius:8px;border:2px solid var(--bg)}

/* casca */
.shell{display:flex;min-height:100vh}
.side{width:248px;flex:none;padding:20px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.marca{display:flex;align-items:center;gap:10px;padding:6px 8px;margin-bottom:22px}
.marca-m{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff;background:linear-gradient(135deg,var(--acc2),#0a7fe0);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 20px -10px rgba(15,143,229,.9)}
.marca b{font-size:17px;font-weight:800;letter-spacing:-.02em;display:block;line-height:1.1}
.marca small{font-size:11.5px;color:var(--ink3);font-weight:600}
.grupo{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);padding:14px 10px 6px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:12px;padding:5px 8px;border-radius:16px;font-size:14px;font-weight:600;color:var(--ink2)}
.nav a:hover{color:var(--ink)}
.nav a.on{color:var(--ink)}
.nav a .cnt{margin-left:auto}
.tile{width:40px;height:40px;border-radius:16px;display:grid;place-items:center;flex:none;color:var(--ink2);background:linear-gradient(180deg,#fff,#f1f2f8);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(18,19,26,.05),0 8px 16px -10px rgba(18,19,26,.35)}
.tile svg{width:17px;height:17px}
.on .tile,.tile.on{color:#fff;background:linear-gradient(135deg,var(--acc2),#0a7fe0);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 20px -10px rgba(15,143,229,.9)}
:root[data-theme=dark] .tile{background:var(--panel2);box-shadow:none}
:root[data-theme=dark] .on .tile,:root[data-theme=dark] .tile.on{background:linear-gradient(135deg,#3fd3f5,#0f8fe5)}
.side-fim{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.periodo{display:flex;flex-direction:column;gap:6px}
.periodo label{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);padding:0 4px}
.user{display:flex;align-items:center;gap:10px;padding:0 4px}
.user b{font-size:12.5px;display:block}.user small{font-size:11px;color:var(--ink3)}

.main{flex:1;min-width:0;padding:24px 32px 48px}
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.crumb{font-size:12.5px;color:var(--ink3);font-weight:600;margin-bottom:8px;display:flex;gap:6px;align-items:center}
.crumb a:hover{color:var(--ink)}
.ph h1{margin:0;font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1}
.ph p{margin:8px 0 0;color:var(--ink2);font-size:14px}
.acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* componentes */
.card{min-width:0;background:var(--panel);border-radius:24px;border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(18,19,26,.04),0 18px 40px -22px rgba(18,19,26,.28)}
:root[data-theme=dark] .card{border-color:var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 40px -22px rgba(0,0,0,.7)}
.card-h{padding:18px 22px 6px;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:10px}
.card-t{font-size:15px;font-weight:700}
.card-s{font-size:12.5px;color:var(--ink3);margin-top:2px}
.card-b{padding:10px 22px 20px}
.kpi{padding:18px 22px;background:linear-gradient(180deg,#fff 0%,#f7f7fc 100%);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(18,19,26,.04),0 2px 4px rgba(18,19,26,.04),0 22px 44px -24px rgba(15,143,229,.35)}
:root[data-theme=dark] .kpi{background:linear-gradient(180deg,#16171f 0%,#111218 100%);box-shadow:0 22px 44px -24px rgba(0,0,0,.8)}
.kpi .l{font-size:13px;color:var(--ink2);font-weight:600;display:flex;justify-content:space-between;gap:8px}
.kpi .v{font-size:28px;margin-top:8px;line-height:1;letter-spacing:-.03em}
.kpi .v.big{font-size:38px}
.kpi .s{font-size:12.5px;color:var(--ink3);margin-top:7px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.kpi.warn{border-color:color-mix(in oklab,var(--warn) 55%,transparent);background:color-mix(in oklab,var(--warn) 7%,var(--panel))}
.kpi.bad{border-color:color-mix(in oklab,var(--bad) 45%,transparent);background:color-mix(in oklab,var(--bad) 6%,var(--panel))}
.kpi .spk{margin-top:10px}

.g{display:grid;gap:16px;margin-bottom:16px}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.g12{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}

.badge{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:2px 8px;font-size:11.5px;font-weight:700;white-space:nowrap}
.b-ok{background:color-mix(in oklab,var(--ok) 14%,transparent);color:var(--ok)}
.b-warn{background:color-mix(in oklab,var(--warn) 14%,transparent);color:var(--warn)}
.b-bad{background:color-mix(in oklab,var(--bad) 14%,transparent);color:var(--bad)}
.b-info{background:color-mix(in oklab,var(--acc) 12%,transparent);color:var(--acc)}
.b-mute{background:color-mix(in oklab,var(--ink3) 14%,transparent);color:var(--ink2)}
.b-vio{background:color-mix(in oklab,var(--violet) 14%,transparent);color:var(--violet)}
.st-diag{background:color-mix(in oklab,var(--violet) 14%,transparent);color:var(--violet)}
.st-estr{background:color-mix(in oklab,var(--acc) 12%,transparent);color:var(--acc)}
.st-trac{background:color-mix(in oklab,var(--ok) 14%,transparent);color:var(--ok)}
.st-esca{background:color-mix(in oklab,var(--warn) 16%,transparent);color:var(--warn)}
.up{color:var(--ok)}.down{color:var(--bad)}

.btn{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;background:var(--panel);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(18,19,26,.06),0 8px 18px -12px rgba(18,19,26,.3);transition:transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:15px;height:15px}
:root[data-theme=dark] .btn{background:var(--panel2);border-color:var(--line2);box-shadow:none}
.btn-acc,:root[data-theme=dark] .btn-acc{background:linear-gradient(135deg,#1cc6f0 0%,#0a7fe0 100%);color:#fff;border-color:#0f8fe5;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 22px -10px rgba(15,143,229,.8)}
.btn-sm{padding:5px 11px;font-size:12px}
.select,.input{border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--ink);outline:none;background:var(--panel);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 2px rgba(18,19,26,.05),0 1px 2px rgba(18,19,26,.04);font-family:inherit}
:root[data-theme=dark] .select,:root[data-theme=dark] .input{background:var(--panel2);border-color:var(--line2);box-shadow:none}
.input{border-radius:16px;font-weight:500}
.tabs{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:color-mix(in oklab,var(--panel2) 70%,transparent)}
.tab{padding:7px 14px;font-size:13px;font-weight:700;border-radius:999px;color:var(--ink2);border:0;background:transparent;cursor:pointer}
.tab.on{background:var(--panel);color:var(--ink);box-shadow:inset 0 1px 0 #fff,0 6px 14px -8px rgba(18,19,26,.3)}
:root[data-theme=dark] .tab.on{background:var(--panel2);box-shadow:none}

.switch{position:relative;width:100px;height:36px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--ink2);cursor:pointer;background:var(--panel);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(18,19,26,.06),0 8px 18px -12px rgba(18,19,26,.3);padding:0}
:root[data-theme=dark] .switch{background:var(--panel2);border-color:var(--line2);box-shadow:none}
.switch .k{position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#ffb547,#ff7a1a);transition:transform .38s cubic-bezier(.2,.9,.25,1.15),background .35s}
.switch[aria-pressed=true] .k{transform:translateX(64px);background:linear-gradient(135deg,#1cc6f0,#0a7fe0)}
.switch .k svg{width:14px;height:14px}
.switch .lt{position:absolute;top:0;height:100%;display:flex;align-items:center}
.switch .lt.l{left:12px}.switch .lt.r{right:12px}
.switch[aria-pressed=true] .lt.r,.switch:not([aria-pressed=true]) .lt.l{opacity:0}

table{width:100%;border-collapse:collapse}
th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);font-weight:700;padding:10px 14px;text-align:left;white-space:nowrap}
th.s{cursor:pointer;user-select:none}th.s:hover{color:var(--ink)}
td{padding:12px 14px;font-size:14px;border-top:1px solid var(--line);white-space:nowrap;vertical-align:middle}
.r{text-align:right}.c{text-align:center}
tr.h:hover td{background:color-mix(in oklab,var(--panel2) 70%,transparent);cursor:pointer}
.tw{overflow-x:auto}
.mut{color:var(--ink3)}.mut2{color:var(--ink2)}
.small{font-size:12.5px}

.track{height:8px;border-radius:999px;background:color-mix(in oklab,var(--ink3) 16%,transparent);overflow:hidden}
.track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--acc2),var(--acc))}
.track.ok i{background:var(--ok)}.track.warn i{background:var(--warn)}.track.bad i{background:var(--bad)}

.av{width:36px;height:36px;border-radius:13px;display:grid;place-items:center;font-size:11.5px;font-weight:800;flex:none;background:var(--panel2);color:var(--ink2)}
.pessoa{display:flex;align-items:center;gap:10px;min-width:0}
.pessoa b{font-size:14px;display:block}.pessoa small{font-size:12px;color:var(--ink3)}

.lista>*{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.lista>*:first-child{border-top:0}

.alerta{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:color-mix(in oklab,var(--panel2) 70%,transparent)}
.alerta .dot{width:8px;height:8px;border-radius:50%;margin-top:6px;flex:none}

.aviso{border-radius:16px;padding:12px 18px;font-size:13px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px;background:color-mix(in oklab,var(--warn) 14%,transparent);color:var(--warn)}
.aviso b{font-weight:800}.aviso span{color:var(--ink2)}

/* gráficos */
.ch{position:relative}
.ch svg{display:block;overflow:visible}
.ch .yl{position:absolute;left:0;font-size:11px;color:var(--ink3);transform:translateY(-50%)}
.ch .xl{display:flex;justify-content:space-between;font-size:11px;color:var(--ink3);margin-top:6px}
.tipbox{position:absolute;pointer-events:none;background:var(--tip);border:1px solid var(--line);border-radius:12px;padding:8px 10px;font-size:12px;box-shadow:0 18px 40px -16px rgba(18,19,26,.45);white-space:nowrap;transform:translate(-50%,-110%);z-index:5;display:none}
.tipbox b{display:block;font-size:13px}
.leg{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ink2)}
.leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.hbar{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px;padding:6px 0}
.hbar .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
.hm{display:grid;gap:4px}
.hm .cell{height:34px;border-radius:9px;display:grid;place-items:center;font-size:11.5px;font-weight:700}

/* jornada */
.jornada{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.etapa{padding:14px 16px;border-radius:18px;background:color-mix(in oklab,var(--panel2) 70%,transparent);display:flex;flex-direction:column;gap:6px}
.etapa b{font-size:14px}.etapa small{font-size:12px;color:var(--ink3)}
.etapa.feito b::after{content:" ✓";color:var(--ok)}
.etapa.atual{color:#fff;background:linear-gradient(135deg,#1cc6f0,#0a7fe0);box-shadow:0 14px 30px -14px rgba(15,143,229,.9)}
.etapa.atual small{color:rgba(255,255,255,.85)}
.semanas{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;margin-top:12px}
.semanas i{height:8px;border-radius:999px;background:color-mix(in oklab,var(--ink3) 16%,transparent)}
.semanas i.f{background:var(--acc)}.semanas i.a{background:var(--acc2)}

/* kanban */
.kan{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.kan.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.col{border-radius:22px;padding:12px;background:color-mix(in oklab,var(--panel2) 60%,transparent);display:flex;flex-direction:column;gap:10px;min-height:200px}
.col-h{display:flex;justify-content:space-between;align-items:center;padding:4px 6px;font-weight:800;font-size:13px}
.kc{background:var(--panel);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);cursor:pointer;transition:transform .15s}
.kc:hover{transform:translateY(-2px)}
.kc b{font-size:14px}

/* calls */
.player{aspect-ratio:16/9;border-radius:20px;background:linear-gradient(135deg,#0b1220,#13233b);display:grid;place-items:center;position:relative;overflow:hidden}
.player .play{width:68px;height:68px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;cursor:pointer;background:linear-gradient(135deg,#1cc6f0,#0a7fe0);box-shadow:0 14px 30px -10px rgba(15,143,229,.9)}
.player .bar{position:absolute;left:18px;right:18px;bottom:16px;height:4px;border-radius:9px;background:rgba(255,255,255,.2)}
.player .bar i{display:block;height:100%;width:34%;border-radius:9px;background:#fff}
.player .meta{position:absolute;left:18px;top:16px;color:#fff;font-size:13px;font-weight:700}
.fala{display:grid;grid-template-columns:56px 90px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:14px;align-items:baseline}
.fala:first-child{border-top:0}
.fala .t{color:var(--acc);font-weight:700;font-size:12px;font-variant-numeric:tabular-nums}
.callitem{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:16px;cursor:pointer;border:1px solid transparent}
.callitem:hover{background:color-mix(in oklab,var(--panel2) 70%,transparent)}
.callitem.on{background:var(--panel2);border-color:color-mix(in oklab,var(--acc) 50%,transparent)}
ul.res{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px;color:var(--ink2);font-size:14px;line-height:1.45}

.modulo{border-radius:20px;border:1px solid var(--line);overflow:hidden}
.modulo-h{display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer;background:transparent;border:0;width:100%;text-align:left}
.aula{display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--line);font-size:14px}
.chk{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:none;border:1.5px solid var(--line2);color:#fff}
.chk.on{background:var(--ok);border-color:var(--ok)}
.chk svg{width:13px;height:13px}

.rod{font-size:11.5px;color:var(--ink3);margin-top:24px}

@media (max-width:1280px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g21,.g12{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){
  .shell{flex-direction:column}
  .side{width:100%;height:auto;position:static;padding:14px 16px}
  .nav{flex-direction:row;overflow-x:auto;gap:4px}
  .nav a{flex:none}
  .grupo,.side-fim .user{display:none}
  .side-fim{flex-direction:row;flex-wrap:wrap;align-items:center}
  .main{padding:16px}
  .g3,.g2,.kan,.kan.k4,.jornada{grid-template-columns:minmax(0,1fr)}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ph h1{font-size:24px}
}

/* ===== fluxogramas (v6.1 · 11/11/26) ===== */
.fx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-bottom:16px}
.fx-card{display:flex;flex-direction:column;gap:12px;padding:16px;transition:transform .15s}
.fx-card:hover{transform:translateY(-3px)}
.fx-thumb{border-radius:16px;background:color-mix(in oklab,var(--panel2) 70%,transparent);padding:10px;aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.fx-thumb svg{width:100%;height:100%}
.fx-card b{font-size:15px;line-height:1.25}
.fx-card .rodap{display:flex;justify-content:space-between;align-items:center;gap:8px}
.fx-wrap{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}
.fx-lista{display:flex;flex-direction:column;gap:4px;padding:10px}
.fx-lista a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:14px;font-size:13.5px;font-weight:600;color:var(--ink2)}
.fx-lista a:hover{color:var(--ink);background:color-mix(in oklab,var(--panel2) 70%,transparent)}
.fx-lista a.on{color:var(--ink);background:var(--panel2)}
.fx-lista .tile{width:34px;height:34px;border-radius:12px}
.fx-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.fx-bar .z{min-width:52px;text-align:center;font-size:13px;color:var(--ink2)}
.fx-bar .dica{margin-left:auto;font-size:12.5px;color:var(--ink3)}
.fx-view{position:relative;height:calc(100vh - 250px);min-height:560px;overflow:hidden;cursor:grab;touch-action:none;border-radius:0 0 24px 24px;
  background-image:radial-gradient(color-mix(in oklab,var(--ink3) 22%,transparent) 1px,transparent 1px);background-size:22px 22px}
.fx-view.drag{cursor:grabbing}
.fx-view:fullscreen{background-color:var(--bg);border-radius:0;height:100vh}
.fx-stage{position:absolute;left:0;top:0;transform-origin:0 0}
.fx-stage svg.fx-l{position:absolute;inset:0;overflow:visible;pointer-events:none}
.fx-l path{fill:none;stroke:color-mix(in oklab,var(--ink3) 80%,transparent);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;transition:opacity .2s,stroke .2s}
.fn{--c:var(--acc);box-sizing:border-box;position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;font-size:14px;line-height:1.3;color:var(--ink);cursor:pointer;user-select:none;overflow:hidden;overflow-wrap:break-word;z-index:1;transition:opacity .2s,box-shadow .2s,transform .2s;font-family:var(--font)}
.fn>div,.fn>i{max-width:100%}
.fn b,.fn strong{font-weight:800}
.fn.box{border-radius:14px;padding:6px 10px;background:color-mix(in oklab,var(--c) 14%,var(--panel));border:1.5px solid color-mix(in oklab,var(--c) 45%,transparent);box-shadow:0 10px 24px -18px rgba(18,19,26,.5)}
.fn.green{--c:var(--ok)}.fn.blue{--c:var(--acc)}.fn.orange{--c:var(--warn)}.fn.purple{--c:var(--violet)}.fn.pink{--c:var(--bad)}.fn.cream{--c:#f5b400}
.fn.pink,.fn.cream{font-weight:700}
.fn.pill{border-radius:999px;padding:2px 14px;font-weight:800;color:#fff;background:linear-gradient(135deg,#1cc6f0,#0a7fe0);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 24px -12px rgba(15,143,229,.9);letter-spacing:.02em}
.fn.it{font-style:italic;font-size:13.5px}
.fn.chip{border-radius:10px;padding:4px 10px;font-weight:800;font-style:italic;letter-spacing:.04em;background:color-mix(in oklab,#f5b400 22%,var(--panel));border:1.5px solid color-mix(in oklab,#f5b400 60%,transparent)}
.fn.note,.fn.verif{padding:18px 24px;font-size:16px;line-height:1.45;border-radius:18px}
.fn.note h3{margin:0 0 12px;font-size:1.05em;font-weight:800;text-align:center}
.fn.note p{margin:0 0 10px}
.fn.verif{flex-direction:column;align-items:stretch;font-size:14px}
.fn.verif h2{margin:0 0 12px;font-size:1.3em;font-weight:800;letter-spacing:.06em;text-align:center;white-space:nowrap}
.fn.verif ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.fn.verif li{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:12px;align-items:baseline;text-align:left}
.fn.verif li strong{white-space:nowrap}.fn.verif li strong::before{content:"•";margin-right:10px;color:var(--c)}
.fn.verif li em{font-size:.82em;text-align:center;color:var(--ink2)}
.fn.lev{flex-direction:column;align-items:stretch;text-align:left;padding:10px 16px}
.fn.lev h4{margin:0 0 6px;font-size:13.5px;font-weight:800;letter-spacing:.04em;text-align:center}
.fn.lev ul{margin:0;padding-left:18px;display:grid;gap:2px}
.fn.fx .eq{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;margin:2px 6px}
.fn.fx .eq span:first-child{border-bottom:2px solid currentColor;padding:0 6px}
.fn.fx .res,.fn.trap .num{color:var(--acc);font-weight:800;transition:opacity .35s}
.fn:not(.rev) .num,.fn:not(.rev) .res{opacity:0}
.fn.trap:not(.rev)::after{content:"clique para ver o número";position:absolute;bottom:20%;font-size:11px;font-weight:600;color:var(--ink3)}
.fn.fx:not(.rev)::after{content:"clique para ver a conta";position:absolute;bottom:10px;font-size:11px;font-weight:600;color:var(--ink3)}
.fn.dia,.fn.trap{overflow:visible;font-weight:800}
.fn.dia svg,.fn.trap svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fn.dia polygon{stroke:color-mix(in oklab,var(--c) 55%,transparent);stroke-width:1.5;fill:color-mix(in oklab,var(--c) 18%,var(--panel))}
.fn.dia{--c:var(--warn)}.fn.dia.d-red{--c:var(--bad)}.fn.dia.d-lime{--c:var(--ok)}.fn.dia.d-orange{--c:#ff7a1a}.fn.dia.d-yellow{--c:#f5b400}
.fn.dia span{position:relative;white-space:nowrap}
.fn.d-big{font-size:13px}
.fn.trap{flex-direction:column;padding:0;font-size:20px;letter-spacing:.05em}
.fn.trap polygon{stroke:color-mix(in oklab,var(--acc) 55%,transparent);stroke-width:2;fill:color-mix(in oklab,var(--acc) 16%,var(--panel))}
.fn.trap .lbl,.fn.trap .num{position:relative;max-width:66%}
.fn.trap .num{margin-top:6px;font-size:19px;letter-spacing:0}
.fx-stage.focus .fn{opacity:.2}
.fx-stage.focus .fx-l path{opacity:.12}
.fx-stage.focus .fn.on{opacity:1}
.fx-stage.focus .fn.sel{box-shadow:0 0 0 4px color-mix(in oklab,var(--acc) 40%,transparent);transform:scale(1.04);z-index:2}
.fx-stage.focus .fn.dia.sel{box-shadow:none;filter:drop-shadow(0 0 6px color-mix(in oklab,var(--acc) 70%,transparent))}
.fx-stage.focus .fx-l path.on{opacity:1;stroke:var(--acc);stroke-width:3}
@media (max-width:1100px){.fx-wrap{grid-template-columns:minmax(0,1fr)}.fx-lista{flex-direction:row;overflow-x:auto}.fx-lista a{flex:none}}
[hidden]{display:none!important}
.fn .big{font-size:1.07em}
.fn .sm{font-size:.86em;font-style:italic;color:var(--ink2)}
.fn .rows{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;text-align:left;font-style:normal;align-items:baseline}
.fn .ex{display:grid;grid-template-columns:repeat(5,auto);justify-content:center;align-items:center;gap:10px 18px;margin:4px 0 12px}
.fn .ex .k{font-weight:800;font-size:13px;letter-spacing:.06em}
.fn .ex .v{font-weight:800;font-size:24px;color:var(--acc)}
.fn .ex .arr{font-size:22px;color:var(--ink3)}

/* ===== agenda (v6.2 · 11/11/26) ===== */
.cal{border-top:1px solid var(--line)}
.cal-h{display:grid;grid-template-columns:56px repeat(7,minmax(0,1fr));border-bottom:1px solid var(--line)}
.cal-h div{padding:10px 6px;text-align:center;font-size:12px;color:var(--ink3);font-weight:700}
.cal-h div b{display:block;font-size:18px;color:var(--ink);margin-top:2px}
.cal-h div.hoje b{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#fff;background:linear-gradient(135deg,#1cc6f0,#0a7fe0)}
.cal-b{display:grid;grid-template-columns:56px repeat(7,minmax(0,1fr));position:relative}
.cal-hr{position:relative}
.cal-hr span{position:absolute;right:8px;font-size:11px;color:var(--ink3);transform:translateY(-50%)}
.cal-d{position:relative;border-left:1px solid var(--line);background-image:linear-gradient(var(--line) 1px,transparent 1px);background-size:100% 48px}
.cal-d.passado{background-color:color-mix(in oklab,var(--panel2) 45%,transparent)}
.cal-agora{position:absolute;left:0;right:0;height:2px;background:var(--bad);z-index:3}
.cal-agora::before{content:"";position:absolute;left:-5px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--bad)}
.ev{position:absolute;border-radius:10px;padding:5px 7px;font-size:11.5px;line-height:1.25;overflow:hidden;cursor:pointer;border:0;text-align:left;color:var(--ink);z-index:2;
  background:color-mix(in oklab,var(--c) 22%,var(--panel));box-shadow:inset 3px 0 0 var(--c);transition:transform .15s}
.ev:hover{transform:scale(1.02);z-index:4}
.ev b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev small{color:var(--ink2);white-space:nowrap}
.ev.feita{opacity:.7}
.ev.ocupado{--c:var(--ink3);cursor:default}
.slot{position:absolute;border-radius:10px;border:1.5px dashed color-mix(in oklab,var(--c) 55%,transparent);background:color-mix(in oklab,var(--c) 6%,transparent);color:var(--c);font-size:11px;font-weight:700;cursor:pointer;display:grid;place-items:center;z-index:1;transition:background .15s}
.slot:hover{background:color-mix(in oklab,var(--c) 18%,transparent)}
.cor-mat{--c:var(--acc)}.cor-cri{--c:var(--violet)}
.pedido{border-radius:18px;padding:14px;background:color-mix(in oklab,var(--panel2) 70%,transparent);display:flex;flex-direction:column;gap:8px}
.pedido .acoes{display:flex;gap:8px;flex-wrap:wrap}
.btn-ok,:root[data-theme=dark] .btn-ok{background:linear-gradient(135deg,#2fd39b,#12a877);color:#fff;border-color:#12a877}
.btn-bad{color:var(--bad)}
.passos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.passo{border-radius:18px;padding:14px;background:color-mix(in oklab,var(--panel2) 70%,transparent);display:flex;flex-direction:column;gap:6px;position:relative}
.passo .n{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,#1cc6f0,#0a7fe0)}
.passo b{font-size:14px}.passo span{font-size:12.5px;color:var(--ink2);line-height:1.45}
.auto{display:flex;flex-direction:column;gap:8px}
.auto>div{display:flex;align-items:center;gap:10px;font-size:13.5px}
.auto .ok{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:var(--ok);color:#fff;flex:none}
.auto .ok svg{width:13px;height:13px}
.lock{margin-left:auto;font-size:11px;font-weight:700;color:var(--ok)}
.modal-fundo{position:fixed;inset:0;background:rgba(5,5,7,.6);backdrop-filter:blur(4px);z-index:90;display:grid;place-items:center;padding:16px}
.modal{width:min(520px,100%);max-height:90vh;overflow-y:auto;background:var(--panel);border-radius:24px;border:1px solid var(--line);box-shadow:0 30px 80px -20px rgba(0,0,0,.6);padding:22px;display:flex;flex-direction:column;gap:14px}
.modal h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.01em}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-size:12px;font-weight:700;color:var(--ink2)}
.campo .input,.campo .select{width:100%}
.campo textarea.input{min-height:80px;resize:vertical;line-height:1.45}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.modal .rodape{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:4px}
.toast{position:fixed;right:24px;bottom:24px;z-index:95;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px 18px;box-shadow:0 20px 50px -18px rgba(0,0,0,.6);font-size:13.5px;display:flex;gap:10px;align-items:center;max-width:380px;animation:filtro-in .2s ease-out}
@keyframes filtro-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:900px){.passos{grid-template-columns:minmax(0,1fr)}.cal-h div b{font-size:14px}}
