:root{
  --bg:#eef3fb;--card:#fff;--ink:#14213d;--mut:#5d6b88;--line:#dbe4f3;--acc:#3b5bfd;--acc-ink:#fff;--acc-soft:#e3e9ff;
  --reel:#3b5bfd;--carrossel:#00a889;--story:#ff7a59;--post:#a24bff;
  --ok:#00875a;--warn:#b25e00;--err:#c4262e;--warn-bg:#fff2dc;--err-bg:#ffe6e6;--ok-bg:#dff7ee;
  --r:18px;--r-s:12px;--nav-h:64px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);
  --sombra:0 1px 2px rgba(20,33,61,.06),0 4px 14px rgba(20,33,61,.05);
}
@media(prefers-color-scheme:dark){:root{
  --bg:#0f1730;--card:#17213f;--ink:#eaf0ff;--mut:#9aa8c7;--line:#26335a;--acc:#6f87ff;--acc-ink:#0b1230;--acc-soft:#212d5c;
  --reel:#7f93ff;--carrossel:#2fd3b3;--story:#ff9477;--post:#c58bff;
  --ok:#3ddc9c;--warn:#ffb454;--err:#ff7d83;--warn-bg:#3a2f14;--err-bg:#3d1c25;--ok-bg:#12372d;
  --sombra:0 1px 2px rgba(0,0,0,.3);}}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{font:500 15px/1.45 Manrope,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink);
  -webkit-tap-highlight-color:transparent;min-height:100dvh;overscroll-behavior-y:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation;border:0;background:none}
a{color:var(--acc)}
h1,h2,h3{font-weight:800;letter-spacing:-.02em}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px;border-radius:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* esqueleto */
.shell{display:flex;flex-direction:column;min-height:100dvh}
.topo{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);
  padding:calc(10px + var(--safe-t)) 16px 10px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line)}
.marca{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.03em}
.marca img{width:34px;height:34px}
.nav{display:none;gap:4px;margin-left:12px}
.nav a,.tab{color:var(--mut);text-decoration:none;font-weight:700}
.nav a{padding:9px 14px;border-radius:99px}
.nav a[aria-current=page]{background:var(--acc);color:var(--acc-ink)}
.topo .sp{flex:1}
.quem{font-size:13px;color:var(--mut);display:none}
main{flex:1;padding:16px 16px calc(var(--nav-h) + var(--safe-b) + 24px);max-width:1280px;width:100%;margin:0 auto}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(5,1fr);
  background:var(--card);border-top:1px solid var(--line);padding-bottom:var(--safe-b)}
.tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:var(--nav-h);font-size:11px;min-width:0}
.tab svg{width:24px;height:24px}
.tab[aria-current=page]{color:var(--acc)}
@media(min-width:860px){
  .nav{display:flex}.tabs{display:none}.quem{display:block}
  main{padding:24px 28px 48px}.topo{padding:12px 28px}
}

/* componentes */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sombra)}
.btn{text-decoration:none;min-height:44px;padding:0 18px;border-radius:99px;background:var(--acc);color:var(--acc-ink);font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn.sec{background:var(--acc-soft);color:var(--acc)}
.btn.fantasma{background:none;color:var(--mut);border:1px solid var(--line)}
.btn[disabled]{opacity:.5;cursor:default}
@media(hover:hover){.btn:not([disabled]):hover{filter:brightness(1.07)}.fcard:hover{border-color:var(--acc)}}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;padding:3px 10px;border-radius:99px;
  background:color-mix(in srgb,var(--k,var(--acc)) 16%,transparent);color:var(--k,var(--acc));white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.chip.Reel{--k:var(--reel)}.chip.Carrossel{--k:var(--carrossel)}.chip.Story{--k:var(--story)}.chip.Post{--k:var(--post)}
.chip.ok{--k:var(--ok)}.chip.warn{--k:var(--warn)}.chip.err{--k:var(--err)}.chip.neutro{--k:var(--mut)}
.titulo-pag{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.titulo-pag h1{font-size:26px;flex:1;min-width:140px}
.sub{color:var(--mut);font-size:14px}
.vazio{padding:32px 20px;text-align:center;color:var(--mut)}
.banner{border-radius:var(--r-s);padding:12px 14px;margin-bottom:14px;font-weight:600;display:flex;gap:10px;align-items:flex-start}
.banner.err{background:var(--err-bg);color:var(--err)}.banner.warn{background:var(--warn-bg);color:var(--warn)}.banner.ok{background:var(--ok-bg);color:var(--ok)}
.seg{display:flex;background:var(--card);border:1px solid var(--line);border-radius:99px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{flex:1;min-height:40px;padding:0 14px;border-radius:99px;font-weight:700;color:var(--mut);white-space:nowrap}
.seg button[aria-pressed=true]{background:var(--acc);color:var(--acc-ink)}
input[type=date],input[type=url],select{min-height:44px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--card);padding:0 12px;width:100%;font-size:16px}
label.campo{display:block;font-size:13px;font-weight:700;color:var(--mut);margin-bottom:6px}

/* calendário */
.semana-nav{display:flex;align-items:center;gap:8px}
.semana-nav .btn{min-width:44px;padding:0 14px}
.semana{display:grid;grid-template-columns:1fr;gap:12px}
.dia{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px;min-width:0}
.dia.hoje{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-soft)}
.dia h3{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);display:flex;justify-content:space-between;margin-bottom:8px}
.dia.hoje h3{color:var(--acc)}
.dia .nada{color:var(--mut);font-size:13px;padding:2px 0 4px}
@media(min-width:700px){.semana{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;align-items:start}}
@media(min-width:1180px){.semana{grid-template-columns:repeat(7,minmax(0,1fr))}.dia{min-height:260px;padding:10px}}
.fcard{display:block;width:100%;text-align:left;background:var(--bg);border:1px solid var(--line);border-left:5px solid var(--k);border-radius:var(--r-s);padding:10px 12px;margin-bottom:8px;min-height:44px}
.fcard.Reel{--k:var(--reel)}.fcard.Carrossel{--k:var(--carrossel)}.fcard.Story{--k:var(--story)}.fcard.Post{--k:var(--post)}
.fcard .h{font-weight:800;font-variant-numeric:tabular-nums;color:var(--k);font-size:13px;display:flex;gap:6px;align-items:center;justify-content:space-between}
.fcard .t{font-weight:700;line-height:1.3;margin:2px 0 6px;overflow-wrap:break-word;hyphens:auto}
.fcard .m{display:flex;gap:6px;flex-wrap:wrap}
.fcard.cancelado{opacity:.55}.fcard.cancelado .t{text-decoration:line-through}
.gd{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--mut)}
.gd.ok{background:var(--ok)}.gd.erro,.gd.falta{background:var(--err)}

/* a gravar */
.grupo{margin-bottom:18px}
.grupo h2{font-size:14px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.lista{display:grid;gap:8px}
@media(min-width:860px){.lista{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* carga */
.carga{display:grid;gap:10px}
.crow{display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;padding:12px 14px;width:100%;text-align:left}
.crow .rot{font-weight:800}.crow .rot small{display:block;color:var(--mut);font-weight:600}
.barra{height:14px;border-radius:99px;background:var(--line);display:flex;overflow:hidden}
.barra i{display:block;height:100%}
.crow .n{font-weight:800;font-size:20px;text-align:right;min-width:28px}
.crow .extra{grid-column:2/4;display:flex;gap:6px;flex-wrap:wrap}
@media(min-width:860px){.crow{grid-template-columns:140px 1fr 60px 220px}.crow .extra{grid-column:auto;justify-content:flex-end}}
.legenda{display:flex;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--mut);margin-bottom:12px}
.legenda b{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px}

/* importar */
.form{display:grid;gap:14px;padding:16px;margin-bottom:16px}
@media(min-width:700px){.form .duas{display:grid;grid-template-columns:1fr 1fr;gap:14px}}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips button{min-height:40px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:var(--card);font-weight:700}
.chips button[aria-pressed=true]{background:var(--acc-soft);color:var(--acc);border-color:var(--acc)}
.tab-imp{display:grid;gap:8px}
.irow{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px 14px}
.irow .t{font-weight:700;overflow-wrap:anywhere}
.irow .av{grid-column:1/-1;font-size:13px;color:var(--warn)}
@media(min-width:860px){.irow{grid-template-columns:96px 70px 1fr auto auto}.irow .av{grid-column:3/-1}}

/* ficha (folha) */
.veu{position:fixed;inset:0;background:rgba(10,18,40,.5);z-index:40}
.folha{position:fixed;z-index:41;background:var(--bg);overflow:auto;overscroll-behavior:contain;
  left:0;right:0;bottom:0;max-height:92dvh;border-radius:24px 24px 0 0;padding:6px 16px calc(24px + var(--safe-b));box-shadow:0 -8px 40px rgba(0,0,0,.25)}
.folha .pega{width:44px;height:5px;border-radius:9px;background:var(--line);margin:6px auto 12px}
@media(min-width:860px){.folha{left:auto;top:0;width:560px;max-height:none;border-radius:0;padding:20px 24px 32px}.folha .pega{display:none}}
.folha header{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;margin-bottom:12px}
.folha h2{font-size:22px;line-height:1.2;overflow-wrap:anywhere}
.bloco{padding:14px;margin-bottom:12px}
.bloco h3{font-size:13px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14px}.kv dt{color:var(--mut)}.kv dd{margin:0;font-weight:700;overflow-wrap:anywhere}
pre.guiao{white-space:pre-wrap;overflow-wrap:anywhere;font:500 14px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s);padding:12px;max-height:340px;overflow:auto}
.prob{display:flex;gap:8px;font-size:14px;padding:6px 0;align-items:flex-start}
.prob .chip{flex:none}
.fecho{min-width:44px;min-height:44px;border-radius:50%;background:var(--card);border:1px solid var(--line);font-size:20px;line-height:1;flex:none}
details summary{cursor:pointer;font-weight:800;min-height:32px}

/* ajuda */
.ajuda{display:grid;gap:12px}
.ajuda .card{padding:16px 18px}
.ajuda h2{font-size:17px;margin-bottom:6px}
.ajuda p,.ajuda li{color:var(--ink);margin-bottom:6px}.ajuda ul{padding-left:20px}

/* login */
.entrada{min-height:100dvh;display:grid;place-items:center;padding:24px}
.entrada .card{padding:32px 24px;max-width:380px;width:100%;text-align:center;display:grid;gap:16px}
.entrada img{width:72px;height:72px;margin:0 auto}
.entrada h1{font-size:32px}

#toasts{position:fixed;left:12px;right:12px;bottom:calc(var(--nav-h) + var(--safe-b) + 12px);z-index:60;display:grid;gap:8px;pointer-events:none}
.toast{background:var(--ink);color:var(--bg);padding:12px 16px;border-radius:var(--r-s);font-weight:700;box-shadow:var(--sombra);pointer-events:auto}
.toast.err{background:var(--err);color:#fff}
@media(min-width:860px){#toasts{left:auto;right:24px;bottom:24px;width:380px}}
@media(prefers-reduced-motion:no-preference){.folha{animation:sobe .22s ease-out}@keyframes sobe{from{transform:translateY(24px);opacity:0}}
 @media(min-width:860px){.folha{animation:entra .2s ease-out}@keyframes entra{from{transform:translateX(24px);opacity:0}}}}
