/* Página de enviar recado (recado.html), feita pro celular: cartão único, botões grandes. O resto (campos, botões) é do styles.css (.mod, .chip-btn, .feedback-input). */
.wall{max-width:560px}
.wall-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.wall-head-mascot{width:64px;height:auto;flex:none}
.wall-logo{height:30px;width:auto;margin-bottom:6px}
.wall-mascot{display:block;width:96px;height:auto;margin:8px auto 0}
.wall-head .mod-title{margin:0}
.wall-head .mod-hint{margin:4px 0 0}
.wall-form{display:flex;flex-direction:column;gap:16px}
.wall-prompts{margin:0;padding:0;border:0;display:flex;flex-direction:column;gap:8px}
.wall-legend{padding:0;margin-bottom:8px;font:700 14px var(--font-body);color:var(--muted)}
.wall-prompt{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--card-border);border-radius:14px;background:var(--card-a);font:600 16px/1.3 var(--font-body);cursor:pointer}
.wall-prompt:has(input:checked){border-color:var(--accent);background:color-mix(in oklch,var(--accent) 12%,var(--card-a))}
.wall-prompt input{accent-color:var(--accent);width:20px;height:20px;flex:none}
.wall-field{display:flex;flex-direction:column;gap:6px;font:700 14px var(--font-body);color:var(--muted)}
.wall-count{align-self:flex-end;font:600 12px var(--font-body);color:var(--muted-dim)}
.wall-send{min-height:52px;justify-content:center;font-size:17px}
.wall-state{margin:20px 0;padding:18px;border:1px solid var(--card-border);border-radius:14px;background:var(--card-a);font:700 18px/1.4 var(--font-body)}
.wall-state.is-ok{border-color:var(--accent)}

/* a página dentro da casca do site (menu e rodapé do site): coluna única centralizada */
.wall{max-width:560px;margin:0 auto;padding:24px}
.wall-intro{margin:6px 0 0;font:500 16px/1.5 var(--font-body);color:var(--muted)}
.wall-head-mascot{display:block}

/* convites pro mural de recados: o cartão da home (some fora da janela de envio) e o link depois da avaliação */
.wall-invite{max-width:1180px;margin:0 auto;padding:0 24px}
.wall-invite-card{display:flex;align-items:center;gap:16px;padding:16px 20px;border:1px solid var(--accent);border-radius:18px;background:color-mix(in oklch,var(--accent) 10%,var(--card-a));color:var(--text);text-decoration:none}
.wall-invite-mascot{flex:none;width:64px;height:auto}
.wall-invite-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.wall-invite-body b{font:800 18px var(--font-display)}
.wall-invite-body span{font:500 15px/1.4 var(--font-body);color:var(--muted)}
.wall-invite-card .chip-btn{flex:none;min-height:44px;display:inline-flex;align-items:center}
.wall-invite-link{margin:8px 0 0;font:600 14px var(--font-body);color:var(--muted)}
.wall-invite-link a{color:var(--accent);font-weight:800}
@media(max-width:560px){.wall-invite-card{flex-wrap:wrap}.wall-invite-card .chip-btn{width:100%;justify-content:center}}