/* WChampion · sistema de gestão — folha de estilo da aplicação (base: conceito aprovado a 07/10/2026)
   Paleta e tipografia: brand-kit/design-tokens.json. Dourado sobre claro:
   decisões de design de 09/08 (--gold-d) e n.º 37 (--gold-p). Pisos de
   tamanho de texto: decisão n.º 42. */
@font-face{font-family:'Barlow';font-weight:400;font-display:swap;src:url('../fontes/Barlow-400-latin.woff2') format('woff2')}
@font-face{font-family:'Barlow';font-weight:500;font-display:swap;src:url('../fontes/Barlow-500-latin.woff2') format('woff2')}
@font-face{font-family:'Barlow';font-weight:600;font-display:swap;src:url('../fontes/Barlow-600-latin.woff2') format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:600;font-display:swap;src:url('../fontes/BarlowCondensed-600-latin.woff2') format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url('../fontes/BarlowCondensed-700-latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-weight:300;font-display:swap;src:url('../fontes/CormorantGaramond-300-latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-weight:600;font-display:swap;src:url('../fontes/CormorantGaramond-600-latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-weight:600;font-style:italic;font-display:swap;src:url('../fontes/CormorantGaramond-600i-latin.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-weight:700;font-display:swap;src:url('../fontes/CormorantGaramond-700-latin.woff2') format('woff2')}

:root{
  --obsidian:#060e09;--forest:#0c2018;--pine:#142d1f;--moss:#1e4530;--sage:#2a6448;
  --gold:#c4922a;--gold-warm:#d9a93e;--gold-pale:#e8c870;
  --gold-d:#8a6416;   /* dourado de leitura sobre --white */
  --gold-p:#7d5a12;   /* dourado de leitura sobre --cream e --stone */
  --cream:#f4f0e6;--stone:#e8e2d6;--pebble:#c8c0b0;--white:#fdfcf9;
  --tinta:#142d1f;--texto:#4a453d;--apoio:#6b645a;
  --alerta:#e74c3c;--alerta-d:#a8281c; /* texto de alerta sobre claro */
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Barlow','Helvetica Neue',Arial,sans-serif;
  --cond:'Barlow Condensed','Barlow',Arial,sans-serif;
  --corte:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--cream)}
body{font-family:var(--sans);font-size:15px;line-height:1.5;color:var(--texto);background:var(--cream);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.app{display:grid;grid-template-columns:256px minmax(0,1fr);min-height:100vh}

/* ── barra lateral ── */
.lado{background:var(--pine);color:var(--cream);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;border-right:1px solid rgba(196,146,42,.22)}
.marca{display:block;padding:26px 24px 22px;border-bottom:1px solid rgba(244,240,230,.08)}
.marca img{display:block;width:168px;height:auto}
.menu{padding:10px 12px;flex:1;overflow:auto}
.menu-rot{font:700 11px/1 var(--cond);letter-spacing:2.6px;text-transform:uppercase;color:var(--gold-warm);padding:20px 12px 10px}
.menu a{display:flex;align-items:center;gap:12px;padding:10px 12px;font-size:15px;color:rgba(244,240,230,.74);border-left:2px solid transparent;transition:background .2s,color .2s}
.menu a:hover{background:rgba(244,240,230,.05);color:var(--white)}
.menu a.activo{background:rgba(196,146,42,.12);color:var(--white);border-left-color:var(--gold-warm);font-weight:500}
.menu a.activo svg{color:var(--gold-warm)}
.conta{margin-left:auto;font:600 12px/1 var(--sans);padding:4px 7px;background:rgba(244,240,230,.1);color:var(--cream);font-variant-numeric:tabular-nums}
.conta.ouro{background:var(--gold-warm);color:var(--obsidian)}
.lado-pe{padding:10px 12px;border-top:1px solid rgba(244,240,230,.08)}
.lado-pe button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;font-size:15px;color:rgba(244,240,230,.74)}
.lado-pe button:hover{background:rgba(244,240,230,.05);color:var(--white)}

/* ── topo ── */
.palco{min-width:0}
.topo{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 40px;background:var(--white);border-bottom:1px solid var(--stone);position:sticky;top:0;z-index:5}
.busca{display:flex;align-items:center;gap:10px;flex:1;max-width:440px;padding:0 14px;height:42px;background:var(--cream);border:1px solid var(--stone);color:var(--apoio)}
.busca input{flex:1;min-width:0;border:0;background:none;font:400 16px var(--sans);color:var(--tinta);outline:0}
.busca input::placeholder{color:var(--apoio)}
.busca:focus-within{border-color:var(--gold)}
.topo-dir{display:flex;align-items:center;gap:18px}
.lingua{display:flex;border:1px solid var(--stone)}
.lingua button{font:700 11.5px/1 var(--cond);letter-spacing:2px;padding:9px 10px;color:var(--apoio)}
.lingua .on{background:var(--pine);color:var(--cream)}
.sino{position:relative;width:42px;height:42px;display:grid;place-items:center;color:var(--tinta);border:1px solid var(--stone)}
.sino svg{width:20px;height:20px}
.sino i{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;background:var(--gold-warm);color:var(--obsidian);font:600 11.5px/1 var(--sans);font-style:normal}
.eu{display:flex;align-items:center;gap:10px}
.eu strong{display:block;font-weight:600;color:var(--tinta);line-height:1.2}
.eu small{font-size:12.5px;color:var(--apoio)}
.av{width:38px;height:38px;display:grid;place-items:center;background:var(--moss);color:var(--cream);font:600 13px/1 var(--cond);letter-spacing:1px;font-style:normal;flex:none}
.av.p{width:26px;height:26px;font-size:11px;background:var(--stone);color:var(--tinta)}

/* ── conteúdo ── */
.conteudo{padding:36px 40px 56px;max-width:1320px}
.saudacao{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
.eyebrow{display:flex;align-items:center;gap:12px;font:700 11.5px/1 var(--cond);letter-spacing:3px;text-transform:uppercase;color:var(--gold-p);margin-bottom:12px}
.eyebrow span{width:40px;height:1px;background:var(--gold)}
h1{font:300 clamp(2.4rem,3.6vw,3.4rem)/1.05 var(--serif);color:var(--tinta);letter-spacing:-.3px}
h1 em{font-weight:600;font-style:italic;color:var(--gold-p)}
.lead{margin-top:10px;font-size:16px;color:var(--texto);max-width:56ch}
.cta{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;background:var(--gold);color:var(--obsidian);font:700 12.5px/1 var(--cond);letter-spacing:2.5px;text-transform:uppercase;clip-path:var(--corte);transition:background .2s;white-space:nowrap}
.cta:hover{background:var(--gold-warm)}
.cta svg{stroke-width:2}

.numeros{display:grid;grid-template-columns:repeat(4,1fr);background:var(--white);border:1px solid var(--stone);margin-bottom:24px}
.numeros article{padding:22px 26px 20px;border-left:1px solid var(--stone);position:relative}
.numeros article:first-child{border-left:0}
.rot{font:700 11.5px/1 var(--cond);letter-spacing:2.6px;text-transform:uppercase;color:var(--apoio);display:flex;align-items:center;gap:7px}
.rot svg{width:15px;height:15px}
.num{font:700 3.4rem/1 var(--serif);color:var(--tinta);margin:10px 0 6px;font-variant-numeric:lining-nums}
.sub{font-size:14px;color:var(--apoio)}
.sub b{font-weight:600;color:var(--tinta)}
.numeros .alerta{background:linear-gradient(180deg,rgba(231,76,60,.07),rgba(231,76,60,0) 70%)}
.numeros .alerta::before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:2px;background:var(--alerta)}
.numeros .alerta .rot,.numeros .alerta .num{color:var(--alerta-d)}
.barra{display:block;width:100%;height:3px;margin-top:12px;border:0;background:var(--stone);color:var(--sage);appearance:none;-webkit-appearance:none}
.barra::-webkit-progress-bar{background:var(--stone)}
.barra::-webkit-progress-value{background:var(--sage)}
.barra::-moz-progress-bar{background:var(--sage)}

.duas{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:24px;margin-bottom:24px}
.cartao{background:var(--white);border:1px solid var(--stone)}
.cab{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 26px 16px;border-bottom:1px solid var(--stone)}
h2{font:600 1.5rem/1.1 var(--serif);color:var(--tinta)}
.filtros,.vistas{display:flex;gap:2px}
.filtros a,.vistas a{font:600 12px/1 var(--cond);letter-spacing:1.8px;text-transform:uppercase;padding:9px 12px;color:var(--apoio);border-bottom:2px solid transparent}
.filtros .on,.vistas .on{color:var(--tinta);border-bottom-color:var(--gold)}

.lista li{display:grid;grid-template-columns:56px minmax(0,1fr) 124px 128px;align-items:center;gap:16px;padding:15px 26px;border-bottom:1px solid var(--stone);border-left:2px solid transparent}
.lista li:hover{background:var(--cream)}
.lista time{font:500 15px/1 var(--sans);color:var(--tinta);font-variant-numeric:tabular-nums}
.corpo strong{display:block;font-weight:500;color:var(--tinta);font-size:15.5px;line-height:1.3}
.corpo span{font-size:13.5px;color:var(--apoio)}
.quem{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--texto)}
.lista .atraso{border-left-color:var(--alerta)}
.lista .feita .corpo strong{color:var(--apoio);text-decoration:line-through;text-decoration-color:var(--pebble)}
.est{display:inline-flex;align-items:center;gap:7px;font:600 12px/1 var(--cond);letter-spacing:1.6px;text-transform:uppercase;white-space:nowrap}
.est svg{width:15px;height:15px;stroke-width:1.8}
.e-pend{color:var(--apoio)}
.e-curso{color:var(--gold-d)}
.e-feita{color:var(--sage)}
.e-atraso{color:var(--alerta-d)}
.mais{display:flex;align-items:center;gap:8px;padding:16px 26px;font:700 11.5px/1 var(--cond);letter-spacing:2.4px;text-transform:uppercase;color:var(--gold-d)}
.mais svg{width:16px;height:16px;transition:transform .2s}
.mais:hover svg{transform:translateX(4px)}

.escuro{background:var(--forest);border-color:var(--forest);color:rgba(244,240,230,.72);position:relative;overflow:hidden}
.escuro::after{content:"";position:absolute;right:-70px;bottom:-60px;width:260px;height:260px;background:url('../img/08-simbolo-fundo-verde.svg') center/contain no-repeat;opacity:.07;pointer-events:none}
.escuro .cab{border-bottom-color:rgba(244,240,230,.1)}
.escuro h2{color:var(--white)}
.escuro .rot{color:var(--gold-warm)}
.avisos li{position:relative;padding:16px 26px 16px 40px;border-bottom:1px solid rgba(244,240,230,.08);z-index:1}
.avisos li::before{content:"";position:absolute;left:24px;top:23px;width:6px;height:6px;border-radius:50%;background:rgba(244,240,230,.25)}
.avisos .novo::before{background:var(--gold-warm)}
.avisos b{display:block;font-weight:500;color:var(--white);font-size:15px}
.avisos p{font-size:14px;line-height:1.45;margin:2px 0 4px}
.avisos small{font-size:12.5px;color:rgba(244,240,230,.6)}
.acoes{display:flex;gap:8px;margin-top:12px}
.acoes button{font:700 11.5px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;padding:11px 16px}
.b-ouro{background:var(--gold);color:var(--obsidian);clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px))}
.b-linha{border:1px solid rgba(244,240,230,.3);color:var(--cream)}

.grelha{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.dia{min-height:210px;padding:14px 10px 16px;border-left:1px solid var(--stone)}
.dia:first-child{border-left:0}
.dia.fds{background:repeating-linear-gradient(135deg,transparent 0 7px,rgba(200,192,176,.2) 7px 8px)}
.dia.hoje{background:rgba(196,146,42,.07);box-shadow:inset 0 2px 0 var(--gold)}
.d{font:600 12px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--apoio);display:flex;align-items:baseline;gap:8px;margin-bottom:12px;padding:0 4px}
.d b{font:600 1.5rem/1 var(--serif);color:var(--tinta);letter-spacing:0;font-variant-numeric:lining-nums}
.hoje .d,.hoje .d b{color:var(--gold-p)}
.ev{display:block;padding:8px 10px;margin-bottom:6px;background:var(--cream);border-left:3px solid var(--pebble);font-size:14px;line-height:1.3;color:var(--tinta);font-weight:500}
.ev time{display:block;font:500 12.5px/1.2 var(--sans);color:var(--apoio);font-variant-numeric:tabular-nums}
.ev small{display:block;font-size:12.5px;font-weight:400;color:var(--apoio)}
.hoje .ev{background:var(--white)}
.ev.curso{border-left-color:var(--gold)}
.ev.feita{border-left-color:var(--sage);color:var(--apoio)}
.ev.atraso{border-left-color:var(--alerta);background:rgba(231,76,60,.07)}
.ev.atraso time{color:var(--alerta-d)}
.resto{font-size:13px;color:var(--gold-p);font-weight:500;padding:4px}
.legenda{display:flex;flex-wrap:wrap;gap:22px;padding:14px 26px;border-top:1px solid var(--stone)}

.barra-movel{display:none}

/* ── ecrãs médios ── */
@media (max-width:1180px){
  .app{grid-template-columns:76px minmax(0,1fr)}
  .marca{padding:20px 14px}.marca img{width:48px;height:48px;object-fit:cover;object-position:left}
  .menu-rot,.lado-pe span,.conta{display:none}
  .menu a{justify-content:center;padding:13px 0;font-size:0;gap:0}
  .menu a svg{width:21px;height:21px}
  .lado-pe{padding:10px 0}.lado-pe button{justify-content:center;padding:13px 0}
  .conteudo,.topo{padding-left:24px;padding-right:24px}
  .duas{grid-template-columns:1fr}
  .numeros{grid-template-columns:repeat(2,1fr)}
  .numeros article:nth-child(3){border-left:0}
  .numeros article:nth-child(n+3){border-top:1px solid var(--stone)}
}

/* ── telemóvel ── */
@media (max-width:720px){
  .app{display:block;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .lado{display:none}
  .topo{padding:10px 16px;gap:12px}
  .eu div{display:none}
  .busca{height:44px}
  .conteudo{padding:24px 16px 32px}
  .saudacao{display:block;margin-bottom:20px}
  /* a «Nova tarefa» está no botão + da barra de baixo; os outros botões de topo (Convidar…) ficam */
  .saudacao .cta[href$="/tarefas/nova"]{display:none}
  .saudacao a.cta{margin-top:16px}
  .num{font-size:2.6rem}
  .numeros article{padding:16px 16px 14px}
  .cab{padding:16px;flex-wrap:wrap}
  .lista li{grid-template-columns:48px minmax(0,1fr);gap:4px 12px;padding:14px 16px}
  .lista .quem,.lista .est{grid-column:2}
  .mais,.legenda{padding-left:16px;padding-right:16px}
  .avisos li{padding-right:16px}
  .semana .vistas{display:none}
  .grelha{display:block}
  .dia{min-height:0;border-left:0;border-top:1px solid var(--stone);padding:12px 16px}
  .dia.fds.sem{display:none}
  .barra-movel{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:var(--pine);border-top:1px solid rgba(196,146,42,.3);padding:8px 4px calc(8px + env(safe-area-inset-bottom));z-index:10}
  .barra-movel a{display:flex;flex-direction:column;align-items:center;gap:5px;font:600 11px/1 var(--cond);letter-spacing:1.4px;text-transform:uppercase;color:rgba(244,240,230,.7);padding:6px 0}
  .barra-movel svg{width:22px;height:22px}
  .barra-movel .activo{color:var(--gold-warm)}
  .barra-movel .novo{align-self:center;justify-self:center;width:52px;height:52px;justify-content:center;background:var(--gold);color:var(--obsidian);clip-path:var(--corte);margin-top:-22px}
  .barra-movel .novo svg{stroke-width:2}
}
/* ── peças comuns das telas reais ── */
.saltar{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--obsidian);padding:10px 14px;z-index:50}
.saltar:focus{left:8px;top:8px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sair-movel{display:none}
.sair-movel button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--stone);color:var(--tinta)}
.aviso-ok{display:flex;align-items:center;gap:10px;padding:12px 16px;margin-bottom:20px;background:rgba(42,100,72,.1);border-left:2px solid var(--sage);color:var(--tinta);font-weight:500}
.aviso-ok svg{color:var(--sage)}
.erro{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;background:rgba(231,76,60,.08);border-left:2px solid var(--alerta);color:var(--alerta-d);font-weight:500}
.erro svg{margin-top:2px}
.vazio{padding:36px 26px;color:var(--apoio);font-size:15px}
.escuro .vazio{color:rgba(244,240,230,.72);position:relative;z-index:1}
.vazio-linha{color:var(--apoio)}
.lig{color:var(--gold-p);text-decoration:underline;text-underline-offset:3px}
.corpo a:hover strong{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.mais.curto{padding:0}
.aviso-lig{display:flex;width:max-content;align-items:center;gap:6px;margin-top:8px;font:700 11.5px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;color:var(--gold-warm)}
.aviso-lig svg{width:15px;height:15px}
.tira{width:3px;height:14px;background:var(--pebble);flex:none}
.tira.curso{background:var(--gold)}.tira.feita{background:var(--sage)}.tira.atraso{background:var(--alerta)}
.b-linha-c{display:inline-flex;align-items:center;gap:8px;padding:13px 18px;border:1px solid var(--pebble);color:var(--tinta);font:700 12px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;white-space:nowrap;background:var(--white)}
.b-linha-c:hover{border-color:var(--tinta)}
.b-linha-c svg{width:16px;height:16px}
.cta.largo{width:100%;justify-content:center;padding:18px 26px;font-size:13px}
button.cta{cursor:pointer}
.voltar{display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;font:700 11.5px/1 var(--cond);letter-spacing:2.4px;text-transform:uppercase;color:var(--apoio)}
.voltar:hover{color:var(--tinta)}
.voltar svg{width:16px;height:16px}

/* filtros de lista e de calendário */
.cab-filtros{flex-wrap:wrap}
.afinar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.afinar select,.campo select,.campo input,.campo textarea{font:400 16px var(--sans);color:var(--tinta);background:var(--white);border:1px solid var(--pebble);padding:10px 12px;min-height:44px;border-radius:0}
.afinar select{background:var(--cream)}
.campo input:focus,.campo select:focus,.campo textarea:focus,.afinar select:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.marcar{display:flex;align-items:center;gap:9px;font-size:15px;color:var(--texto);cursor:pointer}
.marcar input{width:18px;height:18px;accent-color:var(--moss)}

/* lista com data */
.lista.com-data li{grid-template-columns:72px minmax(0,1fr) 150px 128px}
.lista time small{display:block;font:600 11.5px/1.3 var(--cond);letter-spacing:1.6px;text-transform:uppercase;color:var(--apoio)}
.lista .quem{min-width:0}
.paginas{display:flex;align-items:center;justify-content:space-between;padding:16px 26px;font-size:14px;color:var(--apoio)}
.paginas a{display:inline-flex;align-items:center;gap:6px;font:700 11.5px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;color:var(--gold-d)}
.paginas svg{width:15px;height:15px}

/* calendário do mês */
.mes-nav{display:flex;align-items:center;gap:6px}
.mes-nav a{display:grid;place-items:center;min-width:42px;height:42px;border:1px solid var(--stone);color:var(--tinta)}
.mes-nav a:hover{border-color:var(--gold)}
.mes-nav .hoje-b{padding:0 16px;font:700 12px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase}
.mes-cab{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom:1px solid var(--stone)}
.mes-cab span{padding:10px 12px;font:600 12px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--apoio)}
.mes-grelha{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.cel{min-height:132px;padding:8px 8px 10px;border-left:1px solid var(--stone);border-bottom:1px solid var(--stone);min-width:0}
.cel:nth-child(7n+1){border-left:0}
.cel.fds{background:repeating-linear-gradient(135deg,transparent 0 7px,rgba(200,192,176,.2) 7px 8px)}
.cel.fora{background:var(--cream)}
.cel.fora .cel-n b{color:var(--apoio);font-weight:400}
.cel.hoje{background:rgba(196,146,42,.07);box-shadow:inset 0 2px 0 var(--gold)}
.cel-n{display:inline-flex;align-items:baseline;gap:8px;padding:2px 4px 6px}
.cel-n b{font:600 1.35rem/1 var(--serif);color:var(--tinta);font-variant-numeric:lining-nums}
.cel-n:hover b{color:var(--gold-p)}
.cel.hoje .cel-n b{color:var(--gold-p)}
.cel-sem{display:none;font:600 12px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--apoio)}
.cel .ev{padding:5px 8px;margin-bottom:4px;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cel .ev time{display:inline;margin-right:6px}
.cel .ev small{display:none}
.cel .ev .ev-titulo{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cel .ev:nth-of-type(n+5){display:none}
.cel.hoje .ev{background:var(--white)}
.cel .resto{display:block}
a.ev:hover{box-shadow:inset 0 0 0 1px var(--pebble)}

/* ficha da tarefa */
.ficha-topo{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;flex-wrap:wrap}
.h-ficha{font-size:clamp(2rem,3vw,2.8rem);max-width:22ch}
.ficha-estado{display:flex;align-items:center;gap:16px;margin-top:14px}
.selo{font:700 11px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;padding:6px 9px;border:1px solid var(--gold-p);color:var(--gold-p)}
.ficha-acoes{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ficha-acoes .cta{padding:14px 22px;border:0}
.duas.ficha{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:start}
.ficha-corpo{padding:22px 26px}
.descricao{font-size:16px;line-height:1.65;color:var(--texto);max-width:68ch}
.dados{border-top:1px solid var(--stone)}
.dados div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:13px 26px;border-bottom:1px solid var(--stone)}
.dados dt{font:700 11.5px/1.6 var(--cond);letter-spacing:2.2px;text-transform:uppercase;color:var(--apoio)}
.dados dd{color:var(--tinta);font-size:15px}
.fuso{padding:14px 26px;font-size:12.5px;color:var(--apoio)}
.historico{padding:8px 26px 20px}
.historico li{padding:12px 0 12px 18px;border-bottom:1px solid var(--stone);font-size:14.5px;position:relative}
.historico li::before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.historico li.vazio-linha::before{display:none}
.historico b{font-weight:600;color:var(--tinta)}
.historico small{display:block;font-size:12.5px;color:var(--apoio);margin-top:2px}

/* formulários */
.formulario{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px;padding:28px 26px;max-width:860px}
.largo-2{grid-column:1/-1}
.formulario .erro{grid-column:1/-1}
.campo{display:flex;flex-direction:column;gap:7px;border:0;min-width:0}
.campo>span,.campo legend{font:700 11.5px/1 var(--cond);letter-spacing:2.4px;text-transform:uppercase;color:var(--apoio);padding:0}
.campo legend{margin-bottom:7px}
.campo i{color:var(--gold-p);font-style:normal}
.campo textarea{resize:vertical;line-height:1.5}
.campo input,.campo select,.campo textarea{width:100%}
.ajuda{font-size:12.5px;color:var(--apoio)}
.campo-erro{font-size:13.5px;color:var(--alerta-d);font-weight:500}
.prio-ajuda{margin-top:8px;min-height:38px}
.prio-ajuda .ajuda{display:none;font-size:13.5px;line-height:1.45}
.prio-ajuda .ajuda b{font-weight:600;color:var(--texto)}
.opcoes:has(input[value="baixa"]:checked)~.prio-ajuda [data-prioridade="baixa"],
.opcoes:has(input[value="normal"]:checked)~.prio-ajuda [data-prioridade="normal"],
.opcoes:has(input[value="alta"]:checked)~.prio-ajuda [data-prioridade="alta"]{display:block}
.opcoes{display:flex;border:1px solid var(--pebble)}
.opcoes label{flex:1;position:relative;cursor:pointer}
.opcoes label+label{border-left:1px solid var(--pebble)}
.opcoes input{position:absolute;opacity:0;inset:0;width:100%;height:100%;min-height:0;padding:0;cursor:pointer}
.opcoes span{display:grid;place-items:center;min-height:42px;font-size:15px;color:var(--texto);background:var(--white)}
.opcoes input:checked+span{background:var(--pine);color:var(--cream);font-weight:500}
.opcoes input:focus-visible+span{outline:2px solid var(--gold);outline-offset:-2px}
.form-pe{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--stone)}
.form-pe .fuso{padding:0}
.form-pe div{display:flex;gap:10px}
.form-pe .cta{border:0}

/* entrada */
.entrada{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);min-height:100vh;background:var(--cream)}
.entrada-marca{background:var(--pine);color:var(--cream);padding:48px 56px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-right:1px solid rgba(196,146,42,.3)}
.entrada-marca::after{content:"";position:absolute;right:-140px;bottom:-120px;width:560px;height:560px;background:url('../img/08-simbolo-fundo-verde.svg') center/contain no-repeat;opacity:.07;pointer-events:none}
.entrada-marca>*{position:relative;z-index:1}
.entrada-marca img{width:210px;height:auto}
.entrada-marca .eyebrow{color:var(--gold-warm)}
.entrada-frase{font:300 clamp(2.4rem,4.2vw,4rem)/1.08 var(--serif);color:var(--white);max-width:13ch}
.entrada-frase em{font-weight:600;font-style:italic;color:var(--gold-warm);display:block}
.entrada-pe{font-size:13.5px;color:rgba(244,240,230,.66)}
.entrada-form{display:grid;place-items:center;padding:40px 24px}
.entrada-form form{width:100%;max-width:400px;display:flex;flex-direction:column;gap:20px}
.entrada-form h1{font-size:2.8rem}
.entrada-form .lead{margin-top:-10px}
.nota{font-size:13.5px;color:var(--apoio)}

/* administração: utilizadores e grupos */
.lista.pessoas li{grid-template-columns:44px minmax(0,1.4fr) minmax(0,1fr) 130px 96px}
.lista.pessoas .av{width:38px;height:38px;font-size:13px;background:var(--stone);color:var(--tinta)}
.lista.pessoas .corpo span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.etiquetas{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.etiqueta{font:600 11.5px/1 var(--cond);letter-spacing:1.6px;text-transform:uppercase;padding:6px 8px;background:var(--cream);border:1px solid var(--stone);color:var(--texto);white-space:nowrap}
.papel{font:600 12px/1 var(--cond);letter-spacing:1.8px;text-transform:uppercase;color:var(--tinta)}
.papel.alto{color:var(--gold-d)}
.lig-acao{display:inline-flex;align-items:center;gap:6px;justify-self:end;font:700 11.5px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;color:var(--gold-d)}
.lig-acao svg{width:15px;height:15px}
.conta-n{font:600 11.5px/1 var(--sans);margin-left:6px;color:var(--apoio);font-variant-numeric:tabular-nums;letter-spacing:0}
.caixa-convite{grid-column:1/-1;padding:18px 20px;background:rgba(196,146,42,.09);border-left:2px solid var(--gold);display:flex;flex-direction:column;gap:10px;margin-bottom:24px;max-width:860px}
.caixa-convite b{color:var(--tinta);font-weight:600}
.caixa-convite p{font-size:14.5px;color:var(--texto);max-width:70ch}
.caixa-convite input{font:400 16px var(--sans);color:var(--tinta);background:var(--white);border:1px solid var(--pebble);padding:10px 12px;min-height:44px;width:100%}
.escolhas{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.escolhas label{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--stone);background:var(--white);cursor:pointer;min-height:44px;font-size:15px;color:var(--texto);min-width:0}
.escolhas label:has(input:checked){border-color:var(--moss);background:rgba(30,69,48,.06);color:var(--tinta)}
.escolhas input{width:18px;height:18px;min-height:0;padding:0;accent-color:var(--moss);flex:none}
.escolhas small{display:block;font-size:12.5px;color:var(--apoio)}
.campo-fixo{font-size:16px;color:var(--tinta);padding:10px 0;min-height:44px;overflow-wrap:anywhere}
.zona-conta{max-width:860px;margin-top:24px}
.zona-conta .ficha-corpo{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.zona-conta p{max-width:52ch;font-size:15px}
.confirmar{margin-bottom:12px}
/* caixa de avisos */
.lista.caixa li{grid-template-columns:10px minmax(0,1fr) 130px 84px}
.lista.caixa .ponto{width:8px;height:8px;border-radius:50%;background:var(--pebble)}
.lista.caixa .novo .ponto{background:var(--gold)}
.lista.caixa .novo{background:rgba(196,146,42,.06)}
.lista.caixa li:not(.novo) .corpo strong{font-weight:400;color:var(--texto)}
.lista.caixa time{font:400 13.5px/1.3 var(--sans);color:var(--apoio)}
.lista.caixa .corpo span{display:block;overflow-wrap:anywhere}
.aviso-lig.sem-margem{margin-top:0}
.saudacao form .b-linha-c{white-space:nowrap}
.barra-movel .com-conta{position:relative}
.barra-movel .com-conta i{position:absolute;top:0;left:calc(50% + 6px);min-width:17px;height:17px;padding:0 4px;display:grid;place-items:center;background:var(--gold-warm);color:var(--obsidian);font:600 10.5px/1 var(--sans);font-style:normal;letter-spacing:0}
/* caixas de marcar dentro de um campo: as regras de .campo input (largura total, 44 px) não são para elas */
.campo .marcar input{width:18px;height:18px;min-height:0;padding:0;flex:none}
.campo .marcar{justify-content:flex-start;min-height:32px}
.lingua{display:flex;border:1px solid var(--stone)}
.lingua button{font:700 11.5px/1 var(--cond);letter-spacing:2px;padding:9px 10px;color:var(--apoio);background:var(--white)}
.lingua button.on{background:var(--pine);color:var(--cream)}
.entrada-form{position:relative}
.entrada-form>.lingua{position:absolute;top:24px;right:24px;width:auto;max-width:none;flex-direction:row;gap:0}
.texto-erro{color:var(--alerta-d)!important;overflow-wrap:anywhere}
.zona-conta>.formulario{max-width:none;padding:22px 26px}
.zona-conta .dados div:last-child{border-bottom:0}
.zona-conta .dados+.ficha-corpo{border-top:1px solid var(--stone)}
.texto-corrido .chave{margin:4px 0 12px}
.texto-corrido .cta{margin-top:6px}
.lista.copias li{grid-template-columns:96px minmax(0,1fr) 150px}
.lista.copias .corpo strong{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.texto-corrido{display:block!important}
.texto-corrido p{max-width:70ch;margin-bottom:10px}
.texto-corrido p:last-child{margin-bottom:0}
.texto-corrido b{color:var(--tinta);font-weight:600}
.saudacao form .cta{border:0}
.codigo{font:500 22px/1 var(--sans)!important;letter-spacing:.24em;font-variant-numeric:tabular-nums;max-width:260px}
.entrada-form .codigo{max-width:none}
.passos{max-width:860px;padding:8px 26px 26px}
.passos ol{counter-reset:passo}
.passos li{counter-increment:passo;position:relative;padding:22px 0 22px 62px;border-bottom:1px solid var(--stone)}
.passos li:last-child{border-bottom:0;padding-bottom:0}
.passos li::before{content:counter(passo);position:absolute;left:0;top:18px;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--gold);font:600 1.4rem/1 var(--serif);color:var(--gold-d);font-variant-numeric:lining-nums}
.passos h2{font-size:1.4rem;margin-bottom:6px}
.passos p{max-width:62ch}
.qr-linha{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:14px}
.qr{width:220px;height:220px;border:1px solid var(--stone);flex:none}
.qr svg{display:block;width:100%;height:100%;stroke:none;fill:initial}
.chave{font:500 17px/1.6 var(--sans);letter-spacing:.12em;color:var(--tinta);margin-top:8px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.confirmar-codigo{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:12px}
.confirmar-codigo .cta{border:0;padding:15px 26px}
.codigos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;max-width:520px}
.codigos li{font:500 16px/1 var(--sans);letter-spacing:.08em;padding:11px 12px;background:var(--white);border:1px solid var(--pebble);color:var(--tinta);font-variant-numeric:tabular-nums}
.largura-form{max-width:860px;margin-bottom:24px}
.sem-topo{margin-top:0}
.cab .est{flex:none}
.bloco-seguinte{margin-top:24px}
.formulario h2{padding-bottom:4px}
.campo.meio{max-width:calc(50% - 12px)}
.linha-cima{border-top:1px solid var(--stone)}
a.eu:hover strong{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.entrada-linha{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:15px}
.entrada-form .voltar{margin:4px 0 0}
.entrada-form .aviso-ok{margin:0;align-items:flex-start}
.campo-erro{display:block}
.b-perigo{display:inline-flex;align-items:center;gap:8px;padding:13px 18px;border:1px solid var(--alerta-d);color:var(--alerta-d);font:700 12px/1 var(--cond);letter-spacing:2.2px;text-transform:uppercase;white-space:nowrap;background:var(--white)}
.b-perigo:hover{background:var(--alerta-d);color:var(--white)}
.grupos{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-bottom:24px}
.grupo{padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.grupo h2{font-size:1.7rem}
.grupo .sub{font-size:14px}
.grupo .lig-acao{justify-self:start;margin-top:auto}
.rostos{display:flex;flex-wrap:wrap;gap:6px}
.novo-grupo{display:flex;gap:12px;align-items:flex-end;padding:22px 26px;flex-wrap:wrap}
.novo-grupo .campo{flex:1;min-width:220px}
.novo-grupo .cta{border:0;padding:15px 24px}
/* ── telas novas em ecrã médio e telemóvel (depois das regras base) ── */
@media (max-width:1180px){
  .duas.ficha{grid-template-columns:1fr}
}
@media (max-width:720px){
  .lista.com-data li{grid-template-columns:56px minmax(0,1fr)}
  .afinar{width:100%}.afinar select{flex:1;min-width:0}
  .mes-cab{display:none}
  .mes-grelha{display:block}
  .cel{min-height:0;border-left:0;padding:12px 16px}
  .cel.sem,.cel.fora{display:none}
  .cel.hoje.sem{display:block}
  .cel-sem{display:inline}
  .cel .ev{white-space:normal;padding:8px 10px;font-size:14px}
  .cel .ev:nth-of-type(n+5){display:block}
  .cel .ev small{display:block}
  .cel .ev .ev-titulo{position:static;display:block;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;font-weight:400;color:var(--texto)}
  .cel .ev time{display:block}
  .cel .resto{display:none}
  .dia.sem:not(.hoje){display:none}
  .ficha-acoes{width:100%}
  .dados div{grid-template-columns:1fr;gap:2px;padding:12px 16px}
  .ficha-corpo,.historico{padding-left:16px;padding-right:16px}
  .fuso{padding-left:16px;padding-right:16px}
  .formulario{grid-template-columns:1fr;padding:20px 16px}
  .form-pe div{width:100%}.form-pe div>*{flex:1;justify-content:center;text-align:center}
  .paginas{padding:14px 16px}
  .vazio{padding:28px 16px}
  .sair-movel{display:block}
  .entrada{display:block}
  .entrada-marca{padding:28px 24px;gap:28px;min-height:0}
  .entrada-marca img{width:160px}
  .entrada-frase{font-size:2.1rem}
  .entrada-pe{display:none}
  .entrada-form{padding:76px 20px 48px}
  .entrada-form>.lingua{top:18px;right:20px}
}
@media (max-width:720px){
  .lista.pessoas li{grid-template-columns:44px minmax(0,1fr);gap:6px 12px}
  .lista.pessoas .etiquetas,.lista.pessoas .papel,.lista.pessoas .lig-acao{grid-column:2;justify-self:start}
  .grupos{grid-template-columns:1fr;gap:16px}
  .novo-grupo{padding:18px 16px}
  .lista.caixa li{grid-template-columns:10px minmax(0,1fr);gap:4px 12px}
  .lista.caixa time,.lista.caixa .est{grid-column:2}
  /* no telemóvel o topo só leva procura, conta e saída: os avisos estão na barra de baixo e o idioma em «A minha conta» */
  .topo .sino,.topo .lingua{display:none}
  .lista.copias li{grid-template-columns:72px minmax(0,1fr)}
  .lista.copias .lig-acao{grid-column:2;justify-self:start}
  .saudacao form .cta{display:inline-flex;margin-top:16px}
  .passos{padding:4px 16px 20px}
  .passos li{padding-left:0;padding-top:66px}
  .passos li::before{top:16px}
  .confirmar-codigo .cta{width:100%;justify-content:center}
  .codigo{max-width:none}
  .campo.meio{max-width:none}
  .novo-grupo .cta{width:100%;justify-content:center}
  .zona-conta .ficha-corpo>*{width:100%}
  .b-perigo{justify-content:center}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ── Uso com o dedo: em telemóvel e em qualquer ecrã de toque, tudo o que se toca tem 44 px ── */
@media (max-width:720px),(pointer:coarse){
  .busca{height:46px}
  .busca input{align-self:stretch;min-height:44px}
  .eu{min-width:44px;min-height:44px;justify-content:center}
  .lingua button{min-width:44px;min-height:44px}
  .filtros a,.vistas a{display:inline-flex;align-items:center;min-height:44px}
  .voltar{min-height:44px;margin-bottom:8px}
  .marcar,.campo .marcar{min-height:44px}
  .marcar input,.campo .marcar input{width:22px;height:22px;flex:none}
  .lig-acao,.aviso-lig,.mais.curto{min-height:44px}
  .entrada-linha .lig{display:inline-flex;align-items:center;min-height:44px}
  .cel-n{min-height:44px;align-items:center;padding:0 6px}
  .corpo a{display:block;padding:12px 0;margin:-12px 0}
}

/* ── Avisos: escolher e apagar ── */
.caixa-accoes{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 26px;border-bottom:1px solid var(--stone)}
.caixa-accoes .b-perigo{display:inline-flex;align-items:center;gap:8px}
.caixa-accoes .b-perigo svg{width:16px;height:16px}
.lista.caixa li{grid-template-columns:24px 10px minmax(0,1fr) 130px 84px}
.lista.caixa .escolher{justify-content:center}
@media (max-width:720px){
  .caixa-accoes{padding:8px 16px;gap:10px}
  .caixa-accoes .marcar span{white-space:nowrap}
  .caixa-accoes .b-perigo{padding:13px 12px;letter-spacing:1.6px}
  .saudacao form .b-linha-c{margin-top:14px}
  .lista.caixa li{grid-template-columns:44px 10px minmax(0,1fr);gap:4px 6px;padding-left:8px}
  .lista.caixa .escolher{width:44px}
  .lista.caixa time,.lista.caixa .est{grid-column:3}
  .lista.caixa .escolher{grid-row:1 / span 3;align-self:start}
}

/* ── Menu do telemóvel ── */
.menu-movel{display:none}
@media (max-width:720px){
  .menu-movel{display:block;position:relative}
  .menu-movel summary{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--stone);color:var(--tinta);cursor:pointer;list-style:none}
  .menu-movel summary::-webkit-details-marker{display:none}
  .menu-movel summary svg{width:22px;height:22px}
  .menu-movel[open] summary{background:var(--pine);border-color:var(--pine);color:var(--cream)}
  .menu-movel nav{position:absolute;right:0;top:52px;z-index:30;width:min(280px,calc(100vw - 32px));background:var(--pine);border:1px solid rgba(196,146,42,.35);padding:8px 0;box-shadow:0 18px 40px rgba(6,14,9,.35)}
  .menu-movel nav a,.menu-movel nav button{display:flex;align-items:center;gap:14px;width:100%;min-height:50px;padding:0 20px;font:500 16px/1.2 var(--sans);color:var(--cream);text-align:left}
  .menu-movel nav a.activo{background:rgba(196,146,42,.14);box-shadow:inset 3px 0 0 var(--gold)}
  .menu-movel nav svg{width:20px;height:20px;color:var(--gold-pale);flex:none}
  .menu-movel nav .menu-rot{display:block;padding:0;margin:14px 20px 6px;font:700 11px/1 var(--cond);letter-spacing:2.4px;text-transform:uppercase;color:var(--gold)}
  .menu-movel nav form{border-top:1px solid rgba(244,240,230,.14);margin-top:8px;padding-top:8px}
}

/* armadilha para robôs: fora do ecrã, não com display:none (há robôs que saltam os campos escondidos assim) */
.mel{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}