/* Identidad propia y maqueta de la comunidad. */
:root { --teal-dark: #114d46; --teal: #217366; }
.auth-view { background: #e9efec; }
.auth-layout { width: min(1180px, 100%); grid-template-columns: 1.15fr 1fr; align-items: start; }
.brand-panel { min-height: 0; padding: 26px; background: #f5f3ed; color: #163e39; border-radius: 18px; box-shadow: 0 12px 40px #183b3410; justify-content: flex-start; }
.brand-panel .eyebrow { color: #497169; margin: 0; text-align: center; }
.brand-panel .brand-copy { color: #497169; text-align: center; margin: 8px 0 14px; font-size: 1rem; }
.community-logo { display: block; width: 158px; height: auto; margin: 0 auto 8px; }
.community-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.community-logo-small { width: 66px; height: 66px; object-fit: contain; flex-shrink: 0; }
.auth-panel { border-radius: 18px; padding: 32px; }
.button-primary, .btn.primary, .auth-tab.is-active { background: #166251; box-shadow: 0 6px 18px #1662511a; }
.button-primary:hover, .button-primary:focus-visible, .btn.primary:hover { background: #114d46; }
.community-map { margin: 0; overflow: hidden; border-radius: 12px; background: #f5f3ed; color: #163e39; }
.community-map-art { position: relative; isolation: isolate; }
.community-map-art > img { width: 100%; height: auto; display: block; }
.map-pin { position: absolute; display: grid; place-items: center; width: 32px; height: 32px; transform: translate(-50%, -50%); border: 2px solid white; border-radius: 50%; background: #114d46; color: white; font-size: 14px; font-weight: 800; box-shadow: 0 3px 10px #123a3940; }
.patio-a { left: 52%; top: 30%; }
.patio-b { left: 35%; top: 54%; }
.patio-c { left: 64%; top: 74%; }
.patio-d { left: 77%; top: 47%; }
.community-map figcaption { display: grid; gap: 6px; padding: 14px 18px 18px; border-top: 1px solid #194c3917; }
.community-map figcaption strong { font-size: 1rem; }
.community-map figcaption span { font-size: 14px; line-height: 1.65; }
.community-map figcaption small { font-size: 12px; color: #52675e; }
.padel-community-brand { display: flex; align-items: center; gap: 12px; }
@media (max-width: 850px) {
  .auth-layout { grid-template-columns: 1fr; max-width: 560px; }
  .auth-panel { grid-row: 1; padding: 24px; }
  .brand-panel { grid-row: 2; padding: 20px; }
  .auth-view { padding: 16px; }
}