
  :root{
    --navy:#1A2D3F; --navy2:#263C54; --navy3:#2E4D6B;
    --orange:#F4A72A; --orange-d:#E8813A;
    --steel:#7A9AB5; --ice:#EDF2F7; --line:#D8E0EA;
    --paper:#F4F6F9; --white:#FFFFFF;
    --red:#C0392B; --red-bg:#FBEAE7;
    --amber:#B7791F; --amber-bg:#FEF3E0;
    --green:#2E7D32; --green-bg:#E8F5E9;
    --gray:#6B7684; --gray-bg:#EEF0F3;
    --purple:#6B4FA0; --purple-bg:#EFE9F7;
    --ink:#22333F; --muted:#5B7085;
    --sans:'Segoe UI',system-ui,-apple-system,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.5;-webkit-font-smoothing:antialiased}
  .topbar{background:var(--navy);color:#fff;padding:14px 20px;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:20}
  .brand{font-weight:800;letter-spacing:.5px;font-size:15px;white-space:nowrap}
  .brand span{color:var(--orange)}
  .topbar .spacer{flex:1}
  .switcher{display:flex;gap:6px;background:var(--navy2);padding:4px;border-radius:10px}
  .switcher button{background:none;border:none;color:var(--steel);font:inherit;font-size:13px;font-weight:600;padding:6px 14px;border-radius:7px;cursor:pointer}
  .switcher button.active{background:var(--orange);color:var(--navy)}
  select#ceSelect{font:inherit;font-size:13px;padding:7px 12px;border-radius:8px;border:none;background:var(--navy2);color:#fff;cursor:pointer;max-width:200px}
  .wrap{max-width:960px;margin:0 auto;padding:22px 20px 80px}
  .weekband{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:6px}
  .weekband h1{font-size:23px;font-weight:800;color:var(--navy)}
  .weekband .sub{color:var(--muted);font-size:13px}
  .updated{color:var(--muted);font-size:12px;margin-bottom:18px}
  .hero{background:var(--navy);border-radius:16px;padding:20px 22px;color:#fff;margin-bottom:18px}
  .hero .greet{font-size:14px;color:var(--ice);margin-bottom:14px}
  .hero .greet b{color:var(--orange)}
  .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:9px}
  .kpi{background:var(--navy2);border-radius:11px;padding:10px 12px}
  .kpi .n{font-size:22px;font-weight:800;line-height:1}
  .kpi .l{font-size:10.5px;color:var(--steel);margin-top:5px}
  .kpi.warn .n{color:var(--orange)} .kpi.bad .n{color:#F2A6A0} .kpi.good .n{color:#9BDBA0} .kpi.purple .n{color:#C9A9F0}
  .ordem{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:18px}
  .ordem h3{font-size:14px;font-weight:800;color:var(--navy);margin-bottom:10px}
  .ordem ol{list-style:none;counter-reset:passo;display:flex;flex-direction:column;gap:9px}
  .ordem li{counter-increment:passo;display:flex;gap:11px;align-items:flex-start;font-size:13px}
  .ordem li::before{content:counter(passo);flex:none;width:22px;height:22px;border-radius:50%;background:var(--navy);color:var(--orange);font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}
  .ordem .porque{color:var(--muted);font-size:12.5px}
  .prog{display:flex;align-items:center;gap:10px;margin:2px 0 18px}
  .prog .bar{flex:1;height:8px;background:var(--line);border-radius:6px;overflow:hidden}
  .prog .fill{height:100%;background:var(--green);width:0;transition:width .3s}
  .prog .lbl{font-size:12.5px;color:var(--muted);font-weight:600;white-space:nowrap}
  .sec{background:var(--white);border:1px solid var(--line);border-radius:14px;margin-bottom:14px;overflow:hidden}
  .sec.destaque-sec{border:2px solid var(--purple)}
  .sec>h2{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:700;color:var(--navy);padding:14px 18px;border-bottom:1px solid var(--line)}
  .sec>h2 .tag{margin-left:auto;font-size:12px;font-weight:700;padding:3px 10px;border-radius:20px;background:var(--ice);color:var(--navy3)}
  .sec .body{padding:8px 18px 16px}
  .dot{width:9px;height:9px;border-radius:50%;flex:none}
  .dot.o{background:var(--orange)} .dot.n{background:var(--navy3)} .dot.r{background:var(--red)}
  .dot.a{background:var(--amber)} .dot.g{background:var(--green)} .dot.p{background:var(--purple)} .dot.gray{background:var(--gray)}
  .empty{color:var(--muted);font-size:13px;padding:6px 0 2px;font-style:italic}
  .item{display:flex;align-items:flex-start;gap:11px;padding:11px 0;border-bottom:1px solid #EEF1F5}
  .item:last-child{border-bottom:none}
  .item input[type=checkbox]{appearance:none;width:19px;height:19px;border:2px solid var(--steel);border-radius:5px;cursor:pointer;flex:none;margin-top:2px;position:relative}
  .item input[type=checkbox]:checked{background:var(--green);border-color:var(--green)}
  .item input[type=checkbox]:checked::after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
  .item .txt{flex:1;font-size:13.5px}
  .item .txt .school{font-weight:700;color:var(--navy)}
  .item .txt a.school{text-decoration:none;border-bottom:1px dashed var(--steel)}
  .item .txt a.school:hover{border-bottom-style:solid;color:var(--orange-d)}
  .item.done .txt{opacity:.5;text-decoration:line-through}
  .ctxrow{margin-top:5px;font-size:12.5px;color:var(--ink)}
  .ctxrow .lb{font-weight:700;color:var(--navy3)}
  .acao{margin-top:4px;font-size:12.5px;color:var(--ink)}
  .acao .lb{font-weight:700;color:var(--orange-d)}
  .macro{margin-top:4px;font-size:12px;color:var(--muted)}
  .macro code{background:var(--ice);padding:1px 7px;border-radius:5px;color:var(--navy3);font-weight:600}
  .fin{margin-top:6px;font-size:12.5px;background:var(--ice);border-radius:8px;padding:7px 10px;display:inline-block}
  .fin b{color:var(--navy3)}
  .pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;margin-left:6px;vertical-align:middle}
  .pill.r{background:var(--red-bg);color:var(--red)} .pill.a{background:var(--amber-bg);color:var(--amber)}
  .pill.g{background:var(--green-bg);color:var(--green)} .pill.o{background:#FDECD2;color:var(--orange-d)}
  .pill.gray{background:var(--gray-bg);color:var(--gray)} .pill.purple{background:var(--purple-bg);color:var(--purple)}
  .ctx-badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;margin-left:6px;background:var(--red-bg);color:var(--red)}
  .ctx-badge.leve{background:var(--amber-bg);color:var(--amber)}
  .subhead{font-size:12.5px;font-weight:700;color:var(--navy3);margin:12px 0 2px}
  .note{font-size:12.5px;color:var(--muted);background:var(--ice);border-radius:9px;padding:9px 12px;margin-top:8px}
  .foot{text-align:center;color:var(--muted);font-size:11.5px;margin-top:26px}
  .week5{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
  .week5 .d{background:var(--ice);border:1px solid var(--line);border-radius:10px;padding:12px 10px;text-align:left;min-height:92px}
  .week5 .d .dn{font-size:12px;font-weight:800;color:var(--navy3);margin-bottom:6px;text-align:center}
  .week5 .d .ph{font-size:11px;color:var(--ink);margin-top:3px;line-height:1.35}
  @media(max-width:600px){.week5{grid-template-columns:repeat(2,1fr)}}
  .canais-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .canal-card{background:var(--ice);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
  .canal-tit{font-size:13px;font-weight:800;color:var(--navy);margin-bottom:9px;padding-bottom:7px;border-bottom:2px solid var(--orange);display:inline-block}
  .canal-line{font-size:12px;color:var(--ink);line-height:1.45;margin-bottom:7px}
  .canal-line .lb{font-weight:700;color:var(--navy3)}
  .canal-note{margin-top:6px;font-size:11.5px;color:var(--muted);font-style:italic;border-top:1px dashed var(--steel);padding-top:8px}
  @media(max-width:700px){.canais-grid{grid-template-columns:1fr}}
  .diaguia{display:flex;gap:11px;align-items:flex-start;margin-bottom:11px}
  .diaguia:last-child{margin-bottom:0}
  .diaguia .dlabel{flex:none;width:74px;font-size:12px;font-weight:800;color:#fff;background:var(--navy3);border-radius:7px;padding:6px 8px;text-align:center}
  .diaguia .dtext{font-size:12.5px;color:var(--ink);line-height:1.45}
  .diaguia .dtext b{color:var(--navy3)}
  .diaguia .dwhy{color:var(--muted);font-size:11.5px}
  table.lead{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:12.5px}
  table.lead thead th{background:var(--navy);color:#fff;font-weight:600;font-size:11.5px;padding:10px 8px;text-align:center;white-space:nowrap}
  table.lead thead th.name{text-align:left}
  table.lead td{padding:9px 8px;text-align:center;border-top:1px solid var(--line)}
  table.lead td.name{text-align:left;font-weight:600;color:var(--navy);white-space:nowrap}
  table.lead td.name a{text-decoration:none;border-bottom:1px dashed var(--steel)}
  table.lead tbody tr:hover{background:var(--ice)}
  .cellnum{font-weight:700}.cellnum.zero{color:#C3CDD9;font-weight:400}
  .cellnum.r{color:var(--red)}.cellnum.a{color:var(--amber)}.cellnum.o{color:var(--orange-d)}.cellnum.g{color:var(--green)}.cellnum.p{color:var(--purple)}
  .rowtot{background:var(--paper);font-weight:700}.rowtot td{border-top:2px solid var(--navy)}
  .lead-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:18px}
  .lead-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 15px}
  .lead-card .n{font-size:24px;font-weight:800;color:var(--navy)}
  .lead-card .n.r{color:var(--red)}.lead-card .n.a{color:var(--amber)}.lead-card .n.o{color:var(--orange-d)}.lead-card .n.p{color:var(--purple)}
  .lead-intro{color:var(--muted);font-size:13px;margin-bottom:16px}
  .lead-sub{font-size:15px;font-weight:700;color:var(--navy);margin:22px 0 10px}
  .scroll{overflow-x:auto}
  /* Painel: tabela responsiva, CE sticky no scroll horizontal, filtro e resumo por time */
  .lead-wrap{max-width:100%;width:100%;padding-left:16px;padding-right:16px;box-sizing:border-box}
  .lead-filtro{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
  .lead-filtro label{font-size:13px;font-weight:600;color:var(--navy)}
  .lead-filtro select{padding:8px 12px;border:1px solid var(--line);border-radius:9px;font-size:13px;background:#fff;color:var(--ink);min-width:220px}
  .lead-filtro .filtro-travado{font-size:13px;color:var(--ink2)}
  .lead-filtro .filtro-travado b{color:var(--navy)}
  .lead-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:14px;background:#fff;max-width:100%}
  .lead-scroll table.lead{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;border:none;border-radius:0;overflow:visible}
  .lead-scroll table.lead thead th{position:sticky;top:0;z-index:2}
  .lead-scroll table.lead thead th.name{position:sticky;left:0;z-index:4;background:var(--navy);box-shadow:2px 0 0 var(--navy)}
  .lead-scroll table.lead td{background:#fff}
  .lead-scroll table.lead td.name{position:sticky;left:0;z-index:3;background:#fff;box-shadow:2px 0 0 var(--line)}
  .lead-scroll table.lead td.lider,.lead-scroll table.lead td.segmento{text-align:left;white-space:nowrap;font-size:12px;color:var(--ink2)}
  .lead-scroll table.lead tbody tr:hover td{background:var(--ice)}
  .lead-scroll table.lead tbody tr:hover td.name{background:var(--ice)}
  .lead-scroll table.lead tr.rowtot td{background:var(--paper)}
  .lead-scroll table.lead tr.rowtot td.name{background:var(--paper)}
  .time-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:18px}
  .time-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
  .time-card .time-nome{font-size:14px;font-weight:800;color:var(--navy);margin-bottom:4px}
  .time-card .time-meta{font-size:12px;color:var(--muted);margin-bottom:10px}
  .time-card .time-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
  .time-card .time-nums .n{display:block;font-size:20px;font-weight:800;color:var(--navy)}
  .time-card .time-nums .n.r{color:var(--red)}
  .time-card .time-nums .l{display:block;font-size:11px;color:var(--muted)}
  .time-card .time-resultados{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:11.5px;color:var(--ink2)}
  .time-card .time-resultados span{background:var(--paper);border-radius:999px;padding:3px 8px}
  @media(max-width:900px){
    .lead-wrap{padding-left:10px;padding-right:10px}
    .lead-scroll table.lead{font-size:11.5px}
    .lead-scroll table.lead thead th,.lead-scroll table.lead td{padding:8px 6px}
    .lead-filtro select{min-width:0;width:100%}
  }
  .login{max-width:380px;margin:60px auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px 26px;text-align:center}
  .login .ic{width:52px;height:52px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;color:var(--orange);font-size:24px}
  .login input{width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:9px;font-size:14px;margin-bottom:10px;outline:none}
  .login button{width:100%;padding:11px;border:none;border-radius:9px;background:var(--orange);color:var(--navy);font-weight:700;font-size:14px;cursor:pointer}

  /* Bloco adicionado por gen_html.py (linhas 4-28) em cima do CSS base. Mantido
     igual para o guia não mudar de aparência. */
  .sec>h2{cursor:pointer;user-select:none}
  .sec>h2 .caret{margin-left:auto;font-size:12px;color:var(--steel);transition:transform .2s}
  .sec>h2 .tag{margin-left:8px}
  .sec.collapsed .body{display:none}
  .sec.collapsed h2 .caret{transform:rotate(-90deg)}
  .kpi{cursor:pointer;text-decoration:none;display:block;transition:transform .1s}
  .kpi:hover{transform:translateY(-2px);outline:2px solid var(--orange)}
  .dlabel .cnt{display:block;font-size:16px;margin-top:3px}
  .resumo{background:var(--navy2);border-radius:14px;padding:16px 18px;margin-bottom:18px;color:#EDF2F7;font-size:13px;line-height:1.55}
  .resumo h3{color:var(--orange);font-size:13px;font-weight:800;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}
  .resumo b{color:#fff}
  .kpi.o .n{color:var(--orange)}
  .macro{margin-top:5px;font-size:11.5px;color:var(--muted)}
  .macro code{background:var(--ice);padding:1px 7px;border-radius:5px;color:var(--navy3);font-weight:700}
  .busca{width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:10px;font-size:13px;margin:10px 0 4px;outline:none}
  .busca:focus{border-color:var(--orange)}
  .params{background:var(--ice);border:1px solid var(--line)}
  .params table{width:100%;border-collapse:collapse;font-size:12.5px}
  .params td{padding:6px 8px;border-top:1px solid var(--line);vertical-align:top}
  .params td.k{font-weight:700;color:var(--navy3);white-space:nowrap;width:44%}
  .esforco{margin-top:4px;font-size:12px;color:var(--muted)}
  .desf{margin-top:5px;font-size:12px;color:var(--navy3)}
  .desf select{font:inherit;font-size:12px;padding:3px 6px;border:1px solid var(--line);border-radius:6px;background:#fff;margin-left:4px}

  /* Novo: os checks agora vão para a API em vez do localStorage, então o CE precisa
     ver quando a gravação falhou. Sem isso ele marcaria o check e perderia o
     progresso sem saber. */
  .item.salvando .txt{opacity:.6}
  .item.erro{background:var(--red-bg);border-radius:8px}
  .aviso{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-size:12.5px;font-weight:600;padding:10px 16px;border-radius:10px;z-index:50;display:none}
  .aviso.on{display:block}
  .topbar a.sair{color:var(--steel);font-size:12.5px;text-decoration:none;font-weight:600}
  .topbar a.sair:hover{color:#fff}

  /* Novo: classes que substituem os atributos style= inline do gerador original.

     O gen_html.py escrevia o estilo direto na marcação, o que obrigaria a CSP a
     aceitar style-src 'unsafe-inline' — e aí um atributo style vindo de dado
     externo passaria junto. Cada classe abaixo repete, declaração por declaração,
     exatamente o que estava no atributo correspondente, então o resultado
     renderizado é o mesmo do HTML aprovado. */
  .topbar .who{color:#fff;font-size:13px;font-weight:600}
  .resumo.arrasto{background:var(--amber-bg);color:#7a5a12}
  .resumo.arrasto b{color:#7a5a12}
  .prog.por-dia{margin:4px 0 10px}
  .dwhy.excedente{color:#F2A6A0;margin:6px 0 10px}
  .dwhy.explica{margin:4px 0 8px}
  .weekband.detalhe{margin-top:8px}
  .weekband.detalhe h1{font-size:18px}
  .entrar{max-width:520px;margin-top:60px}
  .entrar a.google{display:inline-block;background:var(--orange);color:var(--navy);font-weight:700;padding:9px 18px;border-radius:9px;text-decoration:none;margin-top:4px}
  .entrar .erro{color:#F2A6A0;margin-top:10px;min-height:18px}

  /* Novo: impersonação. A barra superior fica vermelha e acompanha o scroll, então
     não existe posição da página em que dê para confundir o guia de outra pessoa
     com o próprio. */
  .topbar.imperso{background:var(--red)}
  .imperso-band{background:var(--red-bg);border:1px solid var(--red);border-radius:12px;padding:12px 16px;margin-bottom:16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .imperso-band .tit{font-size:13px;font-weight:800;color:var(--red);text-transform:uppercase;letter-spacing:.5px}
  .imperso-band .txt{font-size:12.5px;color:var(--ink);flex:1;min-width:220px}
  .imperso-band a{font-size:12.5px;font-weight:700;color:var(--navy);text-decoration:none;border-bottom:1px dashed var(--steel);white-space:nowrap}
  .imperso-band a:hover{color:var(--red)}
  .somente-leitura .item input[type=checkbox]{cursor:not-allowed;opacity:.55}
  .somente-leitura .desf select{cursor:not-allowed;opacity:.65}
  .ce-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:18px}
  .ce-lista a{background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:13px;font-weight:600;color:var(--navy);text-decoration:none}
  .ce-lista a:hover{border-color:var(--orange);color:var(--orange-d)}
  table.trilha{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:12.5px}
  table.trilha th{background:var(--ice);color:var(--navy3);font-weight:700;font-size:11.5px;padding:8px;text-align:left}
  table.trilha td{padding:8px;border-top:1px solid var(--line)}
