/* ------------------------------------------------------------ experimenta
   A réplica da app no telemóvel, para mexer na landing. Os tamanhos e as cores
   são os medidos na app a 390px; o ecrã é desenhado a 390×800 e encolhido
   inteiro com `transform` para caber na moldura, por isso as medidas aqui são
   as da app e não as da página. Tudo debaixo de `.xp` para não tocar no resto
   da landing. */

.experimenta{padding-block:clamp(8px,2vw,16px) clamp(56px,9vw,96px)}
.experimenta[hidden]{display:none}
.xp-grelha{
  display:grid; gap:clamp(28px,5vw,64px); align-items:start; margin-top:22px;
  grid-template-columns:minmax(0,372px) minmax(0,1fr);
}
/* Numa coluna, o título vem antes do telemóvel e os passos depois: o guia
   desfaz-se e as peças entram na grelha por ordem. */
@media (max-width:760px){
  .xp-grelha{grid-template-columns:minmax(0,1fr); gap:16px}
  .xp-guia{display:contents}
  .xp-guia > h2, .xp-guia > p{order:-1}
  .xp-guia > p{margin-top:0}
  .xp-tel{justify-self:center; margin-block:12px 8px}
  .xp-passos{margin-top:0}
  .xp-rodape{margin-top:0}
}

.xp-tel{
  width:100%; max-width:372px; border:10px solid var(--mt-ink-900); border-radius:46px;
  background:var(--mt-ink-900); box-shadow:var(--mt-shadow-pop); overflow:hidden;
}
.xp-ecra{position:relative; overflow:hidden; border-radius:36px; background:var(--mt-canvas)}

/* Os passos ao lado do telemóvel */
.xp-guia{max-width:46ch}
.xp-guia h2{margin:0; font-weight:600; letter-spacing:-.028em; line-height:1.12; font-size:clamp(27px,3.9vw,40px); text-wrap:balance}
.xp-guia > p{margin:16px 0 0; font-size:17px; color:var(--mt-ink-700)}
.xp-passos{list-style:none; margin:26px 0 0; padding:0; border-top:1px solid var(--mt-line)}
.xp-passos li{border-bottom:1px solid var(--mt-line)}
.xp-passos button{
  all:unset; box-sizing:border-box; cursor:pointer; width:100%;
  display:grid; grid-template-columns:26px 1fr; gap:12px; align-items:start; padding:14px 2px;
  font-size:16px; color:var(--mt-ink-900);
}
.xp-passos button:focus-visible{outline:2px solid var(--mt-accent); outline-offset:2px; border-radius:var(--mt-radius-sm)}
.xp-passos button:hover .xp-passo-titulo{color:var(--mt-accent)}
.xp-passo-marca{
  width:22px; height:22px; margin-top:1px; border-radius:50%; border:1.5px solid var(--mt-line-strong);
  display:grid; place-items:center; font-family:var(--mt-font-mono); font-size:11px; color:var(--mt-ink-400);
}
.xp-passo-titulo{display:block; font-weight:500}
.xp-passo-nota{display:block; margin-top:2px; font-size:14.5px; color:var(--mt-ink-500)}
.xp-passos .feito .xp-passo-marca{background:var(--mt-ok); border-color:var(--mt-ok); color:#fff}
.xp-passos .feito .xp-passo-titulo{color:var(--mt-ink-500); text-decoration:line-through; text-decoration-color:var(--mt-ink-300)}
.xp-rodape{display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; margin-top:18px; font-size:14.5px; color:var(--mt-ink-500)}
.xp-recomecar{
  all:unset; cursor:pointer; color:var(--mt-accent); font-weight:500; font-size:14.5px;
}
.xp-recomecar:hover{text-decoration:underline; text-underline-offset:3px}
.xp-recomecar:focus-visible{outline:2px solid var(--mt-accent); outline-offset:3px; border-radius:var(--mt-radius-sm)}

/* ------------------------------------------------------------ a app */
.xp{
  --xp-warn-ink:#7C4810; --xp-danger:#9E2B2B; --xp-danger-tint:#F8EAEA; --xp-danger-line:#E5BDBD; --xp-toast:#2A2520;
  position:absolute; top:0; left:0; width:390px; height:800px; transform-origin:0 0; overflow:hidden;
  display:flex; flex-direction:column; background:var(--mt-canvas); color:var(--mt-ink-900);
  font-family:var(--mt-font-sans); font-size:15px; line-height:1.4; text-align:left;
  -webkit-tap-highlight-color:transparent;
}
.xp *{box-sizing:border-box}
/* :where() para o reset não ganhar às classes dos botões. */
.xp :where(button){font:inherit; color:inherit; background:none; border:0; padding:0; margin:0; cursor:pointer; text-align:inherit}
.xp :where(button:disabled){cursor:default}
.xp :where(input,textarea){font:inherit; color:var(--mt-ink-900)}
.xp :where(button,input,textarea,a):focus-visible{outline:2px solid var(--mt-accent); outline-offset:2px}
.xp :where(svg){display:block; flex:none; stroke:currentColor}
.xp .mono{font-family:var(--mt-font-mono); font-variant-numeric:tabular-nums}
.xp .nada{color:var(--mt-ink-300)}
.xp .warn{color:var(--mt-warn)}
.xp .deve{color:var(--xp-danger); font-weight:600}
.xp .favor{color:var(--mt-ok); font-weight:600}

.xp-topo{display:flex; align-items:center; gap:10px; height:53px; flex:none; padding:4px 6px 4px 14px; border-bottom:1px solid var(--mt-line); background:var(--mt-surface-2)}
.xp-topo .logo{width:21px; color:var(--mt-accent)}
.xp-topo b{flex:1; font-size:14px; font-weight:600; letter-spacing:-.01em}
.xp-icone-btn{width:44px; height:44px; display:grid; place-items:center; color:var(--mt-ink-900)}
.xp-icone-btn svg{width:22px; height:22px}

/* Sem `overscroll-behavior:contain` de propósito: no telemóvel a moldura ocupa
   o ecrã quase todo, e quem desliza por cima dela tem de conseguir sair para
   o resto da página quando a lista acaba. */
.xp-main{flex:1; overflow-y:auto; padding:16px 14px 20px; scrollbar-width:none}
.xp-main::-webkit-scrollbar{display:none}

/* barra de ações e navegação de baixo */
.xp-accoes{flex:none; display:flex; gap:8px; padding:10px 12px; border-top:1px solid var(--mt-line); background:var(--mt-surface)}
.xp-nav{flex:none; display:flex; gap:4px; height:56px; padding:0 6px; border-top:1px solid var(--mt-line); background:var(--mt-surface-2)}
.xp-nav button{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; font-size:11.5px; font-weight:500; color:var(--mt-ink-500)}
.xp-nav button span:first-child{width:44px; height:24px; display:grid; place-items:center; border-radius:12px}
.xp-nav button svg{width:17px; height:17px}
.xp-nav button[aria-current]{color:var(--mt-ink-900); font-weight:600}
.xp-nav button[aria-current] span:first-child{background:var(--mt-surface-3)}

/* botões */
.xp-btn{
  flex:1; min-width:0; height:44px; display:flex; align-items:center; justify-content:center; gap:6px;
  border-radius:6px; border:1px solid var(--mt-line-strong); background:var(--mt-surface);
  font-size:11.5px; font-weight:600; letter-spacing:.01em; white-space:nowrap; text-align:center;
}
.xp-btn svg{width:15px; height:15px}
.xp-btn--pri{background:var(--mt-accent); border-color:transparent; color:#fff}
.xp-btn--pri:disabled{opacity:.45}
.xp-btn--grande{height:52px; font-size:15px; border-radius:8px}
.xp-btn--linha{flex:none; display:inline-flex; padding:0 14px; font-size:14px}
.xp-btn--alto{height:44px; font-size:14.5px; padding:0 16px}
.xp-btn--texto{border:0; background:none; color:var(--mt-ink-500); font-size:14.5px; font-weight:500}
.xp-btn--perigo{border-color:var(--xp-danger-line); color:var(--xp-danger)}
.xp-btn--perigo-texto{color:var(--xp-danger)}
.xp-btn.apagado{color:var(--mt-ink-300)}
.xp-link{display:block; margin-top:8px; font-size:13.5px; font-weight:600; color:var(--mt-accent)}

/* cabeçalho do dia */
.xp-dia{display:flex; align-items:center; gap:4px; margin:-4px 0 14px}
.xp-dia .seta{width:32px; height:40px; display:grid; place-items:center; color:var(--mt-ink-700)}
.xp-dia .seta svg{width:16px; height:16px}
.xp-dia-nome{flex:1; min-width:0; font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.xp-dia-nome .mono{margin-left:6px; font-weight:400; color:var(--mt-ink-500)}
.xp-dia-hoje{padding:0 6px; height:40px; font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-lotacao{font-size:19px; font-weight:500}
.xp-lotacao span{color:var(--mt-ink-400)}

.xp-faixa{display:flex; align-items:center; gap:8px; margin:0 0 12px; padding:7px 10px; border:1px solid var(--mt-warn-line); border-radius:6px; background:var(--mt-warn-tint); font-size:12.5px; color:var(--xp-warn-ink)}
.xp-faixa svg{flex:none; width:15px; height:15px}
.xp-faixa-nome{font-weight:700; text-decoration:underline; text-underline-offset:2px}

.xp-procura{display:flex; align-items:center; gap:10px; width:100%; height:44px; padding:0 14px; margin-bottom:12px; border:1px solid var(--mt-line-strong); border-radius:6px; background:var(--mt-surface)}
.xp-procura svg{width:18px; height:18px; color:var(--mt-ink-500)}
.xp-procura input{flex:1; min-width:0; border:0; outline:0; background:none; font-size:16px}
.xp-procura input::placeholder{color:var(--mt-ink-300)}
.xp-procura-limpar{flex:none; height:32px; padding:0 4px; font-size:13px; font-weight:600; color:var(--mt-accent)}
.xp-procura--botao{width:300px; font-size:15px; color:var(--mt-ink-300)}
.xp-procura--botao svg{width:16px; height:16px; color:var(--mt-ink-400)}

.xp-abas, .xp-servicos{display:flex; gap:6px; margin-bottom:12px}
.xp-abas button, .xp-servicos button{display:flex; align-items:center; gap:6px; border-radius:6px; border:1px solid var(--mt-line-strong); background:var(--mt-surface); font-size:12.5px; font-weight:600; color:var(--mt-ink-500)}
.xp-abas button .mono, .xp-servicos button .mono{font-weight:500; color:var(--mt-ink-400)}
.xp-abas button[aria-pressed="true"], .xp-servicos button[aria-pressed="true"]{background:var(--mt-ink-900); border-color:transparent; color:#fff}
.xp-abas button[aria-pressed="true"] .mono, .xp-servicos button[aria-pressed="true"] .mono{color:var(--mt-surface-2)}
.xp-abas button{flex:1; min-width:0; height:44px; justify-content:center}

/* os separadores de serviço: uma fila que corre de lado quando não cabe */
.xp-servicos{overflow-x:auto; scrollbar-width:none}
.xp-servicos::-webkit-scrollbar{display:none}
.xp-servicos button{flex:none; height:38px; padding:0 14px; white-space:nowrap}

/* o mapa do hotel: um cartão por grupo de hóspedes */
.xp-mapa{display:flex; flex-direction:column; gap:12px}
.xp-grupo-texto{margin:0; padding:8px 14px; border-bottom:1px solid var(--mt-line); font-size:11.5px; line-height:1.45; color:var(--mt-ink-500)}
.xp-sem-quartos p{margin:0; padding:14px 14px 4px; font-size:13px; color:var(--mt-ink-500)}
.xp-sem-quartos button{display:block; padding:6px 14px 14px; font-size:13px; font-weight:600; color:var(--mt-accent)}
.xp-quarto.livre .xp-grupo{color:var(--mt-ink-400)}
.xp-quarto .xp-grupo span{margin-left:auto; text-transform:none; letter-spacing:0; font-weight:500}
.xp-quarto-tirar{display:block; padding:2px 14px 12px; font-size:12.5px; font-weight:600; color:var(--mt-accent)}
.xp-quarto-escolha{display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:0 14px 12px}
.xp-quarto-escolha span{font-size:12px; color:var(--mt-ink-500)}
.xp-quarto-escolha button{min-height:44px; padding:0 12px; border:1px solid var(--mt-line-strong); border-radius:8px; font-size:13px; font-weight:600; color:var(--mt-accent)}

/* a lista do dia */
.xp-lista{border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface); overflow:hidden}
.xp-lista.ca{border-color:var(--mt-ok-line)}
.xp-vazia{padding:16px 14px; font-size:13.5px; color:var(--mt-ink-300); border-color:var(--mt-ok-line)}
.xp-linha{display:flex; align-items:stretch; height:76px; border-bottom:1px solid var(--mt-line); background:var(--mt-surface)}
.xp-linha:last-child{border-bottom:0}
.xp-linha.aviso{background:var(--mt-warn-tint)}
.xp-linha.escolhida{background:var(--mt-accent-tint)}
.xp-linha-corpo{flex:1; min-width:0; display:flex; align-items:center; gap:12px; padding:0 0 0 13px; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none}
.xp-linha-texto{flex:1; min-width:0}
.xp-linha-nome{display:flex; align-items:center; gap:7px}
.xp-linha-nome b{font-size:17px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.xp-linha-nome .mono{margin-left:auto; font-size:12.5px; color:var(--mt-ink-400)}
.xp-linha-nome .mono.ok{color:var(--mt-ok)}
.xp-linha-sub{display:block; margin-top:1px; font-size:13.5px; color:var(--mt-ink-500); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.xp-linha.aviso .xp-linha-sub{color:var(--mt-warn); font-weight:500}
.xp-meta-aconteceu{font-weight:600; color:var(--mt-warn)}
.xp-meta-aconteceu svg{display:inline-block; width:13px; height:13px; margin:0 4px -2px 0}
.xp-linha.saiu{opacity:.6}
.xp-linha.saiu .xp-av, .xp-linha.faltou .xp-av{background:var(--mt-surface-3); color:var(--mt-ink-400)}
.xp-linha.faltou .xp-av{border:1px dashed var(--mt-line-strong)}
.xp-linha.saiu .xp-linha-nome b, .xp-linha.faltou .xp-linha-nome b{color:var(--mt-ink-500)}
.xp-linha-accao{flex:none; display:flex; align-items:center; padding:0 12px 0 8px}
.xp-check{width:56px; height:56px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; border-radius:10px; background:var(--mt-accent); color:var(--mt-accent-tint); font-size:10.5px; font-weight:600; letter-spacing:.06em; text-align:center}
.xp-check svg{width:22px; height:22px; color:#fff}
.xp-check.calado{background:var(--mt-surface); border:1px solid var(--mt-line-strong); color:var(--mt-ink-500); font-size:9.5px}
.xp-circulo{flex:none; width:24px; height:24px; margin-right:14px; border-radius:50%; border:1.5px solid var(--mt-line-strong); background:var(--mt-surface); display:grid; place-items:center; color:#fff}
.xp-circulo svg{width:14px; height:14px}
.escolhida .xp-circulo{background:var(--mt-accent); border-color:var(--mt-accent)}
.xp-grupo{display:flex; gap:6px; padding:7px 14px; border-block:1px solid var(--mt-line); background:var(--mt-surface-2); font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-grupo-pe{padding:8px 14px; background:var(--mt-surface-2); font-size:11.5px; color:var(--mt-ink-500)}

.xp-selo{flex:none; height:19px; display:inline-flex; align-items:center; padding:0 6px; border-radius:4px; background:var(--mt-surface-3); font-size:10.5px; font-weight:600; color:var(--mt-ink-700); white-space:nowrap}
.xp-selo--ok{background:var(--mt-ok-tint); color:var(--mt-ok)}
.xp-selo--accent{background:var(--mt-accent-tint); color:var(--mt-accent)}
.xp-selo--alerta{background:var(--mt-warn-tint); color:var(--mt-warn)}
.xp-selo--saiu{background:none; border:1px solid var(--mt-line); color:var(--mt-ink-400)}
.xp-selo--faltou{background:none; border:1px dashed var(--mt-line-strong); color:var(--mt-ink-400)}

/* escolher vários */
.xp-escolha{flex:none; padding:10px 12px 12px; border-top:1px solid var(--mt-line); background:var(--mt-surface)}
.xp-escolha-topo{display:flex; align-items:center; gap:14px; height:32px}
.xp-escolha-topo b{flex:1; font-size:13.5px; font-weight:600}
.xp-escolha-topo button{font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-escolha-topo button.calado{font-weight:500; color:var(--mt-ink-500)}
.xp-escolha-regs{display:flex; gap:6px; margin:6px -12px 8px; padding:0 12px; overflow-x:auto; scrollbar-width:none}
.xp-escolha-regs::-webkit-scrollbar{display:none}
.xp-escolha-regs button{flex:none; height:44px; display:flex; align-items:center; gap:7px; padding:0 12px; border:1px solid var(--mt-line-strong); border-radius:6px; font-size:13.5px; font-weight:600}
.xp-escolha-regs svg{width:16px; height:16px; color:var(--mt-accent)}
.xp-escolha-botoes{display:flex; gap:8px}
.xp-escolha-botoes .xp-btn{height:44px; font-size:14px}

/* av */
.xp-av{flex:none; width:44px; height:44px; border-radius:50%; display:grid; place-items:center; font-size:17px; font-weight:600}
.xp-av--m{width:46px; height:46px}
.xp-av--g{width:48px; height:48px; font-size:19px}
.xp-av--f{width:48px; height:48px; font-size:19px}
.xp-av--p{width:30px; height:30px; font-size:11.5px}
.xp-av--pp{width:28px; height:28px; font-size:11.5px}
.xp-av-1{background:#D9CFC2; color:#6B5D4B} .xp-av-2{background:#C9D2C6; color:#4B5B4A}
.xp-av-3{background:#E0D2BC; color:#7A6242} .xp-av-4{background:#D5CBD8; color:#665A6B}
.xp-av-5{background:#C6CDD6; color:#4C5560} .xp-av-6{background:#CFC5B4; color:#665C4C}
.xp-av--neutro{background:var(--mt-surface-3); color:var(--mt-ink-500)}
.xp-av--neutro.vet{background:var(--mt-accent-tint); color:var(--mt-accent)}
.xp-av--tracejado{border:1.5px dashed var(--mt-line-strong); color:var(--mt-ink-400)}

/* páginas */
.xp-migalha{display:flex; gap:6px; font-size:12.5px; color:var(--mt-ink-400); margin-bottom:10px}
.xp-migalha button{color:var(--mt-ink-400)}
.xp-migalha span:last-child{color:var(--mt-ink-700)}
.xp-cabeca{display:flex; gap:16px; align-items:flex-start}
.xp-cabeca > div{min-width:0}
.xp-cabeca h3{margin:0; font-size:34px; line-height:1.1; font-weight:600; letter-spacing:-.02em}
.xp-cabeca-sub{margin:6px 0 0; font-size:13.5px; line-height:1.7; color:var(--mt-ink-500)}
.xp-cabeca-sub i{font-style:normal; margin:0 7px; color:var(--mt-ink-300)}
.xp-cabeca-sub button{color:var(--mt-ink-500)}
.xp-cabeca-selos{display:flex; gap:6px; margin-top:6px}
.xp-titulo{margin:0 0 4px; font-size:27px; font-weight:600; letter-spacing:-.02em}
.xp-titulo button{font-weight:600}
.xp-sub{margin:0 0 14px; font-size:13.5px; color:var(--mt-ink-500)}
.xp-botoes{display:flex; flex-wrap:wrap; gap:8px; margin:16px 0}
.xp-regua{border:0; border-top:1px solid var(--mt-line); margin:0 0 16px}
.xp-seccao{display:flex; align-items:center; gap:12px; margin:22px 0 11px; font-size:17px; font-weight:600}
.xp-seccao::after{content:""; flex:1; order:1; border-top:1px solid var(--mt-line)}
.xp-seccao > button, .xp-seccao > .xp-accoes-titulo{order:2; font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-accoes-titulo{display:flex; gap:14px}
.xp-accoes-titulo button{font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-rubrica{display:flex; align-items:center; gap:12px; margin:6px 0 11px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-rubrica::after{content:""; flex:1; border-top:1px solid var(--mt-line)}
.xp-micro{display:block; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-nota-pequena{margin:8px 0 16px; font-size:12px; color:var(--mt-ink-400); text-align:center}
.xp-nota-pequena.warn{color:var(--xp-warn-ink); margin-bottom:0}

.xp-cartao{border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface); overflow:hidden; margin-bottom:12px}
.xp-cartao.warn{border-color:var(--mt-warn-line)}
.xp-cartao-cabeca{display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--mt-line); font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-cartao-cabeca > button{margin-left:auto; letter-spacing:0; text-transform:none; font-size:13px; font-weight:600; color:var(--mt-accent)}
.xp-cartao-corpo{padding:12px 14px}
.xp-cartao-nota{padding:10px 14px 12px; font-size:12px; color:var(--mt-ink-400); border-top:1px solid var(--mt-line); margin:0}
.xp-cartao-texto{margin:0 0 4px; font-size:13.5px; color:var(--mt-ink-500)}
.xp-cartao-texto.escuro{color:var(--mt-ink-900)}
.xp-mensalidade{padding:0 0 12px; margin-bottom:12px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-mensalidade p{display:flex; align-items:flex-start; justify-content:space-between; gap:8px; margin:0 0 4px}
.xp-mensalidade small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-mensalidade .xp-btn{margin-top:8px}
.xp-vazio-cartao{padding:20px}
.xp-vazio-cartao b{display:block; font-size:15px; font-weight:600}
.xp-vazio-cartao p{margin:6px 0 0; font-size:13.5px; color:var(--mt-ink-500)}
.xp-vazio-cartao .xp-btn{margin-top:14px}

.xp-alerta{border:1px solid var(--mt-warn-line); border-radius:10px; overflow:hidden; margin-bottom:12px; background:var(--mt-surface)}
.xp-alerta-cabeca{display:flex; align-items:center; gap:8px; padding:10px 14px; background:var(--mt-warn-tint); border-bottom:1px solid var(--mt-warn-line); font-size:14px; font-weight:600; color:var(--xp-warn-ink)}
.xp-alerta-cabeca svg{width:16px; height:16px; color:var(--mt-warn)}
.xp-alerta-corpo{padding:10px 14px; font-size:13.5px; border-top:1px solid var(--mt-warn-line)}
.xp-alerta-cabeca + .xp-alerta-corpo{border-top:0}
.xp-alerta-corpo small{display:block; font-size:12.5px; font-weight:600; color:var(--xp-warn-ink)}
.xp-hoje-selo{margin:-2px 0 12px}

.xp-cartao-titulo{display:flex; align-items:center; gap:8px; padding:10px 14px; border-bottom:1px solid var(--mt-line); font-size:14px; color:var(--mt-ink-500)}
.xp-cartao.warn .xp-cartao-titulo{background:var(--mt-warn-tint); border-color:var(--mt-warn-line); color:var(--xp-warn-ink)}
.xp-cartao-titulo svg{width:16px; height:16px}
.xp-cartao-titulo b{flex:1; font-weight:600}
.xp-cartao-titulo button{font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-cartao-vazio{display:block; width:100%; padding:12px 14px; font-size:13.5px; color:var(--mt-ink-300)}
.xp-cuidado{display:flex; gap:10px; align-items:flex-start; padding:10px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-cuidado:last-child{border-bottom:0}
.xp-cuidado span{flex:1}
.xp-cuidado button{font-size:12.5px; font-weight:600; color:var(--mt-ink-400)}
.xp-caixa-nova{display:flex; flex-direction:column; gap:8px; align-items:flex-start; padding:12px 14px}
.xp-caixa-nova textarea{width:100%; padding:9px 10px; border:1px solid var(--mt-line-strong); border-radius:6px; font-size:15px; resize:none}

.xp-ficha-linha{display:grid; grid-template-columns:132px 1fr; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-ficha-linha:last-of-type{border-bottom:0}
.xp-ficha-linha > span:first-child{padding:10px 12px; background:var(--mt-surface-2); border-right:1px solid var(--mt-line); color:var(--mt-ink-500)}
.xp-ficha-linha > span:last-child, .xp-ficha-linha > button{padding:10px; min-height:44px}
.xp-dado{display:grid; grid-template-columns:96px 1fr; gap:8px; padding:10px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-dado:last-child{border-bottom:0}
.xp-dado span:first-child{color:var(--mt-ink-500)}

.xp-vacina{display:flex; align-items:center; gap:9px; width:100%; min-height:44px; padding:0 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-vacina:last-of-type{border-bottom:0}
.xp-vacina::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--mt-ok)}
.xp-vacina .mono{margin-left:auto; font-size:12.5px; color:var(--mt-ink-500)}
.xp-vacina.fora{background:var(--mt-warn-tint); font-weight:600; color:var(--xp-warn-ink)}
.xp-vacina.fora::before{background:var(--mt-warn)}
.xp-vacina.fora .mono{color:var(--mt-warn)}
.xp-vacina-linha{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; width:100%; padding:11px 14px; border-bottom:1px solid var(--mt-line)}
.xp-vacina-linha:last-child{border-bottom:0}
.xp-vacina-linha b{width:100%; font-size:13.5px; font-weight:600}
.xp-vacina-linha small{font-size:12.5px; color:var(--mt-ink-500)}
.xp-vacina-linha small.warn{color:var(--mt-warn); font-weight:600}

.xp-contacto{display:flex; align-items:center; border-bottom:1px solid var(--mt-line)}
.xp-contacto:last-child{border-bottom:0}
.xp-contacto > button:first-child{flex:1; min-width:0; display:flex; align-items:center; gap:12px; padding:11px 14px}
.xp-contacto b{display:block; font-size:13.5px; font-weight:600}
.xp-contacto small{font-size:12px; color:var(--mt-ink-500)}
.xp-ligar{flex:none; width:44px; height:44px; margin-right:6px; display:grid; place-items:center; color:var(--mt-ink-900)}
.xp-ligar svg{width:16px; height:16px}
.xp-tris{display:flex; flex-wrap:wrap; gap:6px; padding:12px 14px}
.xp-tri{height:26px; padding:0 9px; border-radius:4px; border:1px dashed var(--mt-line-strong); font-size:12px; color:var(--mt-ink-300)}
.xp-tri.sim{border:0; background:var(--mt-ok-tint); color:var(--mt-ok); font-weight:600}
.xp-tri.nao{color:var(--mt-ink-400)}

.xp-separadores{display:flex; gap:2px; margin:20px 0 12px; border-bottom:1px solid var(--mt-line); overflow-x:auto; scrollbar-width:none}
.xp-separadores::-webkit-scrollbar{display:none}
.xp-separadores button{flex:none; height:44px; padding:0 13px; margin-bottom:-1px; border-bottom:2px solid transparent; font-size:14px; font-weight:500; color:var(--mt-ink-500); white-space:nowrap}
.xp-separadores button .mono{color:var(--mt-ink-400); font-weight:400}
.xp-separadores button[aria-pressed="true"]{border-color:var(--mt-accent); font-weight:600; color:var(--mt-ink-900)}
.xp-separadores--ficha{margin-top:24px}
.xp-caixinha{padding:13px 15px}
.xp-caixinha small{display:block; margin-bottom:6px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-caixinha p{margin:0; font-size:13.5px}
.xp-recado{display:flex; gap:10px; padding:12px 14px; border-bottom:1px solid var(--mt-line)}
.xp-recado:last-child{border-bottom:0}
.xp-recado p{margin:0; font-size:13.5px}
.xp-recado small{display:flex; gap:8px; margin-top:4px; font-size:11.5px; color:var(--mt-ink-400)}
.xp-recado small button{font-size:11.5px; font-weight:600; color:var(--mt-ink-400)}
.xp-incidente{padding:12px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
button.xp-incidente{display:block; width:100%; background:none; border-width:0 0 1px; font:inherit; font-size:13.5px; color:inherit; text-align:left; cursor:pointer; min-height:44px}
.xp-registo{padding:10px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-registo:last-child{border-bottom:0}
.xp-registo small{display:block; font-size:12px; color:var(--mt-ink-400)}
.xp-registo p{margin:2px 0 0; color:var(--mt-ink-700)}
.xp-registo b{font-weight:600; color:var(--mt-ink-900)}
.xp-alteracoes{margin:4px 0 0; padding:0; list-style:none; font-size:12.5px; color:var(--mt-ink-500)}
.xp-alteracoes s{color:var(--mt-ink-500)}
.xp-alteracoes b{color:var(--mt-ink-700)}
.xp-aviso-dono{margin-top:16px; padding-top:14px; border-top:1px solid var(--mt-line)}
.xp-aviso-dono p{margin:0 0 8px; font-size:13px; color:var(--mt-ink-700)}
.xp-aviso-dono .xp-btn{width:100%}
.xp-aviso-dono pre{margin:8px 0 0; padding:10px 12px; white-space:pre-wrap; font:inherit; font-size:12.5px; color:var(--mt-ink-700); background:var(--mt-surface-2); border:1px solid var(--mt-line); border-radius:8px}
.xp-incidente:last-child{border-bottom:0}
.xp-incidente > b{display:block}
.xp-incidente small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-incidente p{margin:4px 0 0; color:var(--mt-ink-700)}
.xp-incidente-topo{display:flex; align-items:center; gap:8px; margin:0 !important}
.xp-incidente-topo b:first-child{color:var(--mt-ink-500)}
.xp-incidente-topo b:nth-child(2){flex:1; font-size:15px; color:var(--mt-ink-900)}
.xp-fotos{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.xp-foto{position:relative; aspect-ratio:1; border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface-3); display:grid; place-items:center; color:var(--mt-ink-300)}
.xp-foto svg{width:26px; height:26px}
.xp-foto small{position:absolute; left:8px; bottom:6px; font-size:11px; color:var(--mt-ink-500)}

/* listas de cães e clientes */
.xp-filtros{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px}
.xp-filtros button{height:34px; padding:0 11px; border:1px solid var(--mt-line-strong); border-radius:6px; font-size:12.5px; font-weight:500}
.xp-filtros button .mono{color:var(--mt-ink-400)}
.xp-filtros button .mono.warn{color:var(--mt-warn)}
.xp-filtros button[aria-pressed="true"]{background:var(--mt-surface-3); font-weight:600}
.xp-filtros span:last-child{margin-left:auto; font-size:12.5px; color:var(--mt-ink-400)}
.xp-item{display:flex; align-items:center; width:100%; border-bottom:1px solid var(--mt-line)}
.xp-item:last-child{border-bottom:0}
.xp-item-corpo{flex:1; min-width:0; display:flex; align-items:center; gap:12px; min-height:76px; padding:12px 14px}
.xp-item span.t{flex:1; min-width:0}
.xp-item b{display:block; font-size:15px; font-weight:600}
.xp-item small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-item small.warn{color:var(--mt-warn)}
.xp-item > .xp-item-corpo > .mono{font-size:13.5px; color:var(--mt-ink-500)}
.xp-item .mono.deve{font-size:14px}
.xp-repor{margin-right:12px; height:36px}

.xp-divida{display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:15px}
.xp-divida > button{font-size:13.5px; font-weight:500; color:var(--mt-accent)}
.xp-emdia{font-weight:600}
.xp-cao-cartao{display:flex; align-items:center; gap:12px; width:100%; padding:10px 16px}
.xp-cao-cartao b{display:block; font-size:17px; font-weight:600}
.xp-cao-cartao small{font-size:13px; color:var(--mt-ink-500)}
.xp-levanta{display:grid; grid-template-columns:1fr auto; align-items:center; gap:0 8px; padding:6px 0; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-levanta .mono{font-size:12px; color:var(--mt-ink-500)}
.xp-levanta small{grid-column:1; font-size:12px; color:var(--mt-ink-500)}
.xp-levanta button{grid-column:2; grid-row:1 / span 3; width:32px; height:32px; font-size:18px; color:var(--mt-ink-400)}
.xp-form{display:flex; flex-direction:column; gap:10px; margin-top:12px}
.xp-form label{display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; color:var(--mt-ink-500)}
.xp-form .xp-btn{align-self:flex-start}
.xp-grande{font-size:52px; font-weight:600; line-height:1.1; margin:2px 0 8px}
.xp-pacote-linha{display:grid; grid-template-columns:1fr 84px 32px; gap:8px; padding:9px 14px; border-top:1px solid var(--mt-line); font-size:12.5px}
.xp-pacote-linha.cabeca{background:var(--mt-surface-2); font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-pacote-linha .mono{color:var(--mt-ink-500)}
.xp-pacote-linha b{text-align:right}
.xp-pacote-linha b.ok{color:var(--mt-ok)}
.xp-proximo{display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-proximo:last-child{border-bottom:0}
.xp-proximo .mono{width:96px; color:var(--mt-ink-500)}
.xp-proximo button{flex:1; font-weight:600}

/* conta corrente */
.xp-divida-total{display:inline-flex; flex-direction:column; padding:14px 20px; margin-bottom:18px}
.xp-divida-total b{font-size:27px; font-weight:600; color:var(--xp-danger)}
.xp-divida-total > span{font-size:13px; color:var(--mt-ink-500)}
.xp-saldo{padding:14px 17px; border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface); margin-bottom:6px}
.xp-saldo-valor{font-size:27px; font-weight:600; letter-spacing:-.02em; margin-bottom:12px}
.xp-mov{display:flex; gap:12px; width:100%; padding:11px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px; color:var(--mt-ink-900)}
.xp-mov:last-child{border-bottom:0}
.xp-mov > .mono:first-child{width:48px; flex:none; font-size:12.5px; color:var(--mt-ink-400); padding-top:1px}
.xp-mov > span:nth-child(2){flex:1; min-width:0}
.xp-mov b{font-weight:600}
.xp-mov small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-mov .valor{font-weight:600}
.xp-mov .valor.recebido{color:var(--mt-ok)}

/* pedidos */
.xp-pedidos-cabeca{display:flex; align-items:center; gap:8px; height:44px; padding:0 18px; background:var(--mt-surface-2); border-bottom:1px solid var(--mt-line); font-size:13.5px}
.xp-pedidos-cabeca .mono{color:var(--mt-ink-400)}
.xp-pedido{display:flex; flex-wrap:wrap; gap:14px; padding:15px 18px; border-bottom:1px solid var(--mt-line)}
.xp-pedido:last-child{border-bottom:0}
.xp-pedido-dia{width:56px; text-align:center}
.xp-pedido-dia b{display:block; font-size:19px; font-weight:600}
.xp-pedido-dia small{font-size:11.5px; color:var(--mt-ink-500)}
.xp-pedido-texto{flex:1; min-width:0}
.xp-pedido-texto p{display:flex; align-items:center; gap:8px; margin:0; font-size:15px}
.xp-pedido-texto small{display:block; margin-top:3px; font-size:13.5px; color:var(--mt-ink-500)}
.xp-pedido-accoes{display:flex; flex-wrap:wrap; align-items:center; gap:8px; width:100%}
.xp-pedido-accoes .xp-btn{height:40px}
.xp-pedido-accoes .xp-btn--texto{flex:none; padding:0 6px}

/* marcações */
.xp-cal-titulo small{display:block; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-cal-titulo .xp-titulo{margin:4px 0 14px; line-height:1.15}
.xp-cal-controlos{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px}
.xp-cal-nav{display:flex; gap:6px}
.xp-cal-nav button{height:44px; min-width:36px; padding:0 14px; border:1px solid var(--mt-line-strong); border-radius:6px; background:var(--mt-surface); font-size:14px; font-weight:600}
.xp-segmento--p{padding:2px}
.xp-segmento--p button{height:40px; padding:0 13px; font-size:14px}
.xp-mini{padding:11px 11px 12px}
.xp-mini-topo{display:flex; align-items:center; justify-content:space-between; padding:0 2px 8px; font-size:12.5px}
.xp-mini-topo span{display:flex}
.xp-mini-topo button{width:44px; height:32px; color:var(--mt-ink-400)}
.xp-mini-grelha{display:grid; grid-template-columns:repeat(7,1fr); gap:4px 3px; text-align:center}
.xp-mini-grelha > span{font-size:10.5px; font-weight:600; color:var(--mt-ink-400); padding:2px 0 4px}
.xp-mini-dia{display:flex; flex-direction:column; align-items:center; gap:3px; padding:5px 2px 4px; border-radius:4px; font-size:10.5px; font-weight:600; color:var(--mt-ink-700)}
.xp-mini-dia.fora{color:var(--mt-ink-300); font-weight:400}
.xp-mini-dia.hoje{background:var(--mt-accent-tint)}
.xp-mini-nota{margin:10px 0 0; font-size:10.5px; color:var(--mt-ink-400)}
.xp-ocup{display:block; width:100%; height:6px; border-radius:2px; background:var(--mt-surface-3); overflow:hidden}
.xp-ocup.fino{height:4px}
.xp-ocup i{display:block; height:100%; background:var(--mt-ink-900)}
.xp-ocup i.cheio{background:var(--mt-warn)}
.xp-mostrar{padding:12px 14px 4px}
.xp-mostrar small{display:block; margin-bottom:2px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-mostrar button{display:flex; align-items:center; gap:10px; width:100%; min-height:44px; font-size:13.5px}
.xp-caixa{width:18px; height:18px; border-radius:4px; border:1.5px solid var(--mt-line-strong); display:grid; place-items:center; color:#fff}
.xp-caixa svg{width:13px; height:13px}
[aria-checked="true"] > .xp-caixa{background:var(--mt-accent); border-color:var(--mt-accent)}
.xp-colunas{display:flex; flex-direction:column; align-items:flex-start}
.xp-col{width:auto; min-width:168px; max-width:100%}
.xp-col.hoje{border-color:var(--mt-accent-line)}
.xp-col-cabeca{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:0 16px; padding:9px 12px 10px; border-bottom:1px solid var(--mt-line); font-size:12.5px; color:var(--mt-ink-500)}
.xp-col-cabeca b{font-size:17px; color:var(--mt-ink-900)}
.xp-col-cabeca .xp-ocup{margin-top:7px}
.xp-col-corpo{display:flex; flex-direction:column; gap:9px; padding:8px 9px 10px}
.xp-col-grupo small{display:block; margin-bottom:5px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-chips-nomes{display:flex; flex-wrap:wrap; gap:4px}
.xp-chips-nomes button{min-height:44px; padding:0 7px; border:1px solid var(--mt-line); border-radius:3px; background:var(--mt-surface-2); font-size:12px}
.xp-col-vazia{font-size:12.5px; color:var(--mt-ink-300); text-align:left; padding:4px 3px}
.xp-col-grupo.canceladas{border-top:1px solid var(--mt-line); padding-top:8px}
.xp-col-grupo.canceladas div{display:flex; flex-direction:column; align-items:flex-start; font-size:12px; color:var(--mt-ink-400)}
.xp-col-grupo.canceladas button{font-size:11.5px; font-weight:600; color:var(--mt-accent)}
.xp-mes{border:1px solid var(--mt-line); border-radius:10px; overflow:hidden; background:var(--mt-surface)}
.xp-mes-cabeca, .xp-mes-grelha{display:grid; grid-template-columns:repeat(7,1fr)}
.xp-mes-cabeca span{padding:8px 0; text-align:center; background:var(--mt-surface-2); border-bottom:1px solid var(--mt-line); font-size:11px; font-weight:600; color:var(--mt-ink-400)}
.xp-mes-dia{display:flex; flex-direction:column; gap:7px; min-height:64px; padding:7px 7px 8px; border-right:1px solid var(--mt-line); border-bottom:1px solid var(--mt-line); background:var(--mt-surface)}
.xp-mes-dia:nth-child(7n){border-right:0}
.xp-mes-dia > span{display:flex; align-items:center; justify-content:space-between; font-size:13.5px}
.xp-mes-dia small{font-size:11px; color:var(--mt-ink-400)}
.xp-mes-dia .hoje{width:22px; height:22px; margin:-2px 0 0 -3px; display:grid; place-items:center; border-radius:50%; background:var(--mt-accent); color:#fff; font-weight:600}
.xp-mes-dia.fora{background:var(--mt-surface-2); color:var(--mt-ink-400)}
.xp-mes-dia.domingo{background:#FBF4EA}

/* folhas (bottom sheet) */
.xp-fundo{position:absolute; inset:0; z-index:20; background:rgba(27,24,21,.38)}
.xp-folha{
  position:absolute; left:0; right:0; bottom:0; z-index:21; max-height:92%; display:flex; flex-direction:column;
  background:var(--mt-surface); border-radius:16px 16px 0 0; box-shadow:0 -8px 30px -12px rgba(27,24,21,.4);
}
.xp-folha.alta{height:80%}
.xp-folha::before{content:""; flex:none; width:34px; height:4px; margin:9px auto 4px; border-radius:2px; background:var(--mt-line-strong)}
.xp-folha-corpo{flex:1; overflow-y:auto; overscroll-behavior:contain; padding:6px 16px 18px; scrollbar-width:none}
.xp-folha-corpo::-webkit-scrollbar{display:none}
.xp-folha-pe{flex:none; padding:10px 16px 16px; border-top:1px solid var(--mt-line)}
.xp-folha h4{margin:0; font-size:21px; font-weight:600; letter-spacing:-.01em}
.xp-folha-cao{display:flex; align-items:center; gap:12px; margin:4px 0 14px}
.xp-folha-cao b{display:block; font-size:21px; font-weight:600}
.xp-folha-cao button{text-align:left}
.xp-folha-cao small{font-size:13.5px; color:var(--mt-ink-500)}
.xp-aviso-caixa{padding:12px 14px; margin-bottom:12px; border:1px solid var(--mt-warn-line); border-radius:10px; background:var(--mt-warn-tint); color:var(--xp-warn-ink)}
.xp-aviso-caixa p{display:flex; gap:9px; margin:0; font-size:15px; font-weight:600}
.xp-aviso-caixa p svg{width:17px; height:17px; margin-top:2px}
.xp-aviso-caixa small{display:block; margin:4px 0 0 26px; font-size:13.5px}
.xp-aviso-caixa .xp-btn{margin-top:12px; width:100%}
.xp-hora{display:flex; align-items:center; gap:10px; padding:9px 10px 9px 14px; margin-bottom:12px; border-radius:8px; background:var(--mt-surface-2)}
.xp-hora svg{width:16px; height:16px; color:var(--mt-ink-500)}
.xp-hora > span{flex:1; font-size:12.5px; color:var(--mt-ink-500)}
.xp-hora > span b{color:var(--mt-ink-900)}
.xp-hora input{width:72px; padding:9px; border:1px solid var(--mt-line-strong); border-radius:6px; background:var(--mt-surface); font-size:15px; text-align:center}
.xp-par{display:flex; gap:10px; margin-bottom:6px}
.xp-par .xp-btn{font-size:14px; height:48px}
.xp-par .xp-btn--grande{height:52px; font-size:15px}
.xp-nota{margin:8px 0 0; text-align:center; font-size:12px; color:var(--mt-ink-400)}
.xp-reversoes{margin-top:10px; border-top:1px solid var(--mt-line)}
.xp-reversoes .xp-btn{width:100%}

.xp-registos{display:grid; grid-template-columns:repeat(3,1fr); gap:6px}
.xp-registos button{position:relative; height:48px; display:flex; align-items:center; gap:8px; padding:0 10px; border:1px solid var(--mt-line-strong); border-radius:8px; font-size:12.5px; font-weight:500}
.xp-registos button svg{width:18px; height:18px; color:var(--mt-accent)}
.xp-registos button sup{position:absolute; top:4px; right:7px; font-size:10px; color:var(--mt-ink-400)}
.xp-registos button[aria-pressed="true"]{border-color:var(--mt-accent); background:var(--mt-accent-tint)}
.xp-painel{display:flex; flex-direction:column; gap:8px; margin-top:12px}
.xp-painel > small.mono{align-self:flex-end; margin-top:-4px; font-size:11.5px; color:var(--mt-ink-400)}
.xp-painel .xp-btn, .xp-form .xp-btn, .xp-caixa-nova .xp-btn{flex:none}
.xp-painel .xp-btn--texto{height:40px}
.xp-med{display:flex; flex-direction:column; align-items:flex-start; padding:10px 12px; border:1px solid var(--mt-line-strong); border-radius:8px}
.xp-med b{font-size:14.5px}
.xp-med small{font-size:12.5px; color:var(--mt-ink-500)}
.xp-aconteceu{width:100%; height:52px; margin-top:12px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--mt-warn-line); border-radius:8px; background:var(--mt-warn-tint); font-size:15px; font-weight:600; color:var(--xp-warn-ink)}
.xp-aconteceu svg{width:16px; height:16px}
.xp-hoje-lista{margin-top:14px; border-top:1px solid var(--mt-line)}
.xp-hoje-lista > small{display:block; margin:12px 0 4px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-hoje-lista div{display:flex; align-items:center; gap:10px; min-height:38px; font-size:14px}
.xp-hoje-lista div > .mono{width:40px; font-size:12.5px; color:var(--mt-ink-400)}
.xp-hoje-lista div > svg{width:15px; height:15px; color:var(--mt-ink-500)}
.xp-hoje-lista div > span:not(.mono){flex:1; min-width:0}
.xp-hoje-lista em{display:block; font-style:normal; font-size:12.5px; color:var(--mt-ink-500)}
.xp-hoje-lista div button{width:32px; height:32px; display:grid; place-items:center; color:var(--mt-ink-400)}
.xp-hoje-lista div button svg{width:16px; height:16px}

.xp-pessoas{display:flex; flex-direction:column; gap:8px; margin-bottom:14px}
.xp-pessoas button, .xp-pessoa-outra{display:flex; align-items:center; gap:12px; height:60px; padding:0 14px; border:1px solid var(--mt-line-strong); border-radius:10px; text-align:left}
.xp-pessoas button > span:nth-child(2){flex:1; min-width:0}
.xp-pessoas b{display:block; font-size:16px; font-weight:600}
.xp-pessoas small{font-size:12.5px; color:var(--mt-ink-500)}
.xp-pessoas button[aria-pressed="true"]{border:2px solid var(--mt-accent); background:var(--mt-accent-tint)}
.xp-pessoas button svg{width:18px; height:18px; color:var(--mt-accent)}
.xp-pessoa-outra{border-style:dashed}
.xp-pessoa-outra input{flex:1; min-width:0; border:0; outline:0; background:none; font-size:15px}
.xp-porta-linha{display:flex; align-items:center; gap:12px; height:76px; border-top:1px solid var(--mt-line)}
.xp-porta-linha > span{flex:1; min-width:0}
.xp-porta-linha b{display:block; font-size:17px; font-weight:600}
.xp-porta-linha small{display:block; font-size:13px; color:var(--mt-ink-500); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.xp-porta-novo{width:100%; margin-top:12px; font-size:15px}
.xp-envolvido{margin-top:14px; padding:12px 12px 14px; border:1px solid var(--mt-line); border-radius:6px; background:var(--mt-surface-2)}
.xp-envolvido p{display:flex; justify-content:space-between; margin:0; font-size:15px}
.xp-envolvido p button{font-size:13px; color:var(--mt-ink-400)}
.xp-envolvido .xp-chips button{background:var(--mt-surface)}

/* nova marcação e formulários */
.xp-rotulo{display:flex; justify-content:space-between; margin:16px 0 6px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-rotulo span{font-weight:400; letter-spacing:0; text-transform:none; font-size:12.5px; color:var(--mt-ink-500)}
.xp-rotulo--campo{justify-content:flex-start; gap:4px; text-transform:none; letter-spacing:0; font-size:13px; color:var(--mt-ink-900)}
.xp-escolha-lista{margin-top:6px; border:1px solid var(--mt-line); border-radius:8px; overflow:hidden}
.xp-escolha-lista:empty{display:none}
.xp-escolha-lista button{display:flex; justify-content:flex-start; width:100%; padding:11px 14px; border-bottom:1px solid var(--mt-line); font-size:13.5px; font-weight:600}
.xp-escolha-lista button:last-child{border-bottom:0}
.xp-escolha-lista .mono{font-weight:400; font-size:12.5px; color:var(--mt-ink-500)}
.xp-escolha-lista button small{margin-left:6px; font-weight:400; font-size:12.5px; color:var(--mt-ink-500)}
.xp-escolha-lista button > .mono{margin-left:auto}
.xp-fixo{margin-top:16px; padding:10px 12px; border:1px solid var(--mt-line); border-radius:8px; background:var(--mt-surface-2)}
.xp-fixo b{font-size:13px; color:var(--mt-ink-900)}
.xp-fixo span{margin-right:6px; font-size:10px; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-fixo .mono{margin:0; font-size:11px; letter-spacing:0; text-transform:none; color:var(--mt-ink-700)}
.xp-fixo p{margin:7px 0 0; font-size:11px; line-height:1.5; color:var(--mt-ink-500)}
.xp-escolhido{display:flex; align-items:center; gap:10px; padding:8px 12px; border:1px solid var(--mt-line); border-radius:8px; background:var(--mt-surface-2)}
.xp-escolhido b{font-size:15px}
.xp-escolhido .mono{font-size:13px; color:var(--mt-ink-500)}
.xp-escolhido button{margin-left:auto; font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.xp-caes{display:flex; flex-wrap:wrap; gap:8px}
.xp-caes button{flex:1 1 150px; display:flex; align-items:center; gap:10px; height:52px; padding:0 12px; border:1px solid var(--mt-line-strong); border-radius:6px; font-size:14px; font-weight:600}
.xp-caes button svg{width:18px; height:18px; margin-left:auto}
.xp-caes button[aria-pressed="true"]{border-color:var(--mt-accent); box-shadow:0 0 0 1px var(--mt-accent); background:var(--mt-accent-tint); color:var(--mt-accent)}
.xp-segmento{display:flex; padding:3px; border-radius:8px; background:var(--mt-surface-3)}
.xp-segmento button{flex:1; height:40px; border-radius:6px; text-align:center; font-size:15px; color:var(--mt-ink-500)}
.xp-segmento button[aria-pressed="true"]{background:var(--mt-surface); color:var(--mt-ink-900); font-weight:600; box-shadow:0 0 0 1px var(--mt-line)}
.xp-cal{border:1px solid var(--mt-line); border-radius:6px; padding:10px 12px 12px}
.xp-cal-topo{display:flex; align-items:center; justify-content:space-between; padding:0 0 6px; font-size:13.5px; font-weight:600}
.xp-cal-topo div{display:flex; gap:4px}
.xp-cal-topo button{width:32px; height:32px; display:grid; place-items:center; color:var(--mt-ink-500)}
.xp-cal-topo button:disabled{opacity:.3}
.xp-cal-topo button svg{width:14px; height:14px}
.xp-cal-grelha{display:grid; grid-template-columns:repeat(7,1fr); gap:3px; text-align:center}
.xp-cal-grelha > span{font-size:11px; font-weight:600; color:var(--mt-ink-400); padding:4px 0}
.xp-cal-grelha button{position:relative; height:44px; border-radius:6px; border:1px solid transparent; text-align:center; font-family:var(--mt-font-mono); font-size:14px; color:var(--mt-ink-700)}
.xp-cal-grelha button.ja{border-color:var(--mt-accent-line); font-weight:600}
.xp-cal-grelha button.ja::after{content:""; position:absolute; left:50%; bottom:5px; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:var(--mt-accent)}
.xp-cal-grelha button[aria-pressed="true"]{background:var(--mt-accent); border-color:var(--mt-accent); color:#fff; font-weight:600}
.xp-cal-grelha button[aria-pressed="true"]::after{background:#fff}
.xp-cal-grelha button:disabled{color:var(--mt-ink-300)}
.xp-legenda{display:flex; align-items:center; gap:6px; margin-top:8px; font-size:12px; color:var(--mt-ink-500)}
.xp-legenda::before{content:""; width:4px; height:4px; border-radius:50%; background:var(--mt-accent)}
.xp-atalhos{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.xp-atalhos button{height:30px; padding:0 10px; border:1px solid var(--mt-line-strong); border-radius:6px; font-size:12.5px; font-weight:500}
.xp-duas{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.xp-total{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:12px}
.xp-total > div:first-child{font-size:13.5px; color:var(--mt-ink-700)}
.xp-total small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-total .valor{text-align:right; font-size:21px; font-weight:600}
.xp-total .valor small{color:var(--mt-ok); font-family:var(--mt-font-sans); font-weight:500; white-space:nowrap; font-size:11.5px}
.xp-erro{margin:0 0 10px; font-size:13.5px; font-weight:500; color:var(--xp-warn-ink)}
.xp-campo{display:block; width:100%; height:48px; padding:0 12px; border:1px solid var(--mt-line-strong); border-radius:6px; font-family:var(--mt-font-mono); font-size:17px; background:var(--mt-surface)}
.xp-campo--texto{font-family:var(--mt-font-sans); font-size:16px}
textarea.xp-campo{height:auto; padding:10px 12px; resize:none; line-height:1.4}
.xp-campo:focus{outline:0; border-color:var(--mt-accent); box-shadow:0 0 0 3px var(--mt-accent-tint)}
.xp-campo.erro{border-color:var(--mt-warn-line); background:var(--mt-warn-tint)}
.xp-campo::placeholder{color:var(--mt-ink-300)}
.xp-campo--link{font-size:12.5px; height:40px}
.xp-form-campo{display:block}
.xp-chips{display:flex; flex-wrap:wrap; gap:8px}
.xp-chips button{min-height:44px; padding:0 14px; border:1px solid var(--mt-line-strong); border-radius:8px; font-size:14px; font-weight:500; color:var(--mt-ink-700)}
.xp-chips button[aria-pressed="true"]{border-color:var(--mt-accent-line); background:var(--mt-accent-tint); color:var(--mt-accent); font-weight:600}
.xp-chips button.tracejado{border-style:dashed; color:var(--mt-ink-400)}
.xp-linha-conta{padding:10px 14px; border-bottom:1px solid var(--mt-line)}
.xp-linha-conta:last-child{border-bottom:0}
.xp-linha-conta p{display:flex; justify-content:space-between; margin:0; font-size:13.5px}
.xp-linha-conta small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-linha-conta small.mono{color:var(--mt-ink-400)}
.xp-dica{margin-top:4px; padding:12px 14px; border-radius:8px; background:var(--mt-surface-3); font-size:13px; color:var(--mt-ink-700)}

/* gaveta do «Mais» */
.xp-gaveta{
  position:absolute; inset:0 auto 0 0; z-index:21; width:250px; display:flex; flex-direction:column; gap:2px;
  padding:16px 12px; border-right:1px solid var(--mt-line); background:var(--mt-surface-2); box-shadow:8px 0 30px -12px rgba(27,24,21,.4);
}
.xp-gaveta-topo{display:flex; align-items:center; gap:10px; padding:0 8px 20px}
.xp-gaveta-topo .logo{width:20px; color:var(--mt-accent)}
.xp-gaveta-topo b{display:block; font-size:14px; font-weight:600}
.xp-gaveta-topo small{display:block; font-size:11px; color:var(--mt-ink-400)}
.xp-gaveta > button{display:flex; align-items:center; gap:10px; height:44px; padding:0 10px; border-radius:6px; font-size:14px; font-weight:500; color:var(--mt-ink-700)}
.xp-gaveta > button svg{width:16px; height:16px}
.xp-gaveta > button[aria-current]{background:var(--mt-surface-3); font-weight:600; color:var(--mt-ink-900)}
.xp-gaveta > button[aria-expanded] > svg:last-child{margin-left:auto; width:14px; height:14px; color:var(--mt-ink-400); transition:transform .15s}
.xp-gaveta > button[aria-expanded="true"] > svg:last-child{transform:rotate(180deg)}
.xp-gaveta-sub{display:flex; flex-direction:column; gap:2px; margin:0 0 4px 18px; padding-left:8px; border-left:1px solid var(--mt-line)}
.xp-gaveta-sub > button{display:flex; align-items:center; height:40px; padding:0 10px; border-radius:6px; font-size:13.5px; font-weight:500; color:var(--mt-ink-700); text-align:left}
.xp-gaveta-sub > button[aria-current]{background:var(--mt-surface-3); font-weight:600; color:var(--mt-ink-900)}
.xp-gaveta > button .mono{margin-left:auto; font-size:12.5px; color:var(--mt-ink-400)}
.xp-gaveta-pe{display:flex; align-items:center; gap:10px; margin-top:auto; padding:12px 6px 0; border-top:1px solid var(--mt-line); font-size:12.5px; color:var(--mt-ink-700)}
.xp-gaveta-pe .xp-av{width:26px; height:26px; font-size:11px}
.xp-gaveta-pe b{flex:1; font-weight:500}
.xp-gaveta-pe svg{width:14px; height:14px; color:var(--mt-ink-400)}

/* pesquisa */
.xp-paleta-fundo{position:absolute; inset:0; z-index:40; background:rgba(27,24,21,.38)}
.xp-paleta{
  position:absolute; top:80px; left:16px; right:16px; z-index:41; max-height:560px; display:flex; flex-direction:column;
  border:1px solid var(--mt-line-strong); border-radius:10px; background:var(--mt-surface); box-shadow:var(--mt-shadow-pop); overflow:hidden;
}
.xp-paleta-campo{display:flex; align-items:center; gap:12px; height:54px; flex:none; padding:0 14px 0 16px; border-bottom:1px solid var(--mt-line); box-shadow:inset 0 -2px 0 var(--mt-accent)}
.xp-paleta-campo svg{width:18px; height:18px; color:var(--mt-ink-400)}
.xp-paleta-campo input{flex:1; min-width:0; border:0; outline:0; background:none; font-size:17px}
.xp-paleta-campo input::placeholder{color:var(--mt-ink-300)}
.xp kbd{padding:1px 5px; border:1px solid var(--mt-line-strong); border-radius:4px; background:var(--mt-surface-2); font-family:var(--mt-font-mono); font-size:11px; color:var(--mt-ink-400)}
.xp-paleta-lista{flex:1; overflow-y:auto; scrollbar-width:none}
.xp-paleta-lista > small{display:block; padding:12px 16px 6px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.xp-paleta-lista > button{display:flex; align-items:center; gap:11px; width:100%; padding:8px 16px; border-left:2px solid transparent}
.xp-paleta-lista > button:first-of-type{border-left-color:var(--mt-accent); background:var(--mt-accent-tint)}
.xp-paleta-lista > button > span:nth-child(2){flex:1; min-width:0}
.xp-paleta-lista b{display:block; font-size:14px; font-weight:600}
.xp-paleta-lista small{display:block; font-size:12.5px; color:var(--mt-ink-500)}
.xp-paleta-lista em{font-style:normal; font-size:12px; color:var(--mt-ink-500)}
.xp-paleta-lista strong{font-weight:inherit; background:var(--mt-accent-tint); color:var(--mt-accent)}
.xp-paleta-vazia{margin:0; padding:28px 30px; text-align:center; font-size:13.5px; color:var(--mt-ink-300)}
.xp-paleta-pe{display:flex; align-items:center; gap:16px; flex:none; padding:10px 16px; border-top:1px solid var(--mt-line); background:var(--mt-surface-2); font-size:11.5px; color:var(--mt-ink-500)}
.xp-paleta-pe span{display:flex; flex-direction:column; gap:4px; align-items:flex-start}
.xp-paleta-pe em{flex:1; font-style:normal; color:var(--mt-ink-400)}

/* aviso com desfazer */
.xp-aviso{
  position:absolute; left:16px; right:16px; bottom:136px; z-index:30;
  display:flex; align-items:center; gap:14px; min-height:52px; padding:10px 12px 10px 16px; border-radius:8px;
  background:var(--xp-toast); color:var(--mt-surface-2); font-size:14.5px; box-shadow:var(--mt-shadow-pop);
}
.xp-aviso.baixo{bottom:70px}
.xp-aviso.alto{bottom:226px}
.xp-aviso span:first-child{flex:1}
.xp-aviso button{font-weight:600; color:#9CC7D0}
.xp-aviso button.calado{font-weight:500; color:var(--mt-ink-300)}
.xp-aviso .mono{font-size:12px; color:var(--mt-ink-300)}

@media (prefers-reduced-motion:no-preference){
  .xp-folha.xp-entra{animation:xp-sobe .26s cubic-bezier(.2,.8,.3,1)}
  .xp-gaveta.xp-entra{animation:xp-desliza .24s cubic-bezier(.2,.8,.3,1)}
  .xp-fundo.xp-entra{animation:xp-aparece .2s ease}
  .xp-aviso.xp-entra{animation:xp-aparece .18s ease}
  @keyframes xp-sobe{from{transform:translateY(100%)}}
  @keyframes xp-desliza{from{transform:translateX(-100%)}}
  @keyframes xp-aparece{from{opacity:0}}
}

/* ------------------------------------------------------------ a página do dono
   A segunda réplica (`o-dono.js`), na secção dos clientes. Usa a moldura e o
   `.xp` da primeira; o resto copia `resources/views/dono/` a 390px, com os
   tamanhos do `.mt-touch`. */
.dono-grelha{margin-top:clamp(56px,8vw,88px)}
.dono-grelha .xp-ecra > img{display:block; width:100%; height:auto}
.dono-grelha .xp-guia > .morada{margin-top:16px; font-size:13.5px}
@media (max-width:760px){
  .dono-grelha .xp-guia > h3{order:-1; margin:0}
}
.od{background:var(--mt-surface); font-size:16px}
.od .od-mono{font-family:var(--mt-font-mono); font-variant-numeric:tabular-nums}
.od-pagina{flex:1; display:flex; flex-direction:column; overflow-y:auto; scrollbar-width:none}
.od-pagina::-webkit-scrollbar{display:none}
.od-pagina main{flex:1}

.od-topo{padding:14px 18px 0; border-bottom:1px solid var(--mt-line)}
.od-micro-creche{margin:0; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.od-topo nav{display:flex; justify-content:space-between; gap:8px; margin-bottom:-1px}
.od-topo nav button{min-height:44px; border-bottom:2px solid transparent; font-size:17px; font-weight:600; letter-spacing:-.012em; color:var(--mt-ink-500)}
.od-topo nav button[aria-current]{border-color:var(--mt-accent); color:var(--mt-ink-900)}

.od-pedido{margin:16px 18px 0; padding:14px; border:1px solid var(--mt-accent-line); border-radius:10px; background:var(--mt-accent-tint)}
.od-pedido + .od-pedido{margin-top:10px}
.od-pedido p{margin:0; font-size:13.5px; line-height:1.5}
.od-pedido button{min-height:44px; margin-top:4px; font-size:17px; font-weight:600; color:var(--mt-accent)}

.od-h-xl{margin:0; font-size:27px; font-weight:600; line-height:1.15; letter-spacing:-.025em}
.od-h-lg{margin:0; font-size:21px; font-weight:600; line-height:1.25; letter-spacing:-.018em}
.od-av{flex:none; border-radius:50%; display:grid; place-items:center; font-weight:600}
.od-av--g{width:44px; height:44px; font-size:17px}
.od-av--p{width:24px; height:24px; font-size:11.5px}

/* o dia */
.od-cao + .od-cao{border-top:1px solid var(--mt-line)}
.od-quem{display:flex; align-items:center; gap:12px; padding:16px 18px}
.od-data{margin:2px 0 0; font-size:12.5px; color:var(--mt-ink-500)}
.od-vazio{padding:40px 18px}
.od-vazio p{margin:8px 0 0; font-size:15px; line-height:1.5; color:var(--mt-ink-500)}
.od-mini{display:block; width:100%; height:88px; overflow:hidden; background:var(--mt-surface-3)}
.od-mini--g{height:208px}
.od-mini img{display:block; width:100%; height:100%; object-fit:cover}
.od-grelha{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; padding-top:2px}
.od-momentos{list-style:none; margin:0; padding:8px 18px 0}
.od-momentos li{display:flex; gap:10px; padding:12px 0}
.od-momentos li + li{border-top:1px solid var(--mt-line)}
.od-hora{width:52px; flex:none; padding-top:2px; font-family:var(--mt-font-mono); font-size:13.5px; color:var(--mt-ink-500)}
.od-icone{width:30px; flex:none; padding-top:2px; color:var(--mt-accent)}
.od-icone svg{width:20px; height:20px}
.od-momento{flex:1; min-width:0}
.od-momento b{display:block; font-size:17px; font-weight:600; letter-spacing:-.012em}
.od-momento span{display:block; margin-top:2px; font-size:13.5px; line-height:1.5; color:var(--mt-ink-500)}
.od-recado-fora{padding:4px 18px 14px}
.od-recado{display:flex; gap:12px; padding:12px 14px; border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface-2)}
.od-iniciais{flex:none; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--mt-surface-3); font-size:11.5px; font-weight:600; color:var(--mt-ink-700)}
.od-recado p{margin:0; font-size:13.5px; line-height:1.5}
.od-recado small{display:block; margin-top:4px; font-size:11.5px; color:var(--mt-ink-400)}

/* a galeria em ecrã inteiro */
.od-galeria{position:absolute; inset:0; z-index:20; display:flex; flex-direction:column; background:#0B0A09; color:#fff}
.od-fila{flex:1; min-height:0; display:flex; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior:contain; scrollbar-width:none}
.od-fila::-webkit-scrollbar{display:none}
.od-fila figure{margin:0; width:100%; flex:none; display:flex; flex-direction:column; scroll-snap-align:center; scroll-snap-stop:always}
.od-galeria-topo{display:flex; align-items:center; justify-content:space-between; padding:8px 18px}
.od-galeria-topo span{font-size:13.5px; color:#D8D2CA}
.od-galeria-topo button, .od-galeria figcaption a, .od-galeria figcaption button{min-height:44px; min-width:44px; display:inline-flex; align-items:center; color:#fff; font-weight:600; text-decoration:none}
.od-galeria-topo button{justify-content:flex-end; font-size:17px}
.od-galeria-foto{flex:1; min-height:0}
.od-galeria-foto img{display:block; width:100%; height:100%; object-fit:contain}
.od-galeria figcaption{display:grid; grid-template-columns:repeat(3,1fr); align-items:center; padding:8px 18px}
.od-galeria figcaption a{justify-content:center; font-size:13.5px; text-decoration:underline; text-underline-offset:3px}
.od-galeria figcaption button{font-size:21px; font-weight:400}
.od-galeria figcaption span:last-child{text-align:right}
.od-galeria figcaption span:last-child button{justify-content:flex-end}

/* as marcações */
.od-cabeca{padding:16px 18px}
.od-caes{list-style:none; display:flex; flex-wrap:wrap; gap:8px 14px; margin:12px 0 0; padding:0}
.od-caes li{display:inline-flex; align-items:center; gap:8px; font-size:17px; font-weight:500; color:var(--mt-ink-700)}
.od-faixa{margin:0; padding:8px 18px; border-block:1px solid var(--mt-line); background:var(--mt-surface-2); font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.od-micro{margin:0; padding:20px 18px 8px; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.od-proximo, .od-passado{display:flex; align-items:center; gap:14px; padding:14px 18px}
.od-proximo + .od-proximo{border-top:1px solid var(--mt-line)}
.od-passado{padding-block:12px; border-top:1px solid var(--mt-line)}
.od-num{width:44px; flex:none; text-align:center}
.od-num b{display:block; font-size:19px; font-weight:600}
.od-num small{display:block; font-size:11.5px; color:var(--mt-ink-500)}
.od-passado .od-num b{font-size:16.5px; font-weight:400; color:var(--mt-ink-500)}
.od-passado .od-num small{font-size:10.5px; color:var(--mt-ink-400)}
.od-linha{flex:1; min-width:0}
.od-mes{margin:0; padding:14px 18px 4px; font-size:13.5px; font-weight:600; color:var(--mt-ink-500)}
.od-mes::first-letter{text-transform:uppercase}
.od-proximo .od-l1{display:block; font-size:17px}
.od-proximo .od-l1 b{font-weight:600}
.od-proximo .od-l1 span{color:var(--mt-ink-500)}
.od-proximo .od-l2{display:block; font-size:13.5px; color:var(--mt-ink-500)}
.od-mais{border-top:1px solid var(--mt-line)}
.od-mais summary{display:flex; align-items:center; justify-content:space-between; min-height:44px; padding:0 18px; list-style:none; cursor:pointer; font-size:17px; font-weight:600; color:var(--mt-accent)}
.od-mais summary::-webkit-details-marker{display:none}
.od-mais summary svg{width:20px; height:20px; flex:none; stroke:currentColor; transition:transform .15s}
.od-mais[open] summary svg{transform:rotate(180deg)}
.od-mais .od-fechar, .od-mais[open] .od-abrir{display:none}
.od-mais[open] .od-fechar{display:inline}
.od-mais-corpo{border-top:1px solid var(--mt-line)}
.od-passados{margin-top:16px}
.od-passados summary .od-micro{padding:0}
.od-passado .od-linha{font-size:14px; color:var(--mt-ink-700)}
.od-estado{flex:none; padding:2px 8px; border-radius:4px; background:var(--mt-surface-3); font-size:11.5px; font-weight:600; letter-spacing:.01em; color:var(--mt-ink-700)}
.od-estado--ok{background:var(--mt-ok-tint); color:var(--mt-ok)}
.od-media{flex:none; font-size:13.5px; font-weight:600; color:var(--mt-accent)}
.od-saldo-fora{padding:16px 18px 0}
.od-saldo{padding:14px 16px; border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface-2)}
.od-saldo p{margin:0; font-size:17px; font-weight:600}
.od-saldo p + p, .od-saldo .od-sub{margin-top:4px; font-size:13.5px; font-weight:400; line-height:1.5; color:var(--mt-ink-700)}
.od-saldo .od-total{margin-top:8px; font-weight:600; color:var(--mt-ink-900)}
.od-mensal-topo{display:flex; flex-direction:column-reverse; align-items:flex-start; gap:6px}
.od-saldo-fora .od-mensal-topo p{font-size:15px; font-weight:600; line-height:1.35}

/* os formulários */
.od-corpo{padding:16px 18px}
.od-intro{margin:8px 0 0; font-size:13.5px; line-height:1.5; color:var(--mt-ink-500)}
.od-erros{margin-top:16px; padding:14px; border:1px solid var(--mt-warn-line); border-radius:10px; background:var(--mt-warn-tint)}
.od-erros ul{margin:0; padding:0; list-style:none; font-size:13.5px; line-height:1.5; color:#8A5314}
.od-form{margin-top:24px; display:flex; flex-direction:column; gap:16px}
.od-rotulo{display:block; font-size:13.5px; font-weight:600; color:var(--mt-ink-700)}
.od-rotulo span{font-weight:400; color:var(--mt-ink-400)}
.od .od-campo{display:block; width:100%; height:56px; margin-top:6px; padding:0 14px; border:1px solid var(--mt-line-strong); border-radius:8px; background:var(--mt-surface); font-size:17px; color:var(--mt-ink-900)}
.od select.od-campo{appearance:auto}
.od .od-area{height:auto; padding:12px 14px; line-height:1.5; resize:none}
.od .od-ficheiro{display:block; width:100%; margin-top:6px; padding:12px; border:1px solid var(--mt-line-strong); border-radius:8px; background:var(--mt-surface); font:inherit; font-size:13.5px; color:var(--mt-ink-700)}
.od-nota{margin:6px 0 0; font-size:11.5px; line-height:1.5; color:var(--mt-ink-400)}
.od-botao{display:flex; align-items:center; justify-content:center; width:100%; height:56px; margin-top:8px; border-radius:8px; background:var(--mt-accent); color:#fff; font-size:17px; font-weight:600; text-align:center}
.od-caixa{padding:16px; border:1px solid var(--mt-accent-line); border-radius:10px; background:var(--mt-accent-tint)}
.od-caixa--termo{margin-top:16px}
.od-caixa p{margin:8px 0 0; font-size:13.5px; line-height:1.5; color:var(--mt-ink-700)}
.od-caixa p.od-forte{margin:0; font-size:17px; font-weight:600; color:var(--mt-ink-900)}
.od-caixa--termo p + p{margin-top:6px}
.od-botao-linha{display:inline-flex; align-items:center; min-height:44px; margin-top:8px; padding:0 18px; border:1px solid var(--mt-line-strong); border-radius:8px; background:var(--mt-surface); font-size:17px; font-weight:600}
.od-lista-titulo{margin:32px 0 0; font-size:13.5px; font-weight:600; text-transform:uppercase; color:var(--mt-ink-400)}
.od-reportes{list-style:none; margin:8px 0 0; padding:0}
.od-reportes li{padding:12px 0}
.od-reportes li + li{border-top:1px solid var(--mt-line)}
.od-reportes div{display:flex; align-items:baseline; justify-content:space-between; gap:12px}
.od-reportes div p{margin:0; min-width:0; font-size:13.5px}
.od-reportes div p span{color:var(--mt-ink-500)}
.od-reportes small{flex:none; font-size:11.5px; color:var(--mt-ink-400)}
.od-reportes li > p{margin:2px 0 0; font-size:12.5px; color:var(--mt-ink-500)}
.od-termo{margin-top:20px; padding:16px; border:1px solid var(--mt-line); border-radius:10px; background:var(--mt-surface-2); font-size:13.5px; line-height:1.625}
.od-termo p{margin:0}
.od-termo p + p{margin-top:12px}
.od-aceito{display:flex; align-items:flex-start; gap:12px; min-height:44px; font-size:13.5px; line-height:1.5}
.od-aceito input{width:20px; height:20px; margin:2px 0 0; flex:none; accent-color:var(--mt-accent)}

.od-rodape{padding:16px 18px; border-top:1px solid var(--mt-line)}
.od-marcar{display:flex; align-items:center; justify-content:center; height:56px; margin-bottom:10px; border-radius:8px; background:var(--mt-accent); color:#fff; font-size:17px; font-weight:600; text-decoration:none}
.od-rodape p{margin:0; text-align:center; font-size:12.5px; line-height:1.5; color:var(--mt-ink-400)}
.od-rodape button{min-height:44px; text-align:center; font-size:12.5px; color:var(--mt-accent); text-decoration:underline; text-underline-offset:3px}

/* Mensalidade: os dias da semana e o serviço de cada dia são botões de escolha, não listas */
.xp-pilulas{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px}
.xp-pilulas button{min-height:40px; min-width:44px; padding:0 12px; border-radius:6px; border:1px solid var(--mt-line-strong); background:var(--mt-surface); font-size:12.5px; font-weight:600; color:var(--mt-ink-500)}
.xp-pilulas button[aria-pressed="true"]{background:var(--mt-accent-tint); border-color:var(--mt-accent); color:var(--mt-accent)}
.xp-mensal-servico{margin-top:8px}
.xp-mensal-servico > span{font-size:12.5px; font-weight:600; color:var(--mt-ink-500); text-transform:capitalize}
.xp-opcional{font-weight:400; color:var(--mt-ink-400)}
.xp-lembrete{margin-top:10px}
.od-quem--ficha{padding-inline:0}
.od-cao-lista{list-style:none; margin:16px 0 0; padding:0}
.od-cao-lista li + li{border-top:1px solid var(--mt-line)}
.od-cao-lista button{display:flex; align-items:center; gap:12px; width:100%; min-height:64px; text-align:left}
.od-cao-lista .od-nome{flex:1; font-size:17px; font-weight:600}
.od-faltam{flex:none; padding:2px 8px; border-radius:4px; background:var(--mt-surface-3); font-size:11.5px; font-weight:600; color:var(--mt-ink-700)}
.od-seta{color:var(--mt-ink-400)}
.od-guardar{position:sticky; bottom:0; margin:16px -18px -16px; padding:12px 18px; border-top:1px solid var(--mt-line); background:var(--mt-surface)}
.od-guardar .od-botao{margin-top:0}
.od-nota--topo{margin-top:16px}
.od-botao-texto{min-height:44px; font-size:inherit; color:var(--mt-accent); text-decoration:underline; text-underline-offset:3px}
.od-rotulo-micro{margin:24px 0 0; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--mt-ink-400)}
.od-endereco{display:block; width:100%; margin-top:6px; padding:12px 14px; border:1px solid var(--mt-line-strong); border-radius:8px; background:var(--mt-surface-2); font-size:13.5px; text-align:left; word-break:break-all; color:var(--mt-ink-900)}
.od-creche-t{margin:0; min-height:44px; display:flex; align-items:center; font-size:17px; font-weight:600; letter-spacing:-.012em}

/* ------------------------------------------------------------ o seletor de negócio
   A barra no topo (`negocio.js`). Quem escolhe um negócio vê o título, o ecrã de
   exemplo, a demo, os cartões e a pergunta própria dele; o resto não muda. Os
   cartões e as perguntas do negócio sobem com `order` e ganham um selo, e nenhum
   se esconde. Tudo o que tem `hidden` leva a regra própria porque o `display`
   de cada bloco a anula. */
.seletor{background:var(--mt-surface-2); border-bottom:1px solid var(--mt-line); padding-block:22px 18px}
.seletor[hidden]{display:none}
.seletor-rotulo{
  margin:0 0 10px; font-family:var(--mt-font-mono); font-size:11.5px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--mt-accent);
}
.seletor-chips, .seletor-modos{display:flex; flex-wrap:wrap; gap:10px}
.seletor button{
  all:unset; box-sizing:border-box; cursor:pointer; display:inline-flex; align-items:center;
  min-height:var(--mt-tap); padding:0 20px; border-radius:999px; border:1px solid var(--mt-line-strong);
  background:var(--mt-surface); color:var(--mt-ink-900); font-size:16px; font-weight:500; white-space:nowrap;
  transition:background .14s ease, border-color .14s ease;
}
.seletor button:hover{border-color:var(--mt-accent)}
.seletor button:focus-visible{outline:2px solid var(--mt-accent); outline-offset:3px}
.seletor button[aria-pressed="true"]{background:var(--mt-accent); border-color:var(--mt-accent); color:#fff; font-weight:600}
.seletor-modo{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-top:16px}
.seletor-modo .seletor-rotulo{margin:0}
.seletor-modos button{border-radius:var(--mt-radius); font-size:15px; padding:0 16px}
.seletor-nota{margin:12px 0 0; font-size:14.5px; color:var(--mt-ink-500)}
/* Nos telemóveis os negócios correm na horizontal em vez de ocuparem três linhas. */
@media (max-width:560px){
  .seletor{padding-block:16px 14px}
  .seletor-chips{flex-wrap:nowrap; overflow-x:auto; margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter); scrollbar-width:none}
  .seletor-chips::-webkit-scrollbar{display:none}
  .seletor-modo{margin-top:12px}
}

/* O topo com negócio escolhido: o texto à esquerda, o ecrã de exemplo à direita. */
.heroi.tem-negocio{
  display:grid; gap:clamp(28px,5vw,64px); align-items:center;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
}
@media (max-width:860px){ .heroi.tem-negocio{grid-template-columns:minmax(0,1fr)} }
.proprio{margin-top:28px}
.proprio[hidden], .amostra[hidden]{display:none}
.proprio-rotulo{
  margin:0 0 8px; font-family:var(--mt-font-mono); font-size:11px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--mt-ink-400);
}
.proprio ul{list-style:none; margin:0; padding:0}
.proprio li{display:flex; gap:10px; padding:5px 0; font-size:16.5px; line-height:1.4; color:var(--mt-ink-900)}
.proprio li::before{content:"+"; flex:none; font-weight:700; color:var(--mt-accent)}
.proprio ~ .accoes{margin-top:30px}

.amostra{
  background:var(--mt-surface); border:1px solid var(--mt-line); border-radius:var(--mt-radius-lg);
  padding:22px 22px 16px; box-shadow:var(--mt-shadow-pop);
}
.amostra-cabeca{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding-bottom:12px}
.amostra-cabeca strong{font-size:18px; font-weight:600; letter-spacing:-.01em}
.amostra-cabeca span{font-family:var(--mt-font-mono); font-size:13px; color:var(--mt-ink-500); white-space:nowrap}
.amostra-linha{display:flex; justify-content:space-between; gap:12px; padding:12px 0; border-top:1px solid var(--mt-line); font-size:16px}
.amostra-linha span:first-child{font-weight:600}
.amostra-linha span:last-child{color:var(--mt-ink-500); text-align:right}
.amostra-legenda{margin:6px 0 0; font-size:13px; color:var(--mt-ink-400); text-align:center}

/* Cartões e perguntas do negócio escolhido: sobem e levam um selo. */
.grelha .cartao.do-negocio{order:-1; background:var(--mt-accent-tint); position:relative}
.grelha .cartao.do-negocio h3::before{
  content:"O teu negócio"; display:block; margin-bottom:6px; font-family:var(--mt-font-mono);
  font-size:10.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--mt-accent);
}
#dentro .cartao.do-negocio h3::before{content:"Para o teu negócio"}
.perguntas{display:flex; flex-direction:column}
.perguntas details.do-negocio{order:-1}

/* A demo em vídeo, no lugar da réplica. */
.xp-grelha[hidden], .xp-video[hidden], .xp-cenas[hidden]{display:none}
.xp-video{
  display:grid; gap:clamp(28px,5vw,64px); align-items:start; margin-top:22px;
  grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
}
@media (max-width:760px){ .xp-video{grid-template-columns:minmax(0,1fr); gap:20px} .xp-video .xp-guia{display:block; max-width:none} .xp-video .xp-guia > p{order:0} }
.xp-video-ecra{
  aspect-ratio:16/9; border-radius:var(--mt-radius-lg); overflow:hidden; background:var(--mt-ink-900);
  border:1px solid var(--mt-line-strong); box-shadow:var(--mt-shadow-pop);
}
.xp-video-ecra video{display:block; width:100%; height:100%; object-fit:contain; background:var(--mt-ink-900)}
.xp-cenas{list-style:none; margin:24px 0 0; padding:0; border-top:1px solid var(--mt-line)}
.xp-cenas li{border-bottom:1px solid var(--mt-line)}
.xp-cena{
  all:unset; box-sizing:border-box; cursor:pointer; width:100%; display:flex; gap:14px; align-items:flex-start;
  min-height:var(--mt-tap); padding:12px 2px;
}
.xp-cena:hover .xp-cena-titulo{color:var(--mt-accent)}
.xp-cena:focus-visible{outline:2px solid var(--mt-accent); outline-offset:2px; border-radius:var(--mt-radius-sm)}
.xp-cena-tempo{flex:none; min-width:40px; font-family:var(--mt-font-mono); font-size:13px; color:var(--mt-ink-500); padding-top:2px}
.xp-cena-corpo{display:block}
.xp-cena-titulo{display:block; font-size:16px; font-weight:600}
.xp-cena-tipo{display:block; margin-top:2px; font-size:13.5px; color:var(--mt-ink-500)}
.xp-video-nota{margin:16px 0 0; font-size:14px; color:var(--mt-ink-500)}