/* Bloco "Semana" da aba Planejamento.

   Espaço, raio, sombra e tipografia continuam saindo dos tokens do painel. A cor
   é a única coisa que nasce aqui: cada dia da semana tem a sua, porque a faixa
   de sete cards iguais não dizia nada ao olho. Cada cor vem em par, uma viva
   (--fs-<dia>) para faixa, borda e fundo suave, e uma fechada (--fs-<dia>-ink)
   para texto. A fechada é a que passa em AA sobre branco e sobre o fundo suave
   do próprio dia; a viva nunca carrega texto em cima. Os pares de segunda,
   quarta e sexta são os tokens que o painel já tinha (terracota WLB, lilás e
   verde de publicado); os outros quatro seguem a mesma régua de contraste. */
/* As sete cores moram no :root, e não dentro de .fs, porque o calendário
   unificado da mesma aba usa as mesmas para o cabeçalho dos dias e para o fundo
   de cada célula. Um lugar só: se a cor de um dia mudar aqui, muda nos dois. */
:root{
  --fs-seg:#D97559; --fs-seg-ink:#A8472E;
  --fs-ter:#C0392B; --fs-ter-ink:#922B21;
  --fs-qua:#9B7BC7; --fs-qua-ink:#6B3FA0;
  --fs-qui:#3E8CA8; --fs-qui-ink:#1F5F75;
  --fs-sex:#3E8560; --fs-sex-ink:#2F6B4C;
  --fs-sab:#D6558A; --fs-sab-ink:#A32E67;
  --fs-dom:#E0A32B; --fs-dom-ink:#8A5E0F;
}
/* A cor de um dia chega a qualquer elemento por data-fs-dia, com 0 no domingo,
   igual ao Date.getDay() do navegador. */
[data-fs-dia="1"]{--fs-cor:var(--fs-seg);--fs-ink:var(--fs-seg-ink)}
[data-fs-dia="2"]{--fs-cor:var(--fs-ter);--fs-ink:var(--fs-ter-ink)}
[data-fs-dia="3"]{--fs-cor:var(--fs-qua);--fs-ink:var(--fs-qua-ink)}
[data-fs-dia="4"]{--fs-cor:var(--fs-qui);--fs-ink:var(--fs-qui-ink)}
[data-fs-dia="5"]{--fs-cor:var(--fs-sex);--fs-ink:var(--fs-sex-ink)}
[data-fs-dia="6"]{--fs-cor:var(--fs-sab);--fs-ink:var(--fs-sab-ink)}
[data-fs-dia="0"]{--fs-cor:var(--fs-dom);--fs-ink:var(--fs-dom-ink)}
.fs{
  /* Cor por tipo de gravação, usada nos chips de capacidade e nos marcadores de
     grupo. Todas medidas em AA sobre branco e sobre o próprio fundo suave. */
  --fs-t-narrado:#2F6E8C; --fs-t-aula:#6B3FA0; --fs-t-talking:#A8472E;
  --fs-t-broll:#2F6B4C; --fs-t-pov:#4A5B6B; --fs-t-sem:var(--fg2);
  --fs-cor:var(--accent); --fs-ink:var(--accent-aa);
  margin-bottom:var(--sp-12);
}
.fs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Cabeçalho ---------- */
.fs-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-6)}
.fs-head h2{font-size:1.8em;font-weight:900;letter-spacing:-.02em;line-height:1.2;background:linear-gradient(100deg,var(--accent-aa),var(--lilac-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.fs-head h2 span{font-family:Chalkiez,cursive;font-weight:400}
.fs-head p{color:var(--fg2);margin-top:var(--sp-1)}
.fs-tools{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.fs-nav{display:flex;align-items:center;gap:var(--sp-1)}
.fs-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:44px;padding:var(--sp-2) var(--sp-4);border:1px solid var(--line-strong);border-radius:var(--r-pill);background:var(--white);color:var(--fg1);font-weight:700;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
.fs-btn:hover{border-color:var(--accent-aa);background:var(--accent-wash)}
.fs-btn.ghost{border-color:transparent;background:transparent;font-weight:600;color:var(--fg2)}
.fs-btn.ghost:hover{background:var(--accent-wash);color:var(--accent-aa)}
.fs-nav .fs-btn{width:44px;padding:0;font-size:1.3em;line-height:1}
/* Pílula de marca: a cor vem da configuração da instância (--fs-marca), então o
   tom de texto é derivado dela, e não escrito à mão, para continuar legível com
   qualquer marca que o aluno configure. */
.fs-pill{--fs-fundo:color-mix(in srgb,var(--fs-marca,var(--accent)) 60%,var(--dark));border:1.5px solid color-mix(in srgb,var(--fs-marca,var(--accent)) 55%,transparent);color:var(--fs-fundo);font-weight:800}
.fs-pill.duas{--fs-fundo:var(--accent-aa);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
.fs-pill:hover{background:color-mix(in srgb,var(--fs-marca,var(--accent)) 10%,var(--white));border-color:var(--fs-fundo)}
.fs-pill.on{background:var(--fs-fundo);color:var(--white);border-color:transparent;box-shadow:0 4px 14px color-mix(in srgb,var(--fs-marca,var(--accent)) 35%,transparent)}
.fs-pill.duas.on{background:linear-gradient(120deg,color-mix(in srgb,var(--fs-marca,var(--accent)) 60%,var(--dark)),color-mix(in srgb,var(--fs-marca2,var(--lilac-mid)) 60%,var(--dark)))}
.fs-btn.criar{background:linear-gradient(120deg,var(--accent-aa),var(--lilac-deep));color:var(--white);border-color:transparent;font-weight:800;box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 40%,transparent)}
.fs-btn.criar:hover{transform:translateY(-2px);box-shadow:0 10px 24px color-mix(in srgb,var(--lilac-mid) 45%,transparent);background:linear-gradient(120deg,var(--accent-aa),var(--lilac-deep))}
.fs-btn:focus-visible,.fs input:focus-visible,.fs button:focus-visible{outline:2px solid var(--accent-aa);outline-offset:3px}

/* ---------- Faixa dos sete dias ---------- */
.fs-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--sp-3);margin-bottom:var(--sp-8)}
.fs-day{position:relative;display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-4) var(--sp-3) var(--sp-3);border:1px solid color-mix(in srgb,var(--fs-cor) 38%,transparent);border-radius:var(--r-md);background:linear-gradient(170deg,color-mix(in srgb,var(--fs-cor) 12%,var(--white)),var(--white) 62%);box-shadow:0 3px 12px color-mix(in srgb,var(--fs-cor) 16%,transparent);min-width:0;overflow:hidden}
.fs-day::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:linear-gradient(90deg,var(--fs-cor),color-mix(in srgb,var(--fs-cor) 40%,var(--lilac)))}
.fs-day.hoje{border-color:var(--fs-cor);box-shadow:0 0 0 2px color-mix(in srgb,var(--fs-cor) 40%,transparent),0 12px 28px color-mix(in srgb,var(--fs-cor) 32%,transparent)}
.fs-ico{position:absolute;top:var(--sp-3);right:var(--sp-2);font-size:1.7em;line-height:1;opacity:.6}
.fs-day-top{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;padding-right:1.9em}
.fs-dow{font-size:.74em;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--fs-ink)}
.fs-selo{font-size:.66em;letter-spacing:.08em;text-transform:uppercase;font-weight:800;padding:2px var(--sp-2);border-radius:var(--r-pill);background:var(--fs-ink);color:var(--white)}
.fs-date{font-size:1.45em;font-weight:900;line-height:1;color:var(--fs-ink);letter-spacing:-.02em}
/* O papel do dia é um título editável, não um campo de formulário: sem moldura
   até o foco, com um lápis discreto ao lado avisando que dá para clicar. */
.fs-papel{display:flex;align-items:center;gap:0;margin-top:var(--sp-1);margin-left:calc(-1 * var(--sp-1))}
/* A regra do Flow Curto (.fc input) desenha caixa de formulário em todo campo, e
   esta tela vive dentro de um .fc: por isso a mesma especificidade aqui, para o
   papel do dia virar título e não campo. */
.fs .fs-day input:not([type="checkbox"]){flex:1;width:auto;min-width:0;border:1px solid transparent;background:transparent;color:var(--fs-ink);border-radius:var(--r-sm);padding:var(--sp-1) var(--sp-1);font:inherit;font-size:.98em;font-weight:900;letter-spacing:-.02em;line-height:1.25;text-overflow:ellipsis}
.fs .fs-day input:not([type="checkbox"]):hover{background:color-mix(in srgb,var(--fs-cor) 14%,var(--white));border-color:color-mix(in srgb,var(--fs-cor) 34%,transparent)}
.fs .fs-day input:not([type="checkbox"]):focus{background:var(--white);border-color:var(--fs-ink)}
.fs-lapis{flex:none;font-size:.8em;color:var(--fs-ink);opacity:.45;transition:opacity .16s ease}
.fs-papel:focus-within .fs-lapis{opacity:0}
.fs-day small{color:var(--fg2);font-size:.78em;line-height:1.4}
.fs-count{align-self:flex-start;margin-top:auto;font-size:.76em;font-weight:800;padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);background:color-mix(in srgb,var(--fs-cor) 16%,var(--white));color:var(--fs-ink);border:1px solid color-mix(in srgb,var(--fs-cor) 32%,transparent)}
.fs-count.vazio{background:var(--beige);color:var(--fg2);border-color:var(--line)}

/* ---------- Blocos da fila por dia ---------- */
.fs-block{position:relative;border:1px solid var(--line);border-left:6px solid var(--fs-cor);border-radius:var(--r-md);background:var(--white);box-shadow:0 6px 20px color-mix(in srgb,var(--fs-cor) 12%,transparent);padding:var(--sp-6);margin-bottom:var(--sp-4)}
/* O dia é um toggle. O recheio sai do bloco e vai para o cabeçalho e para o
   corpo: com padding no bloco, o dia fechado ficaria com uma faixa vazia em
   baixo da seta. */
.fs-block.fs-dia{padding:0;overflow:hidden;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.fs-block.fs-dia:hover{transform:translateY(-2px);box-shadow:0 12px 28px color-mix(in srgb,var(--fs-cor) 22%,transparent);border-color:color-mix(in srgb,var(--fs-cor) 40%,transparent);border-left-color:var(--fs-cor)}
.fs-block>header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4);padding-bottom:var(--sp-3);border-bottom:1px solid color-mix(in srgb,var(--fs-cor) 22%,transparent)}
.fs-block h3{display:flex;align-items:center;gap:var(--sp-2);font-size:1.16em;font-weight:900;color:var(--fs-ink);letter-spacing:-.01em}
.fs-block h3 .fs-ico-in{font-size:1.15em;line-height:1}
.fs-block>header small{color:var(--fg2)}
/* Cabeçalho clicável do dia. O <summary> já é botão de verdade para teclado e
   leitor de tela; aqui só se tira o triângulo padrão e se organiza a linha. */
.fs-sum{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;column-gap:var(--sp-4);row-gap:var(--sp-1);padding:var(--sp-4) var(--sp-6);cursor:pointer;list-style:none;transition:background-color .16s ease}
.fs-sum::-webkit-details-marker{display:none}
.fs-sum::marker{content:""}
.fs-sum:hover{background:color-mix(in srgb,var(--fs-cor) 7%,var(--white))}
.fs-sum:focus-visible{outline:2px solid var(--accent-aa);outline-offset:-3px;border-radius:var(--r-md)}
.fs-sum>h3{grid-column:1;grid-row:1;min-width:0}
.fs-sum>small{grid-column:1;grid-row:2;color:var(--fg2);font-size:.82em;line-height:1.4}
.fs-sum>.fs-chips{grid-column:2;grid-row:1/3;justify-content:flex-end;max-width:46ch}
.fs-block.fs-dia[open]>.fs-sum{border-bottom:1px solid color-mix(in srgb,var(--fs-cor) 22%,transparent)}
/* A seta gira ao abrir: é o sinal de estado, e o único movimento do cabeçalho. */
.fs-seta{grid-column:3;grid-row:1/3;flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:var(--r-pill);font-size:1.3em;line-height:1;font-weight:900;color:var(--fs-ink);background:color-mix(in srgb,var(--fs-cor) 14%,var(--white));border:1px solid color-mix(in srgb,var(--fs-cor) 30%,transparent);transition:transform .22s ease,background-color .16s ease}
details[open]>summary .fs-seta{transform:rotate(90deg);background:color-mix(in srgb,var(--fs-cor) 26%,var(--white))}
.fs-dia-corpo{padding:0 var(--sp-6) var(--sp-6)}
.fs-dia-corpo>.fs-group:first-child{margin-top:var(--sp-4)}
.fs-chips{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.fs-chip{--fs-c:var(--fg2);font-size:.78em;font-weight:800;padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);background:color-mix(in srgb,var(--fs-c) 12%,var(--white));color:var(--fs-c);border:1px solid color-mix(in srgb,var(--fs-c) 32%,transparent)}
.fs-chip.total{--fs-c:var(--fs-ink);background:color-mix(in srgb,var(--fs-cor) 18%,var(--white));border-color:color-mix(in srgb,var(--fs-cor) 38%,transparent)}
.fs-chip[data-fs-grupo="narrados"],.fs-group[data-fs-grupo="narrados"]{--fs-c:var(--fs-t-narrado)}
.fs-chip[data-fs-grupo="aulas"],.fs-group[data-fs-grupo="aulas"]{--fs-c:var(--fs-t-aula)}
.fs-chip[data-fs-grupo="talking"],.fs-group[data-fs-grupo="talking"]{--fs-c:var(--fs-t-talking)}
.fs-chip[data-fs-grupo="brolls"],.fs-group[data-fs-grupo="brolls"]{--fs-c:var(--fs-t-broll)}
.fs-chip[data-fs-grupo="monta"],.fs-group[data-fs-grupo="monta"]{--fs-c:var(--fs-t-pov)}
.fs-chip[data-fs-grupo="sem-tipo"],.fs-group[data-fs-grupo="sem-tipo"]{--fs-c:var(--fs-t-sem)}
.fs-group{margin-top:var(--sp-6)}
.fs-group>h4{display:flex;align-items:center;gap:var(--sp-2);font-size:.82em;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--fs-c,var(--fg2));margin-bottom:var(--sp-1)}
.fs-group>h4::before{content:"";flex:none;width:10px;height:10px;border-radius:var(--r-pill);background:var(--fs-c,var(--fg2))}
.fs-group>p{color:var(--fg2);font-size:.84em;margin-bottom:var(--sp-3);padding-left:calc(10px + var(--sp-2))}
.fs-list{display:flex;flex-direction:column;gap:var(--sp-2);list-style:none}
/* A peça também é toggle: fechada, título e etiquetas na mesma linha; aberta, o
   roteiro inteiro, para ela ler a fala sem sair da Semana. */
.fs-peca{border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);box-shadow:var(--shadow-sm);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.fs-peca:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:color-mix(in srgb,var(--fs-cor) 45%,transparent)}
.fs-peca[open]{border-color:color-mix(in srgb,var(--fs-cor) 45%,transparent);box-shadow:var(--shadow-md)}
.fs-peca-sum{display:flex;align-items:center;gap:var(--sp-2) var(--sp-3);flex-wrap:wrap;padding:var(--sp-3) var(--sp-4);cursor:pointer;list-style:none;border-radius:var(--r-md)}
.fs-peca-sum::-webkit-details-marker{display:none}
.fs-peca-sum::marker{content:""}
.fs-peca-sum:hover{background:color-mix(in srgb,var(--fs-cor) 6%,var(--white))}
.fs-peca-sum:focus-visible{outline:2px solid var(--accent-aa);outline-offset:-3px}
.fs-peca-tit{flex:1 1 16ch;min-width:0;font-size:.98em;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.fs-peca-sum>.fs-meta{flex:0 1 auto;margin-top:0}
.fs-peca-sum>.fs-seta{grid-column:auto;grid-row:auto;margin-left:auto;width:26px;height:26px;font-size:1.1em}
.fs-peca-corpo{display:flex;flex-direction:column;gap:var(--sp-3);margin:0 var(--sp-4);padding:var(--sp-3) 0 var(--sp-4);border-top:1px dashed color-mix(in srgb,var(--fs-cor) 30%,var(--line))}
.fs-frase{font-size:.92em;line-height:1.45;color:var(--fg1)}
.fs-frase>span,.fs-rot-tit{display:block;font-size:.72em;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--fs-ink);margin-bottom:2px}
.fs-frase.cta>span{color:var(--fs-t-broll)}
.fs-roteiro{border-left:3px solid color-mix(in srgb,var(--fs-cor) 45%,transparent);padding-left:var(--sp-3)}
.fs-roteiro p{white-space:pre-wrap;font-size:.94em;line-height:1.55;color:var(--fg1);overflow-wrap:anywhere}
.fs-roteiro p.fs-vazio{white-space:normal;color:var(--fg2);font-style:italic}
.fs-peca-acao{display:flex;justify-content:flex-end}
.fs-peca .fs-btn{min-height:40px;padding:var(--sp-2) var(--sp-3);font-size:.88em;color:var(--fs-ink);border-color:color-mix(in srgb,var(--fs-cor) 40%,transparent)}
.fs-peca .fs-btn:hover{background:color-mix(in srgb,var(--fs-cor) 12%,var(--white));border-color:var(--fs-ink)}
.fs-meta{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-2)}
.fs-tag{font-size:.72em;font-weight:700;padding:2px var(--sp-2);border-radius:var(--r-pill);background:var(--beige);color:var(--fg2);border:1px solid var(--line-strong)}
.fs-tag.marca{color:var(--white);border-color:transparent;font-weight:800;letter-spacing:.04em}
.fs-tag.voce{background:color-mix(in srgb,var(--accent) 18%,var(--white));color:var(--accent-aa);border-color:color-mix(in srgb,var(--accent-aa) 45%,transparent);font-weight:800}
.fs-tag.time{background:color-mix(in srgb,var(--lilac) 30%,var(--white));color:var(--lilac-deep);border-color:color-mix(in srgb,var(--lilac-deep) 40%,transparent);font-weight:800}

/* ---------- Lista de verificação ---------- */
.fs-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:var(--sp-3)}
.fs-check{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);border:1px solid color-mix(in srgb,var(--fs-cor) 30%,transparent);background:linear-gradient(120deg,color-mix(in srgb,var(--fs-cor) 9%,var(--white)),var(--white) 70%);box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.fs-check:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--fs-cor)}
.fs-num{flex:none;display:grid;place-items:center;width:2.1em;height:2.1em;border-radius:var(--r-pill);font-weight:900;font-size:.92em;background:color-mix(in srgb,var(--fs-cor) 20%,var(--white));color:var(--fs-ink);border:1px solid color-mix(in srgb,var(--fs-cor) 40%,transparent)}
.fs-check span{display:block;font-weight:800;line-height:1.35}
.fs-check small{display:block;color:var(--fg2);font-weight:400;margin-top:2px}
.fs-check.feito{background:linear-gradient(120deg,color-mix(in srgb,var(--fs-sex) 12%,var(--white)),var(--white) 70%);border-color:color-mix(in srgb,var(--fs-sex) 45%,transparent)}
.fs-check.feito .fs-num{background:var(--fs-sex-ink);color:var(--white);border-color:transparent}
.fs-check.feito span{text-decoration:line-through;color:var(--fg2)}
.fs-check input:focus-visible+.fs-num{outline:2px solid var(--accent-aa);outline-offset:3px}
.fs-empty{color:var(--fg2);padding:var(--sp-6);border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent);border-radius:var(--r-md);background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 8%,var(--white)),var(--white) 70%);font-weight:600}

/* ---------- Checklist diário da meta ---------- */
/* Os dias reaproveitam o toggle da fila (.fs-dia) e as caixas reaproveitam a
   lista de verificação (.fs-check); aqui só o cabeçalho e o respiro do corpo.
   Caixa marcada não risca o texto: a hora da marcação precisa continuar legível. */
.fs-diario{margin-bottom:var(--sp-8)}
.fs-diario-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-1) var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.fs-diario-head h3{font-size:1.16em;font-weight:900;color:var(--accent-aa);letter-spacing:-.01em}
.fs-diario-head small{color:var(--fg2)}
.fs-diario-corpo{display:flex;flex-direction:column;gap:var(--sp-3);padding-top:var(--sp-4)}
.fs-diario-corpo .fs-meta{margin-top:0}
.fs-diario .fs-check.feito span{text-decoration:none}

/* ---------- Abrir e fechar com transição ---------- */
/* interpolate-size é o que deixa a altura ir de 0 até auto; sem ele (navegador
   antigo) o bloco continua abrindo, só que de uma vez. Onde ::details-content
   não existir, a regra inteira cai e o <details> nativo segue funcionando. */
@supports (interpolate-size:allow-keywords){.fs{interpolate-size:allow-keywords}}
@supports selector(::details-content){
  .fs-dia::details-content,.fs-peca::details-content{block-size:0;overflow:hidden;opacity:0;transition:block-size .3s ease,opacity .24s ease,content-visibility .3s allow-discrete}
  .fs-dia[open]::details-content,.fs-peca[open]::details-content{block-size:auto;opacity:1}
}

/* ---------- Responsivo e acessibilidade ---------- */
@media(max-width:1100px){.fs-strip{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.fs-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Cabeçalho estreito: os chips descem para uma linha só deles, e a seta passa a
   ocupar as três linhas, para continuar sendo o alvo grande do lado direito. */
@media(max-width:860px){.fs-sum{grid-template-columns:minmax(0,1fr) auto;padding:var(--sp-4)}.fs-sum>.fs-chips{grid-column:1;grid-row:3;justify-content:flex-start;max-width:none;margin-top:var(--sp-1)}.fs-sum>.fs-seta{grid-column:2;grid-row:1/4}.fs-dia-corpo{padding:0 var(--sp-4) var(--sp-4)}}
@media(max-width:520px){.fs-peca .fs-btn{width:100%}.fs-peca-acao{justify-content:stretch}.fs-head{align-items:flex-start}.fs-block{padding:var(--sp-4)}.fs-block.fs-dia{padding:0}.fs-head h2{font-size:1.5em}.fs-tools{width:100%}.fs-tools .fs-btn.criar{flex:1}}
@media(max-width:400px){.fs-strip{grid-template-columns:minmax(0,1fr)}}
/* Celular: os sete dias em pé empurravam a fila de gravação para muito longe
   (gate da Vera de 2026-09-15, achado 3). Abaixo de 520 px cada dia da faixa vira
   uma linha: dia, data, papel e contador lado a lado, sem a dica. */
@media(max-width:520px){
  .fs-strip{grid-template-columns:minmax(0,1fr);gap:var(--sp-2)}
  .fs-day{flex-direction:row;align-items:center;flex-wrap:nowrap;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3) var(--sp-2) var(--sp-4)}
  .fs-day::before{inset:0 auto 0 0;width:6px;height:auto}
  .fs-day>small{display:none}
  .fs-ico{display:none}
  .fs-day-top{flex:none;padding-right:0}
  .fs-date{flex:none;font-size:1.05em}
  .fs-papel{flex:1 1 10ch;min-width:0;margin-top:0}
  .fs-count{flex:0 1 auto;min-width:0;margin-top:0;margin-left:auto;align-self:center;font-size:.7em;padding:2px var(--sp-2);max-width:14ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
/* No mesmo espírito, o dia do checklist fechado ocupa uma linha só: o gancho
   aparece ao abrir e o contador sobe para a linha do título. */
@media(max-width:860px){
  .fs-diario .fs-sum{grid-template-columns:minmax(0,1fr) auto auto;padding:var(--sp-3) var(--sp-4)}
  .fs-diario .fs-sum>.fs-chips{grid-column:2;grid-row:1;justify-content:flex-end;margin-top:0}
  .fs-diario .fs-sum>.fs-seta{grid-column:3;grid-row:1/3}
  .fs-diario .fs-sum>small{grid-column:1/3;grid-row:2}
  .fs-diario .fs-dia:not([open])>.fs-sum>small{display:none}
}
@media(prefers-contrast:more){.fs-day,.fs-block,.fs-peca,.fs-check{border-color:var(--fg1)}.fs-chip,.fs-count,.fs-seta{border-color:currentColor}}
@media(prefers-reduced-motion:reduce){
  .fs *{transition:none!important}
  .fs-peca:hover,.fs-check:hover,.fs-btn.criar:hover,.fs-block.fs-dia:hover{transform:none}
  /* pseudo-elemento não é alcançado por `.fs *`: precisa de regra própria */
  .fs-dia::details-content,.fs-peca::details-content{transition:none!important}
}
