:root { font-family: "Segoe UI", Inter, Arial, sans-serif; color: #26332f; background: #f8f3ec; color-scheme: light; --brand: #496858; --brand-dark: #263f36; --accent: #c48a4a; --accent-soft: #f3e4d0; --soft: #edf4ef; --surface: #fffdf9; --surface-2: #fbf6ef; --line: #eadfce; --muted: #756f66; --shadow: 0 18px 55px #4d372414; --radius: 20px; }
:root[data-theme="dark"] { color: #e8f1ef; background: #0f1719; color-scheme: dark; }
* { box-sizing: border-box; }
body { margin: 0; background:
  radial-gradient(circle at top left, #fff8ee 0, transparent 34%),
  linear-gradient(180deg, #f5eadb 0, #fbf7f1 310px, #f8f3ec 100%); color: #26332f; }
:root:not([data-theme="dark"]) body { background:
  radial-gradient(circle at 10% 0%, #fff7e8 0, transparent 36%),
  radial-gradient(circle at 92% 6%, #eaf4ec 0, transparent 30%),
  linear-gradient(180deg, #fff3df 0, #fffdf8 320px, #f7efe5 100%); color: #26332f; }
:root:not([data-theme="dark"]) .app-header,
:root:not([data-theme="dark"]) .tabbar { background: #fffdf2f2; border-color: #ead8bd; }
:root:not([data-theme="dark"]) .item,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea { color: #26332f; background-color: #fffefb; border-color: #d9c8ae; }
:root:not([data-theme="dark"]) .calendar-day,
:root:not([data-theme="dark"]) .property-selector-card,
:root:not([data-theme="dark"]) .property-tile { background-color: #fffaf1; border-color: #e5d6bd; }
main { max-width: 1120px; margin: auto; padding: 22px; }
.app-shell, .tenant-shell { max-width: 1240px; }
header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.app-header { position: sticky; top: 0; z-index: 5; margin: 0 0 14px; padding: 16px 18px; border: 1px solid #ffffffd8; border-radius: 22px; background: #fffdf2dc; box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.brand-lockup { display: flex; align-items: center; gap: 12px; }
.brand-mark { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 16px; color: white; background: linear-gradient(135deg, var(--brand), var(--brand-dark)); font-size: .9rem; font-weight: 900; letter-spacing: .04em; box-shadow: 0 12px 26px #263f362b; }
.app-kicker { display: block; margin-bottom: 3px; color: #7c6a52; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
h1, h2, h3, p { margin-top: 0; }
h1 { color: var(--brand-dark); margin-bottom: 3px; }
h2 { font-size: 1.22rem; }
small { color: var(--muted); }
.hidden { display: none !important; }
.login-screen { min-height: 100vh; display: grid; place-items: center; padding: 24px; background:
  radial-gradient(circle at 15% 15%, #fff7ed 0 18%, transparent 34%),
  radial-gradient(circle at 82% 12%, #edf4ef 0 16%, transparent 33%),
  linear-gradient(135deg, #f4e4d2 0%, #fffaf3 50%, #e7f0e8 100%); overflow: hidden; }
.login-screen::before,
.login-screen::after { content: ""; position: fixed; width: 260px; height: 260px; border-radius: 999px; background: #c48a4a1f; filter: blur(3px); animation: floaty 8s ease-in-out infinite; pointer-events: none; }
.login-screen::before { left: -80px; bottom: 8%; }
.login-screen::after { right: -70px; top: 10%; animation-delay: -3s; background: #49685822; }
.login-shell { position: relative; z-index: 1; width: min(100%, 980px); display: grid; grid-template-columns: minmax(280px, .95fr) minmax(310px, .75fr); gap: 22px; align-items: center; }
.login-hero { padding: 32px; animation: rise-in .65s ease both; }
.login-hero h1 { font-size: clamp(2.15rem, 5.4vw, 4.1rem); line-height: 1; margin: 10px 0 16px; letter-spacing: -0.045em; }
.login-hero p { max-width: 560px; color: #5a5f55; font-size: 1.06rem; line-height: 1.6; }
.login-kicker { display: inline-flex; width: fit-content; border-radius: 999px; padding: 6px 10px; color: var(--brand-dark); background: var(--soft); font-size: .76rem; font-weight: bold; text-transform: uppercase; letter-spacing: .04em; }
.login-highlights { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.login-highlights span { border-radius: 999px; padding: 8px 11px; color: var(--brand-dark); background: #fffdf9c9; border: 1px solid var(--line); font-size: .86rem; font-weight: bold; box-shadow: 0 8px 24px #4d372412; }
.install-pill { margin-top: 18px; color: var(--brand-dark); background: #fffdf9d9; border: 1px solid #ead8bd; box-shadow: 0 12px 30px #4d372418; }
.login-panel { display: grid; gap: 12px; animation: rise-in .7s ease .08s both; }
.login-card { width: min(100%, 390px); }
.login-panel .login-card { width: 100%; }
.install-card { border-style: dashed; background: #fffaf1d6; }
.install-card h2 { margin: 8px 0 6px; }
.primary-login { border: 1px solid #ffffffd8; padding: 22px; box-shadow: 0 22px 70px #174f4824; backdrop-filter: blur(12px); }
.primary-login h2 { font-size: 1.55rem; margin: 10px 0 5px; }
.landlord-login { border: 1px solid var(--line); border-radius: 16px; padding: 0; background: #fffdf990; box-shadow: 0 12px 38px #4d372414; overflow: hidden; }
.landlord-login summary { padding: 13px 15px; color: var(--brand-dark); list-style: none; }
.landlord-login summary::-webkit-details-marker { display: none; }
.landlord-login summary::after { content: "Mostrar acceso privado"; float: right; color: #60706e; font-size: .76rem; font-weight: normal; }
.landlord-login[open] summary::after { content: "Ocultar"; }
.admin-login-card { border-radius: 0; box-shadow: none; border-top: 1px solid #e0e8e6; }
.tenant-shell { max-width: 1120px; }
.card { background: var(--surface); padding: 20px; border: 1px solid #f0e6d7; border-radius: var(--radius); box-shadow: 0 10px 30px #4d37240f; animation: fade-up .34s ease both; }
nav { display: flex; gap: 8px; margin: 18px 0; overflow-x: auto; padding-bottom: 4px; }
.tabbar { position: sticky; top: 88px; z-index: 4; margin: 0 0 20px; padding: 8px; border: 1px solid #eadfce; border-radius: 20px; background: #fffaf1d8; box-shadow: 0 12px 32px #4d37240d; backdrop-filter: blur(14px); }
button { border: 0; border-radius: 12px; padding: 11px 15px; color: white; background: var(--brand); cursor: pointer; font-weight: bold; }
button.secondary, nav button { color: var(--brand-dark); background: #efe5d6; }
nav button { white-space: nowrap; }
nav button.active { color: white; background: var(--brand); box-shadow: 0 10px 22px #4968582b; }
button.danger { background: #ad5a4e; }
button.ghost { color: var(--brand-dark); background: transparent; border: 1px solid #d9c8ae; }
.compact { padding: 8px 12px; }
.install-action { border: 1px solid #d9c8ae; }
.grid { display: grid; gap: 16px; }
.stats { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin-bottom: 20px; }
.stat strong { display: block; color: var(--brand-dark); font-size: 1.7rem; }
.dashboard-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .45fr); gap: 18px; align-items: stretch; margin-bottom: 12px; padding: 22px; background:
  linear-gradient(135deg, #fffdf9 0%, #faf0e2 52%, #edf4ef 100%); }
.dashboard-hero h2 { margin: 6px 0 10px; color: var(--brand-dark); font-size: clamp(1.75rem, 3.5vw, 2.55rem); line-height: 1.08; letter-spacing: -0.025em; }
.dashboard-hero p { max-width: 660px; color: #5f635a; line-height: 1.55; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.next-action { display: grid; align-content: center; gap: 8px; padding: 18px; border: 1px solid #e2d1b7; border-radius: 18px; background: #fffaf1c7; }
.next-action strong { color: var(--brand-dark); font-size: 1.08rem; }
.next-action p { margin: 0; color: var(--muted); font-size: .94rem; }
.signal-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); margin-bottom: 14px; }
.signal-card { display: grid; align-content: start; gap: 10px; min-height: 138px; }
.signal-card.attention { border-color: #e9c6bf; background: linear-gradient(180deg, #fffdf9, #fff4ef); }
.signal-card .item-row strong { font-size: 1.25rem; }
.progress-line { height: 10px; overflow: hidden; border-radius: 999px; background: #efe4d4; }
.progress-line span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--brand), #9fbd8f); }
.property-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); gap: 12px; margin-top: 14px; }
.property-board-wide { grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)); }
.property-tile { display: grid; gap: 11px; padding: 15px; border: 1px solid #eadfce; border-radius: 16px; background: var(--surface-2); }
.property-tile.active { border-color: #9bb58d; box-shadow: inset 0 0 0 2px #edf4ef; }
.property-money { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.property-money span { display: grid; gap: 2px; padding: 9px; border-radius: 12px; background: #f3eadc; }
.property-money strong { color: var(--brand-dark); }
.property-room-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .75fr); gap: 18px; align-items: center; margin-bottom: 16px; background: linear-gradient(135deg, #fffdf9 0%, #fbf2e5 55%, #edf4ef 100%); }
.property-room-hero h2 { margin: 6px 0 8px; color: var(--brand-dark); font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.025em; }
.property-room-hero p { max-width: 660px; color: #5f635a; line-height: 1.55; }
.property-room-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.property-room-stats span { display: grid; gap: 4px; padding: 12px; border: 1px solid #eadfce; border-radius: 14px; background: #fffaf1c7; }
.property-room-stats strong { color: var(--brand-dark); font-size: 1.45rem; }
.property-room-layout { display: grid; grid-template-columns: minmax(280px, .42fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.property-room-sidebar { position: sticky; top: 160px; align-self: start; }
.property-selector-list { display: grid; gap: 10px; margin-top: 12px; }
.property-selector-card { display: grid; gap: 9px; padding: 12px; border: 1px solid #eadfce; border-radius: 16px; background: var(--surface-2); }
.property-selector-card.active { border-color: #9bb58d; box-shadow: inset 0 0 0 2px #edf4ef; }
.property-selector-main { display: grid; gap: 4px; width: 100%; padding: 0; color: inherit; background: transparent; text-align: left; box-shadow: none !important; }
.property-selector-main:hover { transform: none; box-shadow: none; }
.property-selector-main strong { color: var(--brand-dark); }
.property-selector-main span { color: #5c665b; font-size: .86rem; font-weight: 800; }
.property-selector-main small { line-height: 1.35; }
.property-room-main { min-width: 0; }
.property-focus-card { border-color: #d9e4d2; }
.room-quick-form details { background: #fffaf1; }
.compact-filter { min-width: 220px; }
.room-management-card { display: grid; gap: 12px; }
.room-price-status { display: grid; justify-items: end; gap: 4px; min-width: 110px; }
.room-price-status > span:first-child { color: var(--brand-dark); font-weight: 900; }
.report-actions { display: flex; align-items: end; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.two-columns { grid-template-columns: minmax(300px, .9fr) minmax(360px, 1.1fr); align-items: start; }
.report-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.report-toolbar label { min-width: 190px; }
.report-property h2 { margin-bottom: 4px; }
.report-mini-stats,
.report-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 14px 0; }
.report-mini-stats span,
.report-facts span { display: grid; gap: 4px; padding: 11px; border: 1px solid #eadfce; border-radius: 12px; background: var(--surface-2); }
.report-mini-stats strong,
.report-facts strong { color: var(--brand-dark); }
.report-room-list { margin-top: 12px; }
.report-room.occupied { border-left: 4px solid var(--brand); }
.report-room.available { border-left: 4px solid #ad5a4e; }
.statement { display: grid; gap: 8px; margin-top: 10px; }
.statement div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid #eadfce; }
.statement-total { margin-top: 4px; padding-top: 14px !important; border-top: 2px solid var(--brand); border-bottom: 0 !important; font-size: 1.05rem; }
.compact-notice { margin-top: 9px; padding: 8px; font-size: .82rem; }
form { display: grid; gap: 10px; }
label { display: grid; gap: 6px; color: #5c665b; font-size: .88rem; font-weight: bold; }
input, select, textarea { width: 100%; border: 1px solid #d9cbb7; border-radius: 10px; padding: 11px; background: #fffdf9; font: inherit; }
textarea { min-height: 72px; resize: vertical; }
.list { display: grid; gap: 11px; }
.item { padding: 14px; border: 1px solid #eadfce; border-radius: 14px; background: #fffdf9; }
.item-row { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.item strong { color: var(--brand-dark); }
.meta { margin-top: 5px; color: var(--muted); font-size: .86rem; line-height: 1.42; }
.empty { padding: 18px; color: #71807e; text-align: center; }
.error { color: #b23939; }
.badge { display: inline-block; margin-top: 6px; border-radius: 99px; padding: 4px 9px; color: var(--brand-dark); background: var(--soft); font-size: .77rem; font-weight: bold; }
.badge.pending { color: #984747; background: #fae4dc; }
.actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.actions.no-margin { margin-top: 0; }
.tenant-access { margin-top: 9px; padding-top: 9px; border-top: 1px solid #e0e8e6; }
.tenant-qr-card { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 10px; padding: 12px; border: 1px solid #eadfce; border-radius: 14px; background: #fffaf1; }
.tenant-qr-card img,
.tenant-self-qr img { width: 100%; max-width: 260px; border: 1px solid #eadfce; border-radius: 14px; background: white; padding: 8px; }
.qr-url { overflow-wrap: anywhere; margin-top: 7px; padding: 8px 10px; border-radius: 10px; color: #5c665b; background: #fbf6ef; font-size: .78rem; }
.tenant-panel-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(115px, 1fr)); gap: 8px; overflow: visible; margin: 0 0 14px; padding: 8px; border: 1px solid #eadfce; border-radius: 18px; background: #fffaf1d8; box-shadow: 0 10px 26px #4d37240d; }
.tenant-panel-nav button { color: var(--brand-dark); background: transparent; }
.tenant-panel-nav button.active { color: white; background: var(--brand); box-shadow: 0 10px 22px #4968582b; }
.tenant-panel { display: grid; gap: 16px; }
.tenant-focus-card { min-height: 260px; }
.tenant-self-qr { display: grid; justify-items: start; align-content: start; gap: 10px; }
.payment-cta { display: grid; gap: 9px; margin-top: 12px; padding: 14px; border: 1px solid #d9e4d2; border-radius: 16px; background: linear-gradient(135deg, #edf4ef, #fffaf1); }
.payment-cta span { color: var(--brand-dark); font-weight: 800; }
.payment-cta .button-link { width: fit-content; font-size: .92rem; }
.payment-cta small { color: var(--muted); line-height: 1.4; }
.file-button { display: inline-block; border-radius: 10px; padding: 8px 10px; color: var(--brand-dark); background: #efe5d6; cursor: pointer; font-size: .78rem; }
.file-button input { display: none; }
.view-link { border-radius: 10px; padding: 8px 10px; color: var(--brand-dark); border: 1px solid #d9c8ae; font-size: .78rem; text-decoration: none; }
.button-link { display: inline-block; border-radius: 10px; padding: 10px 12px; color: white; background: var(--brand); font-size: .82rem; font-weight: bold; text-decoration: none; }
details { border: 1px solid #eadfce; border-radius: 12px; padding: 10px; }
summary { color: var(--brand-dark); cursor: pointer; font-size: .88rem; font-weight: bold; }
.details-grid { display: grid; gap: 10px; margin-top: 10px; }
.collapsible-form { padding: 0; overflow: hidden; }
.collapsible-form > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 18px; list-style: none; font-size: 1rem; }
.collapsible-form > summary::-webkit-details-marker { display: none; }
.collapsible-form > summary::after { content: "Abrir"; border-radius: 999px; padding: 6px 10px; color: var(--brand-dark); background: #efe5d6; font-size: .76rem; }
.collapsible-form[open] > summary { border-bottom: 1px solid #eadfce; }
.collapsible-form[open] > summary::after { content: "Ocultar"; }
.collapsible-form > form { padding: 18px; }
.template-upload { margin-top: 12px; padding-top: 12px; border-top: 1px solid #e0e8e6; }
.contract-wizard { border: 2px solid var(--brand); }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 4px 0 8px; }
.steps span { padding: 9px; border-radius: 10px; color: var(--brand-dark); background: var(--soft); font-size: .82rem; font-weight: bold; text-align: center; }
.mini-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); gap: 12px; }
.large-action { padding: 14px 16px; font-size: 1rem; }
.property-summary { margin: 10px 0 12px; padding: 12px; border: 1px solid #eadfce; border-radius: 12px; background: var(--surface-2); }
.room-photo-block { margin-top: 14px; padding-top: 14px; border-top: 1px solid #eadfce; }
.room-photo-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.room-photo-tools { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.room-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin-top: 14px; }
.room-photo-card { display: grid; gap: 10px; margin: 0; padding: 10px; border: 1px solid #eadfce; border-radius: 16px; background: #fffaf1; box-shadow: 0 8px 20px #4d37240d; }
.room-photo-card[draggable="true"] { cursor: grab; }
.room-photo-card.dragging { opacity: .58; transform: scale(.98); }
.room-photo-card.drop-target { border-color: #2f6fe4; box-shadow: 0 0 0 2px rgba(47, 111, 228, .22); }
.room-photo-card-topline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.room-photo-order,
.room-photo-cover-badge,
.room-photo-drag-hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
}
.room-photo-order { color: white; background: #2f6fe4; min-width: 28px; padding-inline: 0; }
.room-photo-cover-badge { color: #134d98; background: #e8f2ff; }
.room-photo-drag-hint { margin-left: auto; color: #5f7190; background: #f1f6fb; }
.photo-thumb { display: block; width: 100%; padding: 0; border-radius: 12px; background: transparent; overflow: hidden; }
.room-photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid #eadfce; border-radius: 12px; background: #f5ede0; }
.room-photos figcaption { margin-top: 0; text-align: center; }
.room-photo-focus-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.room-photo-focus-tools label { display: grid; gap: 6px; font-size: .76rem; font-weight: 700; color: var(--brand-dark); }
.room-photo-focus-tools input[type="range"] { width: 100%; accent-color: #2f6fe4; }
.photo-empty { margin-top: 8px; padding: 10px 12px; border-radius: 12px; background: #fbf6ef; }
.room-photo-dropzone {
  display: grid;
  place-items: center;
  gap: 5px;
  min-height: 118px;
  margin-top: 14px;
  padding: 18px;
  border: 2px dashed #9fc7ff;
  border-radius: 12px;
  color: #1557a8;
  background: linear-gradient(180deg, #f7fbff, #edf6ff);
  text-align: center;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.room-photo-dropzone strong { font-size: .98rem; }
.room-photo-dropzone span { color: #5f7190; font-size: .84rem; }
.room-photo-dropzone.drag-over,
.room-photo-dropzone.is-uploading {
  border-color: #2f6fe4;
  background: linear-gradient(180deg, #eaf4ff, #dcebff);
  box-shadow: 0 16px 32px rgba(47, 111, 228, .16);
  transform: translateY(-1px);
}
.photo-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.photo-actions > * { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; line-height: 1.1; }
.photo-actions .danger { grid-column: 1 / -1; }
.compact-link { display: inline-flex; align-items: center; justify-content: center; padding: 8px 10px; font-weight: bold; text-align: center; }
.photo-viewer { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 18px; background: #081312cc; }
.photo-viewer-card { width: min(100%, 900px); max-height: 94vh; display: grid; gap: 10px; padding: 12px; border-radius: 14px; background: white; box-shadow: 0 12px 42px #0008; }
.photo-viewer-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.photo-viewer img { max-width: 100%; max-height: 72vh; object-fit: contain; border-radius: 10px; background: #0f1719; }
.toast { position: fixed; right: 18px; bottom: 18px; z-index: 20; max-width: min(420px, calc(100vw - 36px)); padding: 13px 15px; border-radius: 14px; color: white; background: var(--brand-dark); box-shadow: 0 16px 40px #4d372440; animation: fade-up .22s ease both; }
.calendar-layout { grid-template-columns: minmax(300px, .8fr) minmax(520px, 1.4fr); align-items: start; }
.calendar-layout > article:last-child { grid-column: 1 / -1; }
.calendar-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 14px; }
.calendar-head h2 { margin: 0; }
.calendar-list-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.calendar-list-head h2,
.calendar-list-head p { margin-bottom: 0; }
.calendar-list-head button { flex: 0 0 auto; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; }
.calendar-weekday { color: var(--muted); font-size: .78rem; font-weight: bold; text-align: center; }
.calendar-day { min-height: 104px; padding: 8px; border: 1px solid #eadfce; border-radius: 12px; background: var(--surface-2); }
.calendar-day.muted { opacity: .35; }
.calendar-day.today { border: 2px solid var(--accent); box-shadow: inset 0 0 0 2px #fff8ed; }
.calendar-day-head { display: flex; justify-content: space-between; align-items: center; gap: 4px; margin-bottom: 4px; }
.day-number { display: block; margin-bottom: 4px; color: var(--muted); font-size: .78rem; font-weight: bold; }
.calendar-day-head .day-number { margin-bottom: 0; }
.calendar-add { width: 24px; height: 24px; padding: 0; border-radius: 999px; color: var(--brand-dark); background: #efe5d6; font-size: .8rem; line-height: 1; }
.calendar-event { display: block; width: 100%; margin-top: 4px; padding: 6px; border-radius: 8px; color: #8f4141; background: #fae4dc; font-size: .7rem; line-height: 1.25; text-align: left; }
.calendar-event small { display: block; margin-top: 2px; color: inherit; opacity: .82; font-weight: normal; }
.calendar-event.custom { color: #59448e; background: #ece5ff; }
.calendar-event.contract { color: #2e5b78; background: #e0edf5; }
.calendar-event.expense { color: #76572d; background: #fff0d1; }
.calendar-event.due { color: #8f4141; background: #fae4dc; }
.calendar-event.paid { color: var(--brand-dark); background: var(--soft); }
.notice { padding: 13px; border-radius: 12px; color: #76572d; background: #fff0d1; }
@keyframes rise-in {
  from { opacity: 0; transform: translateY(18px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes floaty {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(18px, -16px, 0) scale(1.06); }
}
:is(button, .button-link, .view-link, .file-button) { transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease; }
:is(button, .button-link, .view-link, .file-button):hover { transform: translateY(-1px); box-shadow: 0 8px 18px #4d372420; }
input:focus, select:focus, textarea:focus { outline: 2px solid #d6a96e; border-color: var(--accent); box-shadow: 0 0 0 4px #c48a4a20; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition: none !important; }
}
:root[data-theme="dark"] body { background:
  radial-gradient(circle at top left, #2b241c 0, transparent 32%),
  linear-gradient(180deg, #111715 0, #151d19 45%, #101513 100%); color: #eee7dc; }
:root[data-theme="dark"] h1 { color: #d9c5a6; }
:root[data-theme="dark"] small,
:root[data-theme="dark"] .meta,
:root[data-theme="dark"] .calendar-weekday,
:root[data-theme="dark"] .day-number { color: #9fb4b0; }
:root[data-theme="dark"] .login-screen { background:
  radial-gradient(circle at 15% 15%, #2b241c 0 18%, transparent 34%),
  radial-gradient(circle at 82% 12%, #20322a 0 16%, transparent 33%),
  linear-gradient(135deg, #111715 0%, #151d19 50%, #1d261f 100%); }
:root[data-theme="dark"] .login-hero p { color: #bdd0cd; }
:root[data-theme="dark"] .login-kicker { color: #bdebe5; background: #1f4a45; }
:root[data-theme="dark"] .login-highlights span,
:root[data-theme="dark"] .landlord-login { color: #c9f2ed; background: #172225cc; border-color: #2d4347; }
:root[data-theme="dark"] .app-header,
:root[data-theme="dark"] .tabbar { background: #181f1bd9; border-color: #3c3328; box-shadow: 0 12px 34px #0008; }
:root[data-theme="dark"] .app-kicker { color: #d9c5a6; }
:root[data-theme="dark"] .dashboard-hero { background: linear-gradient(135deg, #181f1b 0%, #1e241e 55%, #2c2a1e 100%); }
:root[data-theme="dark"] .property-room-hero { background: linear-gradient(135deg, #181f1b 0%, #1e241e 55%, #2c2a1e 100%); }
:root[data-theme="dark"] .dashboard-hero h2,
:root[data-theme="dark"] .property-room-hero h2,
:root[data-theme="dark"] .next-action strong,
:root[data-theme="dark"] .property-money strong { color: #ead8bd; }
:root[data-theme="dark"] .dashboard-hero p,
:root[data-theme="dark"] .property-room-hero p,
:root[data-theme="dark"] .next-action p { color: #bdd0cd; }
:root[data-theme="dark"] .next-action,
:root[data-theme="dark"] .property-tile,
:root[data-theme="dark"] .property-money span,
:root[data-theme="dark"] .property-room-stats span,
:root[data-theme="dark"] .property-selector-card { background: #111715; border-color: #3c3328; }
:root[data-theme="dark"] .property-selector-card.active { border-color: #6f8a70; box-shadow: inset 0 0 0 2px #243126; }
:root[data-theme="dark"] .property-tile.active { border-color: #6f8a70; box-shadow: inset 0 0 0 2px #243126; }
:root[data-theme="dark"] .property-selector-main strong,
:root[data-theme="dark"] .room-price-status > span:first-child,
:root[data-theme="dark"] .property-room-stats strong { color: #ead8bd; }
:root[data-theme="dark"] .progress-line { background: #302b24; }
:root[data-theme="dark"] .signal-card.attention { border-color: #593c34; background: linear-gradient(180deg, #181f1b, #241b17); }
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .item,
:root[data-theme="dark"] .report-mini-stats span,
:root[data-theme="dark"] .report-facts span,
:root[data-theme="dark"] .property-summary,
:root[data-theme="dark"] .calendar-day { background: #181f1b; border-color: #3c3328; box-shadow: 0 3px 14px #0006; }
:root[data-theme="dark"] .contract-wizard { border-color: #6f8a70; }
:root[data-theme="dark"] .room-quick-form details { background: #111715; }
:root[data-theme="dark"] .steps span { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong,
:root[data-theme="dark"] summary,
:root[data-theme="dark"] label { color: #ead8bd; }
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea { color: #edf7f5; background: #0f1719; border-color: #3a565b; }
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #7f9691; }
:root[data-theme="dark"] button.secondary,
:root[data-theme="dark"] nav button,
:root[data-theme="dark"] .file-button { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] nav button.active,
:root[data-theme="dark"] button { color: #ffffff; background: #6f8a70; }
:root[data-theme="dark"] button.danger { background: #9d4545; }
:root[data-theme="dark"] .view-link,
:root[data-theme="dark"] button.ghost { color: #ead8bd; border-color: #4e4234; }
:root[data-theme="dark"] details,
:root[data-theme="dark"] .template-upload,
:root[data-theme="dark"] .room-photo-block,
:root[data-theme="dark"] .tenant-access,
:root[data-theme="dark"] .statement div { border-color: #2d4347; }
:root[data-theme="dark"] .tenant-qr-card,
:root[data-theme="dark"] .tenant-panel-nav,
:root[data-theme="dark"] .qr-url { color: #bdd0cd; background: #111715; border-color: #3c3328; }
:root[data-theme="dark"] .payment-cta { background: linear-gradient(135deg, #111715, #1f231a); border-color: #3c3328; }
:root[data-theme="dark"] .payment-cta span { color: #ead8bd; }
:root[data-theme="dark"] .payment-cta small { color: #bdd0cd; }
:root[data-theme="dark"] .tenant-panel-nav button { color: #ead8bd; }
:root[data-theme="dark"] .tenant-panel-nav button.active { color: #ffffff; background: #6f8a70; }
:root[data-theme="dark"] .tenant-qr-card img,
:root[data-theme="dark"] .tenant-self-qr img { border-color: #3a565b; }
:root[data-theme="dark"] .collapsible-form > summary::after { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] .collapsible-form[open] > summary { border-bottom-color: #3c3328; }
:root[data-theme="dark"] .statement-total { border-top-color: #6f8a70; }
:root[data-theme="dark"] .badge { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] .badge.pending,
:root[data-theme="dark"] .calendar-event,
:root[data-theme="dark"] .calendar-event.due { color: #ffd7d7; background: #4b2428; }
:root[data-theme="dark"] .calendar-event.paid { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] .calendar-event.custom { color: #dfd3ff; background: #332756; }
:root[data-theme="dark"] .calendar-event.contract { color: #cce8ff; background: #1d3b54; }
:root[data-theme="dark"] .calendar-event.expense { color: #f7dda5; background: #3d3216; }
:root[data-theme="dark"] .calendar-add { color: #ead8bd; background: #2d332a; }
:root[data-theme="dark"] .calendar-day.today { box-shadow: inset 0 0 0 2px #3a2b16; }
:root[data-theme="dark"] .notice { color: #f7dda5; background: #3d3216; }
:root[data-theme="dark"] .room-photo-card { background: #111715; border-color: #3c3328; box-shadow: 0 8px 20px #0006; }
:root[data-theme="dark"] .room-photo-card.drop-target { border-color: #7eb8ff; box-shadow: 0 0 0 2px rgba(126, 184, 255, .22); }
:root[data-theme="dark"] .room-photo-cover-badge { color: #dbeafe; background: rgba(30, 64, 175, .34); }
:root[data-theme="dark"] .room-photo-drag-hint { color: #bfd3ef; background: rgba(16, 27, 46, .88); }
:root[data-theme="dark"] .room-photo-focus-tools label { color: #dbeafe; }
:root[data-theme="dark"] .photo-empty { background: #111715; }
:root[data-theme="dark"] .room-photos img { border-color: #3a565b; background: #0f1719; }
:root[data-theme="dark"] .photo-viewer-card { background: #172225; }
@media (max-width: 750px) {
  main { padding: 14px; }
  header { align-items: flex-start; }
  .app-header { position: static; display: grid; border-radius: 16px; }
  .brand-mark { width: 38px; height: 38px; border-radius: 12px; }
  .tabbar { position: static; border-radius: 14px; }
  .dashboard-hero { grid-template-columns: 1fr; padding: 17px; }
  .dashboard-hero h2 { font-size: 2rem; }
  .property-room-hero { grid-template-columns: 1fr; }
  .property-room-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .property-room-layout { grid-template-columns: 1fr; }
  .property-room-sidebar { position: static; }
  .compact-filter { width: 100%; min-width: 0; }
  .report-actions { justify-content: stretch; }
  .report-actions label { width: 100%; }
  .login-screen { padding: 14px; place-items: start center; overflow: auto; }
  .login-shell { grid-template-columns: 1fr; gap: 8px; }
  .login-hero { padding: 20px 8px 8px; }
  .login-hero h1 { font-size: 2.7rem; }
  .login-panel { gap: 10px; }
  .two-columns { grid-template-columns: 1fr; }
  .tenant-panel-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tenant-qr-card { grid-template-columns: 92px minmax(0, 1fr); padding: 10px; }
  .tenant-self-qr img { justify-self: center; }
  .report-toolbar { display: grid; align-items: start; }
  .report-toolbar label { min-width: 0; }
  .calendar-layout { grid-template-columns: 1fr; }
  .calendar-layout > article:last-child { grid-column: auto; }
  .calendar-month-card { order: 1; }
  .calendar-event-form { order: 2; }
  .calendar-list-card { order: 3; }
  .calendar-head { align-items: flex-start; }
  .calendar-list-head { display: grid; gap: 10px; }
  .calendar-list-head button { width: 100%; }
  nav { margin-inline: -14px; padding-inline: 14px; }
  .calendar-grid { grid-template-columns: 1fr; gap: 8px; }
  .calendar-weekday,
  .calendar-day.muted { display: none; }
  .calendar-day { min-height: auto; padding: 11px; border-radius: 14px; }
  .calendar-day-head { margin-bottom: 6px; }
  .day-number { color: var(--brand-dark); font-size: .9rem; }
  .day-number::before { content: "Dia "; }
  .calendar-add { width: auto; height: auto; padding: 6px 10px; }
  .calendar-event { font-size: .82rem; padding: 8px 10px; margin-top: 6px; }
  .room-photo-tools { width: 100%; justify-content: stretch; }
  .room-photo-tools > * { flex: 1 1 150px; text-align: center; }
  .room-photos { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }
  .photo-actions { grid-template-columns: 1fr; }
  .photo-actions .danger { grid-column: auto; }
  .photo-viewer { padding: 8px; }
  .photo-viewer img { max-height: 68vh; }
  :root:not([data-theme="dark"]) .app-header,
  :root:not([data-theme="dark"]) .tabbar,
  :root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero) { background: #fffdf7; }
  :root:not([data-theme="dark"]) .calendar-day { background: #fff9ed; border-color: #e2ceb0; }
  :root[data-theme="dark"] .day-number { color: #ead8bd; }
}

/* Estilo app moderno: limpio, directo y pensado para celular. */
:root {
  font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  color: #111111;
  background: #f4f5f2;
  --brand: #111111;
  --brand-dark: #050505;
  --accent: #16b86a;
  --accent-soft: #e8f7ee;
  --soft: #f1f3f1;
  --surface: #ffffff;
  --surface-2: #f6f7f5;
  --line: #e5e7e3;
  --muted: #69706b;
  --shadow: 0 22px 55px rgba(15, 18, 16, .08);
  --radius: 24px;
}

body,
:root:not([data-theme="dark"]) body {
  color: #111111;
  background:
    radial-gradient(circle at 12% 0%, rgba(22, 184, 106, .12) 0, transparent 28%),
    linear-gradient(180deg, #f7f8f5 0, #f4f5f2 44%, #eef0ec 100%);
}

main { max-width: 1180px; }
h1, h2, h3 { color: #111111; letter-spacing: -.025em; }
h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); }
h2 { font-size: 1.28rem; }
small, .meta { color: #6d746f; }

.app-header {
  top: 12px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(17, 17, 17, .08);
  border-radius: 30px;
  background: rgba(255, 255, 255, .84);
  box-shadow: 0 18px 45px rgba(17, 17, 17, .08);
}

.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  color: #ffffff;
  background: #111111;
  box-shadow: none;
}

.app-kicker {
  color: #6d746f;
  letter-spacing: .12em;
}

.login-screen,
:root:not([data-theme="dark"]) .login-screen {
  color: #ffffff;
  background:
    radial-gradient(circle at 20% 12%, rgba(22, 184, 106, .34) 0, transparent 26%),
    radial-gradient(circle at 86% 0%, rgba(255, 255, 255, .12) 0, transparent 24%),
    linear-gradient(135deg, #050505 0%, #111111 48%, #171a16 100%);
}

.login-screen::before,
.login-screen::after {
  background: rgba(22, 184, 106, .18);
  filter: blur(8px);
}

.login-hero h1 {
  color: #ffffff;
  font-size: clamp(2.6rem, 6vw, 5rem);
}

.login-hero p { color: #d8ddd9; }
.login-hero .login-kicker,
.login-highlights span {
  color: #ffffff;
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .14);
  box-shadow: none;
}

.login-panel .login-kicker,
.primary-login .login-kicker {
  color: #111111;
  background: #eef2ee;
}

.primary-login,
.landlord-login {
  border-color: rgba(255, 255, 255, .7);
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 32px 80px rgba(0, 0, 0, .26);
}

.primary-login h2,
.landlord-login h2,
.primary-login p,
.landlord-login p { color: #111111; }

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
.item,
.property-selector-card,
.property-tile,
.report-mini-stats span,
.report-facts span,
.property-summary,
.calendar-day,
.room-photo-card,
.tenant-qr-card,
.tenant-panel-nav {
  color: #111111;
  background: #ffffff;
  border: 1px solid rgba(17, 17, 17, .08);
  box-shadow: 0 10px 28px rgba(17, 17, 17, .05);
}

.card { border-radius: 28px; }
.item { border-radius: 22px; }
.item strong,
.stat strong,
.property-money strong,
.property-room-stats strong,
.property-selector-main strong,
.room-price-status > span:first-child {
  color: #111111;
}

button,
.button-link {
  min-height: 42px;
  border-radius: 999px;
  color: #ffffff;
  background: #111111;
  box-shadow: none;
}

button.secondary,
nav button,
.file-button,
.view-link,
button.ghost {
  color: #111111;
  background: #eef0ed;
  border: 1px solid transparent;
}

button.danger { background: #d23939; }
button:disabled { opacity: .5; cursor: not-allowed; }

:is(button, .button-link, .view-link, .file-button):hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(17, 17, 17, .1);
}

.tabbar {
  top: 96px;
  padding: 6px;
  border: 1px solid rgba(17, 17, 17, .08);
  border-radius: 999px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 18px 38px rgba(17, 17, 17, .08);
}

nav button,
.tenant-panel-nav button {
  border-radius: 999px;
  padding: 10px 14px;
}

nav button.active,
.tenant-panel-nav button.active {
  color: #ffffff;
  background: #111111;
  box-shadow: none;
}

.dashboard-hero,
.property-room-hero {
  overflow: hidden;
  border: 0;
  color: #ffffff;
  background:
    radial-gradient(circle at 88% 14%, rgba(22, 184, 106, .42) 0, transparent 24%),
    linear-gradient(135deg, #050505 0%, #111111 62%, #1b221d 100%);
  box-shadow: 0 28px 70px rgba(17, 17, 17, .22);
}

.dashboard-hero h2,
.property-room-hero h2 {
  color: #ffffff;
}

.dashboard-hero p,
.property-room-hero p {
  color: #d7ddd8;
}

.next-action {
  border-color: rgba(255, 255, 255, .16);
  color: #ffffff;
  background: rgba(255, 255, 255, .1);
}

.next-action strong,
.next-action p { color: #ffffff; }

.signal-card.attention,
.notice,
.payment-cta {
  border-color: rgba(22, 184, 106, .18);
  color: #19231d;
  background: #eaf8ef;
}

.payment-cta span { color: #111111; }
.progress-line { background: #e8ece7; }
.progress-line span { background: linear-gradient(90deg, #111111, #16b86a); }

.badge {
  color: #111111;
  background: #eef0ed;
}

.badge.pending {
  color: #9f2525;
  background: #ffe5e5;
}

input, select, textarea,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea {
  color: #111111;
  background: #f4f5f3;
  border: 1px solid transparent;
  border-radius: 16px;
}

input:focus, select:focus, textarea:focus {
  outline: 2px solid #111111;
  border-color: transparent;
  box-shadow: 0 0 0 5px rgba(22, 184, 106, .16);
}

label, summary { color: #222824; }
details { border-color: rgba(17, 17, 17, .08); }
.collapsible-form > summary::after,
.calendar-add {
  color: #111111;
  background: #eef0ed;
}

.property-money span,
.property-room-stats span,
.steps span,
.room-quick-form details,
.qr-url,
.photo-empty {
  color: #111111;
  background: #f4f5f3;
  border-color: rgba(17, 17, 17, .08);
}

.property-selector-card.active,
.property-focus-card,
.contract-wizard {
  border-color: #111111;
  box-shadow: inset 0 0 0 1px #111111;
}

.calendar-event {
  color: #7a2222;
  background: #ffe5e5;
}
.calendar-event.paid { color: #113f2a; background: #ddf5e8; }
.calendar-event.custom { color: #3f2a77; background: #ebe6ff; }
.calendar-event.contract { color: #123a5a; background: #e1eff8; }
.calendar-event.expense { color: #6e4a12; background: #fff1d4; }

.toast {
  color: #ffffff;
  background: #111111;
  border-radius: 18px;
}

:root[data-theme="dark"] {
  color: #f5f5f2;
  background: #050505;
  --brand: #ffffff;
  --brand-dark: #ffffff;
  --surface: #111111;
  --surface-2: #171717;
  --line: #272727;
  --soft: #1d1d1d;
  --muted: #a2aaa4;
}

:root[data-theme="dark"] body {
  color: #f5f5f2;
  background:
    radial-gradient(circle at 16% 0%, rgba(22, 184, 106, .18) 0, transparent 30%),
    linear-gradient(180deg, #050505 0%, #0b0b0b 48%, #050505 100%);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong,
:root[data-theme="dark"] summary,
:root[data-theme="dark"] label,
:root[data-theme="dark"] .property-selector-main strong,
:root[data-theme="dark"] .property-money strong,
:root[data-theme="dark"] .property-room-stats strong,
:root[data-theme="dark"] .room-price-status > span:first-child {
  color: #f5f5f2;
}

:root[data-theme="dark"] small,
:root[data-theme="dark"] .meta,
:root[data-theme="dark"] .calendar-weekday,
:root[data-theme="dark"] .day-number {
  color: #a2aaa4;
}

:root[data-theme="dark"] .app-header,
:root[data-theme="dark"] .tabbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .item,
:root[data-theme="dark"] .report-mini-stats span,
:root[data-theme="dark"] .report-facts span,
:root[data-theme="dark"] .property-summary,
:root[data-theme="dark"] .calendar-day,
:root[data-theme="dark"] .property-selector-card,
:root[data-theme="dark"] .property-tile,
:root[data-theme="dark"] .room-photo-card,
:root[data-theme="dark"] .tenant-qr-card,
:root[data-theme="dark"] .tenant-panel-nav,
:root[data-theme="dark"] .qr-url {
  color: #f5f5f2;
  background: #111111;
  border-color: #272727;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
}

:root[data-theme="dark"] .dashboard-hero,
:root[data-theme="dark"] .property-room-hero {
  background:
    radial-gradient(circle at 88% 14%, rgba(22, 184, 106, .34) 0, transparent 26%),
    linear-gradient(135deg, #000000 0%, #0b0b0b 62%, #101611 100%);
}

:root[data-theme="dark"] button,
:root[data-theme="dark"] .button-link,
:root[data-theme="dark"] nav button.active,
:root[data-theme="dark"] .tenant-panel-nav button.active {
  color: #111111;
  background: #ffffff;
}

:root[data-theme="dark"] button.secondary,
:root[data-theme="dark"] nav button,
:root[data-theme="dark"] .tenant-panel-nav button,
:root[data-theme="dark"] .file-button,
:root[data-theme="dark"] .view-link,
:root[data-theme="dark"] button.ghost,
:root[data-theme="dark"] .calendar-add,
:root[data-theme="dark"] .collapsible-form > summary::after {
  color: #f5f5f2;
  background: #222222;
  border-color: #2d2d2d;
}

:root[data-theme="dark"] button.danger { color: #ffffff; background: #d23939; }

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .property-money span,
:root[data-theme="dark"] .property-room-stats span,
:root[data-theme="dark"] .steps span,
:root[data-theme="dark"] .room-quick-form details,
:root[data-theme="dark"] .photo-empty {
  color: #f5f5f2;
  background: #1b1b1b;
  border-color: #2d2d2d;
}

:root[data-theme="dark"] .notice,
:root[data-theme="dark"] .payment-cta,
:root[data-theme="dark"] .signal-card.attention {
  color: #dff8e9;
  background: #0f2117;
  border-color: #1d5d39;
}

:root[data-theme="dark"] .payment-cta span,
:root[data-theme="dark"] .payment-cta small { color: #dff8e9; }

:root[data-theme="dark"] .badge { color: #f5f5f2; background: #222222; }
:root[data-theme="dark"] .badge.pending { color: #ffdada; background: #4a1f1f; }

@media (max-width: 750px) {
  main.app-shell,
  main.tenant-shell {
    padding: 12px 12px 92px;
  }

  .app-header {
    position: sticky;
    top: 10px;
    display: grid;
    border-radius: 26px;
  }

  .tabbar {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    top: auto;
    z-index: 30;
    overflow-x: auto;
    margin: 0;
    padding: 6px;
    border-radius: 999px;
  }

  .tabbar button {
    flex: 0 0 auto;
    padding: 10px 14px;
    font-size: .82rem;
  }

  nav { margin-inline: 0; padding-inline: 0; }
  .login-shell { min-height: calc(100vh - 28px); align-content: center; }
  .login-hero h1 { font-size: 3.15rem; }
  .card { border-radius: 24px; }
  .dashboard-hero h2 { font-size: 2.2rem; }
  .tenant-panel-nav { border-radius: 24px; }
  .payment-cta .button-link { width: 100%; text-align: center; }
}

/* Interfaz tipo asistente: navegacion clara, contenido centrado y lectura conversacional. */
:root {
  --assistant-bg: #f7f7f8;
  --assistant-panel: #ffffff;
  --assistant-sidebar: #f3f4f6;
  --assistant-sidebar-strong: #eceef1;
  --assistant-text: #202123;
  --assistant-muted: #6b7280;
  --assistant-line: #e5e7eb;
  --assistant-accent: #10a37f;
  --assistant-danger: #d92d20;
  --assistant-shadow: 0 18px 46px rgba(32, 33, 35, .08);
  --brand: #202123;
  --brand-dark: #202123;
  --accent: #10a37f;
  --soft: #eef2f1;
  --surface: #ffffff;
  --surface-2: #f7f7f8;
  --line: #e5e7eb;
  --muted: #6b7280;
  --shadow: var(--assistant-shadow);
  --radius: 18px;
}

body,
:root:not([data-theme="dark"]) body {
  color: var(--assistant-text);
  background: var(--assistant-bg);
}

h1, h2, h3,
.item strong,
.stat strong,
.property-selector-main strong,
.property-money strong,
.property-room-stats strong {
  color: var(--assistant-text);
}

small,
.meta {
  color: var(--assistant-muted);
}

.login-screen,
:root:not([data-theme="dark"]) .login-screen {
  color: var(--assistant-text);
  background:
    radial-gradient(circle at 50% -20%, rgba(16, 163, 127, .12), transparent 34%),
    var(--assistant-bg);
}

.login-screen::before,
.login-screen::after {
  display: none;
}

.login-shell {
  width: min(100%, 1040px);
  grid-template-columns: minmax(280px, .95fr) minmax(320px, .72fr);
}

.login-hero {
  display: grid;
  align-content: center;
  min-height: 520px;
  padding: 34px;
}

.login-hero h1 {
  color: var(--assistant-text);
  max-width: 620px;
  font-size: clamp(3rem, 7vw, 5.8rem);
}

.login-hero p {
  color: #4b5563;
  max-width: 540px;
  font-size: 1.08rem;
}

.login-kicker,
.login-hero .login-kicker,
.login-panel .login-kicker,
.primary-login .login-kicker {
  color: #0f766e;
  background: #e7f6f1;
  border: 1px solid #cce9df;
}

.login-highlights span {
  color: var(--assistant-text);
  background: #ffffff;
  border-color: var(--assistant-line);
  box-shadow: none;
}

.primary-login,
.landlord-login {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border: 1px solid var(--assistant-line);
  border-radius: 26px;
  box-shadow: var(--assistant-shadow);
}

.primary-login h2,
.landlord-login h2,
.primary-login p,
.landlord-login p {
  color: var(--assistant-text);
}

main.app-shell {
  display: grid;
  grid-template-columns: 284px minmax(0, 980px);
  gap: 22px;
  align-items: start;
  max-width: none;
  min-height: 100vh;
  padding: 18px max(18px, calc((100vw - 1340px) / 2));
}

main.tenant-shell {
  display: grid;
  grid-template-columns: 280px minmax(0, 900px);
  gap: 22px;
  align-items: start;
  max-width: none;
  min-height: 100vh;
  padding: 18px max(18px, calc((100vw - 1240px) / 2));
}

#app > .app-header,
#tenant-app > .app-header {
  grid-column: 1;
  grid-row: 1;
}

#tabs.tabbar {
  grid-column: 1;
  grid-row: 2 / span 12;
}

#app > .page {
  grid-column: 2;
  grid-row: 1 / span 16;
  min-width: 0;
}

#tenant-portal {
  grid-column: 2;
  grid-row: 1 / span 12;
  min-width: 0;
}

.app-header,
:root:not([data-theme="dark"]) .app-header {
  position: sticky;
  top: 18px;
  display: grid;
  gap: 16px;
  align-items: start;
  padding: 16px;
  border: 1px solid var(--assistant-line);
  border-radius: 24px;
  background: var(--assistant-sidebar);
  box-shadow: none;
  backdrop-filter: none;
}

.brand-lockup {
  align-items: flex-start;
}

.brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  color: #ffffff;
  background: var(--assistant-text);
}

.app-kicker {
  color: var(--assistant-muted);
  letter-spacing: .08em;
}

.header-actions {
  justify-content: stretch;
}

.header-actions > * {
  flex: 1 1 auto;
}

.tabbar,
:root:not([data-theme="dark"]) .tabbar {
  position: sticky;
  top: 154px;
  display: grid;
  gap: 4px;
  overflow: visible;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--assistant-line);
  border-radius: 24px;
  background: var(--assistant-sidebar);
  box-shadow: none;
  backdrop-filter: none;
}

nav button,
.tenant-panel-nav button {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  min-height: 39px;
  padding: 9px 11px;
  border-radius: 12px;
  color: var(--assistant-text);
  background: transparent;
  font-size: .92rem;
  text-align: left;
}

nav button.active,
.tenant-panel-nav button.active {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  box-shadow: 0 1px 2px rgba(32, 33, 35, .08);
}

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
.item,
.property-selector-card,
.property-tile,
.report-mini-stats span,
.report-facts span,
.property-summary,
.calendar-day,
.room-photo-card,
.tenant-qr-card,
.tenant-panel-nav {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border: 1px solid var(--assistant-line);
  border-radius: 22px;
  box-shadow: none;
}

.card {
  padding: 20px;
}

.item {
  background: #fbfbfb;
}

.dashboard-hero,
.property-room-hero {
  position: relative;
  color: var(--assistant-text);
  border: 1px solid var(--assistant-line);
  background: var(--assistant-panel);
  box-shadow: none;
}

.dashboard-hero::before,
.property-room-hero::before {
  content: "";
  position: absolute;
  inset: 16px auto auto 16px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--assistant-accent);
}

.dashboard-hero h2,
.property-room-hero h2 {
  color: var(--assistant-text);
}

.dashboard-hero p,
.property-room-hero p {
  color: #4b5563;
}

.next-action {
  color: var(--assistant-text);
  background: var(--assistant-sidebar);
  border-color: var(--assistant-line);
}

.next-action strong,
.next-action p {
  color: var(--assistant-text);
}

button,
.button-link {
  border-radius: 12px;
  color: #ffffff;
  background: var(--assistant-text);
}

button.secondary,
.file-button,
.view-link,
button.ghost {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  border: 1px solid transparent;
}

button.danger {
  background: var(--assistant-danger);
}

:is(button, .button-link, .view-link, .file-button):hover {
  transform: none;
  box-shadow: none;
  filter: brightness(.98);
}

input, select, textarea,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border: 1px solid var(--assistant-line);
  border-radius: 14px;
}

input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--assistant-text);
  border-color: transparent;
  box-shadow: none;
}

.notice,
.payment-cta,
.signal-card.attention {
  color: #064e3b;
  background: #ecfdf5;
  border-color: #bbf7d0;
}

.payment-cta span {
  color: var(--assistant-text);
}

.badge {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
}

.badge.pending {
  color: #991b1b;
  background: #fee2e2;
}

.property-selector-card.active,
.property-focus-card,
.contract-wizard {
  border-color: var(--assistant-accent);
  box-shadow: inset 0 0 0 1px var(--assistant-accent);
}

.tenant-panel-nav {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 6px;
  border-radius: 18px;
  background: var(--assistant-sidebar);
}

.tenant-panel-nav button {
  justify-content: center;
  width: auto;
  flex: 1 1 0;
  text-align: center;
}

.calendar-add {
  border-radius: 10px;
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
}

.calendar-event {
  border-radius: 10px;
}

.photo-viewer {
  background: rgba(0, 0, 0, .72);
}

.toast {
  color: #ffffff;
  background: var(--assistant-text);
}

:root[data-theme="dark"] {
  --assistant-bg: #212121;
  --assistant-panel: #2f2f2f;
  --assistant-sidebar: #171717;
  --assistant-sidebar-strong: #262626;
  --assistant-text: #f7f7f8;
  --assistant-muted: #b4b4b4;
  --assistant-line: #3f3f46;
  --assistant-shadow: none;
  --brand: #f7f7f8;
  --brand-dark: #f7f7f8;
  --surface: #2f2f2f;
  --surface-2: #262626;
  --line: #3f3f46;
  --muted: #b4b4b4;
}

:root[data-theme="dark"] body {
  color: var(--assistant-text);
  background: var(--assistant-bg);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong,
:root[data-theme="dark"] summary,
:root[data-theme="dark"] label,
:root[data-theme="dark"] .property-selector-main strong,
:root[data-theme="dark"] .property-money strong,
:root[data-theme="dark"] .property-room-stats strong,
:root[data-theme="dark"] .room-price-status > span:first-child {
  color: var(--assistant-text);
}

:root[data-theme="dark"] small,
:root[data-theme="dark"] .meta,
:root[data-theme="dark"] .calendar-weekday,
:root[data-theme="dark"] .day-number {
  color: var(--assistant-muted);
}

:root[data-theme="dark"] .app-header,
:root[data-theme="dark"] .tabbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .item,
:root[data-theme="dark"] .report-mini-stats span,
:root[data-theme="dark"] .report-facts span,
:root[data-theme="dark"] .property-summary,
:root[data-theme="dark"] .calendar-day,
:root[data-theme="dark"] .property-selector-card,
:root[data-theme="dark"] .property-tile,
:root[data-theme="dark"] .room-photo-card,
:root[data-theme="dark"] .tenant-qr-card,
:root[data-theme="dark"] .tenant-panel-nav,
:root[data-theme="dark"] .qr-url {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border-color: var(--assistant-line);
  box-shadow: none;
}

:root[data-theme="dark"] .app-header,
:root[data-theme="dark"] .tabbar,
:root[data-theme="dark"] .tenant-panel-nav {
  background: var(--assistant-sidebar);
}

:root[data-theme="dark"] .dashboard-hero,
:root[data-theme="dark"] .property-room-hero {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border-color: var(--assistant-line);
}

:root[data-theme="dark"] .dashboard-hero h2,
:root[data-theme="dark"] .property-room-hero h2 {
  color: var(--assistant-text);
}

:root[data-theme="dark"] .dashboard-hero p,
:root[data-theme="dark"] .property-room-hero p {
  color: var(--assistant-muted);
}

:root[data-theme="dark"] button,
:root[data-theme="dark"] .button-link {
  color: #202123;
  background: #f7f7f8;
}

:root[data-theme="dark"] button.secondary,
:root[data-theme="dark"] nav button,
:root[data-theme="dark"] .tenant-panel-nav button,
:root[data-theme="dark"] .file-button,
:root[data-theme="dark"] .view-link,
:root[data-theme="dark"] button.ghost,
:root[data-theme="dark"] .calendar-add,
:root[data-theme="dark"] .collapsible-form > summary::after {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  border-color: transparent;
}

:root[data-theme="dark"] nav button.active,
:root[data-theme="dark"] .tenant-panel-nav button.active {
  color: var(--assistant-text);
  background: var(--assistant-panel);
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .property-money span,
:root[data-theme="dark"] .property-room-stats span,
:root[data-theme="dark"] .steps span,
:root[data-theme="dark"] .room-quick-form details,
:root[data-theme="dark"] .photo-empty {
  color: var(--assistant-text);
  background: #262626;
  border-color: var(--assistant-line);
}

:root[data-theme="dark"] .notice,
:root[data-theme="dark"] .payment-cta,
:root[data-theme="dark"] .signal-card.attention {
  color: #d1fae5;
  background: #12372d;
  border-color: #1f5f4d;
}

@media (max-width: 900px) {
  main.app-shell,
  main.tenant-shell {
    display: block;
    max-width: 100%;
    padding: 12px 12px 88px;
  }

  .app-header,
  :root:not([data-theme="dark"]) .app-header,
  :root[data-theme="dark"] .app-header {
    position: sticky;
    top: 8px;
    display: flex;
    align-items: center;
    border-radius: 20px;
    z-index: 20;
  }

  .header-actions {
    justify-content: flex-end;
  }

  .tabbar,
  :root:not([data-theme="dark"]) .tabbar,
  :root[data-theme="dark"] .tabbar {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    top: auto;
    z-index: 30;
    display: flex;
    overflow-x: auto;
    margin: 0;
    border-radius: 20px;
  }

  .tabbar button {
    flex: 0 0 auto;
    width: auto;
    min-height: 40px;
    padding: 9px 12px;
    font-size: .82rem;
  }

  .login-shell {
    grid-template-columns: 1fr;
  }

  .login-hero {
    min-height: auto;
    padding: 24px 8px 8px;
  }

  .login-hero h1 {
    font-size: 3rem;
  }

  .tenant-panel-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tenant-panel-nav button {
    width: 100%;
  }
}

/* Ajuste fino movil para que el encabezado respire como una app de conversacion. */
@media (max-width: 560px) {
  main.app-shell,
  main.tenant-shell {
    padding: 10px 10px 86px;
  }

  .app-header,
  :root:not([data-theme="dark"]) .app-header,
  :root[data-theme="dark"] .app-header {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
    border-radius: 18px;
  }

  .brand-lockup {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    align-items: center;
  }

  .brand-mark {
    width: 42px;
    height: 42px;
    font-size: .84rem;
  }

  .app-kicker {
    font-size: .68rem;
    letter-spacing: .06em;
  }

  .app-header h1 {
    font-size: clamp(1.75rem, 8vw, 2.15rem);
    line-height: 1.02;
    word-break: normal;
  }

  .app-header small {
    display: block;
    margin-top: 4px;
    font-size: .84rem;
  }

  .header-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .header-actions button {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
  }

  .dashboard-hero,
  .property-room-hero,
  .card,
  .item {
    border-radius: 18px;
  }

  .dashboard-hero h2,
  .property-room-hero h2 {
    font-size: clamp(2rem, 10vw, 2.55rem);
  }

  .actions {
    gap: 8px;
  }

  .tabbar,
  :root:not([data-theme="dark"]) .tabbar,
  :root[data-theme="dark"] .tabbar {
    left: 8px;
    right: 8px;
    bottom: 8px;
    padding: 6px;
  }
}

:root[data-theme="dark"] .login-screen {
  color: var(--assistant-text);
  background:
    radial-gradient(circle at 50% -20%, rgba(16, 163, 127, .12), transparent 34%),
    var(--assistant-bg);
}

:root[data-theme="dark"] .login-hero p {
  color: var(--assistant-muted);
}

:root[data-theme="dark"] .login-highlights span,
:root[data-theme="dark"] .primary-login,
:root[data-theme="dark"] .landlord-login,
:root[data-theme="dark"] .install-card,
:root[data-theme="dark"] .install-pill {
  color: var(--assistant-text);
  background: var(--assistant-panel);
  border-color: var(--assistant-line);
  box-shadow: none;
}

:root[data-theme="dark"] .login-kicker,
:root[data-theme="dark"] .login-hero .login-kicker,
:root[data-theme="dark"] .login-panel .login-kicker,
:root[data-theme="dark"] .primary-login .login-kicker {
  color: #d1fae5;
  background: #12372d;
  border-color: #1f5f4d;
}

/* Paneles plegables para limpiar el portal del arrendador. */
.record-accordion,
.dashboard-section,
.compact-details {
  overflow: hidden;
  padding: 0;
}

.record-accordion > summary,
.dashboard-section > summary,
.compact-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 56px;
  padding: 14px 16px;
  list-style: none;
  cursor: pointer;
}

.record-accordion > summary::-webkit-details-marker,
.dashboard-section > summary::-webkit-details-marker,
.compact-details > summary::-webkit-details-marker {
  display: none;
}

.record-accordion > summary::after,
.dashboard-section > summary::after,
.compact-details > summary::after {
  content: "Abrir";
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  font-size: .76rem;
  font-weight: 800;
}

.record-accordion[open] > summary,
.dashboard-section[open] > summary,
.compact-details[open] > summary {
  border-bottom: 1px solid var(--assistant-line);
}

.record-accordion[open] > summary::after,
.dashboard-section[open] > summary::after,
.compact-details[open] > summary::after {
  content: "Ocultar";
}

.record-accordion-body,
.room-photo-content {
  display: grid;
  gap: 11px;
  padding: 14px 16px 16px;
}

.dashboard-section > .list,
.dashboard-section > p,
.dashboard-section > .meta {
  margin: 0;
  padding: 0 16px 16px;
}

.dashboard-section > p {
  padding-top: 12px;
}

.room-photo-block {
  border-color: var(--assistant-line);
  background: var(--assistant-sidebar);
}

.room-photo-block > summary strong {
  color: var(--assistant-text);
}

.room-photo-head {
  align-items: center;
}

.tenant-file-block {
  border-color: var(--assistant-line);
  background: var(--assistant-sidebar);
}

.tenant-file-content {
  display: grid;
  gap: 12px;
  padding: 14px 16px 16px;
}

.tenant-profile-card {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--assistant-line);
  border-radius: 16px;
  background: var(--assistant-panel);
}

.tenant-profile-photo,
.tenant-profile-placeholder {
  width: 88px;
  height: 88px;
  border-radius: 24px;
  border: 1px solid var(--assistant-line);
}

.tenant-profile-photo {
  display: block;
  object-fit: cover;
  background: var(--assistant-sidebar);
}

.tenant-profile-placeholder {
  display: grid;
  place-items: center;
  color: white;
  background: linear-gradient(135deg, var(--assistant-accent), #0f766e);
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: .04em;
}

.tenant-document-panel,
.tenant-document-item {
  padding: 12px;
  border: 1px solid var(--assistant-line);
  border-radius: 16px;
  background: var(--assistant-panel);
}

.tenant-document-panel {
  display: grid;
  gap: 10px;
}

:root[data-theme="dark"] .tenant-file-block {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  border-color: var(--assistant-line);
}

:root[data-theme="dark"] .tenant-profile-card,
:root[data-theme="dark"] .tenant-document-panel,
:root[data-theme="dark"] .tenant-document-item {
  background: var(--assistant-panel);
  border-color: var(--assistant-line);
}

.report-accordion > summary h2 {
  margin-bottom: 2px;
}

.collapsible-form.contract-wizard {
  border-color: var(--assistant-accent);
}

:root[data-theme="dark"] .record-accordion > summary::after,
:root[data-theme="dark"] .dashboard-section > summary::after,
:root[data-theme="dark"] .compact-details > summary::after,
:root[data-theme="dark"] .room-photo-block {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  border-color: var(--assistant-line);
}

@media (max-width: 560px) {
  .record-accordion > summary,
  .dashboard-section > summary,
  .compact-details > summary {
    align-items: flex-start;
    padding: 13px;
  }

  .record-accordion > summary::after,
  .dashboard-section > summary::after,
  .compact-details > summary::after {
    padding: 5px 8px;
  }

  .record-accordion-body,
  .room-photo-content,
  .tenant-file-content {
    padding: 12px 13px 13px;
  }

  .tenant-profile-card {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 11px;
  }

  .tenant-profile-photo,
  .tenant-profile-placeholder {
    width: 68px;
    height: 68px;
    border-radius: 18px;
  }
}

/* Catalogo publico para prospectos. */
.public-entry-card {
  display: grid;
  gap: 10px;
}

.public-entry-card p {
  color: var(--assistant-muted);
  line-height: 1.45;
}

.public-catalog-shell {
  max-width: 1180px;
  min-height: 100vh;
  margin: auto;
  padding: 18px;
}

.public-catalog-header {
  position: sticky;
  top: 12px;
  z-index: 20;
}

.public-catalog-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, .42fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 10px;
}

.public-catalog-hero h2 {
  margin: 10px 0;
  font-size: clamp(2rem, 5vw, 3.6rem);
  line-height: .98;
  letter-spacing: -.04em;
}

.public-catalog-hero p {
  max-width: 680px;
  color: var(--assistant-muted);
  line-height: 1.55;
}

.public-catalog-stats {
  display: grid;
  gap: 10px;
}

.public-catalog-stats span {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--assistant-line);
  border-radius: 18px;
  background: var(--assistant-sidebar);
}

.public-catalog-stats strong {
  color: var(--assistant-text);
  font-size: 1.45rem;
}

.public-location-picker {
  display: grid;
  gap: 16px;
  margin-top: 12px;
}

.public-location-intro {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.public-location-intro h2 {
  margin: 8px 0 6px;
}

.public-location-intro p {
  max-width: 640px;
  margin: 0;
  color: var(--assistant-muted);
  line-height: 1.5;
}

.public-location-layout {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(360px, 1fr);
  gap: 14px;
  align-items: stretch;
}

.public-location-list {
  display: grid;
  gap: 10px;
  align-content: start;
}

.public-location-card {
  display: grid;
  gap: 6px;
  width: 100%;
  min-height: auto;
  padding: 14px;
  border: 1px solid var(--assistant-line);
  border-radius: 18px;
  color: var(--assistant-text);
  background: var(--assistant-sidebar);
  text-align: left;
}

.public-location-card.active {
  color: white;
  background: var(--assistant-text);
  border-color: var(--assistant-text);
  box-shadow: 0 18px 34px rgba(17, 17, 17, .14);
}

.public-location-card.active .public-location-address,
.public-location-card.active .public-location-meta,
.public-location-card.active .public-location-services {
  color: rgba(255, 255, 255, .82);
}

.public-location-name {
  font-size: 1rem;
  font-weight: 900;
}

.public-location-address,
.public-location-meta,
.public-location-services {
  color: var(--assistant-muted);
  font-size: .82rem;
  line-height: 1.35;
}

.public-location-meta {
  font-weight: 900;
}

.public-map-card {
  overflow: hidden;
  min-height: 380px;
  border: 1px solid var(--assistant-line);
  border-radius: 22px;
  background: var(--assistant-sidebar);
}

.public-map-visual {
  position: relative;
  overflow: hidden;
  min-height: 320px;
  background: var(--assistant-sidebar-strong);
}

.public-map-card iframe {
  display: block;
  width: 100%;
  min-height: 320px;
  height: 100%;
  border: 0;
  background: var(--assistant-sidebar-strong);
}

.public-map-radius {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: min(58%, 310px);
  aspect-ratio: 1;
  border: 4px solid #dc2626;
  border-radius: 999px;
  background: rgba(220, 38, 38, .14);
  box-shadow: 0 0 0 999px rgba(255, 255, 255, .03), 0 12px 32px rgba(127, 29, 29, .2);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.public-map-radius span {
  border-radius: 999px;
  padding: 7px 11px;
  color: white;
  background: #dc2626;
  font-size: .78rem;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(127, 29, 29, .28);
}

.public-map-caption {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
}

.public-map-caption strong {
  color: var(--assistant-text);
}

.public-map-caption span {
  color: var(--assistant-muted);
  font-size: .86rem;
  line-height: 1.35;
}

.public-map-caption small {
  color: var(--assistant-muted);
  line-height: 1.35;
}

.public-property-group {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.public-property-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  padding: 0 4px;
}

.public-property-head h2 {
  margin-bottom: 4px;
}

.public-property-head p {
  margin-bottom: 4px;
  color: var(--assistant-muted);
}

.public-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
  gap: 14px;
}

.public-room-card {
  display: grid;
  gap: 0;
  overflow: hidden;
  padding: 0;
}

.public-room-gallery {
  display: grid;
  gap: 8px;
  padding: 12px 12px 0;
}

.public-room-cover,
.public-room-thumbs button {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: 0;
  border: 0;
  color: white;
  background: var(--assistant-sidebar-strong);
}

.public-room-cover {
  aspect-ratio: 4 / 3;
  border-radius: 18px;
}

.public-room-cover img,
.public-room-thumbs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.public-room-cover span {
  position: absolute;
  right: 10px;
  bottom: 10px;
  border-radius: 999px;
  padding: 6px 9px;
  color: white;
  background: rgba(0, 0, 0, .62);
  font-size: .78rem;
  font-weight: 800;
}

.public-room-thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
}

.public-room-thumbs button {
  aspect-ratio: 1;
  border-radius: 12px;
}

.public-room-empty-photo {
  display: grid;
  place-items: center;
  gap: 4px;
  min-height: 210px;
  margin: 12px 12px 0;
  border: 1px dashed var(--assistant-line);
  border-radius: 18px;
  color: var(--assistant-muted);
  background: var(--assistant-sidebar);
  text-align: center;
}

.public-room-empty-photo span {
  color: var(--assistant-text);
  font-weight: 900;
}

.public-room-body {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.public-room-body h3 {
  margin-bottom: 2px;
}

.public-room-price {
  white-space: nowrap;
  color: var(--assistant-text);
  font-size: 1.2rem;
}

.public-room-tags {
  display: grid;
  gap: 7px;
}

.public-room-tags span {
  border-radius: 999px;
  padding: 8px 10px;
  color: var(--assistant-text);
  background: var(--assistant-sidebar);
  font-size: .84rem;
  font-weight: 800;
}

.public-services {
  display: grid;
  gap: 8px;
}

.public-services small {
  color: var(--assistant-muted);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.public-services > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.public-services span {
  border-radius: 999px;
  padding: 7px 10px;
  color: #0f5132;
  background: #dcfce7;
  font-size: .8rem;
  font-weight: 900;
}

.public-services.muted-services span {
  color: var(--assistant-muted);
  background: var(--assistant-sidebar);
}

.public-room-body p {
  margin: 0;
  color: var(--assistant-muted);
  line-height: 1.45;
}

.secondary-link {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
}

:root[data-theme="dark"] .public-catalog-stats span,
:root[data-theme="dark"] .public-location-card,
:root[data-theme="dark"] .public-map-card,
:root[data-theme="dark"] .public-room-tags span,
:root[data-theme="dark"] .public-room-empty-photo {
  color: var(--assistant-text);
  background: var(--assistant-sidebar-strong);
  border-color: var(--assistant-line);
}

:root[data-theme="dark"] .public-location-card.active {
  color: #111111;
  background: #d1fae5;
  border-color: #d1fae5;
}

:root[data-theme="dark"] .public-location-card.active .public-location-address,
:root[data-theme="dark"] .public-location-card.active .public-location-meta,
:root[data-theme="dark"] .public-location-card.active .public-location-services {
  color: rgba(17, 17, 17, .72);
}

:root[data-theme="dark"] .public-services span {
  color: #d1fae5;
  background: #12372d;
}

/* Lobby y catalogo: enfoque para prospectos que buscan ubicacion disponible. */
.login-screen,
:root:not([data-theme="dark"]) .login-screen {
  color: var(--assistant-text);
  background:
    linear-gradient(115deg, rgba(255, 255, 255, .9) 0 36%, rgba(255, 255, 255, .3) 36% 100%),
    radial-gradient(circle at 8% 16%, rgba(16, 163, 127, .22), transparent 28%),
    radial-gradient(circle at 78% 12%, rgba(196, 138, 74, .18), transparent 24%),
    linear-gradient(145deg, #f8faf7 0%, #eef7f2 46%, #fff8ea 100%);
}

.login-shell {
  width: min(100%, 1120px);
  grid-template-columns: minmax(310px, 1fr) minmax(330px, .78fr);
  gap: 26px;
}

.login-hero {
  position: relative;
  overflow: hidden;
  min-height: 560px;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 32px;
  padding: clamp(28px, 5vw, 52px);
  background:
    linear-gradient(rgba(17, 17, 17, .2), rgba(17, 17, 17, .62)),
    url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1400&q=80") center / cover;
  box-shadow: 0 34px 90px rgba(17, 17, 17, .2);
}

.login-hero::after {
  content: "Zonas listas para visitar";
  position: absolute;
  right: 24px;
  bottom: 24px;
  max-width: 210px;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 18px;
  padding: 14px 16px;
  color: #ffffff;
  background: rgba(17, 17, 17, .5);
  font-size: .92rem;
  font-weight: 900;
  backdrop-filter: blur(12px);
}

.login-hero h1 {
  color: #ffffff;
  max-width: 640px;
  text-wrap: balance;
  text-shadow: 0 12px 36px rgba(0, 0, 0, .34);
}

.login-hero p {
  color: rgba(255, 255, 255, .88);
  max-width: 560px;
}

.login-hero .login-kicker,
.login-highlights span {
  color: #ffffff;
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .24);
  backdrop-filter: blur(10px);
}

.login-panel {
  gap: 14px;
}

.login-panel .login-card,
.landlord-login {
  border-radius: 24px;
  background: rgba(255, 255, 255, .9);
  border-color: rgba(17, 17, 17, .08);
  box-shadow: 0 22px 60px rgba(17, 17, 17, .1);
  backdrop-filter: blur(18px);
}

.public-entry-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(16, 163, 127, .28) !important;
  background:
    linear-gradient(135deg, rgba(220, 252, 231, .92), rgba(255, 253, 249, .98)) !important;
}

.public-entry-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 7px;
  background: linear-gradient(180deg, #10a37f, #c48a4a);
}

.public-entry-card h2 {
  color: #0f3d31;
}

.public-entry-card .large-action {
  color: #ffffff;
  background: #0f766e;
  box-shadow: 0 14px 30px rgba(15, 118, 110, .22);
}

.public-location-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(16, 163, 127, .2);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(238, 247, 242, .95));
  box-shadow: 0 12px 30px rgba(17, 17, 17, .06);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.public-location-card:hover {
  transform: translateY(-2px);
  border-color: rgba(16, 163, 127, .45);
  box-shadow: 0 18px 38px rgba(17, 17, 17, .1);
}

.public-location-card.active {
  color: #ffffff;
  background:
    linear-gradient(135deg, #0f766e 0%, #12372d 100%);
  border-color: #0f766e;
}

.public-location-status {
  width: fit-content;
  border-radius: 999px;
  padding: 5px 9px;
  color: #065f46;
  background: #d1fae5;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.public-location-card.active .public-location-status {
  color: #12372d;
  background: #ffffff;
}

.public-location-name {
  font-size: 1.08rem;
}

.public-location-meta {
  color: #0f766e;
  font-size: .88rem;
}

.public-map-card {
  border-color: rgba(16, 163, 127, .22);
  box-shadow: 0 18px 45px rgba(17, 17, 17, .08);
}

:root[data-theme="dark"] .login-hero {
  border-color: rgba(255, 255, 255, .1);
  background:
    linear-gradient(rgba(0, 0, 0, .22), rgba(0, 0, 0, .68)),
    url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1400&q=80") center / cover;
}

:root[data-theme="dark"] .login-panel .login-card,
:root[data-theme="dark"] .landlord-login {
  background: rgba(24, 31, 27, .9);
  border-color: var(--assistant-line);
}

:root[data-theme="dark"] .public-entry-card {
  background: linear-gradient(135deg, rgba(18, 55, 45, .92), rgba(24, 31, 27, .98)) !important;
}

:root[data-theme="dark"] .public-entry-card h2 {
  color: #d1fae5;
}

:root[data-theme="dark"] .public-location-card {
  background: linear-gradient(135deg, #151d19, #111715);
  border-color: rgba(209, 250, 229, .16);
}

@media (max-width: 760px) {
  .login-screen {
    padding: 12px;
  }

  .login-shell {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .login-hero {
    min-height: 430px;
    border-radius: 24px;
  }

  .login-hero::after {
    position: static;
    margin-top: 20px;
  }

  .public-catalog-shell {
    padding: 10px;
  }

  .public-catalog-hero {
    grid-template-columns: 1fr;
  }

  .public-catalog-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .public-catalog-stats span {
    padding: 10px;
  }

  .public-catalog-stats strong {
    font-size: 1.05rem;
  }

  .public-location-intro {
    display: grid;
  }

  .public-location-layout {
    grid-template-columns: 1fr;
  }

  .public-location-list {
    grid-auto-flow: column;
    grid-auto-columns: minmax(245px, 82vw);
    overflow-x: auto;
    padding-bottom: 4px;
    scroll-snap-type: x mandatory;
  }

  .public-location-card {
    scroll-snap-align: start;
  }

  .public-map-card {
    min-height: 310px;
  }

  .public-map-card iframe {
    min-height: 245px;
  }

  .public-map-visual {
    min-height: 245px;
  }

  .public-map-radius {
    width: min(62%, 245px);
    border-width: 3px;
  }

  .public-property-head {
    display: grid;
  }

  .public-room-grid {
    grid-template-columns: 1fr;
  }
}

/* Redise?o showroom inspirado en Tesla: limpio, visual y con se?ales por modulo. */
:root {
  --tesla-bg: #f4f4f2;
  --tesla-ink: #171a20;
  --tesla-muted: #5c5e62;
  --tesla-panel: rgba(255, 255, 255, .9);
  --tesla-line: rgba(23, 26, 32, .1);
  --tesla-black: #171a20;
  --tesla-red: #e82127;
  --tesla-green: #0f766e;
  --tesla-shadow: 0 22px 70px rgba(23, 26, 32, .12);
}

body,
:root:not([data-theme="dark"]) body {
  color: var(--tesla-ink);
  background:
    linear-gradient(180deg, rgba(244, 244, 242, .86), rgba(244, 244, 242, .98)),
    url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=1800&q=80") center top / cover fixed;
}

main.app-shell,
main.tenant-shell,
.public-catalog-shell {
  max-width: 1280px;
}

#app > .app-header,
#tenant-app > .app-header,
.public-catalog-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root:not([data-theme="dark"]) #tenant-app > .app-header,
:root:not([data-theme="dark"]) .public-catalog-header {
  top: 14px;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 10px;
  background: rgba(255, 255, 255, .76);
  box-shadow: 0 18px 50px rgba(23, 26, 32, .1);
  backdrop-filter: blur(18px);
}

.brand-mark {
  border-radius: 8px;
  color: #ffffff;
  background: var(--tesla-black);
  box-shadow: none;
}

.brand-mark::after {
  content: "";
  width: 18px;
  height: 2px;
  margin-top: -2px;
  border-radius: 999px;
  background: var(--tesla-red);
}

.brand-mark {
  font-size: 0;
}

.brand-mark::before {
  content: "RS";
  font-size: .84rem;
  font-weight: 900;
  letter-spacing: .08em;
}

.app-kicker,
.login-kicker {
  color: var(--tesla-muted);
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(23, 26, 32, .08);
  letter-spacing: .12em;
}

h1, h2, h3,
.item strong,
.stat strong {
  color: var(--tesla-ink);
}

small,
.meta,
label {
  color: var(--tesla-muted);
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
.tenant-panel-nav {
  position: sticky;
  top: 98px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 6px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 16px 46px rgba(23, 26, 32, .08);
  backdrop-filter: blur(16px);
}

#tabs button,
.tenant-panel-nav button {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  justify-content: start;
  min-height: 46px;
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--tesla-muted);
  background: transparent;
  box-shadow: none;
  text-align: left;
}

#tabs button::before,
.tenant-panel-nav button::before,
.collapsible-form > summary::before,
.dashboard-section > summary::before {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  color: #ffffff;
  background: var(--tesla-black);
  font-size: .78rem;
  font-weight: 900;
}

#tabs button[data-page="dashboard"]::before { content: "I"; }
#tabs button[data-page="payments"]::before { content: "$"; background: #107c41; }
#tabs button[data-page="properties"]::before { content: "P"; background: #2563eb; }
#tabs button[data-page="rooms"]::before { content: "R"; background: #7c3aed; }
#tabs button[data-page="tenants"]::before { content: "T"; background: #0f766e; }
#tabs button[data-page="documents"]::before { content: "D"; background: #b45309; }
#tabs button[data-page="calendar"]::before { content: "C"; background: #dc2626; }
#tabs button[data-page="expenses"]::before { content: "-"; background: #be123c; }
#tabs button[data-page="reports"]::before { content: "%"; background: #334155; }
#tabs button[data-page="settings"]::before { content: "*"; background: #52525b; }

#tabs button.active,
.tenant-panel-nav button.active {
  color: #ffffff;
  background: var(--tesla-black);
  box-shadow: none;
}

button,
.button-link {
  border-radius: 8px;
  background: var(--tesla-black);
  box-shadow: none;
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}

button:hover,
.button-link:hover,
.view-link:hover {
  transform: translateY(-1px);
}

button.secondary,
nav button,
.view-link,
.file-button {
  color: var(--tesla-ink);
  background: rgba(244, 244, 242, .9);
  border: 1px solid rgba(23, 26, 32, .1);
}

button.danger {
  background: #b91c1c;
}

.large-action {
  min-height: 48px;
  border-radius: 8px;
}

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
.item,
.property-selector-card,
.property-tile,
.calendar-day,
.room-photo-card,
.tenant-qr-card {
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 10px;
  background: var(--tesla-panel);
  box-shadow: 0 16px 50px rgba(23, 26, 32, .08);
  backdrop-filter: blur(14px);
}

input,
select,
textarea,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea {
  border-color: rgba(23, 26, 32, .13);
  border-radius: 8px;
  background: rgba(255, 255, 255, .92);
}

.page {
  position: relative;
}

.page:not(.hidden)::before {
  display: grid;
  min-height: 270px;
  margin-bottom: 18px;
  border-radius: 12px;
  padding: clamp(24px, 5vw, 52px);
  color: #ffffff;
  align-content: end;
  font-size: clamp(2.4rem, 6vw, 5.4rem);
  font-weight: 900;
  line-height: .95;
  letter-spacing: 0;
  text-shadow: 0 16px 42px rgba(0, 0, 0, .48);
  box-shadow: var(--tesla-shadow);
}

#dashboard.page:not(.hidden)::before {
  content: "Control total de tus rentas";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .12), rgba(0, 0, 0, .62)),
    url("https://images.unsplash.com/photo-1600607688969-a5bfcd646154?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#payments.page:not(.hidden)::before {
  content: "Cobranza";
  background:
    radial-gradient(circle at 78% 42%, rgba(34, 197, 94, .42), transparent 0 12%, transparent 30%),
    linear-gradient(135deg, rgba(4, 120, 87, .92), rgba(6, 78, 59, .78)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.08) 0 1px, transparent 1px 44px),
    linear-gradient(135deg, #064e3b, #111827);
}

#properties.page:not(.hidden)::before {
  content: "Inmuebles";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .58)),
    url("https://images.unsplash.com/photo-1600566753190-17f0baa2a6c3?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#rooms.page:not(.hidden)::before {
  content: "Habitaciones";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .6)),
    url("https://images.unsplash.com/photo-1618221195710-dd6b41faaea6?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#tenants.page:not(.hidden)::before {
  content: "Inquilinos";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .58)),
    url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#documents.page:not(.hidden)::before {
  content: "Contratos";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .6)),
    url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#calendar.page:not(.hidden)::before {
  content: "Calendario";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .62)),
    url("https://images.unsplash.com/photo-1506784365847-bbad939e9335?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#expenses.page:not(.hidden)::before {
  content: "Gastos";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .6)),
    url("https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#reports.page:not(.hidden)::before {
  content: "Reportes";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .62)),
    url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1800&q=80") center / cover;
}

#settings.page:not(.hidden)::before {
  content: "Ajustes";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .62)),
    url("https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=1800&q=80") center / cover;
}

.dashboard-hero,
.property-room-hero {
  overflow: hidden;
  border-radius: 10px;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(23, 26, 32, .92), rgba(23, 26, 32, .72)),
    url("https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1400&q=80") center / cover;
  box-shadow: var(--tesla-shadow);
}

.dashboard-hero h2,
.dashboard-hero p,
.property-room-hero h2,
.property-room-hero p,
.dashboard-hero .app-kicker,
.property-room-hero .app-kicker {
  color: #ffffff;
}

.dashboard-hero .app-kicker,
.property-room-hero .app-kicker {
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .22);
}

.property-room-stats span,
.public-catalog-stats span,
.report-mini-stats span,
.report-facts span,
.property-money span {
  border-radius: 8px;
  background: rgba(244, 244, 242, .76);
}

.dashboard-hero .property-room-stats span,
.property-room-hero .property-room-stats span {
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .12);
}

.dashboard-hero .property-room-stats strong,
.property-room-hero .property-room-stats strong {
  color: #ffffff;
}

.stat {
  position: relative;
  overflow: hidden;
  min-height: 120px;
}

.stat::after,
.signal-card::after {
  position: absolute;
  right: 16px;
  bottom: 10px;
  color: rgba(23, 26, 32, .08);
  font-size: 4rem;
  font-weight: 900;
  line-height: 1;
}

#payments .card::after { content: "$"; }
#properties .card::after { content: "P"; }
#rooms .card::after { content: "R"; }
#tenants .card::after { content: "T"; }
#documents .card::after { content: "D"; }
#calendar .card::after { content: "C"; }
#expenses .card::after { content: "-"; }
#reports .card::after { content: "%"; }

#payments.page:not(.hidden)::after {
  content: "$";
  position: absolute;
  top: 52px;
  right: clamp(26px, 6vw, 78px);
  display: grid;
  place-items: center;
  width: min(30vw, 230px);
  aspect-ratio: 1.62;
  border: 2px solid rgba(255, 255, 255, .55);
  border-radius: 16px;
  color: rgba(255, 255, 255, .92);
  background:
    radial-gradient(circle at 22% 50%, rgba(255,255,255,.18), transparent 0 22%, transparent 23%),
    radial-gradient(circle at 78% 50%, rgba(255,255,255,.18), transparent 0 22%, transparent 23%),
    linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.05));
  font-size: clamp(4rem, 10vw, 8rem);
  font-weight: 900;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
  pointer-events: none;
}

.page .card {
  position: relative;
  overflow: hidden;
}

.page .card::after {
  position: absolute;
  right: 18px;
  bottom: 10px;
  color: rgba(255, 255, 255, .07);
  font-size: 5rem;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}

#tabs button:not(.active),
.tenant-panel-nav button:not(.active) {
  color: rgba(255, 255, 255, .82);
}

.badge {
  border-radius: 999px;
  color: #065f46;
  background: #d1fae5;
}

.badge.pending {
  color: #991b1b;
  background: #fee2e2;
}

.calendar-day.today {
  border-color: var(--tesla-red);
  box-shadow: inset 0 0 0 1px var(--tesla-red), 0 14px 36px rgba(232, 33, 39, .12);
}

.public-catalog-hero {
  min-height: 330px;
  border-radius: 12px;
  color: #ffffff;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .64)),
    url("https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?auto=format&fit=crop&w=1800&q=80") center / cover;
}

.public-catalog-hero h2,
.public-catalog-hero p,
.public-catalog-hero .login-kicker {
  color: #ffffff;
}

.public-catalog-hero .login-kicker {
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .24);
}

.login-screen,
:root:not([data-theme="dark"]) .login-screen {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .1)),
    url("https://images.unsplash.com/photo-1600607687644-aac4c3eac7f4?auto=format&fit=crop&w=1900&q=80") center / cover;
}

.login-hero {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .58)),
    url("https://images.unsplash.com/photo-1600566753086-00f18fb6b3ea?auto=format&fit=crop&w=1800&q=80") center / cover;
}

.login-panel .login-card,
.landlord-login {
  background: rgba(255, 255, 255, .82);
}

:root[data-theme="dark"] body {
  background:
    linear-gradient(180deg, rgba(15, 23, 25, .9), rgba(15, 23, 25, .98)),
    url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=1800&q=80") center top / cover fixed;
}

:root[data-theme="dark"] #app > .app-header,
:root[data-theme="dark"] #tenant-app > .app-header,
:root[data-theme="dark"] .public-catalog-header,
:root[data-theme="dark"] #tabs.tabbar,
:root[data-theme="dark"] .tenant-panel-nav,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .item,
:root[data-theme="dark"] .property-selector-card,
:root[data-theme="dark"] .property-tile,
:root[data-theme="dark"] .calendar-day,
:root[data-theme="dark"] .room-photo-card,
:root[data-theme="dark"] .tenant-qr-card {
  border-color: rgba(255, 255, 255, .1);
  background: rgba(17, 24, 24, .84);
  box-shadow: 0 18px 54px rgba(0, 0, 0, .35);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong {
  color: #f8fafc;
}

@media (max-width: 760px) {
  body,
  :root:not([data-theme="dark"]) body {
    background-attachment: scroll;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  .public-catalog-header {
    top: 8px;
    border-radius: 10px;
  }

  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar {
    position: fixed;
    left: 8px;
    right: 8px;
    bottom: 8px;
    top: auto;
    z-index: 40;
    display: flex;
    overflow-x: auto;
  }

  #tabs button {
    grid-template-columns: 24px auto;
    flex: 0 0 auto;
    min-width: 126px;
  }

  .page:not(.hidden)::before {
    min-height: 230px;
    font-size: clamp(2.1rem, 11vw, 3.5rem);
    padding: 22px;
  }

  main.app-shell,
  main.tenant-shell {
    padding-bottom: 92px;
  }
}

/* Version mas cercana a Tesla: nav superior, hero full-screen y menus discretos. */
body,
:root:not([data-theme="dark"]) body,
:root[data-theme="dark"] body {
  color: #171a20;
  background: #ffffff;
}

main.app-shell,
main.tenant-shell {
  display: block;
  max-width: none;
  min-height: 100vh;
  padding: 0;
}

#app > .app-header,
#tenant-app > .app-header,
.public-catalog-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root:not([data-theme="dark"]) #tenant-app > .app-header,
:root:not([data-theme="dark"]) .public-catalog-header,
:root[data-theme="dark"] #app > .app-header,
:root[data-theme="dark"] #tenant-app > .app-header,
:root[data-theme="dark"] .public-catalog-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 56px;
  margin: 0;
  padding: 10px clamp(16px, 3vw, 44px);
  border: 0;
  border-radius: 0;
  color: #171a20;
  background: linear-gradient(180deg, rgba(255, 255, 255, .54), rgba(255, 255, 255, 0));
  box-shadow: none;
  backdrop-filter: none;
}

.brand-lockup {
  min-width: 190px;
  align-items: center;
}

.brand-mark {
  display: none;
}

.brand-lockup h1 {
  margin: 0;
  color: #171a20;
  font-size: 1.16rem;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.brand-lockup h1::before {
  content: "RENTAS";
  margin-right: 7px;
}

.app-kicker,
.brand-lockup small {
  display: none;
}

.header-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.header-actions button,
.header-actions .button-link,
.header-actions .view-link {
  min-height: 32px;
  border: 0;
  border-radius: 999px;
  padding: 7px 13px;
  color: #171a20;
  background: rgba(255, 255, 255, .32);
  font-size: .82rem;
  box-shadow: none;
  backdrop-filter: blur(16px);
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar,
.tenant-panel-nav,
:root[data-theme="dark"] .tenant-panel-nav {
  position: fixed;
  top: 9px;
  left: 50%;
  right: auto;
  bottom: auto;
  z-index: 100;
  display: flex;
  width: auto;
  max-width: min(72vw, 880px);
  gap: 3px;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transform: translateX(-50%);
}

#tabs button,
:root[data-theme="dark"] #tabs button,
.tenant-panel-nav button,
:root[data-theme="dark"] .tenant-panel-nav button {
  display: block;
  flex: 0 0 auto;
  min-width: auto;
  min-height: 36px;
  border: 0;
  border-radius: 999px;
  padding: 8px 12px;
  color: #171a20;
  background: transparent;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  box-shadow: none;
}

#tabs button::before,
.tenant-panel-nav button::before {
  display: none;
}

#tabs button:hover,
.tenant-panel-nav button:hover,
#tabs button.active,
.tenant-panel-nav button.active {
  color: #171a20;
  background: rgba(255, 255, 255, .42);
  backdrop-filter: blur(16px);
}

.page,
#tenant-portal {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 18px 42px;
}

.page:not(.hidden)::before {
  position: relative;
  left: 50%;
  width: 100vw;
  min-height: 100svh;
  margin-left: -50vw;
  margin-bottom: 28px;
  border-radius: 0;
  padding: 15vh clamp(18px, 5vw, 70px) 12vh;
  align-content: start;
  justify-items: center;
  color: #171a20;
  font-size: clamp(2.6rem, 7vw, 5.8rem);
  line-height: .96;
  text-align: center;
  text-shadow: none;
  box-shadow: none;
}

.page:not(.hidden)::after {
  content: "Gestionar ahora";
  position: absolute;
  left: 50%;
  top: calc(100svh - 128px);
  z-index: 2;
  display: grid;
  place-items: center;
  width: min(260px, calc(50vw - 28px));
  min-height: 42px;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(23, 26, 32, .86);
  font-size: .86rem;
  font-weight: 900;
  transform: translateX(calc(-100% - 8px));
  pointer-events: none;
}

.page > .grid:first-child::before,
.page > .card:first-child::before,
.page > section:first-child::before {
  content: "Ver detalles";
  position: absolute;
  left: calc(50% + 8px);
  top: calc(100svh - 128px);
  z-index: 3;
  display: grid;
  place-items: center;
  width: min(260px, calc(50vw - 28px));
  min-height: 42px;
  border-radius: 999px;
  color: #171a20;
  background: rgba(255, 255, 255, .78);
  font-size: .86rem;
  font-weight: 900;
  backdrop-filter: blur(14px);
  pointer-events: none;
}

#dashboard.page:not(.hidden)::before {
  content: "Rentas SLP";
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.52)),
    url("https://images.unsplash.com/photo-1600607688969-a5bfcd646154?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#payments.page:not(.hidden)::before {
  content: "Cobranza";
  color: #ffffff;
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.28), transparent 0 13%, transparent 14%),
    linear-gradient(180deg, rgba(8, 47, 35, .08), rgba(8, 47, 35, .62)),
    linear-gradient(135deg, #0f766e, #064e3b);
}

#payments.page:not(.hidden)::after {
  content: "Registrar pago";
}

#payments.page:not(.hidden) > .grid:first-child::before {
  content: "Historial";
}

#payments.page:not(.hidden)::before {
  text-shadow: 0 14px 42px rgba(0,0,0,.26);
}

#properties.page:not(.hidden)::before {
  content: "Inmuebles";
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.46)),
    url("https://images.unsplash.com/photo-1600566753190-17f0baa2a6c3?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#rooms.page:not(.hidden)::before {
  content: "Habitaciones";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.52)),
    url("https://images.unsplash.com/photo-1618221195710-dd6b41faaea6?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#tenants.page:not(.hidden)::before {
  content: "Inquilinos";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#documents.page:not(.hidden)::before {
  content: "Contratos";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#calendar.page:not(.hidden)::before {
  content: "Calendario";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1506784365847-bbad939e9335?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#expenses.page:not(.hidden)::before {
  content: "Gastos";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#reports.page:not(.hidden)::before {
  content: "Reportes";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=2200&q=85") center / cover;
}

#settings.page:not(.hidden)::before {
  content: "Ajustes";
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.56)),
    url("https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=2200&q=85") center / cover;
}

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
:root[data-theme="dark"] .card,
.item,
:root[data-theme="dark"] .item,
.property-selector-card,
.property-tile,
.calendar-day,
.room-photo-card,
.tenant-qr-card {
  border: 0;
  border-radius: 12px;
  color: #171a20;
  background: #f4f4f4;
  box-shadow: none;
  backdrop-filter: none;
}

.dashboard-hero,
.property-room-hero {
  color: #171a20;
  background: #f4f4f4;
  box-shadow: none;
}

.dashboard-hero h2,
.dashboard-hero p,
.property-room-hero h2,
.property-room-hero p,
.dashboard-hero .app-kicker,
.property-room-hero .app-kicker {
  color: #171a20;
}

button,
.button-link {
  border-radius: 999px;
}

button.secondary,
nav button,
.view-link,
.file-button {
  background: rgba(255, 255, 255, .72);
}

#payments.page:not(.hidden)::before::after {
  content: none;
}

@media (max-width: 900px) {
  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    top: 58px;
    left: 0;
    right: 0;
    max-width: none;
    padding: 0 10px 8px;
    transform: none;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  .public-catalog-header {
    min-height: 56px;
    padding: 9px 12px;
  }

  .header-actions {
    gap: 5px;
  }

  .header-actions button {
    padding: 7px 10px;
    font-size: .78rem;
  }

  .brand-lockup {
    min-width: 116px;
  }

  .brand-lockup h1 {
    font-size: .9rem;
    letter-spacing: .1em;
  }

  .page:not(.hidden)::before {
    padding-top: 19vh;
  }
}

@media (max-width: 560px) {
  .page,
  #tenant-portal {
    padding: 0 10px 26px;
  }

  .page:not(.hidden)::before {
    font-size: clamp(2.2rem, 12vw, 4rem);
  }

  .page:not(.hidden)::after,
  .page > .grid:first-child::before,
  .page > .card:first-child::before,
  .page > section:first-child::before {
    top: calc(100svh - 112px);
    width: calc(50vw - 18px);
    min-height: 39px;
    font-size: .78rem;
  }
}

/* Pulido final de barra Tesla-like. */
.brand-lockup h1::before {
  content: none;
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar {
  top: 8px;
  max-width: none;
  overflow: visible;
  scrollbar-width: none;
}

#tabs.tabbar::-webkit-scrollbar {
  display: none;
}

#tabs button,
:root[data-theme="dark"] #tabs button {
  padding: 9px 10px;
  font-size: .82rem;
}

.page:not(.hidden)::after {
  top: calc(100svh - 96px);
}

.page > .grid:first-child::before,
.page > .card:first-child::before,
.page > section:first-child::before {
  top: calc(100svh - 96px);
}

@media (max-width: 1100px) {
  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    top: 56px;
    left: 8px;
    right: 8px;
    max-width: none;
    overflow-x: auto;
    transform: none;
  }
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar {
  justify-content: center !important;
  overflow: visible !important;
  background: transparent !important;
}

#tabs.tabbar::-webkit-scrollbar,
:root:not([data-theme="dark"]) #tabs.tabbar::-webkit-scrollbar,
:root[data-theme="dark"] #tabs.tabbar::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

#tabs button,
:root:not([data-theme="dark"]) #tabs button,
:root[data-theme="dark"] #tabs button {
  color: #171a20 !important;
  text-shadow: none;
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar {
  top: 10px !important;
  left: 50% !important;
  right: auto !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  max-width: calc(100vw - 430px) !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .46) !important;
  backdrop-filter: blur(16px) !important;
  transform: translateX(-50%) !important;
}

#tabs button,
:root:not([data-theme="dark"]) #tabs button,
:root[data-theme="dark"] #tabs button {
  width: auto !important;
  flex: 0 0 auto !important;
  min-height: 28px !important;
  padding: 6px 8px !important;
  font-size: .76rem !important;
  white-space: nowrap !important;
}

#tabs button.active,
:root:not([data-theme="dark"]) #tabs button.active,
:root[data-theme="dark"] #tabs button.active {
  background: rgba(255, 255, 255, .78) !important;
}

@media (max-width: 980px) {
  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    top: 56px !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    transform: none !important;
  }
}

/* Inspirado en Budget Finance Tracker: app financiera limpia y amigable. */
:root {
  --budget-bg: #e8e1df;
  --budget-ink: #121212;
  --budget-muted: #77767b;
  --budget-card: #ffffff;
  --budget-soft: #f5f4f2;
  --budget-line: #e7e3df;
  --budget-lilac: #cfc3ff;
  --budget-mint: #bfead3;
  --budget-rose: #e9c5c9;
  --budget-dark: #101010;
  --budget-shadow: 0 26px 80px rgba(31, 30, 28, .14);
}

body,
:root:not([data-theme="dark"]) body,
:root[data-theme="dark"] body {
  min-height: 100vh;
  color: var(--budget-ink);
  background:
    radial-gradient(circle at 16% 16%, rgba(207, 195, 255, .58), transparent 0 28%, transparent 42%),
    radial-gradient(circle at 82% 10%, rgba(191, 234, 211, .7), transparent 0 24%, transparent 40%),
    radial-gradient(circle at 72% 82%, rgba(233, 197, 201, .62), transparent 0 28%, transparent 44%),
    linear-gradient(135deg, #eee9e5 0%, #f8f4ee 48%, #e0ece7 100%);
  background-attachment: fixed;
}

main.app-shell,
main.tenant-shell,
.public-catalog-shell {
  display: grid;
  grid-template-columns: 1fr;
  width: min(100%, 1220px);
  max-width: 1220px;
  min-height: auto;
  margin: 32px auto;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 28px;
  background: rgba(249, 249, 250, .86);
  box-shadow: var(--budget-shadow);
  backdrop-filter: blur(20px);
}

#app > .app-header,
#tenant-app > .app-header,
.public-catalog-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root:not([data-theme="dark"]) #tenant-app > .app-header,
:root:not([data-theme="dark"]) .public-catalog-header,
:root[data-theme="dark"] #app > .app-header,
:root[data-theme="dark"] #tenant-app > .app-header,
:root[data-theme="dark"] .public-catalog-header {
  position: relative;
  inset: auto;
  z-index: 2;
  display: flex;
  min-height: 150px;
  margin: 0;
  padding: 24px;
  border: 0;
  border-radius: 22px;
  color: #ffffff;
  background:
    radial-gradient(circle at 86% 22%, rgba(207, 195, 255, .22), transparent 0 28%, transparent 48%),
    linear-gradient(135deg, #111111, #22201f);
  box-shadow: none;
}

.brand-lockup {
  min-width: 0;
}

.brand-mark {
  display: grid;
  border-radius: 14px;
  color: #111111;
  background: #ffffff;
}

.brand-mark::before {
  color: #111111;
}

.brand-mark::after {
  display: none;
}

.brand-lockup h1,
:root[data-theme="dark"] .brand-lockup h1 {
  color: #ffffff;
  font-size: clamp(1.8rem, 4vw, 3.15rem);
  letter-spacing: 0;
  text-transform: none;
}

.brand-lockup h1::before {
  content: none;
}

.brand-lockup small,
.app-kicker {
  display: block;
  color: rgba(255, 255, 255, .68);
}

.header-actions {
  align-items: start;
}

.header-actions button,
.header-actions .view-link,
.header-actions .button-link {
  min-height: 38px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  color: #ffffff;
  background: rgba(255, 255, 255, .08);
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar,
.tenant-panel-nav,
:root[data-theme="dark"] .tenant-panel-nav {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 3;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  width: auto !important;
  max-width: none !important;
  gap: 7px;
  margin: -24px 22px 22px;
  padding: 9px;
  border: 1px solid rgba(18, 18, 18, .06);
  border-radius: 18px;
  background: rgba(255, 255, 255, .88) !important;
  box-shadow: 0 18px 44px rgba(22, 20, 18, .1);
  transform: none !important;
  backdrop-filter: blur(18px);
}

#tabs button,
:root:not([data-theme="dark"]) #tabs button,
:root[data-theme="dark"] #tabs button,
.tenant-panel-nav button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-height: 36px !important;
  flex: 0 0 auto !important;
  border: 0;
  border-radius: 13px;
  padding: 9px 12px !important;
  color: #4a484b !important;
  background: transparent;
  font-size: .84rem !important;
}

#tabs button.active,
:root:not([data-theme="dark"]) #tabs button.active,
:root[data-theme="dark"] #tabs button.active,
.tenant-panel-nav button.active {
  color: #111111 !important;
  background: #f0eef7 !important;
}

#tabs button::before,
.tenant-panel-nav button::before {
  display: none !important;
}

.page,
#tenant-portal,
#public-catalog-content {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 8px 8px;
}

.page:not(.hidden)::before,
.page:not(.hidden)::after,
.page > .grid:first-child::before,
.page > .card:first-child::before,
.page > section:first-child::before {
  display: none !important;
  content: none !important;
}

.dashboard-hero,
.property-room-hero,
.public-catalog-hero {
  border: 0;
  border-radius: 24px;
  color: var(--budget-ink);
  background:
    radial-gradient(circle at 84% 20%, rgba(207, 195, 255, .72), transparent 0 22%, transparent 42%),
    linear-gradient(135deg, #ffffff, #f3f1ed);
  box-shadow: none;
}

.dashboard-hero h2,
.dashboard-hero p,
.property-room-hero h2,
.property-room-hero p,
.public-catalog-hero h2,
.public-catalog-hero p,
.dashboard-hero .app-kicker,
.property-room-hero .app-kicker,
.public-catalog-hero .login-kicker {
  color: var(--budget-ink);
}

.dashboard-hero .app-kicker,
.property-room-hero .app-kicker,
.public-catalog-hero .login-kicker {
  width: fit-content;
  border: 0;
  background: var(--budget-lilac);
}

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
:root[data-theme="dark"] .card,
.item,
:root[data-theme="dark"] .item,
.property-selector-card,
.property-tile,
.calendar-day,
.room-photo-card,
.tenant-qr-card {
  border: 1px solid var(--budget-line);
  border-radius: 22px;
  color: var(--budget-ink);
  background: rgba(255, 255, 255, .92);
  box-shadow: none;
}

.card::after,
.page .card::after,
.stat::after,
.signal-card::after {
  color: rgba(18, 18, 18, .045);
}

.stats,
.signal-grid,
.property-board,
.public-room-grid {
  gap: 14px;
}

.stat {
  min-height: 130px;
  background:
    linear-gradient(135deg, #ffffff, #f8f7f5);
}

.stat strong {
  font-size: clamp(1.8rem, 3vw, 2.65rem);
}

.signal-card.attention,
.badge.pending {
  background: #f6e7ea;
}

.badge {
  color: #243b31;
  background: var(--budget-mint);
}

.badge.pending {
  color: #63303a;
}

button,
.button-link {
  border-radius: 14px;
  color: #ffffff;
  background: var(--budget-dark);
}

button.secondary,
nav button,
.view-link,
.file-button {
  color: var(--budget-ink);
  background: #efeeec;
}

input,
select,
textarea,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea {
  border-color: var(--budget-line);
  border-radius: 14px;
  background: #ffffff;
}

.progress-line {
  background: #ece8e2;
}

.progress-line span {
  background: linear-gradient(90deg, #111111, #8d7af8);
}

.public-location-card.active,
:root[data-theme="dark"] .public-location-card.active {
  color: #111111;
  background: var(--budget-lilac);
  border-color: transparent;
}

:root[data-theme="dark"] body {
  color-scheme: light;
}

@media (max-width: 760px) {
  main.app-shell,
  main.tenant-shell,
  .public-catalog-shell {
    margin: 10px;
    padding: 10px;
    border-radius: 22px;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  .public-catalog-header {
    display: grid;
    min-height: auto;
    border-radius: 18px;
    padding: 18px;
  }

  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    margin: -12px 10px 16px;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
  }
}

/* Correccion de layout y contraste para la referencia Budget Tracker. */
main.app-shell,
main.tenant-shell {
  grid-template-columns: 350px minmax(0, 1fr) !important;
  gap: 18px;
  align-items: start;
}

#app > .app-header,
#tenant-app > .app-header {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid;
  align-content: space-between;
  min-height: 260px;
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar,
.tenant-panel-nav {
  grid-column: 1 !important;
  grid-row: 2 !important;
  margin: -10px 24px 0 !important;
  width: auto !important;
}

#app > .page,
#tenant-portal {
  grid-column: 2 !important;
  grid-row: 1 / span 16 !important;
  min-width: 0;
}

#app > .app-header .brand-lockup {
  align-items: start;
}

#app > .app-header .brand-lockup h1 {
  max-width: 220px;
  line-height: .95;
}

#app > .app-header .header-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  margin-top: 12px;
}

#app > .app-header .header-actions #logout,
#tenant-app > .app-header .header-actions #tenant-logout {
  grid-column: 1 / -1;
}

#tabs button,
:root:not([data-theme="dark"]) #tabs button,
:root[data-theme="dark"] #tabs button {
  color: #3f3d41 !important;
}

h1, h2, h3,
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
.item strong,
.stat strong,
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong,
.property-selector-main strong,
.property-money strong,
.property-room-stats strong,
.report-mini-stats strong,
.report-facts strong {
  color: #121212 !important;
}

small,
.meta,
label,
:root[data-theme="dark"] small,
:root[data-theme="dark"] .meta,
:root[data-theme="dark"] label {
  color: #747176 !important;
}

.card,
:root[data-theme="dark"] .card,
.item,
:root[data-theme="dark"] .item,
.stat,
:root[data-theme="dark"] .stat,
.property-tile,
:root[data-theme="dark"] .property-tile,
.calendar-day,
:root[data-theme="dark"] .calendar-day {
  color: #121212 !important;
  background: rgba(255, 255, 255, .94) !important;
}

.dashboard-hero,
.property-room-hero,
:root[data-theme="dark"] .dashboard-hero,
:root[data-theme="dark"] .property-room-hero {
  color: #121212 !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(207, 195, 255, .72), transparent 0 25%, transparent 42%),
    linear-gradient(135deg, #ffffff, #f6f3ef) !important;
}

.dashboard-hero h2,
.dashboard-hero p,
.property-room-hero h2,
.property-room-hero p,
:root[data-theme="dark"] .dashboard-hero h2,
:root[data-theme="dark"] .dashboard-hero p,
:root[data-theme="dark"] .property-room-hero h2,
:root[data-theme="dark"] .property-room-hero p {
  color: #121212 !important;
}

.dashboard-hero .next-action,
.signal-card.attention,
.property-tile.active {
  background: #101010 !important;
  color: #ffffff !important;
}

.dashboard-hero .next-action strong,
.dashboard-hero .next-action p,
.signal-card.attention strong,
.signal-card.attention .meta,
.property-tile.active strong,
.property-tile.active .meta,
.property-tile.active small {
  color: #ffffff !important;
}

.property-tile:not(.active) {
  background: rgba(255,255,255,.94) !important;
}

.property-money span,
.report-mini-stats span,
.report-facts span,
.property-room-stats span {
  color: #121212 !important;
  background: #f3f1ed !important;
}

.property-money span strong,
.report-mini-stats span strong,
.report-facts span strong,
.property-room-stats span strong {
  color: #121212 !important;
}

.property-tile.active,
.dashboard-hero .next-action,
.signal-card.attention {
  background: #101010 !important;
  border-color: #101010 !important;
}

.property-tile.active *,
.dashboard-hero .next-action *,
.signal-card.attention * {
  color: #ffffff !important;
}

.property-tile.active .property-money span,
.signal-card.attention .property-money span {
  background: rgba(255, 255, 255, .12) !important;
}

@media (max-width: 920px) {
  main.app-shell,
  main.tenant-shell {
    grid-template-columns: 1fr !important;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  #tabs.tabbar,
  #app > .page,
  #tenant-portal {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* ENTREGA FINAL: dashboard premium, estable y legible. */
:root {
  --final-bg: #f3eee8;
  --final-shell: #fbfaf8;
  --final-card: #ffffff;
  --final-ink: #181817;
  --final-muted: #74716b;
  --final-line: #e4ded6;
  --final-dark: #171717;
  --final-green: #0f6b57;
  --final-purple: #7b61ff;
  --final-amber: #c7902f;
  --final-red: #b94a48;
  --final-radius: 18px;
  --final-shadow: 0 30px 90px rgba(32, 27, 21, .14);
}

html {
  background: var(--final-bg);
}

body,
:root:not([data-theme="dark"]) body,
:root[data-theme="dark"] body {
  min-height: 100vh;
  color: var(--final-ink) !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(123, 97, 255, .18), transparent 0 24%, transparent 42%),
    radial-gradient(circle at 90% 18%, rgba(15, 107, 87, .16), transparent 0 20%, transparent 40%),
    linear-gradient(135deg, #f6f0e9 0%, #faf8f4 45%, #eef5ef 100%) !important;
  background-attachment: fixed;
}

main.app-shell,
main.tenant-shell,
.public-catalog-shell {
  display: grid !important;
  grid-template-columns: 320px minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(100% - 32px, 1320px) !important;
  max-width: 1320px !important;
  margin: 24px auto !important;
  padding: 16px !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  border-radius: 28px !important;
  background: rgba(251, 250, 248, .9) !important;
  box-shadow: var(--final-shadow) !important;
  backdrop-filter: blur(18px);
}

#app > .app-header,
#tenant-app > .app-header,
.public-catalog-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root:not([data-theme="dark"]) #tenant-app > .app-header,
:root:not([data-theme="dark"]) .public-catalog-header,
:root[data-theme="dark"] #app > .app-header,
:root[data-theme="dark"] #tenant-app > .app-header,
:root[data-theme="dark"] .public-catalog-header {
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 18px !important;
  display: grid !important;
  align-content: start !important;
  gap: 18px !important;
  min-height: 260px !important;
  margin: 0 !important;
  padding: 22px !important;
  border: 0 !important;
  border-radius: 24px !important;
  color: #ffffff !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(123, 97, 255, .28), transparent 0 26%, transparent 52%),
    linear-gradient(145deg, #111111 0%, #24211f 100%) !important;
  box-shadow: none !important;
}

.brand-lockup,
#app > .app-header .brand-lockup,
#tenant-app > .app-header .brand-lockup {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.brand-mark,
:root[data-theme="dark"] .brand-mark {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 16px !important;
  color: #171717 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 0 !important;
}

.brand-mark::before {
  content: "RS" !important;
  color: #171717 !important;
  font-size: .9rem !important;
  font-weight: 950 !important;
  letter-spacing: .06em !important;
}

.brand-mark::after {
  display: none !important;
}

.brand-lockup h1,
:root[data-theme="dark"] .brand-lockup h1,
#app > .app-header .brand-lockup h1 {
  max-width: none !important;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(1.75rem, 3vw, 2.45rem) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.brand-lockup h1::before {
  content: none !important;
}

.brand-lockup small,
.app-header .app-kicker,
:root[data-theme="dark"] .app-header .app-kicker {
  display: block !important;
  color: rgba(255, 255, 255, .66) !important;
}

.app-header .app-kicker {
  margin-bottom: 5px !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-size: .72rem !important;
  letter-spacing: .12em !important;
}

.header-actions,
#app > .app-header .header-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 9px !important;
  width: 100% !important;
  margin-top: 4px !important;
}

.header-actions button,
.header-actions .view-link,
.header-actions .button-link,
:root[data-theme="dark"] .header-actions button {
  width: 100% !important;
  min-height: 42px !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 14px !important;
  color: #ffffff !important;
  background: rgba(255, 255, 255, .1) !important;
  box-shadow: none !important;
}

#logout,
#tenant-logout {
  grid-column: 1 / -1 !important;
}

#tabs.tabbar,
:root:not([data-theme="dark"]) #tabs.tabbar,
:root[data-theme="dark"] #tabs.tabbar,
.tenant-panel-nav,
:root[data-theme="dark"] .tenant-panel-nav {
  grid-column: 1 !important;
  grid-row: 2 !important;
  position: sticky !important;
  top: 300px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--final-line) !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, .86) !important;
  box-shadow: 0 18px 46px rgba(32, 27, 21, .08) !important;
  transform: none !important;
  backdrop-filter: blur(14px);
}

#tabs button,
:root:not([data-theme="dark"]) #tabs button,
:root[data-theme="dark"] #tabs button,
.tenant-panel-nav button {
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) !important;
  align-items: center !important;
  justify-content: start !important;
  gap: 7px !important;
  width: 100% !important;
  min-height: 43px !important;
  border: 0 !important;
  border-radius: 15px !important;
  padding: 8px 9px !important;
  color: #48443f !important;
  background: transparent !important;
  font-size: .86rem !important;
  font-weight: 850 !important;
  text-align: left !important;
}

#tabs button::before,
.tenant-panel-nav button::before {
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  background: #222222 !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
}

#tabs button[data-page="dashboard"]::before { content: "I" !important; background: #222222 !important; }
#tabs button[data-page="payments"]::before { content: "$" !important; background: var(--final-green) !important; }
#tabs button[data-page="properties"]::before { content: "P" !important; background: #4568d4 !important; }
#tabs button[data-page="rooms"]::before { content: "R" !important; background: var(--final-purple) !important; }
#tabs button[data-page="tenants"]::before { content: "T" !important; background: #0a7c79 !important; }
#tabs button[data-page="documents"]::before { content: "D" !important; background: var(--final-amber) !important; }
#tabs button[data-page="calendar"]::before { content: "C" !important; background: var(--final-red) !important; }
#tabs button[data-page="expenses"]::before { content: "-" !important; background: #9d3154 !important; }
#tabs button[data-page="reports"]::before { content: "%" !important; background: #3d4654 !important; }
#tabs button[data-page="settings"]::before { content: "*" !important; background: #6f6b72 !important; }

#tabs button.active,
:root:not([data-theme="dark"]) #tabs button.active,
:root[data-theme="dark"] #tabs button.active,
.tenant-panel-nav button.active {
  color: #171717 !important;
  background: #f2eee8 !important;
}

#app > .page,
#tenant-portal,
#public-catalog-content {
  grid-column: 2 !important;
  grid-row: 1 / span 16 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.page:not(.hidden)::before,
.page:not(.hidden)::after,
.page > .grid:first-child::before,
.page > .card:first-child::before,
.page > section:first-child::before {
  display: none !important;
  content: none !important;
}

.grid {
  gap: 16px !important;
}

.card,
:root:not([data-theme="dark"]) .card:not(.dashboard-hero):not(.property-room-hero),
:root[data-theme="dark"] .card,
.item,
:root[data-theme="dark"] .item,
.property-tile,
:root[data-theme="dark"] .property-tile,
.calendar-day,
:root[data-theme="dark"] .calendar-day,
.property-selector-card,
.room-photo-card,
.tenant-qr-card,
.public-location-card,
.public-map-card,
.public-room-card {
  border: 1px solid var(--final-line) !important;
  border-radius: var(--final-radius) !important;
  color: var(--final-ink) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: none !important;
  overflow: hidden;
}

h1, h2, h3,
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
.item strong,
.stat strong,
:root[data-theme="dark"] .item strong,
:root[data-theme="dark"] .stat strong,
.property-selector-main strong,
.property-money strong,
.property-room-stats strong,
.report-mini-stats strong,
.report-facts strong {
  color: var(--final-ink) !important;
}

small,
.meta,
label,
:root[data-theme="dark"] small,
:root[data-theme="dark"] .meta,
:root[data-theme="dark"] label {
  color: var(--final-muted) !important;
}

.dashboard-hero,
.property-room-hero,
.public-catalog-hero,
:root[data-theme="dark"] .dashboard-hero,
:root[data-theme="dark"] .property-room-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(240px, .42fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
  border: 1px solid var(--final-line) !important;
  border-radius: 22px !important;
  padding: 22px !important;
  color: var(--final-ink) !important;
  background:
    radial-gradient(circle at 86% 18%, rgba(123, 97, 255, .22), transparent 0 24%, transparent 42%),
    linear-gradient(135deg, #ffffff, #f7f3ee) !important;
  box-shadow: none !important;
}

.dashboard-hero h2,
.property-room-hero h2,
.public-catalog-hero h2 {
  color: var(--final-ink) !important;
  font-size: clamp(2rem, 4vw, 3.4rem) !important;
  line-height: .98 !important;
  letter-spacing: 0 !important;
}

.dashboard-hero p,
.property-room-hero p,
.public-catalog-hero p {
  color: #504c48 !important;
}

.dashboard-hero .app-kicker,
.property-room-hero .app-kicker,
.public-catalog-hero .login-kicker {
  width: fit-content !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 7px 10px !important;
  color: #342a66 !important;
  background: #ded6ff !important;
}

.next-action,
.dashboard-hero .next-action,
.signal-card.attention,
.property-tile.active {
  border: 0 !important;
  color: #ffffff !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(123, 97, 255, .28), transparent 0 28%, transparent 48%),
    #171717 !important;
}

.next-action *,
.dashboard-hero .next-action *,
.signal-card.attention *,
.property-tile.active * {
  color: #ffffff !important;
}

.dashboard-hero .next-action p,
.dashboard-hero .next-action .meta,
.dashboard-hero .next-action small,
.next-action p,
.next-action .meta,
.next-action small {
  color: rgba(255, 255, 255, .78) !important;
}

.signal-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.signal-card {
  min-height: 142px !important;
}

.stats {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.stat {
  min-height: 128px !important;
  padding: 18px !important;
  background: #ffffff !important;
}

details,
.collapsible-form,
.dashboard-section,
.record-accordion {
  border: 1px solid var(--final-line) !important;
  border-radius: var(--final-radius) !important;
  background: #ffffff !important;
  overflow: hidden;
}

summary,
.collapsible-form > summary,
.dashboard-section > summary,
.record-accordion > summary {
  color: var(--final-ink) !important;
  background: transparent !important;
  font-weight: 900 !important;
}

.collapsible-form > summary::after,
.dashboard-section > summary::after {
  color: #ffffff !important;
  background: var(--final-dark) !important;
}

.collapsible-form[open] > summary,
.dashboard-section[open] > summary {
  border-bottom-color: var(--final-line) !important;
}

.stat strong {
  display: block !important;
  margin-top: 10px !important;
  color: var(--final-ink) !important;
  font-size: clamp(1.85rem, 2.8vw, 2.25rem) !important;
  line-height: 1.02 !important;
  overflow-wrap: anywhere !important;
}

.progress-line {
  height: 9px !important;
  background: #ebe5dc !important;
}

.progress-line span {
  background: linear-gradient(90deg, #111111, var(--final-purple)) !important;
}

.property-money span,
.report-mini-stats span,
.report-facts span,
.property-room-stats span,
.public-catalog-stats span {
  border: 0 !important;
  border-radius: 14px !important;
  color: var(--final-ink) !important;
  background: #f4f0eb !important;
}

.property-money span strong,
.report-mini-stats span strong,
.report-facts span strong,
.property-room-stats span strong,
.public-catalog-stats span strong {
  color: var(--final-ink) !important;
}

.room-price-status > span:first-child,
.room-price-status strong {
  color: var(--final-ink) !important;
}

.badge {
  border-radius: 999px !important;
  color: #143e32 !important;
  background: #d8f2e6 !important;
}

.badge.pending {
  color: #703537 !important;
  background: #f4dddd !important;
}

button,
.button-link {
  border-radius: 14px !important;
  color: #ffffff !important;
  background: var(--final-dark) !important;
  box-shadow: none !important;
}

button.secondary,
nav button,
.view-link,
.file-button {
  color: var(--final-ink) !important;
  background: #f0ece6 !important;
}

input,
select,
textarea,
:root:not([data-theme="dark"]) input,
:root:not([data-theme="dark"]) select,
:root:not([data-theme="dark"]) textarea,
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
  border: 1px solid var(--final-line) !important;
  border-radius: 13px !important;
  color: var(--final-ink) !important;
  background: #ffffff !important;
}

.login-screen,
:root:not([data-theme="dark"]) .login-screen,
:root[data-theme="dark"] .login-screen {
  background:
    radial-gradient(circle at 10% 12%, rgba(123, 97, 255, .18), transparent 0 28%, transparent 42%),
    linear-gradient(135deg, #f6f0e9, #eef5ef) !important;
}

.login-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(123, 97, 255, .22), transparent 0 30%, transparent 52%),
    #171717 !important;
}

@media (max-width: 1120px) {
  main.app-shell,
  main.tenant-shell,
  .public-catalog-shell {
    grid-template-columns: 1fr !important;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  .public-catalog-header,
  #tabs.tabbar,
  #app > .page,
  #tenant-portal,
  #public-catalog-content {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
  }

  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  main.app-shell,
  main.tenant-shell,
  .public-catalog-shell {
    width: calc(100% - 16px) !important;
    margin: 8px auto !important;
    padding: 10px !important;
    border-radius: 22px !important;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  .public-catalog-header,
  .dashboard-hero,
  .property-room-hero,
  .public-catalog-hero {
    grid-template-columns: 1fr !important;
  }

  #tabs.tabbar,
  :root:not([data-theme="dark"]) #tabs.tabbar,
  :root[data-theme="dark"] #tabs.tabbar {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    padding-bottom: 10px !important;
  }

  #tabs button {
    flex: 0 0 132px !important;
  }

  .signal-grid,
  .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .stat strong {
    font-size: 1.85rem !important;
  }
}

.hidden,
#login.hidden,
#app.hidden,
#tenant-app.hidden,
#public-catalog.hidden {
  display: none !important;
}

.dashboard-hero .next-action,
.dashboard-hero .next-action * {
  color: #ffffff !important;
}

.dashboard-hero .next-action p,
.dashboard-hero .next-action small {
  color: rgba(255, 255, 255, .78) !important;
}

.dashboard-hero .next-action {
  border: 1px solid var(--final-line) !important;
  color: var(--final-ink) !important;
  background: #ffffff !important;
}

.dashboard-hero .next-action *,
.dashboard-hero .next-action p,
.dashboard-hero .next-action small,
.dashboard-hero .next-action strong {
  color: var(--final-ink) !important;
}

.dashboard-hero .next-action small,
.dashboard-hero .next-action p {
  color: var(--final-muted) !important;
}

/* ENTREGA FINAL: calendario legible y sin eventos comprimidos. */
#calendar .calendar-layout {
  grid-template-columns: minmax(280px, .85fr) minmax(360px, 1.15fr) !important;
  align-items: start !important;
}

#calendar .calendar-month-card {
  grid-column: 1 / -1 !important;
  order: 1 !important;
  overflow-x: auto !important;
}

#calendar .calendar-event-form {
  order: 2 !important;
}

#calendar .calendar-list-card {
  grid-column: auto !important;
  order: 3 !important;
}

#calendar .calendar-grid {
  grid-template-columns: repeat(7, minmax(112px, 1fr)) !important;
  min-width: 820px !important;
  gap: 10px !important;
}

#calendar .calendar-day {
  min-height: 148px !important;
  padding: 10px !important;
  border-radius: 18px !important;
}

#calendar .calendar-event {
  min-height: 54px !important;
  padding: 8px 9px !important;
  border-radius: 12px !important;
  font-size: .76rem !important;
  line-height: 1.15 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

#calendar .calendar-event small {
  display: -webkit-box !important;
  margin-top: 4px !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.property-room-stats span,
.public-catalog-stats span,
.report-mini-stats span,
.report-facts span {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 760px) {
  #calendar .calendar-layout {
    grid-template-columns: 1fr !important;
  }

  #calendar .calendar-month-card,
  #calendar .calendar-list-card,
  #calendar .calendar-event-form {
    grid-column: 1 !important;
  }

  #calendar .calendar-grid {
    grid-template-columns: 1fr !important;
    min-width: 0 !important;
  }

  #calendar .calendar-weekday,
  #calendar .calendar-day.muted {
    display: none !important;
  }
}

#calendar .calendar-event.due {
  color: #6d3033 !important;
  background: #f6dddd !important;
}

#calendar .calendar-event.paid {
  color: #173f31 !important;
  background: #dff3e8 !important;
}

#calendar .calendar-event.contract {
  color: #183d5a !important;
  background: #e0eef8 !important;
}

#calendar .calendar-event.custom {
  color: #3e2e74 !important;
  background: #e9e3ff !important;
}

#calendar .calendar-event.expense {
  color: #6f4e18 !important;
  background: #fff0cc !important;
}

#calendar .calendar-event small {
  color: inherit !important;
  opacity: .76 !important;
}

/* ENTREGA FINAL: panel lateral con subpaneles de acceso rapido. */
#side-panel,
:root:not([data-theme="dark"]) #side-panel,
:root[data-theme="dark"] #side-panel {
  grid-column: 1 !important;
  grid-row: 3 / span 12 !important;
  display: grid !important;
  gap: 10px !important;
  align-self: start !important;
  min-width: 0 !important;
}

.side-card,
:root:not([data-theme="dark"]) .side-card,
:root[data-theme="dark"] .side-card {
  display: grid !important;
  gap: 10px !important;
  padding: 14px !important;
  border: 1px solid var(--final-line) !important;
  border-radius: 22px !important;
  color: var(--final-ink) !important;
  background: rgba(255, 255, 255, .88) !important;
  box-shadow: 0 14px 34px rgba(32, 27, 21, .07) !important;
  backdrop-filter: blur(14px);
}

:root[data-theme="dark"] .side-card {
  color: #f3f4f6 !important;
  background: rgba(24, 24, 27, .9) !important;
  border-color: rgba(255, 255, 255, .12) !important;
}

.side-kicker {
  color: var(--final-muted) !important;
  font-size: .7rem !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.side-card > strong {
  color: inherit !important;
  font-size: 1.05rem !important;
}

.side-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

.side-stats span {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 9px 7px !important;
  border-radius: 14px !important;
  background: #f3f0eb !important;
}

:root[data-theme="dark"] .side-stats span {
  background: rgba(255, 255, 255, .08) !important;
}

.side-stats small {
  overflow: hidden !important;
  color: var(--final-muted) !important;
  font-size: .68rem !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.side-stats b {
  color: inherit !important;
  font-size: 1.05rem !important;
}

.side-nav-groups {
  display: grid !important;
  gap: 10px !important;
}

.side-nav-group {
  display: grid !important;
  gap: 6px !important;
}

.side-nav-group small {
  color: var(--final-muted) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
}

.side-nav-group button,
.side-action,
:root:not([data-theme="dark"]) .side-nav-group button,
:root:not([data-theme="dark"]) .side-action,
:root[data-theme="dark"] .side-nav-group button,
:root[data-theme="dark"] .side-action {
  width: 100% !important;
  min-height: 40px !important;
  justify-content: start !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  padding: 9px 11px !important;
  color: var(--final-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .84rem !important;
  font-weight: 850 !important;
  text-align: left !important;
}

:root[data-theme="dark"] .side-nav-group button,
:root[data-theme="dark"] .side-action {
  color: #f3f4f6 !important;
}

.side-nav-group button.active,
.side-action:hover,
.side-nav-group button:hover {
  border-color: var(--final-line) !important;
  background: #f3f0eb !important;
}

:root[data-theme="dark"] .side-nav-group button.active,
:root[data-theme="dark"] .side-action:hover,
:root[data-theme="dark"] .side-nav-group button:hover {
  background: rgba(255, 255, 255, .09) !important;
  border-color: rgba(255, 255, 255, .13) !important;
}

.side-subpanel {
  border-color: rgba(15, 107, 87, .22) !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(15, 107, 87, .14), transparent 0 36%, transparent 58%),
    rgba(255, 255, 255, .92) !important;
}

:root[data-theme="dark"] .side-subpanel {
  background:
    radial-gradient(circle at 88% 0%, rgba(15, 107, 87, .22), transparent 0 36%, transparent 58%),
    rgba(24, 24, 27, .92) !important;
}

.side-actions {
  display: grid !important;
  gap: 7px !important;
}

.side-action {
  background: #f7f4ef !important;
}

:root[data-theme="dark"] .side-action {
  background: rgba(255, 255, 255, .07) !important;
}

@media (max-width: 1120px) {
  #side-panel,
  :root:not([data-theme="dark"]) #side-panel,
  :root[data-theme="dark"] #side-panel {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  #side-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #side-panel {
    grid-template-columns: 1fr !important;
  }

  .side-nav-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .side-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 460px) {
  .side-nav-groups,
  .side-actions,
  .side-stats {
    grid-template-columns: 1fr !important;
  }
}

/* AJUSTE: un solo sistema de navegacion, sin tabs duplicados ni empalmes. */
#app #tabs.tabbar,
:root:not([data-theme="dark"]) #app #tabs.tabbar,
:root[data-theme="dark"] #app #tabs.tabbar {
  display: none !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  grid-column: 1 !important;
  grid-row: 2 / span 12 !important;
  position: sticky !important;
  top: 300px !important;
  align-self: start !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  max-height: calc(100vh - 318px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

#app #side-panel::-webkit-scrollbar {
  width: 6px !important;
}

#app #side-panel::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(0, 0, 0, .18) !important;
}

#app > .page {
  grid-column: 2 !important;
  grid-row: 1 / span 20 !important;
}

.side-card {
  overflow: hidden !important;
}

.side-nav-groups {
  gap: 8px !important;
}

.side-nav-group {
  padding-top: 8px !important;
  border-top: 1px solid var(--final-line) !important;
}

.side-nav-group:first-child {
  padding-top: 0 !important;
  border-top: 0 !important;
}

.side-subpanel {
  margin-top: 0 !important;
}

@media (max-width: 1120px) {
  #app #side-panel,
  :root:not([data-theme="dark"]) #app #side-panel,
  :root[data-theme="dark"] #app #side-panel {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #app > .page {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* AJUSTE: panel de opciones al lado del panel principal. */
#app.app-shell,
:root:not([data-theme="dark"]) #app.app-shell,
:root[data-theme="dark"] #app.app-shell {
  grid-template-columns: 292px 292px minmax(0, 1fr) !important;
  max-width: 1540px !important;
  align-items: start !important;
}

#app > .app-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root[data-theme="dark"] #app > .app-header {
  grid-column: 1 !important;
  grid-row: 1 / span 30 !important;
  position: sticky !important;
  top: 18px !important;
  align-self: start !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  grid-column: 2 !important;
  grid-row: 1 / span 30 !important;
  position: sticky !important;
  top: 18px !important;
  max-height: calc(100vh - 36px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

#app > .page,
:root:not([data-theme="dark"]) #app > .page,
:root[data-theme="dark"] #app > .page {
  grid-column: 3 !important;
  grid-row: 1 / span 30 !important;
}

.side-help {
  margin: -2px 0 0 !important;
  color: var(--final-muted) !important;
  font-size: .78rem !important;
  line-height: 1.35 !important;
}

.side-subpanel .side-actions {
  margin-top: 2px !important;
}

@media (max-width: 1280px) {
  #app.app-shell,
  :root:not([data-theme="dark"]) #app.app-shell,
  :root[data-theme="dark"] #app.app-shell {
    grid-template-columns: 260px 270px minmax(0, 1fr) !important;
    width: calc(100% - 18px) !important;
  }
}

@media (max-width: 1120px) {
  #app.app-shell,
  :root:not([data-theme="dark"]) #app.app-shell,
  :root[data-theme="dark"] #app.app-shell {
    grid-template-columns: 1fr !important;
  }

  #app > .app-header,
  #app #side-panel,
  #app > .page,
  :root:not([data-theme="dark"]) #app > .app-header,
  :root:not([data-theme="dark"]) #app #side-panel,
  :root:not([data-theme="dark"]) #app > .page,
  :root[data-theme="dark"] #app > .app-header,
  :root[data-theme="dark"] #app #side-panel,
  :root[data-theme="dark"] #app > .page {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #app #side-panel {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }
}

@media (max-width: 700px) {
  #app #side-panel {
    grid-template-columns: 1fr !important;
  }
}

/* AJUSTE: quitar cabecera flotante del arrendador y mover sus acciones a Ajustes. */
#app.app-shell,
:root:not([data-theme="dark"]) #app.app-shell,
:root[data-theme="dark"] #app.app-shell {
  grid-template-columns: 304px minmax(0, 1fr) !important;
  max-width: 1360px !important;
}

#app > .app-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root[data-theme="dark"] #app > .app-header {
  display: none !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  grid-column: 1 !important;
  grid-row: 1 / span 30 !important;
  position: sticky !important;
  top: 18px !important;
  max-height: calc(100vh - 36px) !important;
  overflow: auto !important;
}

#app > .page,
:root:not([data-theme="dark"]) #app > .page,
:root[data-theme="dark"] #app > .page {
  grid-column: 2 !important;
  grid-row: 1 / span 30 !important;
}

.settings-app-card .actions {
  margin-top: 12px !important;
}

.theme-choice-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.theme-choice {
  display: grid;
  gap: 4px;
  min-height: 92px;
  border: 1px solid #dceaff;
  border-radius: 18px;
  padding: 13px;
  color: #1f4f86;
  background: linear-gradient(180deg, #f8fbff, #eef7ff);
  box-shadow: 0 12px 26px rgba(65, 108, 180, .08);
  text-align: left;
}

.theme-choice span {
  color: #6b7f9d;
  font-size: .82rem;
  font-weight: 650;
  line-height: 1.25;
}

.theme-choice.active {
  border-color: #72a9ff;
  color: #0f3f82;
  background: linear-gradient(180deg, #eaf4ff, #ddecff);
  box-shadow: 0 16px 34px rgba(47, 111, 228, .15);
}

@media (max-width: 700px) {
  .theme-choice-group {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1120px) {
  #app.app-shell,
  :root:not([data-theme="dark"]) #app.app-shell,
  :root[data-theme="dark"] #app.app-shell {
    grid-template-columns: 1fr !important;
  }

  #app #side-panel,
  #app > .page,
  :root:not([data-theme="dark"]) #app #side-panel,
  :root:not([data-theme="dark"]) #app > .page,
  :root[data-theme="dark"] #app #side-panel,
  :root[data-theme="dark"] #app > .page {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* COOLADMIN ADAPTADO: shell tipo dashboard para Rentas SLP. */
:root {
  --ca-bg: #f4f6fa;
  --ca-surface: #ffffff;
  --ca-surface-2: #f8fafc;
  --ca-sidebar: #1c2333;
  --ca-sidebar-soft: #28304a;
  --ca-border: #e4e7ec;
  --ca-text: #1f2937;
  --ca-muted: #64748b;
  --ca-accent: #4272d7;
  --ca-accent-soft: #eaf0fc;
  --ca-success: #10b981;
  --ca-warning: #f59e0b;
  --ca-danger: #ef4444;
  --ca-shadow: 0 12px 32px rgba(15, 23, 42, .08);
  --ca-radius: 14px;
}

body,
:root:not([data-theme="dark"]) body {
  color: var(--ca-text) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(66, 114, 215, .09), transparent 0 25%, transparent 42%),
    linear-gradient(180deg, #f8fafc 0%, var(--ca-bg) 100%) !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

:root[data-theme="dark"] body {
  color: #e5e7eb !important;
  background: #0f172a !important;
}

#app.app-shell,
:root:not([data-theme="dark"]) #app.app-shell,
:root[data-theme="dark"] #app.app-shell {
  display: grid !important;
  grid-template-columns: 248px 268px minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(100% - 24px, 1580px) !important;
  max-width: 1580px !important;
  margin: 12px auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#app > .app-header,
:root:not([data-theme="dark"]) #app > .app-header,
:root[data-theme="dark"] #app > .app-header,
#app #tabs.tabbar,
:root:not([data-theme="dark"]) #app #tabs.tabbar,
:root[data-theme="dark"] #app #tabs.tabbar {
  display: none !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  grid-column: 1 / span 2 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 12px !important;
  display: grid !important;
  grid-template-columns: 248px 268px !important;
  gap: 18px !important;
  align-self: start !important;
  max-height: calc(100vh - 24px) !important;
  overflow: visible !important;
  padding: 0 !important;
}

#app > .page,
:root:not([data-theme="dark"]) #app > .page,
:root[data-theme="dark"] #app > .page {
  grid-column: 3 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.side-card,
:root:not([data-theme="dark"]) .side-card,
:root[data-theme="dark"] .side-card {
  border-radius: var(--ca-radius) !important;
  box-shadow: var(--ca-shadow) !important;
}

#app #side-panel .side-card:first-child,
:root:not([data-theme="dark"]) #app #side-panel .side-card:first-child,
:root[data-theme="dark"] #app #side-panel .side-card:first-child {
  min-height: calc(100vh - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  overflow: auto !important;
  padding: 18px !important;
  color: #f1f5f9 !important;
  background: var(--ca-sidebar) !important;
  border: 1px solid rgba(255, 255, 255, .06) !important;
}

.cooladmin-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 18px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
}

.cooladmin-brand > span {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  background: var(--ca-accent) !important;
  font-size: .88rem !important;
  font-weight: 950 !important;
  letter-spacing: .05em !important;
}

.cooladmin-brand strong {
  display: block !important;
  color: #ffffff !important;
  font-size: 1rem !important;
}

.cooladmin-brand small {
  color: #94a3b8 !important;
  font-size: .78rem !important;
}

#app #side-panel .side-card:first-child .side-kicker,
#app #side-panel .side-card:first-child > strong,
#app #side-panel .side-card:first-child .side-nav-group small {
  color: #94a3b8 !important;
}

#app #side-panel .side-card:first-child .side-stats span {
  background: rgba(255, 255, 255, .06) !important;
}

#app #side-panel .side-card:first-child .side-stats b {
  color: #ffffff !important;
}

#app #side-panel .side-card:first-child .side-nav-group {
  border-top-color: rgba(255, 255, 255, .08) !important;
}

#app #side-panel .side-card:first-child .side-nav-group button {
  min-height: 38px !important;
  color: #cbd5e1 !important;
  background: transparent !important;
  border-color: transparent !important;
}

#app #side-panel .side-card:first-child .side-nav-group button:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, .06) !important;
}

#app #side-panel .side-card:first-child .side-nav-group button.active {
  color: #ffffff !important;
  background: rgba(66, 114, 215, .24) !important;
  border-color: rgba(66, 114, 215, .35) !important;
  box-shadow: inset 3px 0 0 var(--ca-accent) !important;
}

#app #side-panel .side-subpanel,
:root:not([data-theme="dark"]) #app #side-panel .side-subpanel,
:root[data-theme="dark"] #app #side-panel .side-subpanel {
  min-height: calc(100vh - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  overflow: auto !important;
  padding: 18px !important;
  color: var(--ca-text) !important;
  background: var(--ca-surface) !important;
  border: 1px solid var(--ca-border) !important;
}

:root[data-theme="dark"] #app #side-panel .side-subpanel {
  color: #e5e7eb !important;
  background: #111827 !important;
  border-color: rgba(255, 255, 255, .08) !important;
}

.side-action,
:root:not([data-theme="dark"]) .side-action,
:root[data-theme="dark"] .side-action {
  border: 1px solid var(--ca-border) !important;
  color: var(--ca-text) !important;
  background: var(--ca-surface-2) !important;
}

.side-action:hover {
  border-color: rgba(66, 114, 215, .35) !important;
  color: var(--ca-accent) !important;
  background: var(--ca-accent-soft) !important;
}

#app .card,
#app .item,
#app details,
#app .property-tile,
#app .property-selector-card,
#app .tenant-file-block,
#app .tenant-profile-card,
#app .tenant-document-panel,
#app .room-photo-card {
  border: 1px solid var(--ca-border) !important;
  border-radius: var(--ca-radius) !important;
  color: var(--ca-text) !important;
  background: var(--ca-surface) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
}

:root[data-theme="dark"] #app .card,
:root[data-theme="dark"] #app .item,
:root[data-theme="dark"] #app details,
:root[data-theme="dark"] #app .property-tile,
:root[data-theme="dark"] #app .property-selector-card,
:root[data-theme="dark"] #app .tenant-file-block,
:root[data-theme="dark"] #app .tenant-profile-card,
:root[data-theme="dark"] #app .tenant-document-panel,
:root[data-theme="dark"] #app .room-photo-card {
  color: #e5e7eb !important;
  background: #111827 !important;
  border-color: rgba(255, 255, 255, .08) !important;
}

#app h1,
#app h2,
#app h3,
#app .item strong,
#app .stat strong {
  color: var(--ca-text) !important;
}

:root[data-theme="dark"] #app h1,
:root[data-theme="dark"] #app h2,
:root[data-theme="dark"] #app h3,
:root[data-theme="dark"] #app .item strong,
:root[data-theme="dark"] #app .stat strong {
  color: #f8fafc !important;
}

#app .meta,
#app small,
#app label {
  color: var(--ca-muted) !important;
}

#app button,
#app .button-link {
  border-radius: 10px !important;
  background: var(--ca-accent) !important;
  box-shadow: none !important;
}

#app button.secondary,
#app .view-link,
#app .file-button,
#app .compact-link {
  border: 1px solid var(--ca-border) !important;
  color: var(--ca-text) !important;
  background: var(--ca-surface-2) !important;
}

#app button.danger {
  color: #ffffff !important;
  background: var(--ca-danger) !important;
}

#app input,
#app select,
#app textarea {
  border: 1px solid var(--ca-border) !important;
  border-radius: 10px !important;
  color: var(--ca-text) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#app input:focus,
#app select:focus,
#app textarea:focus {
  outline: 0 !important;
  border-color: var(--ca-accent) !important;
  box-shadow: 0 0 0 3px rgba(66, 114, 215, .14) !important;
}

#app .badge {
  color: var(--ca-accent) !important;
  background: var(--ca-accent-soft) !important;
}

#app .dashboard-hero,
#app .property-room-hero {
  background:
    radial-gradient(circle at 88% 8%, rgba(66, 114, 215, .14), transparent 0 30%, transparent 56%),
    var(--ca-surface) !important;
}

@media (max-width: 1180px) {
  #app.app-shell,
  :root:not([data-theme="dark"]) #app.app-shell,
  :root[data-theme="dark"] #app.app-shell {
    grid-template-columns: 1fr !important;
    width: calc(100% - 18px) !important;
  }

  #app #side-panel,
  :root:not([data-theme="dark"]) #app #side-panel,
  :root[data-theme="dark"] #app #side-panel,
  #app > .page,
  :root:not([data-theme="dark"]) #app > .page,
  :root[data-theme="dark"] #app > .page {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
  }

  #app #side-panel {
    grid-template-columns: 1fr 1fr !important;
  }

  #app #side-panel .side-card:first-child,
  #app #side-panel .side-subpanel {
    min-height: auto !important;
    max-height: none !important;
  }
}

@media (max-width: 720px) {
  #app #side-panel {
    grid-template-columns: 1fr !important;
  }
}

/* COOLADMIN LITERAL: topbar, perfil y graficas. */
#app #admin-topbar,
:root:not([data-theme="dark"]) #app #admin-topbar,
:root[data-theme="dark"] #app #admin-topbar {
  grid-column: 3 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 12px !important;
  z-index: 6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-width: 0 !important;
  min-height: 64px !important;
  margin: 0 0 18px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: var(--ca-radius) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 6px 20px rgba(15, 23, 42, .06) !important;
  backdrop-filter: blur(14px);
}

:root[data-theme="dark"] #app #admin-topbar {
  background: rgba(17, 24, 39, .94) !important;
  border-color: rgba(255, 255, 255, .08) !important;
}

#app > .page,
:root:not([data-theme="dark"]) #app > .page,
:root[data-theme="dark"] #app > .page {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

.cool-topbar-search {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: min(100%, 430px) !important;
  height: 40px !important;
  padding: 0 10px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 10px !important;
  background: var(--ca-surface-2) !important;
}

.cool-topbar-search span {
  color: var(--ca-muted) !important;
  font-size: 1.05rem !important;
}

.cool-topbar-search input,
#app .cool-topbar-search input {
  height: 38px !important;
  min-width: 0 !important;
  flex: 1 !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.cool-topbar-search small {
  border: 1px solid var(--ca-border) !important;
  border-radius: 6px !important;
  padding: 3px 6px !important;
  color: var(--ca-muted) !important;
  background: #ffffff !important;
  font-size: .72rem !important;
}

.cool-topbar-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}

#app .cool-icon-btn {
  position: relative !important;
  display: grid !important;
  width: 40px !important;
  height: 40px !important;
  place-items: center !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 10px !important;
  color: var(--ca-muted) !important;
  background: var(--ca-surface-2) !important;
}

#app .cool-icon-btn::before {
  color: var(--ca-muted) !important;
  font-weight: 900 !important;
}

#app .cool-icon-btn:nth-child(1)::before { content: "$"; }
#app .cool-icon-btn:nth-child(2)::before { content: "C"; }
#app .cool-icon-btn:nth-child(3)::before { content: "!"; }

#app .cool-icon-btn span {
  position: absolute !important;
  top: -6px !important;
  right: -6px !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border: 2px solid #ffffff !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: var(--ca-danger) !important;
  font-size: .68rem !important;
  line-height: 14px !important;
}

.cool-profile-menu {
  position: relative !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.cool-profile-menu summary {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 42px !important;
  padding: 3px 10px 3px 3px !important;
  border-radius: 999px !important;
  color: var(--ca-text) !important;
  list-style: none !important;
  cursor: pointer !important;
}

.cool-profile-menu summary::-webkit-details-marker {
  display: none !important;
}

.cool-profile-menu summary:hover {
  background: var(--ca-surface-2) !important;
}

.cool-avatar {
  display: grid !important;
  width: 36px !important;
  height: 36px !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  background: var(--ca-accent) !important;
  font-weight: 900 !important;
}

.cool-profile-menu summary strong {
  display: block !important;
  color: var(--ca-text) !important;
  font-size: .86rem !important;
}

.cool-profile-menu summary small {
  color: var(--ca-muted) !important;
  font-size: .73rem !important;
}

.cool-profile-dropdown {
  position: absolute !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  z-index: 12 !important;
  display: grid !important;
  gap: 4px !important;
  min-width: 190px !important;
  padding: 8px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 12px !important;
  background: var(--ca-surface) !important;
  box-shadow: var(--ca-shadow) !important;
}

#app .cool-profile-dropdown button {
  justify-content: start !important;
  width: 100% !important;
  color: var(--ca-text) !important;
  background: transparent !important;
  text-align: left !important;
}

#app .cool-profile-dropdown button:hover {
  background: var(--ca-surface-2) !important;
}

.cool-dashboard-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr) !important;
  gap: 16px !important;
  margin: 16px 0 !important;
}

.cool-chart-card {
  overflow: hidden !important;
}

.cool-chart-main {
  min-height: 300px !important;
}

.cool-card-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

.cool-card-head h2 {
  margin: 3px 0 2px !important;
}

.cool-chart {
  width: 100% !important;
}

.cool-line-chart svg {
  display: block !important;
  width: 100% !important;
  height: 190px !important;
}

.cool-chart-grid {
  fill: none !important;
  stroke: var(--ca-border) !important;
  stroke-width: 1 !important;
}

.cool-line-area {
  fill: rgba(66, 114, 215, .12) !important;
}

.cool-line-stroke {
  fill: none !important;
  stroke: var(--ca-accent) !important;
  stroke-width: 4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.cool-line-chart circle {
  fill: #ffffff !important;
  stroke: var(--ca-accent) !important;
  stroke-width: 3 !important;
}

.cool-chart-labels {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 5px !important;
  margin-top: -6px !important;
  color: var(--ca-muted) !important;
  font-size: .72rem !important;
  text-align: center !important;
}

.cool-donut-wrap {
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
  margin: 12px 0 !important;
}

.cool-donut {
  display: grid !important;
  width: 132px !important;
  height: 132px !important;
  place-items: center !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at center, var(--ca-surface) 0 54%, transparent 55%),
    conic-gradient(var(--ca-accent) calc(var(--pct) * 1%), #e5e7eb 0) !important;
}

.cool-donut strong {
  color: var(--ca-text) !important;
  font-size: 1.55rem !important;
}

.cool-mini-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

.cool-mini-list span {
  display: grid !important;
  gap: 3px !important;
  padding: 11px !important;
  border-radius: 12px !important;
  background: var(--ca-surface-2) !important;
}

.cool-bar-chart {
  display: grid !important;
  gap: 12px !important;
}

.cool-bar-row {
  display: grid !important;
  gap: 7px !important;
}

.cool-bar-label {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.cool-bar-label strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.cool-bar-track {
  position: relative !important;
  height: 10px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: #eef2f7 !important;
}

.cool-bar-track span,
.cool-bar-track i {
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  border-radius: inherit !important;
}

.cool-bar-track span {
  background: rgba(66, 114, 215, .32) !important;
}

.cool-bar-track i {
  background: var(--ca-success) !important;
}

@media (max-width: 1180px) {
  #app #admin-topbar {
    grid-column: 1 !important;
    grid-row: auto !important;
    position: relative !important;
    top: auto !important;
  }

  #app > .page {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

@media (max-width: 820px) {
  #app #admin-topbar {
    display: grid !important;
  }

  .cool-topbar-search {
    width: 100% !important;
  }

  .cool-topbar-actions {
    justify-content: space-between !important;
    width: 100% !important;
  }

  .cool-dashboard-grid {
    grid-template-columns: 1fr !important;
  }

  .cool-donut-wrap {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
  }
}

/* COOLADMIN LITERAL: login/auth pages. */
.cool-login-screen,
:root:not([data-theme="dark"]) .cool-login-screen,
:root[data-theme="dark"] .cool-login-screen {
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
  padding: 28px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(66, 114, 215, .12), transparent 0 28%, transparent 52%),
    linear-gradient(180deg, #f8fafc 0%, #f4f6fa 100%) !important;
}

.skip-link {
  position: fixed !important;
  top: 12px !important;
  left: 12px !important;
  transform: translateY(-150%) !important;
  z-index: 30 !important;
  border-radius: 8px !important;
  padding: 8px 10px !important;
  color: #ffffff !important;
  background: var(--ca-accent) !important;
}

.skip-link:focus {
  transform: translateY(0) !important;
}

.cool-login-shell {
  width: min(100%, 460px) !important;
  display: grid !important;
  gap: 14px !important;
  justify-items: center !important;
}

.cool-login-logo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--ca-text) !important;
  text-decoration: none !important;
}

.cool-login-logo span {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  background: var(--ca-accent) !important;
  font-weight: 950 !important;
}

.cool-login-logo .app-house-logo,
.app-house-logo {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  color: transparent !important;
  background: linear-gradient(135deg, #6ea8ff, #2f6fe4) !important;
}

.cool-login-logo .app-house-logo::before,
.app-house-logo::before {
  content: "" !important;
  width: 64% !important;
  height: 64% !important;
  background: #ffffff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

.cool-login-logo strong {
  font-size: 1.1rem !important;
}

.cool-auth-card,
:root:not([data-theme="dark"]) .cool-auth-card,
:root[data-theme="dark"] .cool-auth-card {
  width: 100% !important;
  display: grid !important;
  gap: 13px !important;
  padding: 30px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .10) !important;
}

.cool-auth-card h1,
.cool-auth-card h2 {
  margin: 0 !important;
  color: var(--ca-text) !important;
  font-size: 2rem !important;
  letter-spacing: -.03em !important;
}

.cool-auth-card p {
  margin: -5px 0 4px !important;
  color: var(--ca-muted) !important;
}

.cool-auth-card label {
  color: var(--ca-text) !important;
  font-size: .86rem !important;
}

.cool-auth-card input:not([type="checkbox"]) {
  height: 44px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 10px !important;
  background: var(--ca-surface-2) !important;
}

.cool-public-entry,
:root:not([data-theme="dark"]) .cool-public-entry,
:root[data-theme="dark"] .cool-public-entry {
  width: 100% !important;
  display: grid !important;
  gap: 16px !important;
  padding: 34px !important;
  border: 1px solid rgba(77, 124, 254, .24) !important;
  border-radius: 24px !important;
  color: #ffffff !important;
  background:
    radial-gradient(circle at 92% 10%, rgba(255, 255, 255, .28), transparent 0 30%, transparent 52%),
    linear-gradient(135deg, #4d7cfe 0%, #355bd8 62%, #233d9f 100%) !important;
  box-shadow: 0 24px 70px rgba(77, 124, 254, .28) !important;
}

.cool-public-entry .login-kicker,
.cool-public-entry p {
  color: rgba(255, 255, 255, .82) !important;
}

.cool-public-entry h1 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 7vw, 2.75rem) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}

.cool-public-entry p {
  margin: 0 !important;
  max-width: 36rem !important;
  font-size: .96rem !important;
  line-height: 1.55 !important;
}

#login .cool-public-entry .cool-public-action {
  min-height: 54px !important;
  border: 0 !important;
  color: #2440a6 !important;
  background: #ffffff !important;
  box-shadow: 0 16px 34px rgba(16, 24, 40, .18) !important;
  font-size: 1rem !important;
}

#login .cool-public-entry .secondary {
  border-color: rgba(255, 255, 255, .35) !important;
  color: #ffffff !important;
  background: rgba(255, 255, 255, .13) !important;
}

.cool-login-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.cool-check {
  display: inline-flex !important;
  align-items: center !important;
  grid-template-columns: none !important;
  gap: 7px !important;
  color: var(--ca-muted) !important;
  font-weight: 500 !important;
}

.cool-check input {
  width: auto !important;
}

.link-button,
#login .link-button {
  border: 0 !important;
  padding: 0 !important;
  color: var(--ca-accent) !important;
  background: transparent !important;
  font-weight: 700 !important;
}

.cool-auth-divider {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  margin: 4px 0 !important;
  color: var(--ca-muted) !important;
  font-size: .78rem !important;
}

.cool-auth-divider::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: var(--ca-border) !important;
}

.cool-auth-divider span {
  position: relative !important;
  padding: 0 10px !important;
  background: #ffffff !important;
}

.cool-social-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}

.cool-access-details,
.cool-landlord-login {
  width: 100% !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.cool-access-details > summary,
.cool-landlord-login > summary {
  width: 100% !important;
  border-radius: 10px !important;
  padding: 12px !important;
  color: var(--ca-accent) !important;
  background: var(--ca-accent-soft) !important;
  text-align: center !important;
  list-style: none !important;
  cursor: pointer !important;
  font-weight: 800 !important;
}

.cool-access-details > summary::-webkit-details-marker,
.cool-landlord-login > summary::-webkit-details-marker {
  display: none !important;
}

.cool-access-details:not([open]) > :not(summary) {
  display: none !important;
}

.cool-access-details[open] > summary {
  color: #ffffff !important;
  background: var(--ca-accent) !important;
}

.cool-tenant-login > summary {
  border: 1px solid var(--ca-border) !important;
  color: var(--ca-text) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .05) !important;
}

.cool-admin-secret {
  width: auto !important;
  justify-self: end !important;
  margin-top: -4px !important;
}

.cool-admin-secret > summary {
  width: auto !important;
  min-width: 0 !important;
  display: inline-flex !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  color: rgba(100, 116, 139, .72) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

.cool-admin-secret > summary:hover {
  color: var(--ca-accent) !important;
  background: rgba(77, 124, 254, .08) !important;
}

.cool-admin-secret[open] {
  width: 100% !important;
  justify-self: stretch !important;
}

.cool-admin-secret[open] > summary {
  color: #ffffff !important;
  background: var(--ca-accent) !important;
}

.cool-admin-secret .cool-auth-card {
  padding: 22px !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .08) !important;
}

.cool-admin-secret .cool-auth-card h2 {
  font-size: 1.45rem !important;
}

.cool-tenant-login > .cool-auth-card,
.cool-tenant-login > .cool-auth-form,
.cool-admin-auth-card {
  margin-top: 12px !important;
}

.cool-auth-foot {
  margin: 0 !important;
  color: var(--ca-muted) !important;
  font-size: .88rem !important;
  text-align: center !important;
}

/* LOGIN V2: tarjeta limpia estilo CoolAdmin. */
.cool-login-screen,
:root:not([data-theme="dark"]) .cool-login-screen,
:root[data-theme="dark"] .cool-login-screen {
  min-height: 100vh !important;
  padding: 42px 20px !important;
  background:
    radial-gradient(circle at 92% 96%, rgba(255, 229, 242, .72), transparent 0 32%, transparent 58%),
    linear-gradient(180deg, #eef3fb 0%, #f7f9fd 100%) !important;
}

.cool-login-card,
:root:not([data-theme="dark"]) .cool-login-card,
:root[data-theme="dark"] .cool-login-card {
  width: min(100%, 388px) !important;
  justify-items: stretch !important;
  gap: 16px !important;
  padding: 32px !important;
  border: 1px solid #dce4f1 !important;
  border-radius: 17px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 60px rgba(15, 23, 42, .12) !important;
}

.cool-login-card .cool-login-logo {
  justify-self: center !important;
  margin-bottom: 4px !important;
  color: #0f2745 !important;
}

.cool-login-card .cool-login-logo span {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: #416ddc !important;
  box-shadow: 0 10px 20px rgba(65, 109, 220, .22) !important;
}

.cool-login-card .cool-login-logo .app-house-logo {
  border-radius: 12px !important;
  background: linear-gradient(135deg, #6ea8ff, #2f6fe4) !important;
  box-shadow: 0 10px 22px rgba(47, 111, 228, .22) !important;
}

.cool-login-card .cool-login-logo strong {
  color: #0f2745 !important;
  font-size: 1.05rem !important;
  font-weight: 850 !important;
}

.cool-login-title {
  text-align: center !important;
}

.cool-login-title h1 {
  margin: 0 0 6px !important;
  color: #061b36 !important;
  font-size: 1.72rem !important;
  line-height: 1.15 !important;
  letter-spacing: -.035em !important;
}

.cool-login-title p {
  margin: 0 !important;
  color: #435574 !important;
  font-size: .94rem !important;
}

#login .cool-public-action,
#login .cool-auth-form .large-action {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  background: #4472d9 !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

#login .cool-public-action {
  min-height: 56px !important;
  border-radius: 11px !important;
  background:
    linear-gradient(135deg, #4d7cfe 0%, #315fc8 100%) !important;
  box-shadow: 0 16px 34px rgba(65, 109, 220, .28) !important;
  font-size: 1rem !important;
}

#login .cool-public-action:hover,
#login .cool-auth-form .large-action:hover {
  background: #315fc8 !important;
  transform: translateY(-1px) !important;
}

#login .cool-public-action:hover {
  background:
    linear-gradient(135deg, #416fe9 0%, #254fad 100%) !important;
}

.cool-auth-form {
  width: 100% !important;
  display: grid !important;
  gap: 16px !important;
}

.cool-auth-form label {
  display: grid !important;
  gap: 8px !important;
  color: #061b36 !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
}

.cool-auth-form input:not([type="checkbox"]) {
  width: 100% !important;
  height: 43px !important;
  border: 1px solid #d9e1ee !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  color: #0f2745 !important;
  background: #ffffff !important;
  font-size: .95rem !important;
  box-shadow: none !important;
}

.cool-auth-form input::placeholder {
  color: #95a3bd !important;
}

.cool-login-card .cool-login-row {
  margin-top: 1px !important;
}

.cool-login-card .cool-check {
  color: #0f2745 !important;
  font-weight: 600 !important;
}

.cool-login-card .cool-check input {
  width: 16px !important;
  height: 16px !important;
  accent-color: #4472d9 !important;
}

.cool-login-card .link-button {
  color: #315fc8 !important;
  font-size: .86rem !important;
}

.cool-login-card .cool-auth-divider {
  margin: 3px 0 !important;
  color: #95a3bd !important;
  font-size: .78rem !important;
}

.cool-login-card .cool-auth-divider span {
  background: #ffffff !important;
}

#login .cool-outline-action {
  min-height: 44px !important;
  border: 1px solid #d9e1ee !important;
  border-radius: 8px !important;
  color: #0f2745 !important;
  background: #ffffff !important;
  font-weight: 800 !important;
}

.cool-login-card .cool-social-row {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

.cool-login-card .cool-admin-secret {
  justify-self: center !important;
  margin-top: 2px !important;
}

.cool-login-card .cool-admin-secret > summary {
  color: #8b98b2 !important;
  font-size: .74rem !important;
}

.cool-login-card .cool-admin-secret[open] {
  width: 100% !important;
}

.cool-login-card .cool-admin-secret .cool-auth-card {
  padding: 18px !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .08) !important;
}

.cool-login-card .cool-auth-foot {
  padding-top: 6px !important;
  border-top: 1px solid #edf1f7 !important;
  color: #435574 !important;
  font-size: .86rem !important;
}

@media (max-width: 520px) {
  .cool-login-screen {
    padding: 20px 14px !important;
    align-items: start !important;
  }

  .cool-login-card {
    padding: 26px 22px !important;
    border-radius: 15px !important;
  }
}

/* AJUSTE UX: accesos y opciones visibles al abrir paneles. */
.cool-login-screen,
:root:not([data-theme="dark"]) .cool-login-screen,
:root[data-theme="dark"] .cool-login-screen {
  place-items: start center !important;
  overflow-y: auto !important;
}

.cool-login-card {
  margin: 0 auto !important;
}

.cool-access-details[open] {
  scroll-margin-top: 18px !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  align-content: start !important;
}

#app #side-panel .side-subpanel,
:root:not([data-theme="dark"]) #app #side-panel .side-subpanel,
:root[data-theme="dark"] #app #side-panel .side-subpanel {
  order: -1 !important;
  padding: 16px !important;
}

#app #side-panel .side-subpanel .side-help {
  margin-bottom: 6px !important;
}

#app #side-panel .side-subpanel .side-actions {
  display: grid !important;
  gap: 7px !important;
  margin-top: 8px !important;
}

#app #side-panel .side-subpanel .side-action {
  min-height: 36px !important;
  padding: 8px 10px !important;
}

/* COOLADMIN LITERAL: calendar app. */
.cool-page-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 18px !important;
}

.cool-page-head h1 {
  margin: 0 0 4px !important;
  color: var(--ca-text) !important;
  font-size: 2rem !important;
}

.cool-page-head p {
  margin: 0 !important;
  color: var(--ca-muted) !important;
}

.calendar-view-switcher,
#calendar .calendar-view-switcher {
  display: inline-flex !important;
  gap: 6px !important;
  margin: 0 0 16px !important;
  padding: 6px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .06) !important;
}

.calendar-view-switcher button {
  min-height: 34px !important;
  border: 0 !important;
  border-radius: 10px !important;
  padding: 8px 13px !important;
  color: var(--ca-muted) !important;
  background: transparent !important;
  font-weight: 800 !important;
}

.calendar-view-switcher button.active,
.calendar-view-switcher button:hover {
  color: #ffffff !important;
  background: var(--ca-accent) !important;
}

#calendar .cool-calendar-layout {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  align-items: start !important;
}

#calendar .cool-calendar-form {
  grid-column: 1 / -1 !important;
  order: 3 !important;
}

#calendar .cool-calendar-card {
  grid-column: 1 !important;
  order: 1 !important;
}

.cool-calendar-sidebar {
  grid-column: 2 !important;
  order: 2 !important;
  display: grid !important;
  gap: 16px !important;
}

#calendar .calendar-head {
  min-height: 58px !important;
  border-bottom: 1px solid var(--ca-border) !important;
  padding-bottom: 14px !important;
}

#calendar .calendar-grid {
  min-width: 0 !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 0 !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

#calendar .calendar-weekday {
  padding: 12px 8px !important;
  color: var(--ca-muted) !important;
  background: var(--ca-surface-2) !important;
  border-bottom: 1px solid var(--ca-border) !important;
  font-size: .72rem !important;
  text-transform: uppercase !important;
}

#calendar .calendar-day,
:root:not([data-theme="dark"]) #calendar .calendar-day,
:root[data-theme="dark"] #calendar .calendar-day {
  min-height: 132px !important;
  border: 0 !important;
  border-right: 1px solid var(--ca-border) !important;
  border-bottom: 1px solid var(--ca-border) !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#calendar .calendar-day.today {
  background: #f7faff !important;
  box-shadow: inset 0 0 0 2px rgba(66, 114, 215, .28) !important;
}

#calendar .calendar-day-head {
  color: var(--ca-text) !important;
}

#calendar .calendar-add {
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  color: var(--ca-accent) !important;
  background: var(--ca-accent-soft) !important;
}

#calendar .calendar-event {
  min-height: auto !important;
  margin-top: 5px !important;
  border-radius: 7px !important;
  padding: 6px 7px !important;
  font-size: .72rem !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

.cool-calendar-widget h2 {
  margin-bottom: 4px !important;
}

.cool-upcoming-list {
  display: grid !important;
  gap: 10px !important;
}

.cool-upcoming-item,
#app .cool-upcoming-item {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  width: 100% !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 12px !important;
  padding: 9px !important;
  color: var(--ca-text) !important;
  background: #ffffff !important;
  text-align: left !important;
}

.cool-upcoming-item > span {
  display: grid !important;
  place-items: center !important;
  height: 54px !important;
  border-radius: 12px !important;
  color: var(--ca-accent) !important;
  background: var(--ca-accent-soft) !important;
  font-size: 1.1rem !important;
  font-weight: 900 !important;
}

.cool-upcoming-item > span small {
  color: inherit !important;
  font-size: .62rem !important;
  text-transform: uppercase !important;
}

.cool-upcoming-item strong,
.cool-upcoming-item small {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.calendar-type-list {
  display: grid !important;
  gap: 10px !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.calendar-type-list li {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: var(--ca-muted) !important;
  font-size: .9rem !important;
}

.calendar-dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
}

.calendar-dot.due { background: #ef4444 !important; }
.calendar-dot.paid { background: #10b981 !important; }
.calendar-dot.contract { background: #4272d7 !important; }
.calendar-dot.custom { background: #8b5cf6 !important; }
.calendar-dot.expense { background: #f59e0b !important; }

.calendar-week-board {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(120px, 1fr)) !important;
  gap: 10px !important;
  overflow-x: auto !important;
  padding-bottom: 4px !important;
}

.calendar-week-column {
  min-height: 360px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 16px !important;
  padding: 10px !important;
  background: #ffffff !important;
}

.calendar-week-column.today {
  box-shadow: inset 0 0 0 2px rgba(66, 114, 215, .24) !important;
}

.calendar-week-day {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  gap: 8px !important;
  align-items: center !important;
  margin-bottom: 10px !important;
}

.calendar-week-day span {
  color: var(--ca-muted) !important;
  font-size: .72rem !important;
  text-transform: uppercase !important;
}

.calendar-week-day strong {
  color: var(--ca-text) !important;
  font-size: 1.25rem !important;
}

.calendar-week-events,
.calendar-list-day > div {
  display: grid !important;
  gap: 8px !important;
}

.calendar-agenda-item,
#app .calendar-agenda-item {
  display: grid !important;
  gap: 3px !important;
  width: 100% !important;
  border: 1px solid var(--ca-border) !important;
  border-left: 4px solid var(--ca-accent) !important;
  border-radius: 11px !important;
  padding: 10px !important;
  color: var(--ca-text) !important;
  background: #ffffff !important;
  text-align: left !important;
}

.calendar-agenda-item.compact {
  padding: 8px !important;
}

.calendar-agenda-item span,
.calendar-agenda-item small {
  color: var(--ca-muted) !important;
  font-size: .75rem !important;
}

.calendar-agenda-item strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.calendar-agenda-item.type-due { border-left-color: #ef4444 !important; }
.calendar-agenda-item.type-paid { border-left-color: #10b981 !important; }
.calendar-agenda-item.type-contract { border-left-color: #4272d7 !important; }
.calendar-agenda-item.type-custom { border-left-color: #8b5cf6 !important; }
.calendar-agenda-item.type-expense { border-left-color: #f59e0b !important; }

.calendar-year-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.calendar-year-card,
#app .calendar-year-card {
  display: grid !important;
  gap: 7px !important;
  min-height: 118px !important;
  border: 1px solid var(--ca-border) !important;
  border-radius: 16px !important;
  padding: 14px !important;
  color: var(--ca-text) !important;
  background: #ffffff !important;
  text-align: left !important;
}

.calendar-year-card.today {
  border-color: rgba(66, 114, 215, .42) !important;
  box-shadow: 0 12px 30px rgba(66, 114, 215, .12) !important;
}

.calendar-year-card span {
  color: var(--ca-muted) !important;
  font-size: .82rem !important;
}

.calendar-year-card strong {
  color: var(--ca-text) !important;
  font-size: 2rem !important;
  line-height: 1 !important;
}

.calendar-year-card small {
  color: var(--ca-muted) !important;
}

.calendar-list-view {
  display: grid !important;
  gap: 14px !important;
}

.calendar-list-day {
  display: grid !important;
  gap: 9px !important;
}

.calendar-list-day h3 {
  margin: 0 !important;
  color: var(--ca-text) !important;
  font-size: 1rem !important;
}

.compact-empty {
  padding: 10px !important;
  font-size: .8rem !important;
}

@media (max-width: 980px) {
  #calendar .cool-calendar-layout {
    grid-template-columns: 1fr !important;
  }

  #calendar .cool-calendar-card,
  .cool-calendar-sidebar,
  #calendar .cool-calendar-form {
    grid-column: 1 !important;
  }

  .calendar-year-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .cool-page-head {
    display: grid !important;
  }

  #calendar .calendar-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  #calendar .calendar-weekday,
  #calendar .calendar-day.muted {
    display: none !important;
  }

  #calendar .calendar-day {
    min-height: auto !important;
    border-right: 0 !important;
  }
}

/* PUBLIC CATALOG V2: limpio, sin cuadro flotante. */
#public-catalog.public-catalog-shell,
:root:not([data-theme="dark"]) #public-catalog.public-catalog-shell,
:root[data-theme="dark"] #public-catalog.public-catalog-shell {
  display: block !important;
  width: min(100% - 32px, 1120px) !important;
  max-width: 1120px !important;
  min-height: auto !important;
  margin: 34px auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#public-catalog.hidden {
  display: none !important;
}

#public-catalog .public-catalog-header {
  display: none !important;
}

#public-catalog-content,
#public-catalog #public-catalog-content {
  display: grid !important;
  gap: 18px !important;
  width: 100% !important;
  padding: 0 !important;
}

#public-catalog .public-catalog-hero,
:root:not([data-theme="dark"]) #public-catalog .public-catalog-hero,
:root[data-theme="dark"] #public-catalog .public-catalog-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, .62fr) !important;
  gap: 22px !important;
  align-items: center !important;
  padding: 32px !important;
  border: 1px solid #dce4f1 !important;
  border-radius: 22px !important;
  color: #061b36 !important;
  background: #ffffff !important;
  box-shadow: 0 22px 60px rgba(15, 23, 42, .12) !important;
}

.public-clean-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 18px !important;
  color: #0f2745 !important;
}

button.public-clean-brand,
button.public-clean-brand:hover,
button.public-clean-brand:focus,
button.public-clean-brand:active {
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  appearance: none !important;
  cursor: pointer !important;
  transform: none !important;
}

.public-clean-brand span {
  display: grid !important;
  width: 36px !important;
  height: 36px !important;
  place-items: center !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  background: #416ddc !important;
  box-shadow: 0 10px 20px rgba(65, 109, 220, .22) !important;
  font-weight: 950 !important;
}

.public-clean-brand strong {
  color: #0f2745 !important;
}

#public-catalog .public-catalog-hero h2 {
  margin: 0 0 10px !important;
  color: #061b36 !important;
  font-size: clamp(2rem, 6vw, 3.4rem) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}

#public-catalog .public-catalog-hero p {
  max-width: 620px !important;
  margin: 0 !important;
  color: #435574 !important;
  font-size: .98rem !important;
  line-height: 1.6 !important;
}

#public-catalog .public-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
  margin-top: 20px !important;
}

#public-catalog .public-hero-actions .view-link,
#public-catalog .public-hero-actions button,
#public-catalog .public-hero-actions a {
  min-height: 42px !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  font-weight: 850 !important;
}

#public-catalog .public-hero-actions .whatsapp-link,
#public-catalog .public-hero-actions .view-link:first-child {
  border: 0 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #4d7cfe 0%, #315fc8 100%) !important;
  box-shadow: 0 14px 28px rgba(65, 109, 220, .24) !important;
}

#public-catalog .public-catalog-stats {
  display: grid !important;
  gap: 10px !important;
}

#public-catalog .public-catalog-stats span {
  display: grid !important;
  gap: 4px !important;
  padding: 16px !important;
  border: 1px solid #d9e1ee !important;
  border-radius: 16px !important;
  background: #f8fafc !important;
}

#public-catalog .public-catalog-stats small {
  color: #71809b !important;
}

#public-catalog .public-catalog-stats strong {
  color: #061b36 !important;
  font-size: 1.35rem !important;
}

#public-catalog .public-section-nav,
:root:not([data-theme="dark"]) #public-catalog .public-section-nav,
:root[data-theme="dark"] #public-catalog .public-section-nav {
  position: sticky !important;
  top: 10px !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 8px !important;
  border: 1px solid #dce4f1 !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .10) !important;
  backdrop-filter: blur(16px) !important;
}

#public-catalog .public-section-nav button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 7px !important;
  align-items: center !important;
  min-height: 42px !important;
  border: 0 !important;
  border-radius: 13px !important;
  padding: 9px 11px !important;
  color: #435574 !important;
  background: transparent !important;
  font-weight: 850 !important;
  text-align: left !important;
}

#public-catalog .public-section-nav button small {
  display: grid !important;
  min-width: 24px !important;
  height: 24px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #315fc8 !important;
  background: #edf3ff !important;
  font-size: .72rem !important;
}

#public-catalog .public-section-nav button.active,
#public-catalog .public-section-nav button:hover {
  color: #ffffff !important;
  background: linear-gradient(135deg, #4d7cfe 0%, #315fc8 100%) !important;
}

#public-catalog .public-section-nav button.active small,
#public-catalog .public-section-nav button:hover small {
  color: #315fc8 !important;
  background: #ffffff !important;
}

#public-catalog .public-panel-content {
  display: grid !important;
  gap: 18px !important;
}

#public-catalog .public-panel-card {
  margin-top: 0 !important;
}

#public-catalog .public-summary-panel,
#public-catalog .public-contact-panel {
  display: grid !important;
  gap: 18px !important;
  padding: 24px !important;
  border: 1px solid #dce4f1 !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: 0 16px 44px rgba(15, 23, 42, .08) !important;
}

#public-catalog .public-summary-panel h2,
#public-catalog .public-contact-panel h2 {
  margin: 0 0 8px !important;
  color: #061b36 !important;
  letter-spacing: -.03em !important;
}

#public-catalog .public-summary-panel p,
#public-catalog .public-contact-panel p {
  margin: 0 !important;
  color: #435574 !important;
  line-height: 1.6 !important;
}

#public-catalog .public-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#public-catalog .public-summary-grid span {
  display: grid !important;
  gap: 4px !important;
  padding: 16px !important;
  border: 1px solid #d9e1ee !important;
  border-radius: 16px !important;
  background: #f8fafc !important;
}

#public-catalog .public-summary-grid small {
  color: #71809b !important;
}

#public-catalog .public-summary-grid strong {
  color: #061b36 !important;
  font-size: 1.35rem !important;
}

#public-catalog .public-contact-actions {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 10px !important;
}

#public-catalog .public-contact-actions a,
#public-catalog .public-contact-actions button {
  justify-content: center !important;
  width: 100% !important;
  min-height: 44px !important;
}

#public-catalog .public-location-picker,
#public-catalog .public-property-group,
#public-catalog .public-room-card,
#public-catalog .public-map-card {
  border: 1px solid #dce4f1 !important;
  background: #ffffff !important;
  box-shadow: 0 16px 44px rgba(15, 23, 42, .08) !important;
}

#public-catalog .public-location-picker {
  padding: 24px !important;
  border-radius: 22px !important;
}

#public-catalog .public-location-intro .login-kicker {
  display: none !important;
}

#public-catalog .public-location-intro h2,
#public-catalog .public-property-head h2 {
  color: #061b36 !important;
  letter-spacing: -.03em !important;
}

#public-catalog .public-location-intro p,
#public-catalog .public-property-head p,
#public-catalog .public-property-head small {
  color: #435574 !important;
}

#public-catalog .public-location-card,
#public-catalog .public-room-card {
  border: 1px solid #d9e1ee !important;
  border-radius: 18px !important;
  background: #ffffff !important;
}

#public-catalog .public-location-card.active {
  color: #ffffff !important;
  border-color: #416ddc !important;
  background: linear-gradient(135deg, #4d7cfe 0%, #315fc8 100%) !important;
  box-shadow: 0 16px 32px rgba(65, 109, 220, .24) !important;
}

#public-catalog .public-map-card {
  overflow: hidden !important;
  border-radius: 20px !important;
}

#public-catalog .public-room-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 16px !important;
}

#public-catalog .public-property-group {
  padding: 24px !important;
  border-radius: 22px !important;
}

#public-catalog .public-room-card {
  overflow: hidden !important;
  padding: 0 !important;
}

#public-catalog .public-room-cover {
  border-radius: 16px !important;
}

#public-catalog .public-room-price {
  color: #315fc8 !important;
  font-size: 1.25rem !important;
}

#public-catalog .public-room-tags span,
#public-catalog .public-services span {
  border: 1px solid #e6ebf4 !important;
  color: #0f2745 !important;
  background: #f8fafc !important;
}

@media (max-width: 900px) {
  #public-catalog .public-catalog-hero,
  #public-catalog .public-location-layout {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 560px) {
  #public-catalog.public-catalog-shell {
    width: min(100% - 18px, 1120px) !important;
    margin: 12px auto 26px !important;
  }

  #public-catalog-content,
  #public-catalog #public-catalog-content {
    gap: 22px !important;
  }

  #public-catalog .public-catalog-hero,
  #public-catalog .public-location-picker,
  #public-catalog .public-property-group,
  #public-catalog .public-summary-panel,
  #public-catalog .public-contact-panel {
    padding: 22px 18px !important;
    border-radius: 20px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08) !important;
  }

  #public-catalog .public-section-nav {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 8px !important;
    overflow-x: auto !important;
    margin: -2px -2px 0 !important;
    padding: 8px !important;
    border-radius: 16px !important;
    scroll-snap-type: x proximity !important;
  }

  #public-catalog .public-section-nav button {
    flex: 0 0 auto !important;
    min-width: 132px !important;
    scroll-snap-align: start !important;
  }

  #public-catalog .public-clean-brand {
    margin-bottom: 16px !important;
  }

  #public-catalog .public-catalog-hero {
    gap: 20px !important;
  }

  #public-catalog .public-catalog-hero h2 {
    font-size: clamp(2.15rem, 11vw, 3rem) !important;
    line-height: 1 !important;
    letter-spacing: -.06em !important;
  }

  #public-catalog .public-catalog-hero p {
    font-size: .95rem !important;
    line-height: 1.68 !important;
  }

  #public-catalog .public-hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin-top: 22px !important;
  }

  #public-catalog .public-hero-actions a,
  #public-catalog .public-hero-actions button {
    width: 100% !important;
    justify-content: center !important;
    min-height: 46px !important;
  }

  #public-catalog .public-catalog-stats {
    gap: 12px !important;
  }

  #public-catalog .public-summary-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  #public-catalog .public-contact-actions {
    grid-template-columns: 1fr !important;
  }

  #public-catalog .public-catalog-stats span {
    padding: 15px !important;
    border-radius: 15px !important;
  }

  #public-catalog .public-location-intro {
    display: grid !important;
    gap: 12px !important;
  }

  #public-catalog .public-location-intro h2,
  #public-catalog .public-property-head h2 {
    margin-bottom: 8px !important;
    font-size: 1.45rem !important;
  }

  #public-catalog .public-location-intro p {
    line-height: 1.65 !important;
  }

  #public-catalog .public-location-layout,
  #public-catalog .public-location-list,
  #public-catalog .public-room-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  #public-catalog .public-location-card {
    padding: 16px !important;
    border-radius: 16px !important;
  }

  #public-catalog .public-location-name {
    font-size: 1.05rem !important;
  }

  #public-catalog .public-map-card,
  #public-catalog .public-room-card {
    border-radius: 18px !important;
  }

  #public-catalog .public-map-visual,
  #public-catalog .public-map-card iframe {
    min-height: 260px !important;
  }

  #public-catalog .public-map-caption {
    padding: 14px !important;
    gap: 7px !important;
  }

  #public-catalog .public-property-head {
    display: grid !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  #public-catalog .public-room-gallery {
    padding: 14px 14px 0 !important;
  }

  #public-catalog .public-room-cover {
    aspect-ratio: 16 / 11 !important;
  }

  #public-catalog .public-room-body {
    gap: 15px !important;
    padding: 18px 16px 16px !important;
  }

  #public-catalog .public-room-body .item-row {
    display: grid !important;
    gap: 8px !important;
  }

  #public-catalog .public-room-price {
    justify-self: start !important;
    font-size: 1.35rem !important;
  }

  #public-catalog .public-room-tags,
  #public-catalog .public-services {
    gap: 9px !important;
  }

  #public-catalog .public-room-tags span,
  #public-catalog .public-services span {
    display: block !important;
    border-radius: 12px !important;
    padding: 10px 11px !important;
    line-height: 1.35 !important;
  }

  #public-catalog .public-room-body .actions {
    display: grid !important;
    gap: 9px !important;
  }

  #public-catalog .public-room-body .actions a,
  #public-catalog .public-room-body .actions button {
    width: 100% !important;
    justify-content: center !important;
    min-height: 43px !important;
  }
}

/* PUBLIC CATALOG MOBILE FIX: evitar columnas apretadas en celulares grandes. */
#public-catalog,
#public-catalog *,
#public-catalog *::before,
#public-catalog *::after {
  box-sizing: border-box !important;
}

#public-catalog {
  overflow-x: hidden !important;
}

#public-catalog .public-catalog-hero {
  grid-template-columns: minmax(0, 1fr) !important;
}

#public-catalog .public-catalog-stats {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
}

#public-catalog .public-section-nav {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
}

#public-catalog .public-location-layout {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
}

#public-catalog .public-location-list {
  min-width: 0 !important;
}

#public-catalog .public-location-card,
#public-catalog .public-room-card,
#public-catalog .public-map-card {
  min-width: 0 !important;
  max-width: 100% !important;
}

#public-catalog .public-location-card span,
#public-catalog .public-room-card span,
#public-catalog .public-room-card p,
#public-catalog .public-map-caption span,
#public-catalog .public-map-caption small {
  overflow-wrap: anywhere !important;
}

@media (max-width: 920px) {
  #public-catalog.public-catalog-shell {
    width: min(100% - 18px, 720px) !important;
    margin: 12px auto 28px !important;
  }

  #public-catalog-content,
  #public-catalog #public-catalog-content {
    gap: 20px !important;
  }

  #public-catalog .public-catalog-hero,
  #public-catalog .public-location-picker,
  #public-catalog .public-property-group,
  #public-catalog .public-summary-panel,
  #public-catalog .public-contact-panel {
    width: 100% !important;
    padding: 22px 18px !important;
    border-radius: 22px !important;
  }

  #public-catalog .public-catalog-hero h2 {
    max-width: 100% !important;
    font-size: clamp(2.05rem, 9vw, 3.05rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
  }

  #public-catalog .public-catalog-hero p {
    max-width: 100% !important;
    font-size: .98rem !important;
    line-height: 1.62 !important;
  }

  #public-catalog .public-hero-actions,
  #public-catalog .public-room-body .actions,
  #public-catalog .public-contact-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  #public-catalog .public-hero-actions a,
  #public-catalog .public-hero-actions button,
  #public-catalog .public-room-body .actions a,
  #public-catalog .public-room-body .actions button,
  #public-catalog .public-contact-actions a,
  #public-catalog .public-contact-actions button {
    width: 100% !important;
    justify-content: center !important;
    min-height: 46px !important;
  }

  #public-catalog .public-catalog-stats,
  #public-catalog .public-summary-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  #public-catalog .public-catalog-stats span,
  #public-catalog .public-summary-grid span {
    min-width: 0 !important;
    padding: 15px !important;
  }

  #public-catalog .public-catalog-stats strong,
  #public-catalog .public-summary-grid strong {
    font-size: 1.42rem !important;
    word-break: normal !important;
  }

  #public-catalog .public-section-nav {
    position: sticky !important;
    top: 8px !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 8px !important;
  }

  #public-catalog .public-section-nav button {
    min-width: 0 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    text-align: left !important;
    white-space: nowrap !important;
    font-size: .9rem !important;
  }

  #public-catalog .public-location-intro {
    display: grid !important;
    gap: 12px !important;
  }

  #public-catalog .public-location-layout,
  #public-catalog .public-location-list,
  #public-catalog .public-room-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  #public-catalog .public-location-card {
    width: 100% !important;
    padding: 16px !important;
    border-radius: 17px !important;
  }

  #public-catalog .public-map-visual,
  #public-catalog .public-map-card iframe {
    min-height: 250px !important;
  }

  #public-catalog .public-property-head {
    display: grid !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  #public-catalog .public-room-gallery {
    padding: 14px 14px 0 !important;
  }

  #public-catalog .public-room-cover {
    aspect-ratio: 16 / 11 !important;
  }

  #public-catalog .public-room-body {
    padding: 18px 16px 16px !important;
  }

  #public-catalog .public-room-body .item-row {
    display: grid !important;
    gap: 8px !important;
  }

  #public-catalog .public-room-price {
    justify-self: start !important;
    white-space: normal !important;
  }
}

@media (max-width: 420px) {
  #public-catalog .public-section-nav button {
    font-size: .82rem !important;
    padding: 9px 8px !important;
  }

  #public-catalog .public-section-nav button small {
    min-width: 21px !important;
    height: 21px !important;
  }
}

/* PUBLIC CATALOG HARD RESET: mobile-first permanente para evitar amontonamiento. */
#public-catalog.public-catalog-shell,
:root:not([data-theme="dark"]) #public-catalog.public-catalog-shell,
:root[data-theme="dark"] #public-catalog.public-catalog-shell {
  width: min(100% - 18px, 760px) !important;
  max-width: 760px !important;
  margin: 14px auto 30px !important;
  overflow-x: hidden !important;
}

#public-catalog-content,
#public-catalog #public-catalog-content {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 22px !important;
  overflow-x: hidden !important;
}

#public-catalog .public-catalog-hero,
:root:not([data-theme="dark"]) #public-catalog .public-catalog-hero,
:root[data-theme="dark"] #public-catalog .public-catalog-hero,
#public-catalog .public-location-layout,
#public-catalog .public-room-grid,
#public-catalog .public-summary-grid,
#public-catalog .public-contact-actions,
#public-catalog .public-catalog-stats {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 16px !important;
}

#public-catalog .public-catalog-hero,
#public-catalog .public-location-picker,
#public-catalog .public-property-group,
#public-catalog .public-summary-panel,
#public-catalog .public-contact-panel {
  padding: clamp(18px, 5vw, 26px) !important;
  border-radius: 22px !important;
}

#public-catalog .public-clean-brand {
  margin-bottom: 14px !important;
}

#public-catalog .public-catalog-hero h2 {
  max-width: 100% !important;
  margin-bottom: 12px !important;
  font-size: clamp(2rem, 10vw, 3.05rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

#public-catalog .public-catalog-hero p,
#public-catalog .public-location-intro p,
#public-catalog .public-property-head p,
#public-catalog .public-property-head small,
#public-catalog .public-room-body p,
#public-catalog .public-map-caption span,
#public-catalog .public-map-caption small {
  max-width: 100% !important;
  line-height: 1.65 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

#public-catalog .public-section-nav,
:root:not([data-theme="dark"]) #public-catalog .public-section-nav,
:root[data-theme="dark"] #public-catalog .public-section-nav {
  position: sticky !important;
  top: 8px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding: 8px !important;
}

#public-catalog .public-section-nav button {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  min-width: 0 !important;
  width: 100% !important;
  white-space: nowrap !important;
  text-align: left !important;
}

#public-catalog .public-hero-actions,
#public-catalog .public-room-body .actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
}

#public-catalog .public-hero-actions a,
#public-catalog .public-hero-actions button,
#public-catalog .public-room-body .actions a,
#public-catalog .public-room-body .actions button,
#public-catalog .public-contact-actions a,
#public-catalog .public-contact-actions button {
  width: 100% !important;
  min-height: 46px !important;
  justify-content: center !important;
}

#public-catalog .public-location-intro,
#public-catalog .public-property-head,
#public-catalog .public-location-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  overflow: visible !important;
}

#public-catalog .public-location-card,
#public-catalog .public-map-card,
#public-catalog .public-room-card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

#public-catalog .public-location-card {
  padding: 16px !important;
}

#public-catalog .public-map-visual,
#public-catalog .public-map-card iframe {
  min-height: 260px !important;
}

#public-catalog .public-room-body {
  padding: 18px 16px 16px !important;
}

#public-catalog .public-room-body .item-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
}

#public-catalog .public-room-price {
  justify-self: start !important;
  white-space: normal !important;
}

#public-catalog .public-room-cover {
  aspect-ratio: 16 / 11 !important;
}

#public-catalog .public-room-tags span,
#public-catalog .public-services span {
  display: block !important;
  border-radius: 12px !important;
  padding: 10px 11px !important;
}

@media (min-width: 980px) {
  #public-catalog.public-catalog-shell {
    width: min(100% - 36px, 900px) !important;
    max-width: 900px !important;
  }

  #public-catalog .public-section-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* PUBLIC CATALOG LOCATION FIX: lista vertical limpia, sin carrusel ni tarjetas gigantes. */
#public-catalog,
#public-catalog * {
  box-sizing: border-box !important;
}

#public-catalog .public-location-layout,
#public-catalog .public-location-list,
#public-catalog .public-location-stack {
  display: grid !important;
  grid-auto-flow: row !important;
  grid-auto-columns: initial !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  overflow-x: hidden !important;
}

#public-catalog .public-location-card,
#public-catalog .public-location-row {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 14px !important;
  transform: none !important;
  text-align: left !important;
  white-space: normal !important;
  overflow: hidden !important;
}

#public-catalog .public-location-card:hover {
  transform: none !important;
}

#public-catalog .public-location-main,
#public-catalog .public-location-side {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

#public-catalog .public-location-status,
#public-catalog .public-location-name,
#public-catalog .public-location-address,
#public-catalog .public-location-meta,
#public-catalog .public-location-services {
  position: static !important;
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  transform: none !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  line-height: 1.35 !important;
}

#public-catalog .public-location-status {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: start !important;
  width: fit-content !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  font-size: .68rem !important;
  line-height: 1 !important;
}

#public-catalog .public-location-name {
  font-size: clamp(1.02rem, 4vw, 1.18rem) !important;
  font-weight: 900 !important;
}

#public-catalog .public-location-address,
#public-catalog .public-location-services {
  color: inherit !important;
  opacity: .82 !important;
}

#public-catalog .public-location-meta {
  color: inherit !important;
  font-weight: 800 !important;
}

#public-catalog .public-map-card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#public-catalog .public-room-toggle {
  width: 100% !important;
  justify-content: center !important;
}

#public-catalog .public-room-details {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
}

#public-catalog .public-room-details.hidden {
  display: none !important;
}

@media (min-width: 900px) {
  #public-catalog .public-location-row {
    grid-template-columns: minmax(0, 1.05fr) minmax(220px, .95fr) !important;
    align-items: center !important;
    padding: 16px !important;
  }
}

@media (max-width: 560px) {
  #public-catalog.public-catalog-shell {
    width: calc(100% - 18px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #public-catalog .public-location-picker,
  #public-catalog .public-property-group,
  #public-catalog .public-catalog-hero,
  #public-catalog .public-summary-panel,
  #public-catalog .public-contact-panel {
    padding: 16px !important;
  }

  #public-catalog .public-map-visual,
  #public-catalog .public-map-card iframe {
    min-height: 220px !important;
  }
}

/* PUBLIC CATALOG NAV FIX: pesta?as deslizables para tel?fonos con fuente grande. */
#public-catalog .public-catalog-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

#public-catalog .public-section-nav,
:root:not([data-theme="dark"]) #public-catalog .public-section-nav,
:root[data-theme="dark"] #public-catalog .public-section-nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}

#public-catalog .public-section-nav::-webkit-scrollbar {
  display: none !important;
}

#public-catalog .public-section-nav button {
  flex: 0 0 min(46%, 168px) !important;
  min-width: 132px !important;
  max-width: 180px !important;
  scroll-snap-align: start !important;
  white-space: nowrap !important;
}

#public-catalog .public-catalog-stats,
#public-catalog .public-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
  gap: 10px !important;
}

@media (max-width: 560px) {
  #public-catalog .public-catalog-stats,
  #public-catalog .public-summary-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #public-catalog .public-section-nav button {
    flex-basis: min(58%, 176px) !important;
  }
}

/* APP POLISH 20260603-103: estilo limpio tipo login en toda la web. */
:root {
  --rs-blue: #416ddc;
  --rs-blue-dark: #2854bd;
  --rs-blue-soft: #eef4ff;
  --rs-ink: #071b34;
  --rs-muted: #52637f;
  --rs-line: #dce4f1;
  --rs-bg: #f4f6fa;
  --rs-card: #ffffff;
  --rs-card-soft: #f8fafc;
  --rs-shadow: 0 22px 60px rgba(15, 23, 42, .10);
  --rs-shadow-soft: 0 10px 26px rgba(15, 23, 42, .07);
  --rs-radius: 22px;
}

body,
:root:not([data-theme="dark"]) body {
  color: var(--rs-ink) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(65, 109, 220, .12), transparent 0 26%, transparent 52%),
    radial-gradient(circle at 100% 14%, rgba(65, 109, 220, .08), transparent 0 22%, transparent 48%),
    linear-gradient(180deg, #f8fafc 0%, var(--rs-bg) 100%) !important;
}

#app .card,
#app .item,
#app details,
#app .property-tile,
#app .property-selector-card,
#app .tenant-file-block,
#app .tenant-profile-card,
#app .tenant-document-panel,
#app .room-photo-card,
#tenant-app .card,
#tenant-app .item,
#tenant-app details,
#public-catalog .public-catalog-hero,
#public-catalog .public-location-picker,
#public-catalog .public-property-group,
#public-catalog .public-summary-panel,
#public-catalog .public-contact-panel,
#public-catalog .public-map-card,
#public-catalog .public-room-card,
#public-catalog .public-location-card {
  border: 1px solid var(--rs-line) !important;
  border-radius: var(--rs-radius) !important;
  color: var(--rs-ink) !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: var(--rs-shadow-soft) !important;
}

#app .card:hover,
#tenant-app .card:hover,
#public-catalog .public-room-card:hover,
#public-catalog .public-location-card:hover {
  box-shadow: var(--rs-shadow) !important;
}

#app h1,
#app h2,
#app h3,
#tenant-app h1,
#tenant-app h2,
#tenant-app h3,
#public-catalog h1,
#public-catalog h2,
#public-catalog h3,
#app .item strong,
#tenant-app .item strong,
#public-catalog .public-room-price {
  color: var(--rs-ink) !important;
  letter-spacing: -.025em !important;
}

#app .meta,
#app small,
#tenant-app .meta,
#tenant-app small,
#public-catalog p,
#public-catalog small,
#public-catalog .meta,
#public-catalog .public-location-address,
#public-catalog .public-location-services {
  color: var(--rs-muted) !important;
}

#app button,
#app .button-link,
#tenant-app button,
#tenant-app .button-link,
#public-catalog button,
#public-catalog .button-link,
#public-catalog .whatsapp-link {
  border-radius: 12px !important;
  box-shadow: none !important;
}

#app button:not(.secondary):not(.ghost):not(.danger),
#app .button-link,
#tenant-app button:not(.secondary):not(.ghost):not(.danger),
#tenant-app .button-link,
#public-catalog button:not(.secondary):not(.ghost):not(.danger),
#public-catalog .button-link,
#public-catalog .whatsapp-link {
  border: 0 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--rs-blue), var(--rs-blue-dark)) !important;
}

#app button.secondary,
#app .view-link,
#app .file-button,
#tenant-app button.secondary,
#tenant-app .view-link,
#tenant-app .file-button,
#public-catalog button.secondary,
#public-catalog .view-link {
  border: 1px solid var(--rs-line) !important;
  color: var(--rs-ink) !important;
  background: var(--rs-card-soft) !important;
}

#app input,
#app select,
#app textarea,
#tenant-app input,
#tenant-app select,
#tenant-app textarea {
  border: 1px solid var(--rs-line) !important;
  border-radius: 12px !important;
  color: var(--rs-ink) !important;
  background: #ffffff !important;
}

#app input:focus,
#app select:focus,
#app textarea:focus,
#tenant-app input:focus,
#tenant-app select:focus,
#tenant-app textarea:focus {
  outline: 0 !important;
  border-color: var(--rs-blue) !important;
  box-shadow: 0 0 0 4px rgba(65, 109, 220, .14) !important;
}

/* Admin shell limpio: panel lateral blanco y contenido con aire. */
#app.app-shell,
:root:not([data-theme="dark"]) #app.app-shell,
:root[data-theme="dark"] #app.app-shell {
  display: grid !important;
  grid-template-columns: minmax(250px, 292px) minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(100% - 28px, 1380px) !important;
  max-width: 1380px !important;
  margin: 18px auto 34px !important;
  padding: 0 !important;
  align-items: start !important;
}

#app #side-panel,
:root:not([data-theme="dark"]) #app #side-panel,
:root[data-theme="dark"] #app #side-panel {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  position: sticky !important;
  top: 14px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  max-height: calc(100vh - 28px) !important;
  overflow: auto !important;
  padding: 0 2px 0 0 !important;
}

#app #admin-topbar,
:root:not([data-theme="dark"]) #app #admin-topbar,
:root[data-theme="dark"] #app #admin-topbar {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 14px !important;
  z-index: 8 !important;
  border: 1px solid var(--rs-line) !important;
  border-radius: var(--rs-radius) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: var(--rs-shadow-soft) !important;
}

#app > .page,
:root:not([data-theme="dark"]) #app > .page,
:root[data-theme="dark"] #app > .page {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
}

#app #side-panel .side-card,
#app #side-panel .side-subpanel,
:root:not([data-theme="dark"]) #app #side-panel .side-card,
:root:not([data-theme="dark"]) #app #side-panel .side-subpanel,
:root[data-theme="dark"] #app #side-panel .side-card,
:root[data-theme="dark"] #app #side-panel .side-subpanel {
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border: 1px solid var(--rs-line) !important;
  border-radius: var(--rs-radius) !important;
  color: var(--rs-ink) !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: var(--rs-shadow-soft) !important;
}

#app #side-panel .cooladmin-brand > span {
  background: linear-gradient(135deg, var(--rs-blue), var(--rs-blue-dark)) !important;
}

#app #side-panel .cooladmin-brand strong,
#app #side-panel .side-card > strong {
  color: var(--rs-ink) !important;
}

#app #side-panel .cooladmin-brand small,
#app #side-panel .side-kicker,
#app #side-panel .side-help,
#app #side-panel .side-nav-group small {
  color: var(--rs-muted) !important;
}

#app #side-panel .side-stats span,
#app #side-panel .side-card:first-child .side-stats span {
  background: var(--rs-card-soft) !important;
}

#app #side-panel .side-stats b,
#app #side-panel .side-card:first-child .side-stats b {
  color: var(--rs-ink) !important;
}

#app #side-panel .side-nav-group {
  border-top: 1px solid var(--rs-line) !important;
}

#app #side-panel .side-nav-group:first-child {
  border-top: 0 !important;
}

#app #side-panel .side-nav-group button,
#app #side-panel .side-card:first-child .side-nav-group button,
#app #side-panel .side-action {
  border: 1px solid transparent !important;
  color: var(--rs-ink) !important;
  background: transparent !important;
}

#app #side-panel .side-nav-group button.active,
#app #side-panel .side-card:first-child .side-nav-group button.active,
#app #side-panel .side-nav-group button:hover,
#app #side-panel .side-card:first-child .side-nav-group button:hover,
#app #side-panel .side-action:hover {
  color: var(--rs-blue-dark) !important;
  background: var(--rs-blue-soft) !important;
  border-color: rgba(65, 109, 220, .22) !important;
  box-shadow: none !important;
}

#app #side-panel .side-action {
  background: var(--rs-card-soft) !important;
}

.cool-topbar-search,
#app .cool-topbar-search {
  border-color: var(--rs-line) !important;
  border-radius: 14px !important;
  background: var(--rs-card-soft) !important;
}

.cool-profile-menu summary {
  color: var(--rs-ink) !important;
}

/* Mobile admin: sin empalmes, navegacion deslizante y tarjetas compactas. */
@media (max-width: 900px) {
  #app.app-shell,
  :root:not([data-theme="dark"]) #app.app-shell,
  :root[data-theme="dark"] #app.app-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    width: calc(100% - 18px) !important;
    margin: 12px auto 28px !important;
  }

  #app #side-panel,
  #app #admin-topbar,
  #app > .page,
  :root:not([data-theme="dark"]) #app #side-panel,
  :root:not([data-theme="dark"]) #app #admin-topbar,
  :root:not([data-theme="dark"]) #app > .page,
  :root[data-theme="dark"] #app #side-panel,
  :root[data-theme="dark"] #app #admin-topbar,
  :root[data-theme="dark"] #app > .page {
    grid-column: 1 !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #app #side-panel {
    grid-row: 1 !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  #app #admin-topbar {
    grid-row: 2 !important;
    display: grid !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  #app > .page {
    grid-row: 3 !important;
  }

  #app #side-panel .side-card {
    padding: 14px !important;
  }

  #app #side-panel .side-card:first-child .cooladmin-brand {
    grid-template-columns: 44px minmax(0, 1fr) !important;
  }

  #app #side-panel .side-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #app #side-panel .side-nav-groups {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 2px 0 6px !important;
    scroll-snap-type: x proximity !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #app #side-panel .side-nav-groups::-webkit-scrollbar,
  #app #side-panel .side-actions::-webkit-scrollbar,
  #app #admin-topbar .cool-topbar-actions::-webkit-scrollbar {
    display: none !important;
  }

  #app #side-panel .side-nav-group {
    flex: 0 0 min(76vw, 250px) !important;
    display: grid !important;
    gap: 7px !important;
    border: 1px solid var(--rs-line) !important;
    border-radius: 16px !important;
    padding: 10px !important;
    background: var(--rs-card-soft) !important;
    scroll-snap-align: start !important;
  }

  #app #side-panel .side-nav-group button {
    min-height: 38px !important;
    padding: 8px 10px !important;
    font-size: .82rem !important;
  }

  #app #side-panel .side-subpanel {
    padding: 14px !important;
  }

  #app #side-panel .side-subpanel .side-actions {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 9px !important;
    overflow-x: auto !important;
    padding-bottom: 4px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #app #side-panel .side-subpanel .side-action {
    flex: 0 0 auto !important;
    min-width: 150px !important;
    justify-content: center !important;
    text-align: center !important;
  }

  #app #admin-topbar .cool-topbar-search {
    width: 100% !important;
  }

  #app #admin-topbar .cool-topbar-actions {
    width: 100% !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    padding-bottom: 2px !important;
  }

  #app .grid,
  #app .two-columns,
  #app .calendar-layout,
  #app .cool-dashboard-grid,
  #app .cool-calendar-layout,
  #tenant-app .grid,
  #tenant-app .two-columns {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #app .item-row,
  #tenant-app .item-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: start !important;
  }
}

@media (max-width: 520px) {
  #app #side-panel .side-stats,
  #app .stats,
  #app .mini-grid,
  #app .report-facts,
  #app .public-summary-grid,
  #tenant-app .stats,
  #tenant-app .mini-grid,
  #tenant-app .report-facts {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app #side-panel .side-nav-group {
    flex-basis: min(86vw, 280px) !important;
  }

  #app .actions,
  #tenant-app .actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app .actions > *,
  #tenant-app .actions > * {
    width: 100% !important;
    justify-content: center !important;
  }
}

:root[data-theme="dark"] {
  --rs-ink: #f8fafc;
  --rs-muted: #aab6c8;
  --rs-line: rgba(255, 255, 255, .12);
  --rs-bg: #0f172a;
  --rs-card: #111827;
  --rs-card-soft: #182235;
  --rs-shadow: 0 22px 60px rgba(0, 0, 0, .32);
  --rs-shadow-soft: 0 10px 26px rgba(0, 0, 0, .24);
}

:root[data-theme="dark"] body {
  background:
    radial-gradient(circle at 8% 0%, rgba(65, 109, 220, .22), transparent 0 26%, transparent 52%),
    linear-gradient(180deg, #0f172a 0%, #111827 100%) !important;
}

:root[data-theme="dark"] #app .card,
:root[data-theme="dark"] #app .item,
:root[data-theme="dark"] #app details,
:root[data-theme="dark"] #tenant-app .card,
:root[data-theme="dark"] #tenant-app .item,
:root[data-theme="dark"] #tenant-app details,
:root[data-theme="dark"] #public-catalog .public-catalog-hero,
:root[data-theme="dark"] #public-catalog .public-location-picker,
:root[data-theme="dark"] #public-catalog .public-property-group,
:root[data-theme="dark"] #public-catalog .public-summary-panel,
:root[data-theme="dark"] #public-catalog .public-contact-panel,
:root[data-theme="dark"] #public-catalog .public-map-card,
:root[data-theme="dark"] #public-catalog .public-room-card,
:root[data-theme="dark"] #public-catalog .public-location-card,
:root[data-theme="dark"] #app #side-panel .side-card,
:root[data-theme="dark"] #app #side-panel .side-subpanel,
:root[data-theme="dark"] #app #admin-topbar {
  color: var(--rs-ink) !important;
  background: rgba(17, 24, 39, .96) !important;
  border-color: var(--rs-line) !important;
}

/* Visibility must always win over layout rules. */
#login.hidden,
#public-catalog.hidden,
#app.hidden,
#tenant-app.hidden,
#photo-viewer.hidden,
#toast.hidden {
  display: none !important;
}

html body main.hidden,
html body section.hidden,
html body div.hidden,
html body #app.hidden.app-shell,
html body #public-catalog.hidden.public-catalog-shell,
html body #tenant-app.hidden.tenant-shell,
html body #login.hidden.login-screen {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* PUBLIC MOBILE BOTTOM NAV 20260603-66 */
#public-catalog .public-bottom-nav {
  display: none !important;
}

@media (max-width: 760px) {
  #public-catalog.public-catalog-shell:not(.hidden) {
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  }

  #public-catalog .public-section-nav {
    display: none !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    position: fixed !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    z-index: 80 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: auto !important;
    max-width: 520px !important;
    margin: 0 auto !important;
    padding: 8px !important;
    border: 1px solid rgba(220, 228, 241, .9) !important;
    border-radius: 22px !important;
    background: rgba(248, 251, 255, .97) !important;
    box-shadow: 0 18px 46px rgba(47, 111, 228, .14) !important;
    backdrop-filter: blur(18px) !important;
  }

  #public-catalog .public-bottom-nav button {
    display: grid !important;
    place-items: center !important;
    gap: 3px !important;
    min-width: 0 !important;
    min-height: 54px !important;
    border: 1px solid transparent !important;
    border-radius: 18px !important;
    padding: 8px 4px !important;
    color: #71809b !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  #public-catalog .public-bottom-nav button small {
    display: grid !important;
    min-width: 20px !important;
    height: 20px !important;
    place-items: center !important;
    border-radius: 999px !important;
    color: var(--rs-blue-dark) !important;
    background: var(--rs-blue-soft) !important;
    font-size: .68rem !important;
    line-height: 1 !important;
  }

  #public-catalog .public-bottom-nav button.active {
    border-color: #dbe8ff !important;
    color: #2f6fe4 !important;
    background: #edf5ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
  }

  #public-catalog .public-bottom-nav button.active small {
    color: var(--rs-blue-dark) !important;
    background: #ffffff !important;
  }
}

@media (max-width: 380px) {
  #public-catalog .public-bottom-nav {
    gap: 4px !important;
    padding: 7px !important;
  }

  #public-catalog .public-bottom-nav button {
    min-height: 48px !important;
    font-size: .68rem !important;
  }
}

/* PUBLIC LOCATIONS COMPACT 20260603-103 */
#public-catalog .public-location-picker {
  display: grid !important;
  gap: 14px !important;
}

#public-catalog .public-location-intro {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 !important;
}

#public-catalog .public-location-intro h2 {
  margin: 0 !important;
  font-size: clamp(1.35rem, 4vw, 1.9rem) !important;
}

#public-catalog .public-location-intro p {
  max-width: 560px !important;
  margin: 6px 0 0 !important;
  font-size: .92rem !important;
  line-height: 1.35 !important;
}

#public-catalog .public-location-list.public-location-stack {
  gap: 8px !important;
}

#public-catalog .public-location-card.public-location-row {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
}

#public-catalog .public-location-card .public-location-main,
#public-catalog .public-location-card .public-location-side {
  gap: 0 !important;
}

#public-catalog .public-location-card .public-location-name {
  font-size: .98rem !important;
  line-height: 1.15 !important;
}

#public-catalog .public-location-card .public-location-meta {
  font-size: .78rem !important;
  line-height: 1.1 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

#public-catalog .public-location-card .public-location-status,
#public-catalog .public-location-card .public-location-address,
#public-catalog .public-location-card .public-location-services,
#public-catalog .public-map-caption span {
  display: none !important;
}

#public-catalog .public-map-caption {
  display: grid !important;
  gap: 3px !important;
  padding: 12px 14px !important;
}

#public-catalog .public-map-caption strong {
  font-size: .95rem !important;
}

#public-catalog .public-map-caption small {
  font-size: .78rem !important;
}

@media (max-width: 560px) {
  #public-catalog .public-location-intro {
    align-items: stretch !important;
  }

  #public-catalog .public-location-intro .compact-link {
    align-self: stretch !important;
    justify-content: center !important;
    min-height: 40px !important;
  }

  #public-catalog .public-location-card.public-location-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #public-catalog .public-location-card .public-location-meta {
    text-align: left !important;
  }
}

/* PUBLIC CINEPOLIS-LIKE MOBILE FLOW 20260603-103 */
#public-catalog .public-mobile-location-rail {
  display: none !important;
}

#public-catalog .public-mobile-main-nav {
  display: none !important;
}

#public-catalog .public-mobile-header {
  display: none !important;
}

@media (max-width: 760px) {
  #public-catalog.public-catalog-shell:not(.hidden) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: calc(126px + env(safe-area-inset-top, 0px)) 12px calc(104px + env(safe-area-inset-bottom, 0px)) !important;
    scroll-padding-top: calc(126px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden):not([data-public-panel-active="rooms"]) {
    padding-top: calc(86px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(86px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-panel-content,
  #public-catalog .public-section-nav,
  #public-catalog .public-location-picker,
  #public-catalog .public-property-group,
  #public-catalog .public-contact-panel {
    scroll-margin-top: calc(126px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell:not([data-public-panel-active="rooms"]) .public-panel-content,
  #public-catalog.public-catalog-shell:not([data-public-panel-active="rooms"]) .public-section-nav,
  #public-catalog.public-catalog-shell:not([data-public-panel-active="rooms"]) .public-location-picker,
  #public-catalog.public-catalog-shell:not([data-public-panel-active="rooms"]) .public-contact-panel {
    scroll-margin-top: calc(86px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-catalog-hero,
  #public-catalog .public-panel-card,
  #public-catalog .public-location-picker,
  #public-catalog .public-property-group,
  #public-catalog .public-contact-panel,
  #public-catalog .public-summary-panel {
    border-radius: 18px !important;
  }

  #public-catalog .public-mobile-main-nav {
    display: none !important;
  }

  #public-catalog .public-mobile-header,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header,
  :root[data-theme="dark"] #public-catalog .public-mobile-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 84 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    min-height: calc(66px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 8px !important;
    border-bottom: 1px solid rgba(220, 228, 241, .82) !important;
    background: rgba(248, 251, 255, .98) !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(18px) !important;
  }

  #public-catalog .public-mobile-logo {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-width: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  #public-catalog button.public-mobile-logo,
  #public-catalog button.public-mobile-logo:not(.secondary):not(.ghost):not(.danger),
  #public-catalog button.public-mobile-logo:hover,
  #public-catalog button.public-mobile-logo:not(.secondary):not(.ghost):not(.danger):hover,
  #public-catalog button.public-mobile-logo:focus,
  #public-catalog button.public-mobile-logo:not(.secondary):not(.ghost):not(.danger):focus,
  #public-catalog button.public-mobile-logo:active {
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    color: #0f2745 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;
    transform: none !important;
  }

  #public-catalog .public-house-logo {
    position: relative !important;
    display: grid !important;
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 auto !important;
    place-items: center !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #6ea8ff, #2f6fe4) !important;
    box-shadow: 0 10px 22px rgba(47, 111, 228, .2) !important;
  }

  #public-catalog .public-house-logo::before {
    content: "" !important;
    width: 26px !important;
    height: 26px !important;
    background: #ffffff !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-mobile-logo strong,
  #public-catalog .public-mobile-logo small {
    display: block !important;
    line-height: 1.1 !important;
  }

  #public-catalog .public-mobile-logo strong {
    color: #0f2745 !important;
    font-size: 1.02rem !important;
    font-weight: 950 !important;
  }

  #public-catalog .public-mobile-logo small {
    margin-top: 3px !important;
    color: #71809b !important;
    font-size: .72rem !important;
    font-weight: 850 !important;
  }

  #public-catalog .public-mobile-contact {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
  }

  #public-catalog .public-mobile-refresh,
  #public-catalog .public-mobile-contact a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    border: 1px solid #dce4f1 !important;
    border-radius: 999px !important;
    padding: 8px 11px !important;
    color: #2f6fe4 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    font-size: .78rem !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-mobile-refresh {
    position: relative !important;
    width: 40px !important;
    min-width: 40px !important;
    margin-right: 6px !important;
    padding: 0 !important;
    color: #2f6fe4 !important;
    border-color: #cfe0ff !important;
    background: #edf5ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
    font-size: 1.12rem !important;
    line-height: 1 !important;
  }

  #public-catalog .public-mobile-refresh::after {
    content: "" !important;
    position: absolute !important;
    right: -8px !important;
    width: 1px !important;
    height: 22px !important;
    background: #dce4f1 !important;
  }

  #public-catalog .public-mobile-contact a.public-contact-icon-btn {
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
    font-size: 0 !important;
  }

  #public-catalog .public-contact-icon {
    display: block !important;
    width: 21px !important;
    height: 21px !important;
    background: currentColor !important;
  }

  #public-catalog .public-contact-icon-phone {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1v3.5c0 .6-.4 1-1 1C10.8 21 3 13.2 3 3.7c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.2 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1v3.5c0 .6-.4 1-1 1C10.8 21 3 13.2 3 3.7c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.2 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-contact-icon-whatsapp {
    width: 23px !important;
    height: 23px !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C8.8 3 3 8.7 3 15.7c0 2.5.8 4.9 2.1 6.9L3.7 29l6.6-1.7c1.7.9 3.7 1.4 5.7 1.4 7.2 0 13-5.7 13-12.7S23.2 3 16 3Zm0 23.2c-1.8 0-3.5-.5-5-1.4l-.4-.2-3.9 1 1-3.8-.3-.4c-1.2-1.7-1.8-3.7-1.8-5.7 0-5.7 4.7-10.3 10.4-10.3s10.4 4.6 10.4 10.3S21.7 26.2 16 26.2Zm5.8-7.7c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.7.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.5-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.2-.7-1.7-1-2.3-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1.1 1.1-1.1 2.7s1.2 3.1 1.3 3.3c.2.2 2.3 3.5 5.6 4.9.8.3 1.4.5 1.9.7.8.2 1.5.2 2.1.1.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C8.8 3 3 8.7 3 15.7c0 2.5.8 4.9 2.1 6.9L3.7 29l6.6-1.7c1.7.9 3.7 1.4 5.7 1.4 7.2 0 13-5.7 13-12.7S23.2 3 16 3Zm0 23.2c-1.8 0-3.5-.5-5-1.4l-.4-.2-3.9 1 1-3.8-.3-.4c-1.2-1.7-1.8-3.7-1.8-5.7 0-5.7 4.7-10.3 10.4-10.3s10.4 4.6 10.4 10.3S21.7 26.2 16 26.2Zm5.8-7.7c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.7.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.5-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.2-.7-1.7-1-2.3-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1.1 1.1-1.1 2.7s1.2 3.1 1.3 3.3c.2.2 2.3 3.5 5.6 4.9.8.3 1.4.5 1.9.7.8.2 1.5.2 2.1.1.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-mobile-contact a.primary {
    border-color: transparent !important;
    color: #ffffff !important;
    background: #25d366 !important;
    box-shadow: 0 10px 18px rgba(37, 211, 102, .24) !important;
  }

  @media (max-width: 390px) {
    #public-catalog .public-mobile-logo strong {
      font-size: .92rem !important;
    }

    #public-catalog .public-mobile-logo small {
      font-size: .66rem !important;
    }

    #public-catalog .public-mobile-contact {
      gap: 6px !important;
    }

    #public-catalog .public-mobile-contact a {
      min-height: 36px !important;
      padding: 7px 8px !important;
      font-size: .72rem !important;
    }

    #public-catalog .public-mobile-refresh {
      width: 36px !important;
      min-width: 36px !important;
      margin-right: 5px !important;
      padding: 0 !important;
    }

    #public-catalog .public-mobile-contact a.public-contact-icon-btn {
      width: 36px !important;
      min-width: 36px !important;
      padding: 0 !important;
    }

    #public-catalog .public-contact-icon {
      width: 19px !important;
      height: 19px !important;
    }

    #public-catalog .public-contact-icon-whatsapp {
      width: 21px !important;
      height: 21px !important;
    }
  }

  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    position: fixed !important;
    top: calc(67px + env(safe-area-inset-top, 0px)) !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 83 !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 6px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 6px 9px 7px !important;
    border-top: 0 !important;
    border-bottom: 1px solid rgba(221, 232, 248, .9) !important;
    background: rgba(253, 254, 255, .98) !important;
    box-shadow: 0 8px 18px rgba(47, 111, 228, .055) !important;
    backdrop-filter: blur(16px) !important;
  }

  #public-catalog .public-location-tab {
    display: grid !important;
    grid-template-rows: 18px auto !important;
    place-items: center !important;
    gap: 1px !important;
    border: 1px solid #e4efff !important;
    border-radius: 999px !important;
    color: #3d7cf0 !important;
    background: #f3f8ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
    font-size: .64rem !important;
    font-weight: 950 !important;
    text-align: center !important;
  }

  #public-catalog .public-location-tab span {
    color: #3d7cf0 !important;
    font-size: .64rem !important;
    line-height: 1 !important;
    text-transform: none !important;
  }

  #public-catalog .public-location-pills {
    display: flex !important;
    gap: 6px !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x proximity !important;
    scrollbar-width: none !important;
  }

  #public-catalog .public-location-pills::-webkit-scrollbar {
    display: none !important;
  }

  #public-catalog .public-location-pills button {
    flex: 0 0 auto !important;
    display: grid !important;
    min-height: 34px !important;
    border: 1px solid #e6edf7 !important;
    border-radius: 999px !important;
    padding: 7px 11px !important;
    color: #25405f !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: none !important;
    scroll-snap-align: start !important;
    text-align: left !important;
  }

  #public-catalog .public-location-pills button strong {
    max-width: 122px !important;
    overflow: hidden !important;
    color: inherit !important;
    font-size: .74rem !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-location-pills button small {
    max-width: 132px !important;
    overflow: hidden !important;
    color: var(--rs-muted) !important;
    font-size: .62rem !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-location-pills button.active {
    border-color: #bdd5ff !important;
    color: #245fca !important;
    background: #e1edff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .82), 0 6px 14px rgba(47, 111, 228, .09) !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 9px 12px calc(9px + env(safe-area-inset-bottom, 0px)) !important;
    border: 0 !important;
    border-top: 1px solid rgba(220, 228, 241, .78) !important;
    border-radius: 22px 22px 0 0 !important;
    background: rgba(248, 251, 255, .98) !important;
    box-shadow: 0 -12px 34px rgba(47, 111, 228, .12) !important;
  }

  #public-catalog .public-bottom-nav button {
    position: relative !important;
    display: grid !important;
    grid-template-rows: 32px auto !important;
    place-items: center !important;
    gap: 3px !important;
    min-height: 62px !important;
    border: 1px solid transparent !important;
    border-radius: 18px !important;
    padding: 9px 3px 7px !important;
    color: #71809b !important;
    background: rgba(255, 255, 255, .64) !important;
    font-size: .74rem !important;
  }

  #public-catalog .public-bottom-nav button::before {
    display: none !important;
  }

  #public-catalog .public-nav-icon {
    display: block !important;
    width: 29px !important;
    height: 29px !important;
    color: inherit !important;
  }

  #public-catalog .public-nav-icon::before,
  #public-catalog .public-location-tab-icon::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    background: currentColor !important;
    -webkit-mask: var(--nav-icon) center / contain no-repeat !important;
    mask: var(--nav-icon) center / contain no-repeat !important;
  }

  #public-catalog .public-nav-icon-home {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") !important;
  }

  #public-catalog .public-nav-icon-pin,
  #public-catalog .public-location-tab-icon {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5c-4 0-7.2 3.1-7.2 7 0 5.2 7.2 12 7.2 12s7.2-6.8 7.2-12c0-3.9-3.2-7-7.2-7Zm0 9.6a2.6 2.6 0 1 1 0-5.2 2.6 2.6 0 0 1 0 5.2Z'/%3E%3C/svg%3E") !important;
  }

  #public-catalog .public-nav-icon-bed {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.5c0-.8.7-1.5 1.5-1.5S6 4.7 6 5.5V13h15c.6 0 1 .4 1 1v5h-2v-2H5v2H3V5.5Zm5 2C8 6.7 8.7 6 9.5 6h4c.8 0 1.5.7 1.5 1.5V12H8V7.5Zm8.5 1H19c1.1 0 2 .9 2 2V12h-4.5V8.5Z'/%3E%3C/svg%3E") !important;
  }

  #public-catalog .public-nav-icon-phone {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 3.5 9.8 7c.4.4.5 1 .2 1.5l-1.1 2c.9 1.8 2.8 3.7 4.6 4.6l2-1.1c.5-.3 1.1-.2 1.5.2l3.5 3.2c.5.5.6 1.2.2 1.8-.9 1.4-2.4 2.3-4.1 2.3C9.2 21.5 2.5 14.8 2.5 7.4c0-1.7.9-3.2 2.3-4.1.6-.4 1.3-.3 1.8.2Z'/%3E%3C/svg%3E") !important;
  }

  #public-catalog .public-nav-label {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-bottom-nav button.active {
    border-color: #dbe8ff !important;
    color: #2f6fe4 !important;
    background: #edf5ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75), 0 10px 20px rgba(47, 111, 228, .12) !important;
  }

  #public-catalog .public-bottom-nav button.active::after {
    content: "" !important;
    position: absolute !important;
    top: 7px !important;
    left: 50% !important;
    width: 58px !important;
    height: 38px !important;
    transform: translateX(-50%) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .78) !important;
    z-index: -1 !important;
  }

  #public-catalog .public-location-tab-icon {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    color: #2f6fe4 !important;
  }
}

/* PUBLIC CACHE-SAFE OVERRIDES 20260603-103 */
#public-catalog #close-public-catalog,
#public-catalog button#close-public-catalog,
#public-catalog .public-hero-actions #close-public-catalog,
#public-catalog .public-contact-actions #close-public-catalog {
  display: none !important;
}

#public-catalog button.public-mobile-logo,
#public-catalog button.public-clean-brand,
#public-catalog [data-close-public-catalog] {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    border-bottom-color: #edf3fb !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow: 0 6px 14px rgba(47, 111, 228, .045) !important;
  }

  #public-catalog .public-location-tab {
    border-color: #edf3ff !important;
    color: #4b82ee !important;
    background: #f8fbff !important;
  }

  #public-catalog .public-location-tab span {
    color: #4b82ee !important;
  }

  #public-catalog .public-location-pills button {
    border-color: #eef3fa !important;
    color: #38516d !important;
    background: #ffffff !important;
  }

  #public-catalog .public-location-pills button.active {
    border-color: #b8d2ff !important;
    color: #1f5fca !important;
    background: #dfeeff !important;
    box-shadow: 0 7px 16px rgba(47, 111, 228, .12) !important;
  }
}

/* PUBLIC SOFT SELECTOR BAR 20260603-103 */
@media (max-width: 760px) {
  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    border-bottom: 1px solid #eef5ff !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
    box-shadow: 0 5px 12px rgba(31, 95, 202, .035) !important;
  }

  #public-catalog .public-location-tab,
  :root:not([data-theme="dark"]) #public-catalog .public-location-tab,
  :root[data-theme="dark"] #public-catalog .public-location-tab {
    border-color: #eef5ff !important;
    color: #6b98ee !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(244, 248, 255, .95) !important;
  }

  #public-catalog .public-location-tab span,
  #public-catalog .public-location-tab-icon {
    color: #6b98ee !important;
  }

  #public-catalog .public-location-pills button,
  :root:not([data-theme="dark"]) #public-catalog .public-location-pills button,
  :root[data-theme="dark"] #public-catalog .public-location-pills button {
    position: relative !important;
    border: 1px solid #edf3fb !important;
    color: #536a84 !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95) !important;
  }

  #public-catalog .public-location-pills button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-location-pills button.active,
  :root[data-theme="dark"] #public-catalog .public-location-pills button.active {
    border-color: #8db8ff !important;
    color: #174ea6 !important;
    background: #eaf3ff !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, .92),
      0 0 0 2px rgba(141, 184, 255, .22),
      0 7px 16px rgba(47, 111, 228, .10) !important;
  }

  #public-catalog .public-location-pills button.active::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 4px !important;
    width: 26px !important;
    height: 3px !important;
    transform: translateX(-50%) !important;
    border-radius: 999px !important;
    background: #2f6fe4 !important;
  }
}

/* PUBLIC TOP HEADER MOTION 20260603-103 */
@media (max-width: 760px) {
  #public-catalog .public-mobile-header,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header,
  :root[data-theme="dark"] #public-catalog .public-mobile-header {
    transform: translateY(0) !important;
    opacity: 1 !important;
    transition:
      transform .28s cubic-bezier(.22, 1, .36, 1),
      opacity .2s ease,
      box-shadow .22s ease !important;
    will-change: transform, opacity !important;
  }

  #public-catalog .public-mobile-header.is-hidden,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header.is-hidden,
  :root[data-theme="dark"] #public-catalog .public-mobile-header.is-hidden {
    transform: translateY(calc(-100% - 10px)) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    box-shadow: none !important;
  }

  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    transform: translateY(0) !important;
    opacity: 1 !important;
    transition:
      top .28s cubic-bezier(.22, 1, .36, 1),
      box-shadow .22s ease !important;
    will-change: top !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] {
    padding-top: calc(72px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(72px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-location-pills {
    scroll-behavior: smooth !important;
  }

  #public-catalog .public-location-pills button {
    transition:
      background .2s ease,
      border-color .2s ease,
      color .2s ease,
      box-shadow .2s ease,
      transform .2s ease !important;
  }

  #public-catalog .public-location-pills button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-location-pills button.active,
  :root[data-theme="dark"] #public-catalog .public-location-pills button.active {
    transform: translateY(-1px) !important;
  }

  #public-catalog .public-location-pills button.active::after {
    top: auto !important;
    bottom: 4px !important;
    width: 30px !important;
    height: 3px !important;
    background: #4d8cff !important;
  }
}

/* PUBLIC TOP BARS SPACING AND MOTION 20260603-103 */
@media (max-width: 760px) {
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] {
    padding-top: calc(146px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(146px + env(safe-area-inset-top, 0px)) !important;
    transition: padding-top .32s cubic-bezier(.2, .9, .2, 1) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-property-group {
    scroll-margin-top: calc(146px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-mobile-header,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header,
  :root[data-theme="dark"] #public-catalog .public-mobile-header {
    transform: translate3d(0, 0, 0) scale(1) !important;
    transition:
      transform .34s cubic-bezier(.16, 1, .3, 1),
      opacity .24s ease,
      box-shadow .24s ease,
      filter .24s ease !important;
  }

  #public-catalog .public-mobile-header.is-hidden,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header.is-hidden,
  :root[data-theme="dark"] #public-catalog .public-mobile-header.is-hidden {
    transform: translate3d(0, calc(-100% - 12px), 0) scale(.985) !important;
    opacity: 0 !important;
    filter: blur(.3px) !important;
  }

  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    transition:
      top .34s cubic-bezier(.16, 1, .3, 1),
      transform .28s ease,
      box-shadow .24s ease !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(10px + env(safe-area-inset-top, 0px)) !important;
    box-shadow: 0 8px 20px rgba(47, 111, 228, .07) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] {
    padding-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-property-group {
    scroll-margin-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* PUBLIC MOBILE CLEANUP 20260603-103 */
@media (max-width: 760px) {
  #public-catalog .public-section-nav {
    display: none !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] {
    padding-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-property-group {
    scroll-margin-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] {
    padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-property-group {
    scroll-margin-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-mobile-header {
    min-height: calc(58px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(7px + env(safe-area-inset-top, 0px)) 12px 7px !important;
  }

  #public-catalog button.public-mobile-logo,
  #public-catalog button.public-mobile-logo:hover,
  #public-catalog button.public-mobile-logo:focus,
  #public-catalog button.public-mobile-logo:active {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 52vw !important;
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    color: #0f2745 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: 0 !important;
    text-decoration: none !important;
  }

  #public-catalog .public-house-logo {
    width: 39px !important;
    height: 39px !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, #7fb3ff, #3478ef) !important;
    box-shadow: 0 8px 18px rgba(47, 111, 228, .18) !important;
  }

  #public-catalog .public-house-logo::before {
    width: 24px !important;
    height: 24px !important;
  }

  #public-catalog .public-mobile-logo strong {
    font-size: .98rem !important;
  }

  #public-catalog .public-mobile-logo small {
    font-size: .68rem !important;
  }

  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    top: calc(61px + env(safe-area-inset-top, 0px)) !important;
    padding-top: 5px !important;
    padding-bottom: 6px !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(6px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* PUBLIC BOTTOM NAV CENTERED 20260603-103 */
@media (max-width: 760px) {
  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid #edf3fb !important;
    border-radius: 20px 20px 0 0 !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 -8px 24px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(18px) !important;
  }

  #public-catalog .public-bottom-nav button,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button {
    display: grid !important;
    grid-template-rows: 26px auto !important;
    place-items: center !important;
    justify-content: center !important;
    align-content: center !important;
    gap: 3px !important;
    min-width: 0 !important;
    min-height: 58px !important;
    border: 1px solid transparent !important;
    border-radius: 16px !important;
    padding: 7px 2px 6px !important;
    color: #7c8ca3 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .66rem !important;
    font-weight: 850 !important;
    text-align: center !important;
    line-height: 1 !important;
  }

  #public-catalog .public-bottom-nav button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button.active,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button.active {
    border-color: #dceaff !important;
    color: #2f6fe4 !important;
    background: #f1f7ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .88), 0 8px 16px rgba(47, 111, 228, .08) !important;
  }

  #public-catalog .public-bottom-nav button[data-public-chat] {
    color: #18a85d !important;
  }

  #public-catalog .public-bottom-nav button[data-public-chat] .public-nav-icon {
    color: #18a85d !important;
  }

  #public-catalog .public-bottom-nav button.active::after {
    display: none !important;
  }

  #public-catalog .public-bottom-nav .public-nav-icon {
    width: 24px !important;
    height: 24px !important;
  }

  #public-catalog .public-bottom-nav .public-nav-label {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: inherit !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-nav-icon-chat {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4.5C4 3.7 4.7 3 5.5 3h13c.8 0 1.5.7 1.5 1.5v9c0 .8-.7 1.5-1.5 1.5H9l-5 4v-14.5Zm4 4h8V7H8v1.5Zm0 3h6v-1.5H8v1.5Z'/%3E%3C/svg%3E") !important;
  }
}

/* PUBLIC LOCATION TAB RAIL 20260603-103 */
@media (max-width: 760px) {
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
    transition: padding-top .32s cubic-bezier(.2, .9, .2, 1) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(112px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* PUBLIC ZONES MAP ONLY 20260603-107 */
#public-catalog[data-public-panel-active="locations"] .public-location-picker {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 22px !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-caption {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 14px !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-caption strong {
  font-size: .98rem !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only iframe {
  pointer-events: none !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-caption-main {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-note {
  display: block !important;
  max-width: 520px !important;
  color: #64748b !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-floating-link {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 4 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  min-height: 52px !important;
  padding: 12px 18px !important;
  color: #174ea6 !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 14px 30px rgba(37, 99, 235, .22) !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  backdrop-filter: blur(14px) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-google-maps-logo {
  display: block !important;
  flex: 0 0 auto !important;
  width: 34px !important;
  height: 34px !important;
  object-fit: contain !important;
}

@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="locations"] .public-location-picker {
    margin-bottom: calc(90px + env(safe-area-inset-bottom, 0px)) !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-card {
    border-radius: 18px !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08) !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-visual,
  #public-catalog[data-public-panel-active="locations"] .public-map-card iframe {
    min-height: min(62vh, 520px) !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-caption {
    align-items: stretch !important;
    flex-direction: column !important;
    padding: 13px 12px 16px !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-floating-link {
    top: 12px !important;
    right: 12px !important;
    min-height: 56px !important;
    padding: 13px 16px !important;
    font-size: 1.02rem !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-google-maps-logo {
    width: 38px !important;
    height: 38px !important;
  }
}

/* PUBLIC SECONDARY RAIL BREATHING ROOM 20260603-108 */
@media (max-width: 760px) {
  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    top: calc(64px + env(safe-area-inset-top, 0px)) !important;
    min-height: 58px !important;
    padding: 9px 10px 10px !important;
    overflow: visible !important;
    border-bottom: 1px solid #eaf2ff !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 8px 18px rgba(47, 111, 228, .065) !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(12px + env(safe-area-inset-top, 0px)) !important;
    box-shadow: 0 10px 22px rgba(47, 111, 228, .08) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(126px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(126px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-property-group,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(126px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-property-group,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-location-tab {
    align-self: stretch !important;
    min-height: 42px !important;
  }

  #public-catalog .public-location-pills {
    align-items: stretch !important;
    min-height: 42px !important;
    padding-right: calc(100vw - 170px) !important;
    scroll-padding-left: 0 !important;
  }

  #public-catalog .public-location-pills button {
    min-height: 42px !important;
    padding: 9px 18px !important;
  }

  #public-catalog .public-location-pills button.active::after {
    bottom: 5px !important;
  }
}

/* PUBLIC SECONDARY RAIL NO CLIP 20260603-109 */
@media (max-width: 760px) {
  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    top: calc(66px + env(safe-area-inset-top, 0px)) !important;
    min-height: 68px !important;
    padding: 13px 10px 12px !important;
    align-items: center !important;
    overflow: visible !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(16px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(138px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(138px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(86px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(86px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog .public-location-tab {
    min-height: 44px !important;
  }

  #public-catalog .public-location-pills {
    min-height: 48px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }

  #public-catalog .public-location-pills button {
    min-height: 44px !important;
    transform: none !important;
  }

  #public-catalog .public-location-pills button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-location-pills button.active,
  :root[data-theme="dark"] #public-catalog .public-location-pills button.active {
    transform: none !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, .92),
      0 0 0 1px rgba(141, 184, 255, .26),
      0 6px 14px rgba(47, 111, 228, .10) !important;
  }

  #public-catalog .public-location-pills button.active::after {
    top: auto !important;
    bottom: 6px !important;
  }
}

/* PUBLIC RAIL STABLE SELECT 20260603-111 */
@media (max-width: 760px) {
  #public-catalog .public-location-pills {
    scroll-snap-type: none !important;
    scroll-behavior: auto !important;
    overscroll-behavior-x: contain !important;
  }

  #public-catalog .public-location-pills button {
    scroll-snap-align: none !important;
  }

  #public-catalog .public-location-pills button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-location-pills button.active,
  :root[data-theme="dark"] #public-catalog .public-location-pills button.active {
    transition:
      background .18s ease,
      border-color .18s ease,
      color .18s ease,
      box-shadow .18s ease !important;
  }
}

/* PUBLIC COLLAPSED HEADER GAP FIX 20260603-112 */
@media (max-width: 760px) {
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] {
    transition:
      padding-top .28s cubic-bezier(.16, 1, .3, 1),
      scroll-padding-top .28s cubic-bezier(.16, 1, .3, 1) !important;
  }

  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(6px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(68px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(68px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-property-group,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(68px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* PUBLIC COLLAPSED HEADER TIGHT GAP 20260603-113 */
@media (max-width: 760px) {
  #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog.public-header-hidden .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog.public-header-hidden .public-mobile-location-rail {
    top: calc(0px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"],
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] {
    padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
    scroll-padding-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }

  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="rooms"] .public-property-group,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell.public-header-hidden:not(.hidden)[data-public-panel-active="locations"] .public-location-picker {
    scroll-margin-top: calc(58px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* PUBLIC AI CHAT 20260603-114 */
#public-ai-chat-host:empty {
  display: none !important;
}

#public-catalog .public-ai-chat-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 128 !important;
  background: rgba(15, 23, 42, .30) !important;
  backdrop-filter: blur(4px) !important;
}

#public-catalog .public-ai-chat-panel {
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 129 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto !important;
  width: min(420px, calc(100vw - 28px)) !important;
  max-height: min(680px, calc(100vh - 36px)) !important;
  overflow: hidden !important;
  border: 1px solid #dbeafe !important;
  border-radius: 28px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .22) !important;
}

#public-catalog .public-ai-chat-panel header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 16px 16px 12px !important;
  border-bottom: 1px solid #edf4ff !important;
  background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
}

#public-catalog .public-ai-chat-panel header strong {
  display: block !important;
  color: #0f2745 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-ai-chat-panel header small {
  display: block !important;
  color: #64748b !important;
  font-size: .76rem !important;
  font-weight: 800 !important;
}

#public-catalog .public-ai-chat-panel header button {
  width: 38px !important;
  height: 38px !important;
  min-height: 0 !important;
  border: 1px solid #e6eefb !important;
  border-radius: 999px !important;
  padding: 0 !important;
  color: #64748b !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
}

#public-catalog .public-ai-chat-messages {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  min-height: 240px !important;
  overflow-y: auto !important;
  padding: 14px 14px 10px !important;
  background: #f8fbff !important;
}

#public-catalog .public-ai-message {
  display: grid !important;
  gap: 4px !important;
  max-width: 88% !important;
}

#public-catalog .public-ai-message span {
  color: #8292a8 !important;
  font-size: .68rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-ai-message div {
  border: 1px solid #e6eefb !important;
  border-radius: 18px !important;
  padding: 10px 12px !important;
  color: #10233f !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .045) !important;
}

#public-catalog .public-ai-message p {
  margin: 0 0 7px !important;
  color: inherit !important;
  font-size: .9rem !important;
  font-weight: 650 !important;
  line-height: 1.38 !important;
}

#public-catalog .public-ai-message p:last-child {
  margin-bottom: 0 !important;
}

#public-catalog .public-ai-message.user {
  justify-self: end !important;
}

#public-catalog .public-ai-message.user span {
  text-align: right !important;
}

#public-catalog .public-ai-message.user div {
  border-color: #2f6fe4 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #3d7cf0, #245fca) !important;
}

#public-catalog .public-ai-chat-prompts {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding: 10px 14px !important;
  scrollbar-width: none !important;
}

#public-catalog .public-ai-chat-prompts::-webkit-scrollbar {
  display: none !important;
}

#public-catalog .public-ai-chat-prompts button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  color: #2563eb !important;
  background: #eff6ff !important;
  box-shadow: none !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-ai-chat-compose {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  padding: 0 14px 12px !important;
}

#public-catalog .public-ai-chat-compose input {
  width: 100% !important;
  min-height: 46px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 16px !important;
  padding: 0 13px !important;
  color: #10233f !important;
  background: #ffffff !important;
  font-size: .95rem !important;
  font-weight: 750 !important;
}

#public-catalog .public-ai-chat-compose button {
  min-height: 46px !important;
  border-radius: 16px !important;
  padding: 0 15px !important;
  background: #2563eb !important;
  font-size: .88rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-ai-chat-note {
  margin: 0 !important;
  padding: 0 16px 14px !important;
  color: #8292a8 !important;
  font-size: .72rem !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

@media (max-width: 760px) {
  #public-catalog .public-ai-chat-panel {
    left: 10px !important;
    right: 10px !important;
    bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-height: min(74vh, 640px) !important;
    border-radius: 24px !important;
  }

  #public-catalog .public-ai-chat-messages {
    min-height: 250px !important;
  }
}

/* PUBLIC AI CHAT FULL PAGE 20260603-115 */
@media (max-width: 760px) {
  #public-catalog .public-ai-chat-backdrop {
    background: #f8fbff !important;
    backdrop-filter: none !important;
  }

  #public-catalog .public-ai-chat-panel {
    inset: 0 !important;
    z-index: 140 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    grid-template-rows: auto minmax(0, 1fr) auto auto auto !important;
    background: #f8fbff !important;
  }

  #public-catalog .public-ai-chat-panel header {
    min-height: calc(66px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 16px 10px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .07) !important;
  }

  #public-catalog .public-ai-chat-panel header strong {
    font-size: 1.08rem !important;
  }

  #public-catalog .public-ai-chat-panel header small {
    font-size: .78rem !important;
  }

  #public-catalog .public-ai-chat-panel header button {
    width: 44px !important;
    height: 44px !important;
    font-size: 1.55rem !important;
  }

  #public-catalog .public-ai-chat-messages {
    min-height: 0 !important;
    padding: 18px 14px 14px !important;
    background:
      radial-gradient(circle at top right, rgba(47, 111, 228, .10), transparent 34%),
      #f8fbff !important;
  }

  #public-catalog .public-ai-message {
    max-width: 94% !important;
  }

  #public-catalog .public-ai-message div {
    border-radius: 20px !important;
    padding: 12px 13px !important;
  }

  #public-catalog .public-ai-message p {
    font-size: .95rem !important;
  }

  #public-catalog .public-ai-chat-prompts {
    padding: 10px 14px 8px !important;
    background: rgba(248, 251, 255, .96) !important;
  }

  #public-catalog .public-ai-chat-prompts button {
    min-height: 38px !important;
    padding: 9px 13px !important;
    font-size: .82rem !important;
  }

  #public-catalog .public-ai-chat-compose {
    padding: 8px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 -8px 24px rgba(15, 23, 42, .07) !important;
  }

  #public-catalog .public-ai-chat-compose input {
    min-height: 52px !important;
    border-radius: 18px !important;
    font-size: 1rem !important;
  }

  #public-catalog .public-ai-chat-compose button {
    min-height: 52px !important;
    border-radius: 18px !important;
    padding: 0 17px !important;
  }

  #public-catalog .public-ai-chat-note {
    padding: 0 14px 10px !important;
    background: #ffffff !important;
    text-align: center !important;
  }
}

/* PUBLIC GENERAL ZONES MAP 20260604-141 */
#public-catalog .public-general-map-card {
  margin-bottom: 14px !important;
  overflow: hidden !important;
}

#public-catalog .public-general-map-head {
  position: relative !important;
  align-items: center !important;
}

#public-catalog .public-general-map-head .public-map-floating-link {
  position: static !important;
  inset: auto !important;
  min-height: 44px !important;
  padding: 9px 12px !important;
  font-size: .86rem !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .12) !important;
}

#public-catalog .public-general-map-head .public-google-maps-logo {
  width: 28px !important;
  height: 28px !important;
}

#public-catalog .public-general-map-visual {
  display: grid !important;
  gap: 0 !important;
}

#public-catalog .public-general-map-stage {
  position: relative !important;
  min-height: 360px !important;
  overflow: hidden !important;
  border-bottom: 1px solid #dbeafe !important;
  background: linear-gradient(180deg, #eff7ff 0%, #e7f1ff 100%) !important;
}

#public-catalog .public-general-map-stage iframe,
#public-catalog .public-general-map-visual iframe {
  display: block !important;
  width: 100% !important;
  min-height: 360px !important;
  height: 100% !important;
  border: 0 !important;
  background: #eef6ff !important;
  filter: saturate(.92) contrast(.96) brightness(1.03) !important;
}

#public-catalog .public-leaflet-shell {
  position: relative !important;
  width: 100% !important;
  min-height: 360px !important;
  height: 100% !important;
  overflow: hidden !important;
  background: #eef6ff !important;
}

#public-catalog .public-map-coordinate-overlays {
  position: absolute !important;
  inset: 0 !important;
  z-index: 850 !important;
  pointer-events: none !important;
}

#public-catalog .public-map-coordinate-circle {
  position: absolute !important;
  left: var(--map-x, 50%) !important;
  top: var(--map-y, 50%) !important;
  display: grid !important;
  place-items: center !important;
  width: var(--map-size, 160px) !important;
  height: var(--map-size, 160px) !important;
  border: 4px solid rgba(37, 99, 235, .9) !important;
  border-radius: 999px !important;
  color: #1e4f8f !important;
  background: rgba(96, 165, 250, .22) !important;
  box-shadow: 0 0 0 8px rgba(147, 197, 253, .18), 0 12px 34px rgba(37, 99, 235, .2) !important;
  opacity: .95 !important;
  transform: translate(-50%, -50%) !important;
  transition: opacity .12s ease, width .12s ease, height .12s ease, left .12s ease, top .12s ease !important;
}

#public-catalog .public-map-coordinate-circle.is-visible {
  opacity: 1 !important;
}

#public-catalog .public-map-coordinate-circle b {
  max-width: min(72vw, 220px) !important;
  overflow: hidden !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 999px !important;
  padding: 7px 10px !important;
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .95) !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .16) !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-map-coordinate-circle.small {
  border-width: 3px !important;
  background: rgba(96, 165, 250, .18) !important;
}

#public-catalog .public-map-coordinate-circle.small b {
  max-width: 120px !important;
  font-size: .68rem !important;
}

#public-catalog .public-map-coordinate-circle.active {
  border-color: #2563eb !important;
  background: rgba(37, 99, 235, .24) !important;
}

#public-catalog .public-static-map-rings {
  position: absolute !important;
  inset: 0 !important;
  z-index: 875 !important;
  pointer-events: none !important;
}

#public-catalog .public-static-map-ring {
  position: absolute !important;
  left: var(--x, 50%) !important;
  top: var(--y, 50%) !important;
  display: grid !important;
  place-items: center !important;
  width: var(--size, 120px) !important;
  height: var(--size, 120px) !important;
  border: 4px solid rgba(37, 99, 235, .92) !important;
  border-radius: 999px !important;
  background: rgba(96, 165, 250, .20) !important;
  box-shadow: 0 0 0 8px rgba(147, 197, 253, .18), 0 14px 34px rgba(37, 99, 235, .18) !important;
  transform: translate(-50%, -50%) !important;
}

#public-catalog .public-static-map-ring b {
  max-width: 82% !important;
  overflow: hidden !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 999px !important;
  padding: 6px 9px !important;
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .14) !important;
  font-size: .68rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-static-map-ring.active {
  border-color: #2563eb !important;
  background: rgba(37, 99, 235, .24) !important;
}

#public-catalog .public-static-single-ring .public-static-map-ring b {
  padding: 7px 10px !important;
  font-size: .78rem !important;
}

#public-catalog .public-map-fallback {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  min-height: 360px !important;
  height: 100% !important;
  border: 0 !important;
  opacity: 1 !important;
  transition: opacity .2s ease !important;
}

#public-catalog .public-leaflet-map {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 100% !important;
  min-height: 360px !important;
  height: 100% !important;
  background: transparent !important;
  filter: saturate(.96) contrast(.98) brightness(1.02) !important;
  opacity: 0 !important;
  transition: opacity .2s ease !important;
}

#public-catalog .public-leaflet-shell.leaflet-ready .public-leaflet-map {
  opacity: 1 !important;
}

#public-catalog .public-leaflet-area-icon {
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
}

#public-catalog .public-leaflet-area-marker {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  border: 4px solid rgba(37, 99, 235, .88) !important;
  border-radius: 999px !important;
  color: #1e4f8f !important;
  background: rgba(96, 165, 250, .20) !important;
  box-shadow: 0 0 0 8px rgba(147, 197, 253, .18), 0 14px 32px rgba(37, 99, 235, .18) !important;
  text-align: center !important;
}

#public-catalog .public-leaflet-area-marker b,
#public-catalog .public-leaflet-area-marker small {
  max-width: 78% !important;
  overflow: hidden !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 999px !important;
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .14) !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-leaflet-area-marker b {
  padding: 7px 10px !important;
  font-size: .74rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-leaflet-area-marker small {
  margin-top: 5px !important;
  padding: 5px 8px !important;
  font-size: .64rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-leaflet-area-icon.compact .public-leaflet-area-marker {
  border-width: 3px !important;
  background: rgba(96, 165, 250, .18) !important;
  box-shadow: 0 0 0 6px rgba(147, 197, 253, .16), 0 10px 22px rgba(37, 99, 235, .13) !important;
}

#public-catalog .public-leaflet-area-icon.compact .public-leaflet-area-marker b {
  max-width: 82% !important;
  padding: 4px 7px !important;
  font-size: .58rem !important;
}

#public-catalog .public-leaflet-area-icon.active .public-leaflet-area-marker {
  border-color: #2563eb !important;
  background: rgba(37, 99, 235, .24) !important;
}

#public-catalog .public-leaflet-shell.leaflet-ready.leaflet-tiles-ready .public-map-fallback {
  opacity: 0 !important;
  pointer-events: none !important;
}

#public-catalog .public-map-only .public-leaflet-map {
  min-height: 360px !important;
}

#public-catalog .public-leaflet-map .leaflet-control-container,
#public-catalog .public-leaflet-map .leaflet-pane,
#public-catalog .public-leaflet-map .leaflet-top,
#public-catalog .public-leaflet-map .leaflet-bottom {
  font-family: inherit !important;
}

#public-catalog .public-leaflet-map .leaflet-control-zoom a {
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .94) !important;
  border-color: #bfdbfe !important;
}

#public-catalog .public-leaflet-tooltip {
  border: 1px solid #bfdbfe !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .16) !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-leaflet-tooltip.active {
  color: #ffffff !important;
  background: linear-gradient(135deg, #93c5fd 0%, #60a5fa 100%) !important;
  border-color: #60a5fa !important;
}

#public-catalog .public-leaflet-tooltip::before {
  display: none !important;
}

#public-catalog .public-map-card iframe,
#public-catalog .public-general-map-stage iframe,
#public-catalog .public-map-only iframe {
  pointer-events: auto !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

#public-catalog .public-general-map-areas {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

#public-catalog .public-map-area-button,
#public-catalog .public-map-area-button:hover,
#public-catalog .public-map-area-button:focus,
#public-catalog .public-map-area-button:active {
  position: absolute !important;
  left: var(--x) !important;
  top: var(--y) !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  grid-template-areas: "dot title" "dot label" !important;
  align-items: center !important;
  column-gap: 9px !important;
  min-height: 44px !important;
  width: max-content !important;
  max-width: 198px !important;
  border: 1px solid rgba(147, 197, 253, .98) !important;
  border-radius: 999px !important;
  padding: 7px 12px 7px 8px !important;
  color: #1e4f8f !important;
  background: rgba(248, 252, 255, .94) !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .13), 0 0 0 6px rgba(147, 197, 253, .17) !important;
  text-align: left !important;
  transform: translate(-50%, -50%) !important;
  appearance: none !important;
  cursor: pointer !important;
  backdrop-filter: blur(14px) !important;
  pointer-events: auto !important;
}

#public-catalog .public-map-area-button.active {
  border-color: #60a5fa !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%) !important;
  box-shadow: 0 18px 34px rgba(37, 99, 235, .24), 0 0 0 9px rgba(96, 165, 250, .20) !important;
}

#public-catalog .public-map-area-dot {
  grid-area: dot !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  border: 4px solid #dbeafe !important;
  border-radius: 999px !important;
  background: radial-gradient(circle at 50% 50%, #ffffff 0 24%, #60a5fa 25% 100%) !important;
  box-shadow: 0 0 0 5px rgba(96, 165, 250, .13) !important;
}

#public-catalog .public-map-area-button.active .public-map-area-dot {
  border-color: rgba(255, 255, 255, .76) !important;
  background: #ffffff !important;
}

#public-catalog .public-map-area-button strong {
  grid-area: title !important;
  color: inherit !important;
  font-size: .66rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

#public-catalog .public-map-area-button small {
  grid-area: label !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: .80rem !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog button.public-map-area-button:not(.secondary):not(.ghost):not(.danger),
#public-catalog button.public-map-area-button:not(.secondary):not(.ghost):not(.danger):hover,
#public-catalog button.public-map-area-button:not(.secondary):not(.ghost):not(.danger):focus,
#public-catalog button.public-map-area-button:not(.secondary):not(.ghost):not(.danger):active {
  border: 1px solid rgba(147, 197, 253, .98) !important;
  color: #1e4f8f !important;
  background: rgba(248, 252, 255, .94) !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .13), 0 0 0 6px rgba(147, 197, 253, .17) !important;
}

#public-catalog button.public-map-area-button.active:not(.secondary):not(.ghost):not(.danger),
#public-catalog button.public-map-area-button.active:not(.secondary):not(.ghost):not(.danger):hover,
#public-catalog button.public-map-area-button.active:not(.secondary):not(.ghost):not(.danger):focus,
#public-catalog button.public-map-area-button.active:not(.secondary):not(.ghost):not(.danger):active {
  border-color: #60a5fa !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #93c5fd 0%, #60a5fa 100%) !important;
  box-shadow: 0 18px 34px rgba(37, 99, 235, .20), 0 0 0 9px rgba(147, 197, 253, .22) !important;
}

/* PUBLIC CITY IMAGE MAP 20260603-118 */
#public-catalog .public-city-map-image {
  min-height: 360px !important;
  border-bottom: 1px solid #e6eefb !important;
  background: #f8fbff !important;
  overflow: hidden !important;
}

#public-catalog .public-city-map-image.empty {
  display: grid !important;
  place-items: center !important;
  gap: 4px !important;
  color: #64748b !important;
}

#public-catalog .public-city-map-image svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
}

#public-catalog .public-city-map-image .city-ring {
  fill: rgba(255, 255, 255, .72) !important;
  stroke: #cfe0f5 !important;
  stroke-width: 1.1 !important;
}

#public-catalog .public-city-map-image .city-road {
  fill: none !important;
  stroke: #c6d8ee !important;
  stroke-width: 1.25 !important;
  stroke-linecap: round !important;
}

#public-catalog .public-city-map-image .city-road.main {
  stroke: #9fbbe0 !important;
  stroke-width: 2.2 !important;
}

#public-catalog .public-city-map-image .city-road.soft {
  stroke: #d9e7f5 !important;
  stroke-width: .85 !important;
  stroke-dasharray: 2 3 !important;
}

#public-catalog .public-city-map-image .zone-halo {
  fill: rgba(239, 68, 68, .18) !important;
  stroke: #ef4444 !important;
  stroke-width: 1.7 !important;
}

#public-catalog .public-city-map-image .zone-dot {
  fill: #dc2626 !important;
  stroke: #ffffff !important;
  stroke-width: 1 !important;
}

#public-catalog .public-city-map-image g.active .zone-halo {
  fill: rgba(239, 68, 68, .30) !important;
  stroke-width: 2.35 !important;
}

#public-catalog .public-city-map-image text {
  font-family: inherit !important;
  pointer-events: none !important;
}

#public-catalog .public-city-map-image .city-title {
  fill: #0f2745 !important;
  font-size: 5px !important;
  font-weight: 950 !important;
}

#public-catalog .public-city-map-image .city-subtitle {
  fill: #64748b !important;
  font-size: 3px !important;
  font-weight: 850 !important;
}

#public-catalog .public-city-map-image g text {
  fill: #7f1d1d !important;
  font-size: 3px !important;
  font-weight: 950 !important;
  paint-order: stroke !important;
  stroke: #ffffff !important;
  stroke-width: 1.35 !important;
}

#public-catalog .public-general-zone-list {
  display: grid !important;
  gap: 8px !important;
  padding: 12px !important;
  background: #f8fbff !important;
}

#public-catalog .public-general-zone-list button {
  display: grid !important;
  gap: 3px !important;
  width: 100% !important;
  min-height: 0 !important;
  border: 1px solid #dbeafe !important;
  border-radius: 16px !important;
  padding: 10px 12px !important;
  color: #29415f !important;
  background: #ffffff !important;
  box-shadow: none !important;
  text-align: left !important;
}

#public-catalog .public-general-zone-list button.active {
  border-color: #8db8ff !important;
  color: #174ea6 !important;
  background: #edf5ff !important;
  box-shadow: 0 8px 18px rgba(47, 111, 228, .08) !important;
}

#public-catalog .public-general-zone-list strong {
  color: inherit !important;
  font-size: .94rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-general-zone-list small {
  color: #64748b !important;
  font-size: .78rem !important;
  font-weight: 750 !important;
}

#public-catalog .public-map-radius.public-map-radius-button,
#public-catalog .public-map-radius.public-map-radius-button:hover,
#public-catalog .public-map-radius.public-map-radius-button:focus,
#public-catalog .public-map-radius.public-map-radius-button:active {
  z-index: 3 !important;
  display: grid !important;
  place-items: center !important;
  width: min(58vw, 310px) !important;
  max-width: 310px !important;
  min-width: 180px !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  border: 4px solid rgba(96, 165, 250, .92) !important;
  border-radius: 999px !important;
  padding: 0 !important;
  color: #1e4f8f !important;
  background: rgba(147, 197, 253, .17) !important;
  box-shadow: 0 0 0 999px rgba(255, 255, 255, .04), 0 16px 34px rgba(37, 99, 235, .16) !important;
  pointer-events: auto !important;
  appearance: none !important;
  cursor: pointer !important;
}

#public-catalog .public-map-radius.public-map-radius-button span {
  color: #1e4f8f !important;
  background: rgba(255, 255, 255, .94) !important;
  border: 1px solid #bfdbfe !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .14) !important;
}

#public-catalog button.public-map-radius.public-map-radius-button:not(.secondary):not(.ghost):not(.danger),
#public-catalog button.public-map-radius.public-map-radius-button:not(.secondary):not(.ghost):not(.danger):hover,
#public-catalog button.public-map-radius.public-map-radius-button:not(.secondary):not(.ghost):not(.danger):focus,
#public-catalog button.public-map-radius.public-map-radius-button:not(.secondary):not(.ghost):not(.danger):active {
  width: min(58vw, 310px) !important;
  max-width: 310px !important;
  min-width: 180px !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  border: 4px solid rgba(96, 165, 250, .92) !important;
  border-radius: 999px !important;
  color: #1e4f8f !important;
  background: rgba(147, 197, 253, .17) !important;
  box-shadow: 0 0 0 999px rgba(255, 255, 255, .04), 0 16px 34px rgba(37, 99, 235, .16) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-card iframe,
#public-catalog[data-public-panel-active="locations"] .public-map-only iframe,
#public-catalog[data-public-panel-active="locations"] .public-general-map-stage iframe {
  pointer-events: auto !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-floating-link {
  z-index: 900 !important;
}

@media (max-width: 760px) {
  #public-catalog button.public-location-tab,
  #public-catalog button.public-location-tab:hover,
  #public-catalog button.public-location-tab:focus,
  #public-catalog button.public-location-tab:active {
    display: grid !important;
    grid-template-rows: 18px auto !important;
    place-items: center !important;
    gap: 1px !important;
    min-width: 0 !important;
    min-height: 44px !important;
    border: 1px solid #e4efff !important;
    border-radius: 999px !important;
    padding: 0 !important;
    color: #3d7cf0 !important;
    background: #f3f8ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
    font-size: .64rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-align: center !important;
    transform: none !important;
  }

  #public-catalog .public-general-map-head {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  #public-catalog .public-general-map-head .public-map-floating-link {
    width: 100% !important;
  }

  #public-catalog .public-general-map-stage,
  #public-catalog .public-general-map-stage iframe,
  #public-catalog .public-leaflet-map,
  #public-catalog .public-general-map-visual iframe,
  #public-catalog .public-city-map-image,
  #public-catalog .public-city-map-image svg {
    min-height: min(44vh, 420px) !important;
  }

  #public-catalog .public-map-area-button,
  #public-catalog .public-map-area-button:hover,
  #public-catalog .public-map-area-button:focus,
  #public-catalog .public-map-area-button:active {
    grid-template-columns: 18px minmax(0, 1fr) !important;
    min-height: 42px !important;
    max-width: 154px !important;
    padding: 7px 9px 7px 7px !important;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .14), 0 0 0 5px rgba(147, 197, 253, .18) !important;
  }

  #public-catalog .public-map-area-dot {
    width: 18px !important;
    height: 18px !important;
    border-width: 3px !important;
  }

  #public-catalog .public-map-area-button strong {
    font-size: .58rem !important;
  }

  #public-catalog .public-map-area-button small {
    font-size: .74rem !important;
  }

  #public-catalog .public-map-radius.public-map-radius-button,
  #public-catalog button.public-map-radius.public-map-radius-button:not(.secondary):not(.ghost):not(.danger) {
    width: min(68vw, 260px) !important;
    min-width: 170px !important;
    max-width: 260px !important;
  }

  #public-catalog .public-static-map-rings {
    z-index: 980 !important;
  }

  #public-catalog .public-map-coordinate-overlays {
    z-index: 970 !important;
  }

  #public-catalog .public-static-single-ring .public-static-map-ring {
    --size: min(46vw, 170px) !important;
  }

  #public-catalog .public-general-map-stage .public-static-map-ring {
    width: min(var(--size, 80px), 24vw) !important;
    height: min(var(--size, 80px), 24vw) !important;
    border-width: 3px !important;
  }

  #public-catalog .public-general-map-stage .public-static-map-ring b {
    max-width: 88% !important;
    padding: 4px 6px !important;
    font-size: .56rem !important;
  }
}

/* ADMIN AND TENANT MOBILE NAV 20260604-141 */
.portal-bottom-nav {
  display: none !important;
}

/* ADMIN AND TENANT FIXED TOP BAR 20260604-141 */
@media (max-width: 760px) {
  #app.app-shell:not(.hidden),
  #tenant-app.tenant-shell:not(.hidden),
  :root:not([data-theme="dark"]) #app.app-shell:not(.hidden),
  :root:not([data-theme="dark"]) #tenant-app.tenant-shell:not(.hidden),
  :root[data-theme="dark"] #app.app-shell:not(.hidden),
  :root[data-theme="dark"] #tenant-app.tenant-shell:not(.hidden) {
    width: 100% !important;
    margin: 0 !important;
    padding-top: calc(78px + env(safe-area-inset-top, 0px)) !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
  }

  #app > .app-header,
  #tenant-app > .app-header,
  :root:not([data-theme="dark"]) #app > .app-header,
  :root:not([data-theme="dark"]) #tenant-app > .app-header,
  :root[data-theme="dark"] #app > .app-header,
  :root[data-theme="dark"] #tenant-app > .app-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 150 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(220, 228, 241, .82) !important;
    border-radius: 0 !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 9px !important;
    background: rgba(248, 251, 255, .98) !important;
    box-shadow: 0 10px 26px rgba(47, 111, 228, .10) !important;
    backdrop-filter: blur(18px) !important;
  }

  #app > .app-header .brand-lockup,
  #tenant-app > .app-header .brand-lockup {
    min-width: 0 !important;
    gap: 9px !important;
  }

  #app > .app-header .brand-mark,
  #tenant-app > .app-header .brand-mark {
    width: 42px !important;
    height: 42px !important;
    border-radius: 15px !important;
    font-size: .86rem !important;
    box-shadow: 0 10px 22px rgba(47, 111, 228, .16) !important;
  }

  #app > .app-header h1,
  #tenant-app > .app-header h1 {
    max-width: 48vw !important;
    overflow: hidden !important;
    margin: 0 !important;
    color: #0f2745 !important;
    font-size: 1rem !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #app > .app-header .app-kicker,
  #tenant-app > .app-header .app-kicker,
  #app > .app-header small,
  #tenant-app > .app-header small {
    max-width: 48vw !important;
    overflow: hidden !important;
    color: #71809b !important;
    font-size: .68rem !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #app > .app-header .header-actions,
  #tenant-app > .app-header .header-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    min-width: 0 !important;
  }

  #app > .app-header .header-actions .install-action,
  #tenant-app > .app-header .header-actions .install-action,
  #app > .app-header #theme-toggle {
    display: none !important;
  }

  #app > .app-header #logout,
  #tenant-app > .app-header #tenant-logout,
  :root:not([data-theme="dark"]) #app > .app-header #logout,
  :root:not([data-theme="dark"]) #tenant-app > .app-header #tenant-logout,
  :root[data-theme="dark"] #app > .app-header #logout,
  :root[data-theme="dark"] #tenant-app > .app-header #tenant-logout {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 40px !important;
    border: 1px solid #dbe8ff !important;
    border-radius: 999px !important;
    padding: 0 13px !important;
    color: #2f6fe4 !important;
    background: #edf5ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75) !important;
    font-size: .78rem !important;
    font-weight: 950 !important;
  }

  #app #admin-topbar,
  :root:not([data-theme="dark"]) #app #admin-topbar,
  :root[data-theme="dark"] #app #admin-topbar {
    margin-top: 0 !important;
  }

  #tenant-app #tenant-portal {
    padding-top: 0 !important;
  }
}

.portal-nav-icon {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  color: inherit !important;
}

.portal-nav-icon::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  background: currentColor !important;
  -webkit-mask: var(--portal-icon) center / contain no-repeat !important;
  mask: var(--portal-icon) center / contain no-repeat !important;
}

.nav-dashboard {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") !important;
}

.nav-payments {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6.5C4 5.1 5.1 4 6.5 4h11C18.9 4 20 5.1 20 6.5v11c0 1.4-1.1 2.5-2.5 2.5h-11C5.1 20 4 18.9 4 17.5v-11Zm3 1v3h10v-3H7Zm0 6v1.7h4v-1.7H7Zm6 0v1.7h4v-1.7h-4Z'/%3E%3C/svg%3E") !important;
}

.nav-properties {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 21V5.5C5 4.7 5.7 4 6.5 4h8c.8 0 1.5.7 1.5 1.5V21h-4v-5H9v5H5Zm3-12h2V7H8v2Zm5 0h2V7h-2v2Zm-5 4h2v-2H8v2Zm5 0h2v-2h-2v2Zm5 8v-9h1.5c.8 0 1.5.7 1.5 1.5V21h-3Z'/%3E%3C/svg%3E") !important;
}

.nav-rooms {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.5c0-.8.7-1.5 1.5-1.5S6 4.7 6 5.5V13h15c.6 0 1 .4 1 1v5h-2v-2H5v2H3V5.5Zm5 2C8 6.7 8.7 6 9.5 6h4c.8 0 1.5.7 1.5 1.5V12H8V7.5Zm8.5 1H19c1.1 0 2 .9 2 2V12h-4.5V8.5Z'/%3E%3C/svg%3E") !important;
}

.nav-tenants {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 8c.6-3.6 3.4-6 7-6s6.4 2.4 7 6H5Z'/%3E%3C/svg%3E") !important;
}

.nav-documents {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h8l4 4v14H6V3Zm7 1.8V8h3.2L13 4.8ZM8 12h8v-1.7H8V12Zm0 4h8v-1.7H8V16Z'/%3E%3C/svg%3E") !important;
}

.nav-calendar {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3h2v2h6V3h2v2h1.5C19.9 5 21 6.1 21 7.5v10c0 1.4-1.1 2.5-2.5 2.5h-13C4.1 20 3 18.9 3 17.5v-10C3 6.1 4.1 5 5.5 5H7V3Zm12 7H5v7.5c0 .3.2.5.5.5h13c.3 0 .5-.2.5-.5V10Z'/%3E%3C/svg%3E") !important;
}

.nav-expenses {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12v18l-3-1.6-3 1.6-3-1.6L6 21V3Zm3 5h6V6.5H9V8Zm0 4h6v-1.5H9V12Zm0 4h4v-1.5H9V16Z'/%3E%3C/svg%3E") !important;
}

.nav-reports {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19h14v2H5v-2Zm1-2V9h3v8H6Zm5 0V4h3v13h-3Zm5 0v-6h3v6h-3Z'/%3E%3C/svg%3E") !important;
}

.nav-settings {
  --portal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 2 3.1 3.6-.4 1.2 3.4-2.8 2.3c.1.5.1 1.1 0 1.6l2.8 2.3-1.2 3.4-3.6-.4L12 20.4l-2-3.1-3.6.4-1.2-3.4L8 12c-.1-.5-.1-1.1 0-1.6L5.2 8.1l1.2-3.4 3.6.4L12 2Zm0 7a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z'/%3E%3C/svg%3E") !important;
}

@media (max-width: 760px) {
  #app.app-shell:not(.hidden),
  #tenant-app.tenant-shell:not(.hidden) {
    padding-bottom: calc(98px + env(safe-area-inset-bottom, 0px)) !important;
  }

  #app #tabs.tabbar,
  #app #side-panel .side-nav-groups,
  #tenant-app .tenant-panel-nav {
    display: none !important;
  }

  #app #side-panel .side-card:first-child {
    display: none !important;
  }

  .portal-bottom-nav,
  :root:not([data-theme="dark"]) .portal-bottom-nav,
  :root[data-theme="dark"] .portal-bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 140 !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 9px 12px calc(9px + env(safe-area-inset-bottom, 0px)) !important;
    border: 0 !important;
    border-top: 1px solid rgba(220, 228, 241, .82) !important;
    border-radius: 22px 22px 0 0 !important;
    background: rgba(248, 251, 255, .98) !important;
    box-shadow: 0 -12px 34px rgba(47, 111, 228, .12) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  .portal-bottom-nav::-webkit-scrollbar {
    display: none !important;
  }

  .portal-bottom-nav button,
  :root:not([data-theme="dark"]) .portal-bottom-nav button,
  :root[data-theme="dark"] .portal-bottom-nav button {
    position: relative !important;
    flex: 0 0 88px !important;
    display: grid !important;
    grid-template-rows: 31px auto !important;
    place-items: center !important;
    gap: 3px !important;
    min-height: 62px !important;
    min-width: 0 !important;
    border: 1px solid transparent !important;
    border-radius: 18px !important;
    padding: 8px 5px 7px !important;
    color: #71809b !important;
    background: rgba(255, 255, 255, .66) !important;
    box-shadow: none !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  .portal-bottom-nav button span:last-child {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .portal-bottom-nav button.active,
  :root:not([data-theme="dark"]) .portal-bottom-nav button.active,
  :root[data-theme="dark"] .portal-bottom-nav button.active {
    border-color: #dbe8ff !important;
    color: #2f6fe4 !important;
    background: #edf5ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75), 0 10px 20px rgba(47, 111, 228, .12) !important;
  }

  .portal-bottom-nav button.active::after {
    content: "" !important;
    position: absolute !important;
    top: 7px !important;
    left: 50% !important;
    z-index: -1 !important;
    width: 58px !important;
    height: 38px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .78) !important;
    transform: translateX(-50%) !important;
  }

  .tenant-bottom-nav {
    justify-content: center !important;
  }

  .tenant-bottom-nav button {
    flex-basis: 78px !important;
  }
}

/* PORTAL NAV MOTION POLISH 20260604-141 */
@keyframes portal-top-slide-in {
  from {
    opacity: 0;
    transform: translateY(-18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes portal-bottom-slide-in {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes portal-icon-pop {
  0% {
    transform: translateY(0) scale(.94);
  }
  58% {
    transform: translateY(-2px) scale(1.08);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 760px) {
  #app > .app-header,
  #tenant-app > .app-header,
  :root:not([data-theme="dark"]) #app > .app-header,
  :root:not([data-theme="dark"]) #tenant-app > .app-header,
  :root[data-theme="dark"] #app > .app-header,
  :root[data-theme="dark"] #tenant-app > .app-header {
    background: linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(248, 251, 255, .96)) !important;
    animation: portal-top-slide-in .32s cubic-bezier(.16, 1, .3, 1) both !important;
  }

  #app > .app-header .brand-mark,
  #tenant-app > .app-header .brand-mark,
  :root:not([data-theme="dark"]) #app > .app-header .brand-mark,
  :root:not([data-theme="dark"]) #tenant-app > .app-header .brand-mark,
  :root[data-theme="dark"] #app > .app-header .brand-mark,
  :root[data-theme="dark"] #tenant-app > .app-header .brand-mark {
    position: relative !important;
    overflow: hidden !important;
    color: transparent !important;
    background: linear-gradient(135deg, #68a7ff, #2f6fe4) !important;
  }

  #app > .app-header .brand-mark::before,
  #tenant-app > .app-header .brand-mark::before {
    content: "" !important;
    position: absolute !important;
    inset: 10px !important;
    background: #ffffff !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  .portal-bottom-nav,
  :root:not([data-theme="dark"]) .portal-bottom-nav,
  :root[data-theme="dark"] .portal-bottom-nav {
    background: linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(244, 249, 255, .98)) !important;
    animation: portal-bottom-slide-in .34s cubic-bezier(.16, 1, .3, 1) both !important;
  }

  .portal-bottom-nav button,
  :root:not([data-theme="dark"]) .portal-bottom-nav button,
  :root[data-theme="dark"] .portal-bottom-nav button {
    transition:
      color .18s ease,
      background .18s ease,
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s cubic-bezier(.16, 1, .3, 1) !important;
  }

  .portal-bottom-nav button:active {
    transform: translateY(1px) scale(.98) !important;
  }

  .portal-bottom-nav button.active,
  :root:not([data-theme="dark"]) .portal-bottom-nav button.active,
  :root[data-theme="dark"] .portal-bottom-nav button.active {
    transform: translateY(-1px) !important;
  }

  .portal-bottom-nav button.active .portal-nav-icon {
    animation: portal-icon-pop .26s cubic-bezier(.16, 1, .3, 1) both !important;
  }

  .portal-bottom-nav button.active::after {
    top: 6px !important;
    width: 60px !important;
    height: 39px !important;
    background: rgba(255, 255, 255, .86) !important;
    box-shadow: 0 8px 18px rgba(47, 111, 228, .09) !important;
  }

  #app > .page:not(.hidden),
  #tenant-app .tenant-panel {
    animation: fade-up .24s ease both !important;
  }

  #app #admin-topbar,
  :root:not([data-theme="dark"]) #app #admin-topbar,
  :root[data-theme="dark"] #app #admin-topbar {
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .86) !important;
    box-shadow: 0 12px 28px rgba(47, 111, 228, .08) !important;
    backdrop-filter: blur(16px) !important;
  }
}

/* PUBLIC DESKTOP NAV 20260604-143 */
#public-catalog .public-desktop-header {
  display: none !important;
}

@media (min-width: 761px) {
  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    width: min(100% - 44px, 1200px) !important;
    max-width: 1200px !important;
    margin: 0 auto 40px !important;
    padding: 118px 0 42px 112px !important;
    scroll-padding-top: 136px !important;
  }

  #public-catalog .public-desktop-header,
  :root:not([data-theme="dark"]) #public-catalog .public-desktop-header,
  :root[data-theme="dark"] #public-catalog .public-desktop-header {
    position: fixed !important;
    top: 14px !important;
    left: 50% !important;
    z-index: 90 !important;
    display: flex !important;
    width: min(calc(100% - 44px), 1200px) !important;
    min-height: 72px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    border: 1px solid rgba(213, 227, 248, .9) !important;
    border-radius: 26px !important;
    padding: 12px 16px !important;
    color: #0f2745 !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 20px 48px rgba(47, 111, 228, .12) !important;
    backdrop-filter: blur(18px) !important;
    transform: translateX(-50%) !important;
  }

  #public-catalog .public-desktop-brand,
  #public-catalog .public-desktop-brand:hover,
  #public-catalog .public-desktop-brand:focus,
  #public-catalog .public-desktop-brand:active {
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 18px !important;
    padding: 6px 10px 6px 6px !important;
    color: #0f2745 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
    transform: none !important;
  }

  #public-catalog .public-desktop-brand:hover {
    background: #f4f8ff !important;
  }

  #public-catalog .public-house-logo {
    position: relative !important;
    display: grid !important;
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 auto !important;
    place-items: center !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #7fb3ff, #3478ef) !important;
    box-shadow: 0 12px 24px rgba(47, 111, 228, .18) !important;
  }

  #public-catalog .public-house-logo::before {
    content: "" !important;
    width: 28px !important;
    height: 28px !important;
    background: #ffffff !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-desktop-brand strong,
  #public-catalog .public-desktop-brand small {
    display: block !important;
    line-height: 1.08 !important;
  }

  #public-catalog .public-desktop-brand strong {
    font-size: 1.1rem !important;
    font-weight: 950 !important;
  }

  #public-catalog .public-desktop-brand small {
    margin-top: 4px !important;
    color: #6b7a90 !important;
    font-size: .78rem !important;
    font-weight: 850 !important;
  }

  #public-catalog .public-desktop-actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  #public-catalog .public-desktop-actions .public-mobile-refresh,
  #public-catalog .public-desktop-actions .public-contact-icon-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 44px !important;
    border: 1px solid #dce7f6 !important;
    border-radius: 999px !important;
    padding: 0 14px !important;
    color: #2f6fe4 !important;
    background: #ffffff !important;
    box-shadow: 0 10px 22px rgba(47, 111, 228, .08) !important;
    font-size: .86rem !important;
    font-weight: 900 !important;
    text-decoration: none !important;
  }

  #public-catalog .public-desktop-actions .public-mobile-refresh {
    width: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
    color: #2f6fe4 !important;
    background: #edf5ff !important;
    font-size: 1.2rem !important;
  }

  #public-catalog .public-desktop-actions .public-contact-icon-btn.primary {
    border-color: transparent !important;
    color: #ffffff !important;
    background: #25d366 !important;
    box-shadow: 0 14px 24px rgba(37, 211, 102, .22) !important;
  }

  #public-catalog .public-contact-icon,
  #public-catalog .public-nav-icon {
    display: block !important;
    width: 23px !important;
    height: 23px !important;
    flex: 0 0 auto !important;
    background: currentColor !important;
  }

  #public-catalog .public-contact-icon-phone,
  #public-catalog .public-nav-icon-phone {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1v3.5c0 .6-.4 1-1 1C10.8 21 3 13.2 3 3.7c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.2 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1v3.5c0 .6-.4 1-1 1C10.8 21 3 13.2 3 3.7c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.3 1.1l-2.2 2.2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-contact-icon-whatsapp {
    width: 25px !important;
    height: 25px !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C8.8 3 3 8.7 3 15.7c0 2.5.8 4.9 2.1 6.9L3.7 29l6.6-1.7c1.7.9 3.7 1.4 5.7 1.4 7.2 0 13-5.7 13-12.7S23.2 3 16 3Zm0 23.2c-1.8 0-3.5-.5-5-1.4l-.4-.2-3.9 1 1-3.8-.3-.4c-1.2-1.7-1.8-3.7-1.8-5.7 0-5.7 4.7-10.3 10.4-10.3s10.4 4.6 10.4 10.3S21.7 26.2 16 26.2Zm5.8-7.7c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.7.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.5-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.2-.7-1.7-1-2.3-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1.1 1.1-1.1 2.7s1.2 3.1 1.3 3.3c.2.2 2.3 3.5 5.6 4.9.8.3 1.4.5 1.9.7.8.2 1.5.2 2.1.1.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C8.8 3 3 8.7 3 15.7c0 2.5.8 4.9 2.1 6.9L3.7 29l6.6-1.7c1.7.9 3.7 1.4 5.7 1.4 7.2 0 13-5.7 13-12.7S23.2 3 16 3Zm0 23.2c-1.8 0-3.5-.5-5-1.4l-.4-.2-3.9 1 1-3.8-.3-.4c-1.2-1.7-1.8-3.7-1.8-5.7 0-5.7 4.7-10.3 10.4-10.3s10.4 4.6 10.4 10.3S21.7 26.2 16 26.2Zm5.8-7.7c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.7.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.5-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.2-.7-1.7-1-2.3-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1.1 1.1-1.1 2.7s1.2 3.1 1.3 3.3c.2.2 2.3 3.5 5.6 4.9.8.3 1.4.5 1.9.7.8.2 1.5.2 2.1.1.6-.1 1.9-.8 2.2-1.5.3-.8.3-1.4.2-1.5-.1-.2-.3-.3-.6-.4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-nav-icon-pin {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-nav-icon-bed {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h2v8h14V9c0-1.7-1.3-3-3-3h-6c-1.1 0-2 .9-2 2v5H6V5H4v14h2v-2h12v2h2v-6H4V5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h2v8h14V9c0-1.7-1.3-3-3-3h-6c-1.1 0-2 .9-2 2v5H6V5H4v14h2v-2h12v2h2v-6H4V5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-nav-icon-chat {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4.5C4 3.7 4.7 3 5.5 3h13c.8 0 1.5.7 1.5 1.5v9c0 .8-.7 1.5-1.5 1.5H9l-5 4v-14.5Zm4 4h8V7H8v1.5Zm0 3h6v-1.5H8v1.5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4.5C4 3.7 4.7 3 5.5 3h13c.8 0 1.5.7 1.5 1.5v9c0 .8-.7 1.5-1.5 1.5H9l-5 4v-14.5Zm4 4h8V7H8v1.5Zm0 3h6v-1.5H8v1.5Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-section-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-section-nav,
  :root[data-theme="dark"] #public-catalog .public-section-nav {
    position: sticky !important;
    top: 98px !important;
    z-index: 70 !important;
    display: flex !important;
    width: min(100%, 980px) !important;
    margin: 0 auto 22px !important;
    gap: 10px !important;
    border: 1px solid rgba(213, 227, 248, .9) !important;
    border-radius: 22px !important;
    padding: 8px !important;
    background: rgba(248, 251, 255, .96) !important;
    box-shadow: 0 14px 32px rgba(47, 111, 228, .09) !important;
    backdrop-filter: blur(16px) !important;
  }

  #public-catalog .public-section-nav button {
    display: inline-flex !important;
    flex: 1 1 0 !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 46px !important;
    border: 1px solid transparent !important;
    border-radius: 16px !important;
    padding: 10px 14px !important;
    color: #5f7088 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .95rem !important;
    font-weight: 900 !important;
  }

  #public-catalog .public-section-nav button small {
    display: grid !important;
    min-width: 24px !important;
    height: 24px !important;
    place-items: center !important;
    border-radius: 999px !important;
    color: #2f6fe4 !important;
    background: #eaf3ff !important;
    font-size: .72rem !important;
    font-weight: 950 !important;
  }

  #public-catalog .public-section-nav button.active,
  #public-catalog .public-section-nav button:hover {
    border-color: #cfe0ff !important;
    color: #214d96 !important;
    background: #edf5ff !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    position: fixed !important;
    top: 112px !important;
    bottom: auto !important;
    left: max(14px, calc((100vw - 1200px) / 2 + 18px)) !important;
    z-index: 82 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 88px !important;
    max-width: 88px !important;
    margin: 0 !important;
    border: 1px solid rgba(213, 227, 248, .92) !important;
    border-radius: 28px !important;
    padding: 10px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 20px 44px rgba(47, 111, 228, .12) !important;
    backdrop-filter: blur(18px) !important;
  }

  #public-catalog .public-bottom-nav button,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button {
    display: grid !important;
    grid-template-rows: 30px auto !important;
    place-items: center !important;
    gap: 5px !important;
    min-width: 0 !important;
    min-height: 74px !important;
    border: 1px solid transparent !important;
    border-radius: 22px !important;
    padding: 10px 5px !important;
    color: #71809b !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .7rem !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  #public-catalog .public-bottom-nav button.active,
  #public-catalog .public-bottom-nav button:hover,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button:hover,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button.active,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button:hover {
    border-color: #cfe0ff !important;
    color: #2f6fe4 !important;
    background: linear-gradient(180deg, #f3f8ff, #eaf3ff) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .86), 0 10px 18px rgba(47, 111, 228, .08) !important;
  }

  #public-catalog .public-bottom-nav button[data-public-chat] {
    color: #18a85d !important;
  }

  #public-catalog .public-bottom-nav .public-nav-icon {
    width: 28px !important;
    height: 28px !important;
  }

  #public-catalog .public-bottom-nav .public-nav-label {
    max-width: 100% !important;
    overflow: hidden !important;
    color: inherit !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 761px) and (max-width: 1080px) {
  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    width: calc(100% - 28px) !important;
    padding-left: 100px !important;
  }

  #public-catalog .public-desktop-header,
  :root:not([data-theme="dark"]) #public-catalog .public-desktop-header,
  :root[data-theme="dark"] #public-catalog .public-desktop-header {
    width: calc(100% - 28px) !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    left: 14px !important;
  }
}

@media (max-width: 760px) {
  #public-catalog .public-desktop-header,
  #public-catalog .public-section-nav {
    display: none !important;
  }
}

/* PUBLIC AIRBNB INSPIRED CATALOG 20260605-145 */
#public-catalog .public-stay-explorer,
:root:not([data-theme="dark"]) #public-catalog .public-stay-explorer,
:root[data-theme="dark"] #public-catalog .public-stay-explorer {
  display: grid !important;
  grid-template-columns: minmax(0, .98fr) minmax(360px, .72fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
  margin: 0 0 34px !important;
  border: 1px solid #edf0f4 !important;
  border-radius: 32px !important;
  padding: 26px !important;
  color: #111827 !important;
  background: linear-gradient(180deg, #ffffff, #fbfcff) !important;
  box-shadow: 0 18px 46px rgba(15, 23, 42, .06) !important;
}

#public-catalog .public-stay-explorer-main {
  display: grid !important;
  gap: 18px !important;
  align-content: start !important;
}

#public-catalog .public-stay-explorer-copy {
  max-width: 780px !important;
}

#public-catalog .public-stay-explorer-copy span {
  display: inline-flex !important;
  margin-bottom: 8px !important;
  border-radius: 999px !important;
  padding: 6px 11px !important;
  color: #2f6fe4 !important;
  background: #eff6ff !important;
  font-size: .75rem !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#public-catalog .public-stay-explorer-copy h2 {
  margin: 0 !important;
  color: #111827 !important;
  font-size: clamp(2rem, 4vw, 3.3rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.065em !important;
  line-height: .95 !important;
}

#public-catalog .public-stay-explorer-copy p {
  max-width: 620px !important;
  margin: 12px 0 0 !important;
  color: #667085 !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
}

#public-catalog .public-stay-search-card,
:root:not([data-theme="dark"]) #public-catalog .public-stay-search-card,
:root[data-theme="dark"] #public-catalog .public-stay-search-card {
  display: grid !important;
  grid-template-columns: 1.1fr .9fr 1fr !important;
  overflow: hidden !important;
  max-width: 880px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .08) !important;
}

#public-catalog .public-stay-search-card button,
#public-catalog .public-stay-search-card button:hover,
#public-catalog .public-stay-search-card button:focus,
:root:not([data-theme="dark"]) #public-catalog .public-stay-search-card button,
:root[data-theme="dark"] #public-catalog .public-stay-search-card button {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  min-height: 66px !important;
  justify-items: start !important;
  border: 0 !important;
  border-right: 1px solid #edf0f4 !important;
  border-radius: 0 !important;
  padding: 14px 20px !important;
  color: #111827 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
  transform: none !important;
}

#public-catalog .public-stay-search-card button:last-child {
  border-right: 0 !important;
}

#public-catalog .public-stay-search-card button:hover {
  background: #f7f8fa !important;
}

#public-catalog .public-stay-search-card small {
  color: #111827 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-stay-search-card strong {
  overflow: hidden !important;
  max-width: 100% !important;
  color: #667085 !important;
  font-size: .87rem !important;
  font-weight: 750 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-stay-filter-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

#public-catalog .public-stay-filter-panel,
:root:not([data-theme="dark"]) #public-catalog .public-stay-filter-panel,
:root[data-theme="dark"] #public-catalog .public-stay-filter-panel {
  display: grid !important;
  gap: 15px !important;
  align-self: stretch !important;
  border: 1px solid #e5edf8 !important;
  border-radius: 26px !important;
  padding: 18px !important;
  background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8) !important;
}

#public-catalog .public-stay-filter-block {
  display: grid !important;
  gap: 10px !important;
}

#public-catalog .public-stay-filter-block > strong {
  color: #0f172a !important;
  font-size: .92rem !important;
  font-weight: 950 !important;
  letter-spacing: -.01em !important;
}

#public-catalog .public-stay-filter-chips.price-filter button {
  background: #f8fbff !important;
}

#public-catalog .public-stay-filter-chips span,
#public-catalog .public-stay-filter-chips button {
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  padding: 9px 13px !important;
  color: #344054 !important;
  background: #ffffff !important;
  font-size: .83rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-stay-filter-chips button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 40px !important;
  cursor: pointer !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}

#public-catalog .public-stay-filter-chips button span {
  border: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  background: transparent !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

#public-catalog .public-stay-filter-chips button small {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  color: #2f6fe4 !important;
  background: #eff6ff !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-stay-filter-chips button:hover {
  transform: translateY(-1px) !important;
  border-color: #bfd7ff !important;
  box-shadow: 0 10px 22px rgba(47, 111, 228, .12) !important;
}

#public-catalog .public-stay-filter-chips button.active,
:root:not([data-theme="dark"]) #public-catalog .public-stay-filter-chips button.active,
:root[data-theme="dark"] #public-catalog .public-stay-filter-chips button.active {
  color: #ffffff !important;
  border-color: #2f6fe4 !important;
  background: linear-gradient(135deg, #4f8df7, #2f6fe4) !important;
  box-shadow: 0 14px 28px rgba(47, 111, 228, .22) !important;
}

#public-catalog .public-stay-filter-chips button.active small {
  color: #1d4ed8 !important;
  background: #ffffff !important;
}

#public-catalog .public-filter-toggle,
:root:not([data-theme="dark"]) #public-catalog .public-filter-toggle,
:root[data-theme="dark"] #public-catalog .public-filter-toggle {
  display: inline-flex !important;
  width: max-content !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 1px solid #d8e8ff !important;
  border-radius: 999px !important;
  padding: 10px 15px !important;
  color: #2459a8 !important;
  background: #f5f9ff !important;
  box-shadow: 0 10px 22px rgba(47, 111, 228, .08) !important;
  font-size: .88rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-filter-toggle small {
  display: grid !important;
  min-width: 22px !important;
  height: 22px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #2f6fe4 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-filter-toggle.active {
  color: #ffffff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #67a6ff, #2f6fe4) !important;
}

#public-catalog .public-filter-toggle.active small {
  color: #2f6fe4 !important;
  background: #ffffff !important;
}

#public-catalog .public-stay-filter-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

#public-catalog .public-stay-filter-head strong {
  color: #0f2745 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-price-filter-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto !important;
  gap: 10px !important;
  align-items: end !important;
}

#public-catalog .public-price-filter-form label {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

#public-catalog .public-price-filter-form small {
  color: #52739d !important;
  font-size: .76rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-price-filter-form input,
:root:not([data-theme="dark"]) #public-catalog .public-price-filter-form input,
:root[data-theme="dark"] #public-catalog .public-price-filter-form input {
  width: 100% !important;
  min-height: 42px !important;
  border: 1px solid #dbe8fb !important;
  border-radius: 16px !important;
  padding: 10px 12px !important;
  color: #0f2745 !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86) !important;
  font-size: .92rem !important;
  font-weight: 800 !important;
}

#public-catalog .public-price-filter-form button {
  min-height: 42px !important;
  border-radius: 16px !important;
  padding: 10px 14px !important;
  font-size: .86rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-filter-hint {
  margin: 0 !important;
  color: #6b7a90 !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
}

#public-catalog .public-clear-filter-button {
  justify-self: start !important;
}

/* PUBLIC ROOMS STAY CATALOG 20260605-144 */
#public-catalog .public-stay-row,
:root:not([data-theme="dark"]) #public-catalog .public-stay-row,
:root[data-theme="dark"] #public-catalog .public-stay-row {
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 0 0 34px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html:has(#public-catalog.public-catalog-shell:not(.hidden)),
html:has(#public-catalog.public-catalog-shell:not(.hidden)) body {
  background: #ffffff !important;
  color: #101828 !important;
}

#public-catalog.public-catalog-shell:not(.hidden),
:root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
  color: #101828 !important;
  background: #ffffff !important;
}

@media (min-width: 761px) {
  #public-catalog .public-section-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-section-nav,
  :root[data-theme="dark"] #public-catalog .public-section-nav {
    margin-bottom: 42px !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content {
    padding-top: 82px !important;
  }
}

#public-catalog .public-stay-row .public-property-head,
:root:not([data-theme="dark"]) #public-catalog .public-stay-row .public-property-head,
:root[data-theme="dark"] #public-catalog .public-stay-row .public-property-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 0 2px !important;
}

#public-catalog .public-stay-row .public-property-head h2 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  margin: 0 !important;
  color: #101828 !important;
  font-size: clamp(1.18rem, 2vw, 1.48rem) !important;
  font-weight: 920 !important;
  letter-spacing: -.035em !important;
}

#public-catalog .public-stay-row .public-property-head h2::after {
  content: "?" !important;
  display: grid !important;
  width: 28px !important;
  height: 28px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #0f2745 !important;
  background: #eef4ff !important;
  font-size: 1.3rem !important;
  line-height: 1 !important;
}

#public-catalog .public-stay-row .public-property-head p {
  margin: 5px 0 0 !important;
  color: #667085 !important;
  font-size: .88rem !important;
  font-weight: 700 !important;
}

#public-catalog .public-stay-row-controls {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}

#public-catalog .public-stay-row-controls button,
:root:not([data-theme="dark"]) #public-catalog .public-stay-row-controls button,
:root[data-theme="dark"] #public-catalog .public-stay-row-controls button {
  display: grid !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 !important;
  color: #101828 !important;
  background: #f2f4f7 !important;
  box-shadow: none !important;
  font-size: 1.65rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

#public-catalog .public-stay-row-controls button:hover {
  background: #e7efff !important;
  color: #2f6fe4 !important;
}

#public-catalog .public-stay-carousel,
:root:not([data-theme="dark"]) #public-catalog .public-stay-carousel,
:root[data-theme="dark"] #public-catalog .public-stay-carousel {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: clamp(190px, 21vw, 236px) !important;
  grid-template-columns: none !important;
  gap: 18px !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 0 2px 16px !important;
  scroll-padding-left: 2px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

#public-catalog .public-stay-carousel::-webkit-scrollbar {
  display: none !important;
}

#public-catalog .public-stay-card,
:root:not([data-theme="dark"]) #public-catalog .public-stay-card,
:root[data-theme="dark"] #public-catalog .public-stay-card {
  display: grid !important;
  align-content: start !important;
  gap: 9px !important;
  min-width: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  scroll-snap-align: start !important;
}

#public-catalog .public-stay-media {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #eef2f6 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .06) !important;
}

#public-catalog .public-stay-card .public-room-gallery {
  padding: 0 !important;
}

#public-catalog .public-stay-card .public-room-cover,
#public-catalog .public-stay-card .public-room-empty-photo,
:root:not([data-theme="dark"]) #public-catalog .public-stay-card .public-room-cover,
:root:not([data-theme="dark"]) #public-catalog .public-stay-card .public-room-empty-photo,
:root[data-theme="dark"] #public-catalog .public-stay-card .public-room-cover,
:root[data-theme="dark"] #public-catalog .public-stay-card .public-room-empty-photo {
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 18px !important;
  aspect-ratio: 1 / .96 !important;
  background: #eef2f6 !important;
}

#public-catalog .public-stay-card .public-room-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .28s ease !important;
}

#public-catalog .public-stay-card:hover .public-room-cover img {
  transform: scale(1.035) !important;
}

#public-catalog .public-stay-card .public-room-cover > span {
  right: 8px !important;
  bottom: 8px !important;
  border-radius: 999px !important;
  padding: 5px 8px !important;
  color: #ffffff !important;
  background: rgba(16, 24, 40, .72) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-stay-badge,
:root:not([data-theme="dark"]) #public-catalog .public-stay-badge,
:root[data-theme="dark"] #public-catalog .public-stay-badge {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  z-index: 3 !important;
  max-width: calc(100% - 58px) !important;
  border-radius: 14px !important;
  padding: 8px 12px !important;
  color: #101828 !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .12) !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
}

#public-catalog .public-stay-heart,
#public-catalog .public-stay-heart:hover,
#public-catalog .public-stay-heart:focus,
:root:not([data-theme="dark"]) #public-catalog .public-stay-heart,
:root[data-theme="dark"] #public-catalog .public-stay-heart {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 4 !important;
  display: grid !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 !important;
  color: #ffffff !important;
  background: rgba(0, 0, 0, .10) !important;
  box-shadow: none !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .45) !important;
  font-size: 1.55rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

#public-catalog .public-stay-body,
:root:not([data-theme="dark"]) #public-catalog .public-stay-body,
:root[data-theme="dark"] #public-catalog .public-stay-body {
  display: grid !important;
  gap: 3px !important;
  padding: 1px 2px 0 !important;
  color: #101828 !important;
}

#public-catalog .public-stay-body h3 {
  overflow: hidden !important;
  margin: 0 !important;
  color: #101828 !important;
  font-size: .98rem !important;
  font-weight: 850 !important;
  line-height: 1.12 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-stay-zone,
#public-catalog .public-stay-meta {
  overflow: hidden !important;
  margin: 0 !important;
  color: #667085 !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
  line-height: 1.18 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-stay-price {
  margin: 3px 0 0 !important;
  color: #6b7280 !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

#public-catalog .public-stay-price strong {
  color: #101828 !important;
  font-size: .91rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-stay-card .public-room-toggle,
:root:not([data-theme="dark"]) #public-catalog .public-stay-card .public-room-toggle,
:root[data-theme="dark"] #public-catalog .public-stay-card .public-room-toggle {
  justify-content: center !important;
  width: max-content !important;
  min-height: 30px !important;
  margin-top: 7px !important;
  border: 1px solid #dce7f6 !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  color: #2f6fe4 !important;
  background: #f5f9ff !important;
  box-shadow: none !important;
  font-size: .76rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-stay-card .public-room-details {
  margin-top: 9px !important;
  border: 1px solid #e5edf8 !important;
  border-radius: 16px !important;
  padding: 10px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06) !important;
}

#public-catalog .public-stay-card .public-room-details p,
#public-catalog .public-stay-card .public-room-tags span {
  font-size: .78rem !important;
  line-height: 1.25 !important;
}

#public-catalog .public-stay-card .public-room-details .actions,
#public-catalog .public-stay-card .public-room-details .public-contact-actions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
  margin-top: 8px !important;
}

#public-catalog .public-stay-card .public-room-details .actions a,
#public-catalog .public-stay-card .public-room-details .actions button {
  width: 100% !important;
  justify-content: center !important;
  min-height: 34px !important;
  font-size: .78rem !important;
}

@media (max-width: 760px) {
  #public-catalog .public-stay-explorer {
    grid-template-columns: 1fr !important;
    margin: 0 0 24px !important;
    border-radius: 24px !important;
    padding: 19px !important;
  }

  #public-catalog .public-stay-explorer-copy h2 {
    font-size: clamp(1.75rem, 9vw, 2.45rem) !important;
  }

  #public-catalog .public-stay-search-card {
    grid-template-columns: 1fr !important;
    border-radius: 22px !important;
  }

  #public-catalog .public-stay-search-card button {
    min-height: 58px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;
    padding: 12px 15px !important;
  }

  #public-catalog .public-stay-search-card button:last-child {
    border-bottom: 0 !important;
  }

  #public-catalog .public-stay-filter-chips {
    gap: 8px !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
  }

  #public-catalog .public-stay-filter-panel {
    border-radius: 20px !important;
    padding: 13px !important;
  }

  #public-catalog .public-stay-filter-chips::-webkit-scrollbar {
    display: none !important;
  }

  #public-catalog .public-stay-filter-chips span,
  #public-catalog .public-stay-filter-chips button {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-stay-row {
    margin-bottom: 26px !important;
  }

  #public-catalog .public-stay-row .public-property-head {
    padding: 0 2px !important;
  }

  #public-catalog .public-stay-row-controls {
    display: none !important;
  }

  #public-catalog .public-stay-carousel {
    grid-auto-columns: minmax(174px, 52vw) !important;
    gap: 13px !important;
    margin-left: -2px !important;
    padding-bottom: 12px !important;
  }

  #public-catalog .public-stay-card .public-room-cover,
  #public-catalog .public-stay-card .public-room-empty-photo {
    aspect-ratio: 1 / .96 !important;
  }

  #public-catalog .public-stay-badge {
    max-width: calc(100% - 50px) !important;
    padding: 7px 9px !important;
    font-size: .66rem !important;
  }

  #public-catalog .public-stay-heart {
    width: 31px !important;
    height: 31px !important;
    min-width: 31px !important;
    min-height: 31px !important;
    font-size: 1.35rem !important;
  }
}

/* PUBLIC AIRBNB-LIKE MAP 20260605-146 */
#public-catalog .public-map-card,
#public-catalog .public-leaflet-shell,
#public-catalog .public-map-visual,
:root:not([data-theme="dark"]) #public-catalog .public-map-card,
:root[data-theme="dark"] #public-catalog .public-map-card {
  background: #f8fafc !important;
}

#public-catalog .public-leaflet-shell {
  border-radius: 28px !important;
  overflow: hidden !important;
}

#public-catalog .public-leaflet-map {
  filter: saturate(.88) contrast(.98) brightness(1.03) !important;
}

#public-catalog .public-leaflet-map .leaflet-control-zoom {
  overflow: hidden !important;
  border: 1px solid rgba(15, 23, 42, .10) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .12) !important;
}

#public-catalog .public-leaflet-map .leaflet-control-zoom a {
  width: 36px !important;
  height: 36px !important;
  color: #111827 !important;
  background: rgba(255, 255, 255, .96) !important;
  border-color: #edf0f4 !important;
  font-size: 1.15rem !important;
  font-weight: 850 !important;
  line-height: 36px !important;
}

#public-catalog .public-leaflet-area-icon {
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

#public-catalog .public-leaflet-area-marker,
:root:not([data-theme="dark"]) #public-catalog .public-leaflet-area-marker,
:root[data-theme="dark"] #public-catalog .public-leaflet-area-marker {
  display: inline-flex !important;
  flex-direction: column !important;
  width: auto !important;
  min-width: 74px !important;
  height: auto !important;
  min-height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(16, 24, 40, .14) !important;
  border-radius: 999px !important;
  padding: 9px 13px !important;
  color: #111827 !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .16), 0 1px 2px rgba(15, 23, 42, .10) !important;
  text-align: center !important;
  transform: translate(-50%, -50%) !important;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease !important;
}

#public-catalog .public-leaflet-area-marker:hover {
  transform: translate(-50%, -50%) scale(1.04) !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, .20), 0 1px 2px rgba(15, 23, 42, .12) !important;
}

#public-catalog .public-leaflet-area-icon.active .public-leaflet-area-marker,
:root:not([data-theme="dark"]) #public-catalog .public-leaflet-area-icon.active .public-leaflet-area-marker,
:root[data-theme="dark"] #public-catalog .public-leaflet-area-icon.active .public-leaflet-area-marker {
  border-color: #111827 !important;
  color: #ffffff !important;
  background: #111827 !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .28) !important;
}

#public-catalog .public-leaflet-area-marker b,
#public-catalog .public-leaflet-area-marker small,
:root:not([data-theme="dark"]) #public-catalog .public-leaflet-area-marker b,
:root:not([data-theme="dark"]) #public-catalog .public-leaflet-area-marker small,
:root[data-theme="dark"] #public-catalog .public-leaflet-area-marker b,
:root[data-theme="dark"] #public-catalog .public-leaflet-area-marker small {
  display: block !important;
  max-width: none !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#public-catalog .public-leaflet-area-marker b {
  font-size: .86rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

#public-catalog .public-leaflet-area-marker small {
  display: none !important;
}

#public-catalog .public-leaflet-area-icon:not(.compact) .public-leaflet-area-marker {
  min-width: 118px !important;
}

#public-catalog .public-leaflet-area-icon:not(.compact) .public-leaflet-area-marker small {
  display: block !important;
  margin-top: 4px !important;
  color: inherit !important;
  opacity: .72 !important;
  font-size: .62rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-leaflet-tooltip,
:root:not([data-theme="dark"]) #public-catalog .public-leaflet-tooltip,
:root[data-theme="dark"] #public-catalog .public-leaflet-tooltip {
  border: 1px solid rgba(16, 24, 40, .12) !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  color: #111827 !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .10) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-leaflet-tooltip.active {
  border-color: #111827 !important;
  color: #ffffff !important;
  background: #111827 !important;
}

#public-catalog .public-map-coordinate-circle,
#public-catalog .public-map-coordinate-circle.small,
:root:not([data-theme="dark"]) #public-catalog .public-map-coordinate-circle,
:root[data-theme="dark"] #public-catalog .public-map-coordinate-circle {
  border-color: rgba(47, 111, 228, .68) !important;
  background: rgba(47, 111, 228, .10) !important;
  box-shadow: 0 0 0 1px rgba(47, 111, 228, .12) inset !important;
}

#public-catalog .public-map-coordinate-circle b {
  border: 1px solid rgba(16, 24, 40, .13) !important;
  color: #111827 !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .12) !important;
}

#public-catalog .public-map-coordinate-circle.active b {
  color: #ffffff !important;
  background: #111827 !important;
}

/* PUBLIC ROOM DETAIL AIRBNB 20260605-148 */
#public-catalog .public-room-detail-page,
:root:not([data-theme="dark"]) #public-catalog .public-room-detail-page,
:root[data-theme="dark"] #public-catalog .public-room-detail-page {
  display: grid !important;
  gap: 18px !important;
  width: 100% !important;
  color: #111827 !important;
}

#public-catalog .public-detail-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

#public-catalog .public-detail-back,
#public-catalog .public-detail-actions button,
:root:not([data-theme="dark"]) #public-catalog .public-detail-back,
:root:not([data-theme="dark"]) #public-catalog .public-detail-actions button,
:root[data-theme="dark"] #public-catalog .public-detail-back,
:root[data-theme="dark"] #public-catalog .public-detail-actions button {
  min-height: 36px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 999px !important;
  padding: 8px 13px !important;
  color: #111827 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: .84rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-detail-actions {
  display: inline-flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  justify-content: end !important;
}

#public-catalog .public-room-detail-page > h1 {
  margin: 0 !important;
  color: #111827 !important;
  font-size: clamp(1.55rem, 3vw, 2.4rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.045em !important;
  line-height: 1.05 !important;
}

#public-catalog .public-detail-gallery,
:root:not([data-theme="dark"]) #public-catalog .public-detail-gallery,
:root[data-theme="dark"] #public-catalog .public-detail-gallery {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr) !important;
  gap: 8px !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #f2f4f7 !important;
}

#public-catalog .public-detail-gallery.empty {
  grid-template-columns: 1fr !important;
  min-height: 360px !important;
}

#public-catalog .public-detail-photo,
#public-catalog .public-detail-photo:hover,
#public-catalog .public-detail-photo:focus,
:root:not([data-theme="dark"]) #public-catalog .public-detail-photo,
:root[data-theme="dark"] #public-catalog .public-detail-photo {
  position: relative !important;
  overflow: hidden !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: #e5e7eb !important;
  box-shadow: none !important;
}

#public-catalog .public-detail-photo.main {
  aspect-ratio: 1.25 / 1 !important;
}

#public-catalog .public-detail-photo-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#public-catalog .public-detail-gallery.photos-2 .public-detail-photo-grid {
  grid-template-columns: 1fr !important;
}

#public-catalog .public-detail-gallery.photos-2 .public-detail-photo-grid .public-detail-photo {
  height: 100% !important;
  aspect-ratio: auto !important;
}

#public-catalog .public-detail-gallery.photos-3 .public-detail-photo-grid {
  grid-template-columns: 1fr !important;
}

#public-catalog .public-detail-photo-grid .public-detail-photo {
  aspect-ratio: 1.24 / 1 !important;
}

#public-catalog .public-detail-photo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .28s ease !important;
}

#public-catalog .public-detail-photo:hover img {
  transform: scale(1.025) !important;
}

#public-catalog .public-detail-photo span {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  border-radius: 999px !important;
  padding: 9px 12px !important;
  color: #111827 !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 10px 20px rgba(15, 23, 42, .14) !important;
  font-size: .8rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-detail-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 380px) !important;
  gap: clamp(24px, 4vw, 58px) !important;
  align-items: start !important;
}

#public-catalog .public-detail-main {
  display: grid !important;
  gap: 0 !important;
}

#public-catalog .public-detail-main > section {
  border-bottom: 1px solid #e5e7eb !important;
  padding: 26px 0 !important;
}

#public-catalog .public-detail-summary h2,
#public-catalog .public-detail-description h2,
#public-catalog .public-detail-amenities h2 {
  margin: 0 0 10px !important;
  color: #111827 !important;
  font-size: 1.35rem !important;
  font-weight: 950 !important;
  letter-spacing: -.025em !important;
}

#public-catalog .public-detail-summary p,
#public-catalog .public-detail-description p {
  max-width: 760px !important;
  margin: 0 0 10px !important;
  color: #344054 !important;
  font-size: .98rem !important;
  font-weight: 600 !important;
  line-height: 1.58 !important;
}

#public-catalog .public-detail-summary strong {
  display: inline-flex !important;
  margin-top: 6px !important;
  color: #111827 !important;
  font-size: 1.05rem !important;
  font-weight: 950 !important;
}

/* PUBLIC ROOM DETAIL QUICK FEATURES 20260616-206 */
#public-catalog .public-detail-feature-row,
:root:not([data-theme="dark"]) #public-catalog .public-detail-feature-row,
:root[data-theme="dark"] #public-catalog .public-detail-feature-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 14px 0 8px !important;
}

#public-catalog .public-detail-feature-chip,
:root:not([data-theme="dark"]) #public-catalog .public-detail-feature-chip,
:root[data-theme="dark"] #public-catalog .public-detail-feature-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 42px !important;
  border: 1px solid #dceaff !important;
  border-radius: 999px !important;
  padding: 9px 13px !important;
  color: #275c9f !important;
  background: #f3f8ff !important;
  box-shadow: 0 10px 22px rgba(65, 108, 180, .08) !important;
}

#public-catalog .public-detail-feature-chip .public-amenity-icon {
  display: inline-grid !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  place-items: center !important;
  color: currentColor !important;
  background: transparent !important;
}

#public-catalog .public-detail-feature-chip .public-amenity-icon::before {
  width: 22px !important;
  height: 22px !important;
  background: currentColor !important;
}

#public-catalog .public-detail-feature-chip b {
  color: inherit !important;
  font-size: .9rem !important;
  font-weight: 950 !important;
  letter-spacing: -.015em !important;
  line-height: 1 !important;
}

#public-catalog .public-detail-feature-bath,
:root:not([data-theme="dark"]) #public-catalog .public-detail-feature-bath,
:root[data-theme="dark"] #public-catalog .public-detail-feature-bath {
  color: #1967ad !important;
  background: #edf7ff !important;
}

#public-catalog .public-detail-feature-kitchen,
:root:not([data-theme="dark"]) #public-catalog .public-detail-feature-kitchen,
:root[data-theme="dark"] #public-catalog .public-detail-feature-kitchen {
  color: #2f6b4f !important;
  background: #f0fbf5 !important;
  border-color: #d8f0e2 !important;
}

#public-catalog .public-detail-feature-bed,
:root:not([data-theme="dark"]) #public-catalog .public-detail-feature-bed,
:root[data-theme="dark"] #public-catalog .public-detail-feature-bed {
  color: #6c4dc3 !important;
  background: #f5f1ff !important;
  border-color: #e4dcff !important;
}

@media (max-width: 760px) {
  #public-catalog .public-detail-feature-row {
    gap: 7px !important;
    margin: 12px 0 8px !important;
  }

  #public-catalog .public-detail-feature-chip {
    min-height: 38px !important;
    padding: 8px 10px !important;
  }

  #public-catalog .public-detail-feature-chip .public-amenity-icon,
  #public-catalog .public-detail-feature-chip .public-amenity-icon::before {
    width: 19px !important;
    height: 19px !important;
    min-width: 19px !important;
  }

  #public-catalog .public-detail-feature-chip b {
    font-size: .82rem !important;
  }
}

#public-catalog .public-detail-host {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

#public-catalog .public-detail-avatar {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #111827 !important;
  font-size: .9rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-host strong,
#public-catalog .public-detail-host small {
  display: block !important;
}

#public-catalog .public-detail-host strong {
  color: #111827 !important;
  font-size: .98rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-host small {
  margin-top: 3px !important;
  color: #667085 !important;
  font-size: .84rem !important;
  font-weight: 650 !important;
}

#public-catalog .public-detail-highlights {
  display: grid !important;
  gap: 16px !important;
}

#public-catalog .public-detail-highlights article {
  display: grid !important;
  gap: 4px !important;
  padding-left: 34px !important;
  position: relative !important;
}

#public-catalog .public-detail-highlights article::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  display: grid !important;
  width: 22px !important;
  height: 22px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #111827 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-highlights strong {
  color: #111827 !important;
  font-size: .96rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-highlights p {
  margin: 0 !important;
  color: #667085 !important;
  font-size: .86rem !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
}

#public-catalog .public-detail-amenities > div {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 26px !important;
}

#public-catalog .public-detail-amenities article {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

#public-catalog .public-detail-amenities article > span {
  display: grid !important;
  width: 24px !important;
  height: 24px !important;
  place-items: center !important;
  color: #111827 !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-amenities strong,
#public-catalog .public-detail-amenities small {
  display: block !important;
}

#public-catalog .public-detail-amenities strong {
  color: #111827 !important;
  font-size: .94rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-detail-amenities small {
  margin-top: 3px !important;
  color: #667085 !important;
  font-size: .8rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

#public-catalog .public-detail-reserve-card,
:root:not([data-theme="dark"]) #public-catalog .public-detail-reserve-card,
:root[data-theme="dark"] #public-catalog .public-detail-reserve-card {
  position: sticky !important;
  top: 132px !important;
  display: grid !important;
  gap: 16px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 22px !important;
  padding: 22px !important;
  color: #111827 !important;
  background: #ffffff !important;
  box-shadow: 0 16px 44px rgba(15, 23, 42, .14) !important;
}

#public-catalog .public-detail-reserve-card > div:first-child strong {
  color: #111827 !important;
  font-size: 1.35rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-reserve-card > div:first-child span {
  margin-left: 4px !important;
  color: #667085 !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
}

#public-catalog .public-detail-reserve-grid {
  display: grid !important;
  overflow: hidden !important;
  border: 1px solid #98a2b3 !important;
  border-radius: 14px !important;
}

#public-catalog .public-detail-reserve-grid span {
  display: grid !important;
  gap: 3px !important;
  border-bottom: 1px solid #d0d5dd !important;
  padding: 11px 12px !important;
}

#public-catalog .public-detail-reserve-grid span:last-child {
  border-bottom: 0 !important;
}

#public-catalog .public-detail-reserve-grid small {
  color: #111827 !important;
  font-size: .66rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

#public-catalog .public-detail-reserve-grid b {
  overflow: hidden !important;
  color: #344054 !important;
  font-size: .86rem !important;
  font-weight: 750 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-detail-contact-actions {
  display: grid !important;
  gap: 10px !important;
}

#public-catalog .public-detail-contact-actions a,
#public-catalog .public-detail-contact-actions .button-link,
#public-catalog .public-detail-contact-actions .secondary-link {
  display: inline-flex !important;
  width: 100% !important;
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: .92rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-detail-reserve-card > small {
  color: #667085 !important;
  text-align: center !important;
  font-size: .78rem !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
}

#public-catalog .public-detail-map-section {
  display: grid !important;
  gap: 12px !important;
  padding-bottom: 28px !important;
}

#public-catalog .public-detail-map-section h2 {
  margin: 0 !important;
  color: #111827 !important;
  font-size: 1.45rem !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
}

#public-catalog .public-detail-map-section p {
  margin: 0 !important;
  color: #344054 !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
}

#public-catalog .public-detail-map-section > small {
  color: #667085 !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

#public-catalog .public-airbnb-map {
  position: relative !important;
  overflow: hidden !important;
  min-height: 430px !important;
  border: 0 !important;
  border-radius: 24px !important;
  background: #eef2f6 !important;
}

#public-catalog .public-airbnb-map iframe {
  display: block !important;
  width: 100% !important;
  height: 430px !important;
  min-height: 430px !important;
  border: 0 !important;
  filter: saturate(.92) contrast(.98) brightness(1.03) !important;
}

#public-catalog .public-airbnb-home-pin {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  z-index: 2 !important;
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border: 4px solid #ffffff !important;
  border-radius: 999px !important;
  background: #1f2023 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .26) !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}

#public-catalog .public-airbnb-home-pin::before {
  content: "" !important;
  width: 26px !important;
  height: 26px !important;
  background: #ffffff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

@media (max-width: 900px) {
  #public-catalog .public-detail-gallery,
  #public-catalog .public-detail-layout {
    grid-template-columns: 1fr !important;
  }

  #public-catalog .public-detail-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #public-catalog .public-detail-reserve-card {
    position: static !important;
  }
}

@media (max-width: 760px) {
  #public-catalog .public-room-detail-page {
    gap: 14px !important;
  }

  #public-catalog .public-detail-topbar {
    align-items: start !important;
  }

  #public-catalog .public-detail-actions {
    gap: 6px !important;
  }

  #public-catalog .public-detail-gallery {
    border-radius: 18px !important;
  }

  #public-catalog .public-detail-photo.main {
    aspect-ratio: 1.12 / 1 !important;
  }

  #public-catalog .public-detail-amenities > div {
    grid-template-columns: 1fr !important;
  }

  #public-catalog .public-detail-main > section {
    padding: 21px 0 !important;
  }
}

/* PUBLIC DESKTOP FULL WIDTH 20260605-147 */
@media (min-width: 761px) {
  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    width: calc(100vw - 32px) !important;
    max-width: none !important;
    margin: 0 auto 42px !important;
    padding: 116px 18px 44px 112px !important;
  }

  #public-catalog .public-desktop-header,
  :root:not([data-theme="dark"]) #public-catalog .public-desktop-header,
  :root[data-theme="dark"] #public-catalog .public-desktop-header {
    width: calc(100vw - 32px) !important;
    max-width: none !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    left: 24px !important;
  }

  #public-catalog .public-section-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-section-nav,
  :root[data-theme="dark"] #public-catalog .public-section-nav {
    width: min(100%, 1120px) !important;
    max-width: 1120px !important;
  }

  #public-catalog .public-panel-content {
    width: 100% !important;
    max-width: none !important;
  }

  #public-catalog .public-stay-explorer,
  #public-catalog .public-stay-row,
  #public-catalog .public-location-picker,
  #public-catalog .public-map-card,
  #public-catalog .public-contact-panel {
    width: 100% !important;
    max-width: none !important;
  }

  #public-catalog .public-stay-carousel,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-carousel,
  :root[data-theme="dark"] #public-catalog .public-stay-carousel {
    grid-auto-columns: clamp(210px, 15.5vw, 258px) !important;
  }

  #public-catalog .public-map-visual,
  #public-catalog .public-leaflet-map,
  #public-catalog .public-map-fallback {
    min-height: min(58vh, 560px) !important;
  }
}

/* PUBLIC DESKTOP BRAND CLEANUP 20260605-148 */
@media (min-width: 761px) {
  #public-catalog .public-desktop-brand,
  #public-catalog .public-desktop-brand:hover,
  #public-catalog .public-desktop-brand:focus,
  #public-catalog .public-desktop-brand:active,
  #public-catalog button.public-desktop-brand:not(.secondary):not(.ghost):not(.danger),
  #public-catalog button.public-desktop-brand:not(.secondary):not(.ghost):not(.danger):hover,
  #public-catalog button.public-desktop-brand:not(.secondary):not(.ghost):not(.danger):focus,
  #public-catalog button.public-desktop-brand:not(.secondary):not(.ghost):not(.danger):active {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    color: #0f2745 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: 0 !important;
    transform: none !important;
  }

  #public-catalog .public-desktop-brand .public-house-logo {
    width: 44px !important;
    height: 44px !important;
    border-radius: 15px !important;
    background: linear-gradient(135deg, #8ec5ff, #4d8cff) !important;
    box-shadow: 0 10px 20px rgba(77, 140, 255, .18) !important;
  }

  #public-catalog .public-desktop-brand strong {
    color: #0f2745 !important;
    font-size: 1.03rem !important;
    font-weight: 950 !important;
  }

  #public-catalog .public-desktop-brand small {
    margin-top: 3px !important;
    color: #2f6fe4 !important;
    font-size: .76rem !important;
    font-weight: 900 !important;
  }
}

@media (min-width: 1500px) {
  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    padding-left: 124px !important;
    padding-right: 22px !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    left: 28px !important;
  }

  #public-catalog .public-stay-carousel,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-carousel,
  :root[data-theme="dark"] #public-catalog .public-stay-carousel {
    grid-auto-columns: clamp(230px, 14vw, 280px) !important;
  }
}

/* PUBLIC DESKTOP NO TOP NAV 20260605-148 */
@media (min-width: 761px) {
  #public-catalog .public-section-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-section-nav,
  :root[data-theme="dark"] #public-catalog .public-section-nav {
    display: none !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="contact"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="room-detail"] .public-panel-content {
    padding-top: 18px !important;
  }
}

/* PUBLIC AI SIDE CHAT 20260605-151 */
#public-catalog.public-chat-open {
  --public-chat-width: min(480px, calc(100vw - 38px));
}

#public-catalog .public-ai-chat-backdrop,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-backdrop,
:root[data-theme="dark"] #public-catalog .public-ai-chat-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 220 !important;
  background: rgba(12, 24, 45, .16) !important;
  backdrop-filter: blur(2px) !important;
}

#public-catalog .public-ai-chat-panel,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-panel,
:root[data-theme="dark"] #public-catalog .public-ai-chat-panel {
  position: fixed !important;
  top: calc(74px + env(safe-area-inset-top, 0px)) !important;
  right: 14px !important;
  bottom: 0 !important;
  left: auto !important;
  z-index: 221 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto !important;
  width: var(--public-chat-width, min(480px, calc(100vw - 38px))) !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  overflow: hidden !important;
  border: 1px solid rgba(174, 202, 255, .82) !important;
  border-radius: 30px 30px 0 0 !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 251, 255, .98)) !important;
  box-shadow: 0 28px 80px rgba(20, 51, 97, .24), 0 0 0 1px rgba(255, 255, 255, .74) inset !important;
  animation: publicAiSideChatIn .26s cubic-bezier(.2, .8, .2, 1) both !important;
}

@keyframes publicAiSideChatIn {
  from {
    opacity: 0;
    transform: translate3d(34px, 0, 0) scale(.985);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

#public-catalog .public-ai-chat-panel header,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-panel header,
:root[data-theme="dark"] #public-catalog .public-ai-chat-panel header {
  min-height: 72px !important;
  padding: 16px 18px 13px !important;
  border-bottom: 1px solid #eaf2ff !important;
  background:
    radial-gradient(circle at 14% 20%, rgba(97, 162, 255, .22), transparent 34%),
    linear-gradient(135deg, #ffffff, #f4f8ff) !important;
  box-shadow: 0 10px 24px rgba(47, 111, 228, .06) !important;
}

#public-catalog .public-ai-chat-panel header > div {
  position: relative !important;
  display: grid !important;
  gap: 2px !important;
  padding-left: 48px !important;
}

#public-catalog .public-ai-chat-panel header > div::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 14px !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M4 12.1c0-4.2 3.5-7.6 8-7.6s8 3.4 8 7.6-3.5 7.6-8 7.6c-.9 0-1.8-.1-2.6-.4L5 20.5l1.2-3.7A7.3 7.3 0 0 1 4 12.1Zm5.1-1.4h5.8c.5 0 .9-.4.9-.9s-.4-.9-.9-.9H9.1c-.5 0-.9.4-.9.9s.4.9.9.9Zm0 3.1h3.7c.5 0 .9-.4.9-.9s-.4-.9-.9-.9H9.1c-.5 0-.9.4-.9.9s.4.9.9.9Z'/%3E%3C/svg%3E") center / 24px 24px no-repeat,
    linear-gradient(135deg, #7db7ff, #2f6fe4) !important;
  box-shadow: 0 12px 24px rgba(47, 111, 228, .22) !important;
  transform: translateY(-50%) !important;
}

#public-catalog .public-ai-chat-panel header strong {
  color: #122b4d !important;
  font-size: 1.02rem !important;
  font-weight: 950 !important;
  letter-spacing: -.02em !important;
}

#public-catalog .public-ai-chat-panel header small {
  color: #52739d !important;
  font-size: .77rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-ai-chat-panel header button,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-panel header button,
:root[data-theme="dark"] #public-catalog .public-ai-chat-panel header button {
  width: 42px !important;
  height: 42px !important;
  min-height: 0 !important;
  border: 1px solid #dfebff !important;
  border-radius: 999px !important;
  color: #476887 !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 8px 18px rgba(47, 111, 228, .10) !important;
  font-size: 1.45rem !important;
}

#public-catalog .public-ai-chat-messages,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-messages,
:root[data-theme="dark"] #public-catalog .public-ai-chat-messages {
  min-height: 0 !important;
  padding: 16px 16px 12px !important;
  background:
    radial-gradient(circle at 95% 0%, rgba(97, 162, 255, .12), transparent 34%),
    linear-gradient(180deg, #f8fbff, #ffffff) !important;
  scrollbar-color: #bfdbfe transparent !important;
}

#public-catalog .public-ai-message {
  max-width: 90% !important;
}

#public-catalog .public-ai-message div,
:root:not([data-theme="dark"]) #public-catalog .public-ai-message div,
:root[data-theme="dark"] #public-catalog .public-ai-message div {
  border-color: #e5efff !important;
  border-radius: 20px !important;
  padding: 11px 13px !important;
  background: rgba(255, 255, 255, .96) !important;
}

#public-catalog .public-ai-message.user div,
:root:not([data-theme="dark"]) #public-catalog .public-ai-message.user div,
:root[data-theme="dark"] #public-catalog .public-ai-message.user div {
  border-color: #3f83f8 !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #60a5fa, #2563eb) !important;
  box-shadow: 0 12px 22px rgba(37, 99, 235, .18) !important;
}

#public-catalog .public-ai-chat-prompts,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-prompts,
:root[data-theme="dark"] #public-catalog .public-ai-chat-prompts {
  padding: 12px 16px 10px !important;
  background: rgba(255, 255, 255, .96) !important;
}

#public-catalog .public-ai-chat-prompts button,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-prompts button,
:root[data-theme="dark"] #public-catalog .public-ai-chat-prompts button {
  border-color: #cfe2ff !important;
  color: #2364c8 !important;
  background: #eef6ff !important;
}

#public-catalog .public-ai-chat-compose,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-compose,
:root[data-theme="dark"] #public-catalog .public-ai-chat-compose {
  padding: 2px 16px 12px !important;
  background: rgba(255, 255, 255, .98) !important;
}

#public-catalog .public-ai-chat-compose input,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-compose input,
:root[data-theme="dark"] #public-catalog .public-ai-chat-compose input {
  border-color: #dbeafe !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(47, 111, 228, .06) inset !important;
}

#public-catalog .public-ai-chat-compose button,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-compose button,
:root[data-theme="dark"] #public-catalog .public-ai-chat-compose button {
  border-radius: 18px !important;
  background: linear-gradient(135deg, #5da2ff, #2563eb) !important;
  box-shadow: 0 12px 24px rgba(37, 99, 235, .20) !important;
}

#public-catalog .public-ai-chat-note,
:root:not([data-theme="dark"]) #public-catalog .public-ai-chat-note,
:root[data-theme="dark"] #public-catalog .public-ai-chat-note {
  padding: 0 18px 16px !important;
  color: #7890aa !important;
  background: rgba(255, 255, 255, .98) !important;
}

@media (min-width: 1180px) {
  #public-catalog.public-chat-open .public-panel-content {
    padding-right: calc(var(--public-chat-width, 480px) + 24px) !important;
    transition: padding-right .22s ease !important;
  }
}

@media (max-width: 760px) {
  :root.public-chat-open,
  :root.public-chat-open body {
    overflow: hidden !important;
  }

  #public-catalog .public-ai-chat-backdrop,
  :root:not([data-theme="dark"]) #public-catalog .public-ai-chat-backdrop,
  :root[data-theme="dark"] #public-catalog .public-ai-chat-backdrop {
    background: linear-gradient(180deg, #f7fbff, #ffffff) !important;
    backdrop-filter: none !important;
  }

  #public-catalog .public-ai-chat-panel,
  :root:not([data-theme="dark"]) #public-catalog .public-ai-chat-panel,
  :root[data-theme="dark"] #public-catalog .public-ai-chat-panel {
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f8fbff !important;
    box-shadow: none !important;
    animation: publicAiMobileChatIn .24s cubic-bezier(.2, .8, .2, 1) both !important;
  }

  @keyframes publicAiMobileChatIn {
    from {
      opacity: .6;
      transform: translate3d(18px, 0, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }

  #public-catalog .public-ai-chat-panel header {
    min-height: calc(74px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(12px + env(safe-area-inset-top, 0px)) 16px 12px !important;
    border-radius: 0 0 24px 24px !important;
  }

  #public-catalog .public-ai-chat-messages {
    padding: 18px 14px 14px !important;
  }

  #public-catalog .public-ai-message {
    max-width: 94% !important;
  }

  #public-catalog .public-ai-chat-compose {
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow: 0 -10px 26px rgba(20, 51, 97, .08) !important;
  }

  #public-catalog .public-ai-chat-note {
    display: none !important;
  }
}

/* PUBLIC DETAIL ICONS AND SOFT BUTTONS 20260605-152 */
#public-catalog .public-detail-amenities article,
:root:not([data-theme="dark"]) #public-catalog .public-detail-amenities article,
:root[data-theme="dark"] #public-catalog .public-detail-amenities article {
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 58px !important;
  border: 1px solid #e7f0ff !important;
  border-radius: 18px !important;
  padding: 12px !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 10px 24px rgba(84, 142, 218, .07) !important;
}

#public-catalog .public-detail-amenities article > span.public-amenity-icon,
:root:not([data-theme="dark"]) #public-catalog .public-detail-amenities article > span.public-amenity-icon,
:root[data-theme="dark"] #public-catalog .public-detail-amenities article > span.public-amenity-icon {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center !important;
  border: 1px solid #d9eaff !important;
  border-radius: 16px !important;
  color: #3d82db !important;
  background: #eef7ff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .88) !important;
}

#public-catalog .public-amenity-icon::before {
  content: "" !important;
  width: 23px !important;
  height: 23px !important;
  background: currentColor !important;
  -webkit-mask: var(--amenity-icon) center / contain no-repeat !important;
  mask: var(--amenity-icon) center / contain no-repeat !important;
}

#public-catalog .public-amenity-icon-wifi {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.5 9.5 17c1.4-1.2 3.6-1.2 5 0L12 19.5Zm-5-5 2 2c1.7-1.4 4.3-1.4 6 0l2-2c-2.8-2.4-7.2-2.4-10 0Zm-4-4 2 2c4-3.5 10-3.5 14 0l2-2c-5.1-4.6-12.9-4.6-18 0Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-water {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2s6 6.4 6 11a6 6 0 0 1-12 0c0-4.6 6-11 6-11Zm0 17a4 4 0 0 0 4-4h-2a2 2 0 0 1-2 2v2Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-electricity {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 5 13h6l-1 9 9-13h-6l1-7Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-bath {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3a4 4 0 0 0-4 4v7h18v2a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a6 6 0 0 1 10.2-4.2L15 4.6l-1.4 1.4-1.8-1.8A4 4 0 0 0 7 3Zm10 6h-6V7h6v2Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-kitchen {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h2v20H7v-8H5a3 3 0 0 1-3-3V2h2v7h1V2h2v7h1V2Zm10 0c2.2 0 4 2.2 4 5v5h-3v10h-2V2h1Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-bed {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h2v8h14V9c0-1.7-1.3-3-3-3h-6c-1.1 0-2 .9-2 2v5H6V5H4v14h2v-2h12v2h2v-6H4V5Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-closet {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12c.6 0 1 .4 1 1v18H5V4c0-.6.4-1 1-1Zm2 2v15h4V5H8Zm6 0v15h3V5h-3Zm-1 8h1v2h-1v-2Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-home {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .public-amenity-icon-spark {
  --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 2.2 6.8H21l-5.5 4 2.1 6.7L12 15.4l-5.6 4.1 2.1-6.7L3 8.8h6.8L12 2Z'/%3E%3C/svg%3E") !important;
}

#public-catalog .button-link,
#public-catalog button.primary,
#public-catalog button:not(.secondary):not(.ghost):not(.danger):not(.public-stay-heart):not(.public-room-cover):not(.public-detail-photo):not(.public-desktop-brand):not(.public-mobile-logo),
#public-catalog .public-detail-contact-actions .button-link,
#public-catalog .public-detail-actions button,
#public-catalog .public-detail-back,
#public-catalog .public-room-toggle,
#public-catalog .public-ai-chat-compose button {
  border-color: #cfe3ff !important;
  color: #185aa8 !important;
  background: linear-gradient(180deg, #f8fbff, #e8f4ff) !important;
  box-shadow: 0 10px 22px rgba(74, 144, 226, .11) !important;
}

#public-catalog .button-link:hover,
#public-catalog button.primary:hover,
#public-catalog button:not(.secondary):not(.ghost):not(.danger):not(.public-stay-heart):not(.public-room-cover):not(.public-detail-photo):not(.public-desktop-brand):not(.public-mobile-logo):hover,
#public-catalog .public-detail-contact-actions .button-link:hover,
#public-catalog .public-detail-actions button:hover,
#public-catalog .public-detail-back:hover,
#public-catalog .public-room-toggle:hover,
#public-catalog .public-ai-chat-compose button:hover {
  color: #0f4f9b !important;
  background: linear-gradient(180deg, #ffffff, #ddecff) !important;
  box-shadow: 0 14px 26px rgba(74, 144, 226, .16) !important;
}

#public-catalog .public-bottom-nav button.active,
#public-catalog .public-bottom-nav button:hover,
:root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button.active,
:root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button:hover,
:root[data-theme="dark"] #public-catalog .public-bottom-nav button.active,
:root[data-theme="dark"] #public-catalog .public-bottom-nav button:hover {
  border-color: #cfe3ff !important;
  color: #2d71c9 !important;
  background: linear-gradient(180deg, #ffffff, #edf6ff) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .92), 0 10px 20px rgba(74, 144, 226, .10) !important;
}

#public-catalog .public-house-logo,
#public-catalog .public-desktop-brand .public-house-logo {
  background: linear-gradient(135deg, #b9ddff, #74adf7) !important;
  box-shadow: 0 10px 22px rgba(74, 144, 226, .14) !important;
}

@media (max-width: 760px) {
  #public-catalog .public-detail-amenities article {
    min-height: 56px !important;
    padding: 11px !important;
  }
}

/* PUBLIC CLEAN APPROX MAP 20260605-156 */
#public-catalog[data-public-panel-active="locations"] .public-map-only,
:root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="locations"] .public-map-only,
:root[data-theme="dark"] #public-catalog[data-public-panel-active="locations"] .public-map-only {
  overflow: hidden !important;
  border: 1px solid #e4eefb !important;
  border-radius: 28px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 42px rgba(66, 120, 190, .10) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-visual {
  min-height: min(62vh, 520px) !important;
  overflow: hidden !important;
  border-radius: 28px 28px 0 0 !important;
  background: #f7fbff !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-shell,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-map,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-fallback {
  min-height: min(62vh, 520px) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .leaflet-interactive {
  filter: drop-shadow(0 10px 24px rgba(75, 142, 232, .18)) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-coordinate-overlays,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-static-map-rings,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-area-icon,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-tooltip {
  display: none !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-floating-link,
:root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-floating-link,
:root[data-theme="dark"] #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-floating-link {
  top: 18px !important;
  right: 18px !important;
  bottom: auto !important;
  left: auto !important;
  min-height: 54px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
  color: #185aa8 !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 16px 34px rgba(66, 120, 190, .16) !important;
  font-size: 1rem !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-caption {
  display: block !important;
  padding: 18px 20px 22px !important;
  background: #ffffff !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-caption strong {
  color: #12233d !important;
  font-size: 1.25rem !important;
  font-weight: 950 !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-note {
  margin-top: 6px !important;
  color: #5f6f85 !important;
  font-size: .95rem !important;
  line-height: 1.35 !important;
}

@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-visual {
    min-height: 54vh !important;
    max-height: 470px !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-shell,
  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-map,
  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-fallback {
    min-height: 54vh !important;
    max-height: 470px !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-map-only .public-map-floating-link {
    top: 14px !important;
    right: 14px !important;
    min-height: 48px !important;
    padding: 8px 14px !important;
    font-size: .92rem !important;
  }
}

/* PUBLIC AIRBNB STYLE APPROX PIN 20260605-157 */
#public-catalog[data-public-panel-active="locations"] .public-map-only .leaflet-interactive {
  filter: drop-shadow(0 12px 28px rgba(15, 23, 42, .12)) !important;
}

#public-catalog .public-leaflet-home-pin-icon,
#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-home-pin-icon {
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
}

#public-catalog .public-leaflet-home-pin {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border: 4px solid #ffffff !important;
  border-radius: 999px !important;
  background: #1f2023 !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, .24), 0 2px 6px rgba(15, 23, 42, .16) !important;
}

#public-catalog .public-leaflet-home-pin::before {
  content: "" !important;
  width: 25px !important;
  height: 25px !important;
  background: #ffffff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only .public-leaflet-home-pin-icon {
  display: grid !important;
}

/* PUBLIC HIDDEN FILTERS 20260605-158 */
#public-catalog .public-filter-toggle,
:root:not([data-theme="dark"]) #public-catalog .public-filter-toggle,
:root[data-theme="dark"] #public-catalog .public-filter-toggle {
  display: inline-flex !important;
  width: fit-content !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  padding: 9px 14px !important;
  color: #185aa8 !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 10px 22px rgba(74, 144, 226, .10) !important;
  font-size: .9rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-filter-toggle::before {
  content: "" !important;
  width: 18px !important;
  height: 18px !important;
  background: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h10a3 3 0 1 0 0-2H4v2Zm14-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM4 13h3a3 3 0 1 0 0-2H4v2Zm7-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-7 7h10a3 3 0 1 0 0-2H4v2Zm14-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h10a3 3 0 1 0 0-2H4v2Zm14-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM4 13h3a3 3 0 1 0 0-2H4v2Zm7-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-7 7h10a3 3 0 1 0 0-2H4v2Zm14-1a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

#public-catalog .public-filter-toggle small {
  display: grid !important;
  min-width: 22px !important;
  height: 22px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #5d9df7 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-filter-toggle.active {
  border-color: #bfdcff !important;
  background: #edf6ff !important;
}

#public-catalog .public-stay-filter-panel,
:root:not([data-theme="dark"]) #public-catalog .public-stay-filter-panel,
:root[data-theme="dark"] #public-catalog .public-stay-filter-panel {
  display: none !important;
  margin-top: 12px !important;
}

#public-catalog .public-stay-filter-panel.is-open,
:root:not([data-theme="dark"]) #public-catalog .public-stay-filter-panel.is-open,
:root[data-theme="dark"] #public-catalog .public-stay-filter-panel.is-open {
  display: grid !important;
  animation: publicFilterPanelIn .20s ease both !important;
}

@keyframes publicFilterPanelIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#public-catalog .public-stay-filter-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding-bottom: 2px !important;
}

#public-catalog .public-stay-filter-head > strong {
  color: #12233d !important;
  font-size: .98rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-price-filter-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto !important;
  gap: 10px !important;
  align-items: end !important;
}

#public-catalog .public-price-filter-form label {
  display: grid !important;
  gap: 5px !important;
}

#public-catalog .public-price-filter-form label small {
  color: #5f7088 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
}

#public-catalog .public-price-filter-form input {
  width: 100% !important;
  min-height: 42px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 14px !important;
  padding: 0 12px !important;
  color: #12233d !important;
  background: #ffffff !important;
  font-size: .94rem !important;
  font-weight: 850 !important;
}

#public-catalog .public-price-filter-form button {
  min-height: 42px !important;
  border-radius: 14px !important;
}

#public-catalog .public-filter-hint {
  margin: 2px 0 0 !important;
  color: #7890aa !important;
  font-size: .78rem !important;
  font-weight: 750 !important;
}

#public-catalog .public-clear-filter-button {
  width: fit-content !important;
}

@media (max-width: 760px) {
  #public-catalog .public-filter-toggle {
    min-height: 40px !important;
    padding: 8px 13px !important;
    font-size: .84rem !important;
  }

  #public-catalog .public-price-filter-form {
    grid-template-columns: 1fr 1fr !important;
  }

  #public-catalog .public-price-filter-form button {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}

/* PUBLIC MOBILE CATALOG CLEANUP 20260605-158 */
@media (max-width: 760px) {
  html:has(#public-catalog.public-catalog-shell:not(.hidden)),
  html:has(#public-catalog.public-catalog-shell:not(.hidden)) body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    background: #f7fbff !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: calc(126px + env(safe-area-inset-top, 0px)) 12px calc(112px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    color: #0f2745 !important;
    background: linear-gradient(180deg, #f8fbff 0%, #ffffff 42%, #f7fbff 100%) !important;
  }

  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="rooms"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="locations"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="contact"] .public-panel-content,
  #public-catalog.public-catalog-shell:not(.hidden)[data-public-panel-active="room-detail"] .public-panel-content,
  #public-catalog .public-panel-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  #public-catalog .public-mobile-header,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-header,
  :root[data-theme="dark"] #public-catalog .public-mobile-header {
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    min-height: 66px !important;
    border-radius: 0 0 24px 24px !important;
    padding: 8px 10px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 10px 28px rgba(47, 111, 228, .12) !important;
  }

  #public-catalog .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog .public-mobile-location-rail {
    top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    min-height: 48px !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 8px 12px 10px !important;
    background: rgba(248, 251, 255, .96) !important;
    box-shadow: 0 10px 18px rgba(47, 111, 228, .06) !important;
  }

  #public-catalog .public-stay-explorer,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-explorer,
  :root[data-theme="dark"] #public-catalog .public-stay-explorer {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin: 0 0 18px !important;
    border-color: #dceaff !important;
    border-radius: 26px !important;
    padding: 16px !important;
    background: linear-gradient(180deg, #ffffff, #f9fcff) !important;
    box-shadow: 0 12px 30px rgba(47, 111, 228, .10) !important;
  }

  #public-catalog .public-stay-explorer-main {
    gap: 12px !important;
  }

  #public-catalog .public-stay-explorer-copy span {
    margin-bottom: 4px !important;
    padding: 5px 9px !important;
    font-size: .66rem !important;
  }

  #public-catalog .public-stay-explorer-copy h2 {
    font-size: clamp(1.55rem, 8vw, 2.05rem) !important;
    letter-spacing: -.055em !important;
    line-height: 1 !important;
  }

  #public-catalog .public-stay-explorer-copy p {
    margin-top: 8px !important;
    font-size: .88rem !important;
    line-height: 1.42 !important;
  }

  #public-catalog .public-stay-search-card,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-search-card,
  :root[data-theme="dark"] #public-catalog .public-stay-search-card {
    grid-template-columns: 1fr !important;
    border-radius: 20px !important;
    box-shadow: 0 8px 20px rgba(47, 111, 228, .08) !important;
  }

  #public-catalog .public-stay-search-card button,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-search-card button,
  :root[data-theme="dark"] #public-catalog .public-stay-search-card button {
    min-height: 50px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #edf4ff !important;
    padding: 10px 14px !important;
  }

  #public-catalog .public-stay-search-card button:last-child {
    border-bottom: 0 !important;
  }

  #public-catalog .public-filter-toggle {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: space-between !important;
    padding: 11px 14px !important;
  }

  #public-catalog .public-stay-filter-panel,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-filter-panel,
  :root[data-theme="dark"] #public-catalog .public-stay-filter-panel {
    display: none !important;
    gap: 14px !important;
    border-radius: 22px !important;
    padding: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(47, 111, 228, .10) !important;
  }

  #public-catalog .public-stay-filter-panel.is-open,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-filter-panel.is-open,
  :root[data-theme="dark"] #public-catalog .public-stay-filter-panel.is-open {
    display: grid !important;
  }

  #public-catalog .public-stay-filter-chips {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  #public-catalog .public-stay-filter-chips button,
  #public-catalog .public-stay-filter-chips span {
    width: 100% !important;
    justify-content: space-between !important;
    white-space: normal !important;
  }

  #public-catalog .public-price-filter-form {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  #public-catalog .public-price-filter-form button {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  #public-catalog .public-stay-row,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-row,
  :root[data-theme="dark"] #public-catalog .public-stay-row {
    gap: 12px !important;
    margin: 0 0 26px !important;
  }

  #public-catalog .public-stay-row .public-property-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    padding: 0 2px !important;
  }

  #public-catalog .public-stay-row .public-property-head h2 {
    display: flex !important;
    max-width: 100% !important;
    font-size: 1.14rem !important;
    line-height: 1.08 !important;
    white-space: normal !important;
  }

  #public-catalog .public-stay-row .public-property-head h2::after {
    display: none !important;
  }

  #public-catalog .public-stay-row .public-property-head p {
    margin: 0 !important;
    font-size: .8rem !important;
    line-height: 1.25 !important;
  }

  #public-catalog .public-stay-row-controls {
    display: none !important;
  }

  #public-catalog .public-stay-carousel,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-carousel,
  :root[data-theme="dark"] #public-catalog .public-stay-carousel {
    display: grid !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  #public-catalog .public-stay-card,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-card,
  :root[data-theme="dark"] #public-catalog .public-stay-card {
    display: grid !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid #dceaff !important;
    border-radius: 24px !important;
    padding: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(47, 111, 228, .10) !important;
  }

  #public-catalog .public-stay-media {
    width: 100% !important;
    border-radius: 20px !important;
    box-shadow: none !important;
  }

  #public-catalog .public-stay-card .public-room-cover,
  #public-catalog .public-stay-card .public-room-empty-photo,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-card .public-room-cover,
  :root[data-theme="dark"] #public-catalog .public-stay-card .public-room-cover {
    aspect-ratio: 1.28 / .86 !important;
    border-radius: 20px !important;
  }

  #public-catalog .public-stay-body {
    gap: 5px !important;
    padding: 0 2px 2px !important;
  }

  #public-catalog .public-stay-body h3,
  #public-catalog .public-stay-zone,
  #public-catalog .public-stay-meta,
  #public-catalog .public-stay-price {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }

  #public-catalog .public-stay-body h3 {
    font-size: 1rem !important;
    line-height: 1.18 !important;
  }

  #public-catalog .public-stay-zone,
  #public-catalog .public-stay-meta {
    font-size: .84rem !important;
    line-height: 1.25 !important;
  }

  #public-catalog .public-stay-price {
    font-size: .86rem !important;
  }

  #public-catalog .public-stay-card .public-room-toggle {
    width: 100% !important;
    min-height: 40px !important;
    margin-top: 8px !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    border-radius: 26px !important;
    padding: 8px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 18px 42px rgba(47, 111, 228, .18) !important;
  }

  #public-catalog .public-bottom-nav button {
    min-height: 58px !important;
    border-radius: 20px !important;
    padding: 7px 4px !important;
    font-size: .66rem !important;
  }

  #public-catalog .public-bottom-nav .public-nav-icon {
    width: 24px !important;
    height: 24px !important;
  }
}

/* PUBLIC MOBILE ROOM CAROUSEL RESTORE 20260605-159 */
@media (max-width: 760px) {
  #public-catalog .public-stay-carousel,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-carousel,
  :root[data-theme="dark"] #public-catalog .public-stay-carousel {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(244px, 78vw) !important;
    grid-template-columns: none !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    padding: 2px 2px 14px !important;
    scroll-padding-left: 2px !important;
    scroll-snap-type: x proximity !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #public-catalog .public-stay-carousel::-webkit-scrollbar {
    display: none !important;
  }

  #public-catalog .public-stay-card,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-card,
  :root[data-theme="dark"] #public-catalog .public-stay-card {
    width: auto !important;
    min-width: 0 !important;
    scroll-snap-align: start !important;
  }
}

/* PUBLIC CARD TAP CLEANUP 20260605-160 */
#public-catalog .public-stay-card[data-public-room-detail] {
  cursor: pointer !important;
}

#public-catalog .public-room-toggle,
#public-catalog .public-room-details {
  display: none !important;
}

@media (max-width: 760px) {
  #public-catalog .public-stay-explorer,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-explorer,
  :root[data-theme="dark"] #public-catalog .public-stay-explorer {
    gap: 10px !important;
    margin-bottom: 14px !important;
    border-radius: 22px !important;
    padding: 12px !important;
    box-shadow: 0 10px 24px rgba(47, 111, 228, .08) !important;
  }

  #public-catalog .public-stay-explorer-main {
    gap: 9px !important;
  }

  #public-catalog .public-stay-explorer-copy span {
    display: none !important;
  }

  #public-catalog .public-stay-explorer-copy h2 {
    font-size: 1.22rem !important;
    letter-spacing: -.035em !important;
    line-height: 1.04 !important;
  }

  #public-catalog .public-stay-explorer-copy p {
    display: none !important;
  }

  #public-catalog .public-stay-search-card,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-search-card,
  :root[data-theme="dark"] #public-catalog .public-stay-search-card {
    display: none !important;
  }

  #public-catalog .public-filter-toggle {
    width: max-content !important;
    min-height: 36px !important;
    justify-content: center !important;
    padding: 8px 12px !important;
    font-size: .8rem !important;
  }

  #public-catalog .public-stay-card,
  :root:not([data-theme="dark"]) #public-catalog .public-stay-card,
  :root[data-theme="dark"] #public-catalog .public-stay-card {
    gap: 8px !important;
    padding: 8px !important;
  }

  #public-catalog .public-stay-body {
    padding-bottom: 0 !important;
  }
}

/* PUBLIC ZONES MAP FLOW 20260605-159 */
#public-catalog[data-public-panel-active="locations"] .public-location-picker {
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#public-catalog[data-public-panel-active="locations"] .public-location-map-card,
#public-catalog[data-public-panel-active="locations"] .public-general-map-card,
#public-catalog[data-public-panel-active="locations"] .public-map-only {
  overflow: hidden !important;
  border: 1px solid #e4eefb !important;
  border-radius: 30px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 42px rgba(66, 120, 190, .10) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-map-only + .public-general-map-card {
  display: none !important;
}

#public-catalog[data-public-panel-active="locations"] .public-general-map-head {
  display: flex !important;
  gap: 12px !important;
  padding: 18px 20px !important;
  border-bottom: 1px solid #edf4ff !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-general-map-head strong {
  color: #12233d !important;
  font-size: 1.15rem !important;
  font-weight: 950 !important;
}

#public-catalog[data-public-panel-active="locations"] .public-general-map-head .public-map-note {
  color: #66778e !important;
  font-size: .92rem !important;
  line-height: 1.35 !important;
}

#public-catalog[data-public-panel-active="locations"] .public-general-map-stage,
#public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-leaflet-shell,
#public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-leaflet-map,
#public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-map-fallback {
  min-height: min(68vh, 620px) !important;
}

#public-catalog .public-map-interaction-hint {
  position: absolute !important;
  left: 50% !important;
  bottom: 18px !important;
  z-index: 880 !important;
  display: flex !important;
  justify-content: center !important;
  width: min(92%, 330px) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  transition: opacity .22s ease, transform .22s ease !important;
}

#public-catalog .public-map-interaction-hint span {
  border: 1px solid rgba(214, 226, 242, .94) !important;
  border-radius: 999px !important;
  padding: 9px 14px !important;
  color: #485a72 !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 28px rgba(66, 120, 190, .12) !important;
  font-size: .82rem !important;
  font-weight: 850 !important;
  backdrop-filter: blur(14px) !important;
}

#public-catalog .public-leaflet-shell.public-map-unlocked .public-map-interaction-hint {
  opacity: 0 !important;
  transform: translateX(-50%) translateY(8px) !important;
}

#public-catalog .public-leaflet-zone-pin-button,
#public-catalog .public-leaflet-zone-pin-button:hover,
#public-catalog .public-leaflet-zone-pin-button:focus,
#public-catalog .public-leaflet-zone-pin-button:active {
  display: grid !important;
  width: 54px !important;
  height: 54px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  appearance: none !important;
  cursor: pointer !important;
}

#public-catalog .public-leaflet-zone-pin-button .public-leaflet-home-pin {
  width: 50px !important;
  height: 50px !important;
}

#public-catalog .public-leaflet-zone-pin-button:focus-visible .public-leaflet-home-pin {
  outline: 3px solid rgba(96, 165, 250, .74) !important;
  outline-offset: 4px !important;
}

#public-catalog[data-public-panel-active="locations"] .public-general-map-stage .leaflet-interactive {
  filter: drop-shadow(0 12px 28px rgba(15, 23, 42, .10)) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-location-map-back,
#public-catalog[data-public-panel-active="locations"] .public-location-map-back:hover,
#public-catalog[data-public-panel-active="locations"] .public-location-map-back:focus,
#public-catalog[data-public-panel-active="locations"] .public-location-map-back:active {
  position: absolute !important;
  top: 18px !important;
  left: 18px !important;
  z-index: 902 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 999px !important;
  padding: 9px 15px !important;
  color: #185aa8 !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 16px 34px rgba(66, 120, 190, .15) !important;
  font-size: .92rem !important;
  font-weight: 950 !important;
  backdrop-filter: blur(14px) !important;
}

#public-catalog[data-public-panel-active="locations"] .public-location-map-back span {
  display: grid !important;
  width: 24px !important;
  height: 24px !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  background: #74adf7 !important;
}

@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="locations"] .public-general-map-head {
    align-items: stretch !important;
    padding: 14px !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-general-map-stage,
  #public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-leaflet-shell,
  #public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-leaflet-map,
  #public-catalog[data-public-panel-active="locations"] .public-general-map-stage .public-map-fallback {
    min-height: 58vh !important;
  }

  #public-catalog[data-public-panel-active="locations"] .public-location-map-back {
    top: 14px !important;
    left: 14px !important;
    min-height: 44px !important;
    padding: 8px 13px !important;
  }

  #public-catalog .public-map-interaction-hint {
    bottom: 14px !important;
  }
}

/* PUBLIC ZONES BACK BUTTON FIX 20260605-161 */
#public-catalog[data-public-panel-active="locations"] .public-location-map-back,
#public-catalog[data-public-panel-active="locations"] .public-location-map-back *,
#public-catalog[data-public-panel-active="locations"] button.public-location-map-back:not(.secondary):not(.ghost):not(.danger) {
  pointer-events: auto !important;
}

#public-catalog[data-public-panel-active="locations"] .public-location-map-back,
#public-catalog[data-public-panel-active="locations"] button.public-location-map-back:not(.secondary):not(.ghost):not(.danger) {
  z-index: 1200 !important;
}

/* PUBLIC MOBILE COMPACT ROOM FILTER 20260605-162 */
@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer {
    display: block !important;
    margin: -4px 0 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 2px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer-main {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-height: 0 !important;
    gap: 8px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer-copy,
  #public-catalog[data-public-panel-active="rooms"] .public-stay-search-card {
    display: none !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle {
    width: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid #d9eaff !important;
    border-radius: 999px !important;
    padding: 7px 12px !important;
    color: #1f64ad !important;
    background: rgba(247, 251, 255, .96) !important;
    box-shadow: 0 8px 18px rgba(66, 120, 190, .08) !important;
    font-size: .78rem !important;
    font-weight: 950 !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle::before {
    width: 16px !important;
    height: 16px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle.active,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle.active,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-filter-toggle.active {
    color: #185aa8 !important;
    border-color: #b9d7ff !important;
    background: #edf6ff !important;
    box-shadow: 0 10px 22px rgba(66, 120, 190, .12) !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-filter-panel.is-open {
    margin-top: 8px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-property-group:first-of-type {
    margin-top: 0 !important;
  }
}

/* PUBLIC MOBILE RAIL FILTER 20260605-168 */
@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="rooms"] .public-mobile-location-rail,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-mobile-location-rail,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-mobile-location-rail {
    grid-template-columns: 56px minmax(0, 1fr) auto !important;
    column-gap: 8px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-location-pills {
    padding-right: 4px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer {
    margin: 0 0 8px !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-explorer-main {
    display: none !important;
  }

  #public-catalog .public-rail-filter-button,
  #public-catalog .public-rail-filter-button:hover,
  #public-catalog .public-rail-filter-button:focus,
  #public-catalog .public-rail-filter-button:active {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    align-self: stretch !important;
    min-width: 46px !important;
    min-height: 42px !important;
    border: 1px solid #d9eaff !important;
    border-radius: 999px !important;
    padding: 0 10px !important;
    color: #1f64ad !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .88), 0 8px 16px rgba(66, 120, 190, .08) !important;
    font-size: .74rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  #public-catalog .public-rail-filter-button::before {
    content: "" !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 auto !important;
    background: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M4 7h8a3 3 0 0 0 5.83 1H20a1 1 0 1 0 0-2h-2.17A3 3 0 0 0 12 7H4a1 1 0 0 0 0 2Zm11-1a1 1 0 1 1 0 2a1 1 0 0 1 0-2ZM4 17h2.17A3 3 0 0 0 12 16h8a1 1 0 1 0 0-2h-8a3 3 0 0 0-5.83 1H4a1 1 0 1 0 0 2Zm5-2a1 1 0 1 1 0 2a1 1 0 0 1 0-2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M4 7h8a3 3 0 0 0 5.83 1H20a1 1 0 1 0 0-2h-2.17A3 3 0 0 0 12 7H4a1 1 0 0 0 0 2Zm11-1a1 1 0 1 1 0 2a1 1 0 0 1 0-2ZM4 17h2.17A3 3 0 0 0 12 16h8a1 1 0 1 0 0-2h-8a3 3 0 0 0-5.83 1H4a1 1 0 1 0 0 2Zm5-2a1 1 0 1 1 0 2a1 1 0 0 1 0-2Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }

  #public-catalog .public-rail-filter-button small {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 18px !important;
    height: 18px !important;
    border-radius: 999px !important;
    padding: 0 5px !important;
    color: #ffffff !important;
    background: #2f6fe4 !important;
    font-size: .68rem !important;
    font-weight: 950 !important;
  }

  #public-catalog .public-rail-filter-button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-rail-filter-button.active,
  :root[data-theme="dark"] #public-catalog .public-rail-filter-button.active {
    color: #185aa8 !important;
    border-color: #b9d7ff !important;
    background: #edf6ff !important;
    box-shadow: 0 10px 22px rgba(66, 120, 190, .12) !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-filter-panel.is-open {
    margin: 8px 0 12px !important;
  }
}

/* ADMIN LIGHT PORTAL REFRESH 20260605-163 */
#app.app-shell:not(.hidden),
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden),
:root[data-theme="dark"] #app.app-shell:not(.hidden) {
  --admin-ink: #0f2745;
  --admin-muted: #5f7391;
  --admin-soft: #f7fbff;
  --admin-card: rgba(255, 255, 255, .96);
  --admin-card-solid: #ffffff;
  --admin-line: #dceaff;
  --admin-blue: #377cf0;
  --admin-blue-dark: #1f5ec6;
  --admin-blue-soft: #edf6ff;
  --admin-green: #20b985;
  display: grid !important;
  grid-template-columns: 278px minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(100% - 24px, 1460px) !important;
  max-width: 1460px !important;
  margin: 16px auto 44px !important;
  padding: 0 !important;
  color: var(--admin-ink) !important;
  background:
    radial-gradient(circle at top left, rgba(147, 197, 253, .26), transparent 34%),
    linear-gradient(180deg, #fbfdff 0%, #f6faff 100%) !important;
  border-radius: 32px !important;
}

#app.app-shell:not(.hidden) *,
#app.app-shell:not(.hidden) *::before,
#app.app-shell:not(.hidden) *::after {
  box-sizing: border-box !important;
}

#app.app-shell:not(.hidden) > .app-header {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-height: 76px !important;
  margin: 0 !important;
  border: 1px solid var(--admin-line) !important;
  border-radius: 26px !important;
  padding: 14px 16px !important;
  color: var(--admin-ink) !important;
  background: var(--admin-card) !important;
  box-shadow: 0 18px 44px rgba(65, 108, 180, .10) !important;
  backdrop-filter: blur(16px) !important;
}

#app.app-shell:not(.hidden) .brand-lockup {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

#app.app-shell:not(.hidden) .brand-mark {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  flex: 0 0 48px !important;
  place-items: center !important;
  border-radius: 18px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #73b7ff, var(--admin-blue)) !important;
  box-shadow: 0 14px 28px rgba(55, 124, 240, .24) !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) .app-kicker,
#app.app-shell:not(.hidden) small,
#app.app-shell:not(.hidden) .muted,
#app.app-shell:not(.hidden) .meta {
  color: var(--admin-muted) !important;
}

#app.app-shell:not(.hidden) h1,
#app.app-shell:not(.hidden) h2,
#app.app-shell:not(.hidden) h3,
#app.app-shell:not(.hidden) h4,
#app.app-shell:not(.hidden) strong {
  color: var(--admin-ink) !important;
}

#app.app-shell:not(.hidden) > .app-header h1 {
  margin: 0 !important;
  font-size: clamp(1.18rem, 2vw, 1.55rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -.04em !important;
}

#app.app-shell:not(.hidden) .header-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#app.app-shell:not(.hidden) #tabs.tabbar {
  display: none !important;
}

#app.app-shell:not(.hidden) #side-panel,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) #side-panel,
:root[data-theme="dark"] #app.app-shell:not(.hidden) #side-panel {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  position: sticky !important;
  top: 16px !important;
  align-self: start !important;
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
  max-height: calc(100vh - 32px) !important;
  overflow: auto !important;
  padding: 0 2px 4px 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) #side-panel .side-card,
#app.app-shell:not(.hidden) #side-panel .side-subpanel,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) #side-panel .side-card,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) #side-panel .side-subpanel,
:root[data-theme="dark"] #app.app-shell:not(.hidden) #side-panel .side-card,
:root[data-theme="dark"] #app.app-shell:not(.hidden) #side-panel .side-subpanel {
  display: grid !important;
  gap: 13px !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border: 1px solid var(--admin-line) !important;
  border-radius: 28px !important;
  padding: 16px !important;
  color: var(--admin-ink) !important;
  background: var(--admin-card) !important;
  box-shadow: 0 18px 44px rgba(65, 108, 180, .10) !important;
}

#app.app-shell:not(.hidden) #side-panel .cooladmin-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding-bottom: 4px !important;
}

#app.app-shell:not(.hidden) #side-panel .cooladmin-brand > span {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  place-items: center !important;
  border-radius: 17px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #75b9ff, var(--admin-blue)) !important;
  box-shadow: 0 14px 28px rgba(55, 124, 240, .22) !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) #side-panel .side-kicker,
#app.app-shell:not(.hidden) #side-panel .side-help,
#app.app-shell:not(.hidden) #side-panel .side-nav-group small,
#app.app-shell:not(.hidden) #side-panel .cooladmin-brand small {
  color: var(--admin-muted) !important;
}

#app.app-shell:not(.hidden) #side-panel .side-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#app.app-shell:not(.hidden) #side-panel .side-stats span,
#app.app-shell:not(.hidden) #side-panel .side-card:first-child .side-stats span {
  display: grid !important;
  gap: 4px !important;
  border: 1px solid #e7f1ff !important;
  border-radius: 18px !important;
  padding: 10px 8px !important;
  background: #f7fbff !important;
}

#app.app-shell:not(.hidden) #side-panel .side-stats b {
  font-size: 1.05rem !important;
  color: var(--admin-blue-dark) !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-groups {
  display: grid !important;
  gap: 10px !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-group {
  display: grid !important;
  gap: 7px !important;
  border-top: 1px solid #edf4ff !important;
  padding-top: 10px !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-group:first-child {
  border-top: 0 !important;
  padding-top: 0 !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-group button,
#app.app-shell:not(.hidden) #side-panel .side-action,
#app.app-shell:not(.hidden) .portal-bottom-nav button {
  border: 1px solid transparent !important;
  color: #21466f !important;
  background: transparent !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-group button,
#app.app-shell:not(.hidden) #side-panel .side-action {
  justify-content: flex-start !important;
  min-height: 40px !important;
  border-radius: 16px !important;
  padding: 10px 12px !important;
  font-weight: 850 !important;
}

#app.app-shell:not(.hidden) #side-panel .side-nav-group button.active,
#app.app-shell:not(.hidden) #side-panel .side-nav-group button:hover,
#app.app-shell:not(.hidden) #side-panel .side-action:hover,
#app.app-shell:not(.hidden) #side-panel .side-action:focus-visible {
  color: var(--admin-blue-dark) !important;
  border-color: #cfe4ff !important;
  background: var(--admin-blue-soft) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
}

#app.app-shell:not(.hidden) #admin-topbar,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) #admin-topbar,
:root[data-theme="dark"] #app.app-shell:not(.hidden) #admin-topbar {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 12px !important;
  z-index: 15 !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  border: 1px solid var(--admin-line) !important;
  border-radius: 24px !important;
  padding: 12px !important;
  color: var(--admin-ink) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 16px 40px rgba(65, 108, 180, .09) !important;
  backdrop-filter: blur(16px) !important;
}

#app.app-shell:not(.hidden) .cool-topbar-search,
#app.app-shell:not(.hidden) #admin-topbar .cool-topbar-search {
  min-width: 0 !important;
  border: 1px solid #dceaff !important;
  border-radius: 18px !important;
  color: var(--admin-ink) !important;
  background: #f7fbff !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) #admin-topbar input {
  color: var(--admin-ink) !important;
}

#app.app-shell:not(.hidden) #admin-topbar .cool-topbar-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 9px !important;
  min-width: 0 !important;
}

#app.app-shell:not(.hidden) .cool-icon-btn,
#app.app-shell:not(.hidden) #admin-topbar .cool-icon-btn,
#app.app-shell:not(.hidden) button.secondary,
#app.app-shell:not(.hidden) button.compact {
  border: 1px solid #dceaff !important;
  color: #1f64ad !important;
  background: #f7fbff !important;
  box-shadow: 0 10px 22px rgba(65, 108, 180, .08) !important;
}

#app.app-shell:not(.hidden) .cool-icon-btn:hover,
#app.app-shell:not(.hidden) button.secondary:hover,
#app.app-shell:not(.hidden) button.compact:hover {
  border-color: #bdd8ff !important;
  background: #edf6ff !important;
}

#app.app-shell:not(.hidden) .cool-profile-menu summary {
  border: 1px solid #dceaff !important;
  border-radius: 18px !important;
  color: var(--admin-ink) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) .cool-avatar {
  color: #ffffff !important;
  background: linear-gradient(135deg, #75b9ff, var(--admin-blue)) !important;
}

#app.app-shell:not(.hidden) > .page,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) > .page,
:root[data-theme="dark"] #app.app-shell:not(.hidden) > .page {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: var(--admin-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) > .page.hidden {
  display: none !important;
}

#app.app-shell:not(.hidden) .card,
#app.app-shell:not(.hidden) article,
#app.app-shell:not(.hidden) details,
#app.app-shell:not(.hidden) .item,
#app.app-shell:not(.hidden) .tenant-card,
#app.app-shell:not(.hidden) .room-card,
#app.app-shell:not(.hidden) .property-card,
#app.app-shell:not(.hidden) .contract-card,
#app.app-shell:not(.hidden) .payment-card,
#app.app-shell:not(.hidden) .empty {
  border: 1px solid var(--admin-line) !important;
  border-radius: 26px !important;
  color: var(--admin-ink) !important;
  background: var(--admin-card-solid) !important;
  box-shadow: 0 16px 38px rgba(65, 108, 180, .08) !important;
}

#app.app-shell:not(.hidden) input,
#app.app-shell:not(.hidden) select,
#app.app-shell:not(.hidden) textarea {
  border: 1px solid #dceaff !important;
  color: var(--admin-ink) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#app.app-shell:not(.hidden) input:focus,
#app.app-shell:not(.hidden) select:focus,
#app.app-shell:not(.hidden) textarea:focus {
  border-color: #8fc0ff !important;
  box-shadow: 0 0 0 4px rgba(96, 165, 250, .16) !important;
  outline: 0 !important;
}

#app.app-shell:not(.hidden) button:not(.secondary):not(.compact):not(.ghost):not(.danger):not(.cool-icon-btn):not(.side-action):not([data-page]) {
  color: #ffffff !important;
  border: 0 !important;
  background: linear-gradient(135deg, #6fb4ff, var(--admin-blue)) !important;
  box-shadow: 0 14px 28px rgba(55, 124, 240, .20) !important;
}

#app.app-shell:not(.hidden) button.danger {
  color: #ffffff !important;
  background: linear-gradient(135deg, #fb7185, #e11d48) !important;
}

#app.app-shell:not(.hidden) .stats,
#app.app-shell:not(.hidden) .grid,
#app.app-shell:not(.hidden) .two-columns,
#app.app-shell:not(.hidden) .mini-grid,
#app.app-shell:not(.hidden) .calendar-layout,
#app.app-shell:not(.hidden) .cool-dashboard-grid,
#app.app-shell:not(.hidden) .cool-calendar-layout {
  gap: 16px !important;
}

@media (min-width: 901px) {
  #app.app-shell:not(.hidden) > .app-header {
    display: none !important;
  }

  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    display: none !important;
  }
}

@media (max-width: 900px) {
  #app.app-shell:not(.hidden),
  :root:not([data-theme="dark"]) #app.app-shell:not(.hidden),
  :root[data-theme="dark"] #app.app-shell:not(.hidden) {
    display: block !important;
    width: 100% !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding: calc(76px + env(safe-area-inset-top)) 12px calc(112px + env(safe-area-inset-bottom)) !important;
    background: linear-gradient(180deg, #fbfdff 0%, #f5faff 100%) !important;
  }

  #app.app-shell:not(.hidden) > .app-header {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    z-index: 80 !important;
    min-height: calc(64px + env(safe-area-inset-top)) !important;
    border-width: 0 0 1px !important;
    border-radius: 0 0 24px 24px !important;
    padding: calc(10px + env(safe-area-inset-top)) 12px 10px !important;
    box-shadow: 0 12px 30px rgba(65, 108, 180, .11) !important;
  }

  #app.app-shell:not(.hidden) .brand-mark {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
    border-radius: 15px !important;
  }

  #app.app-shell:not(.hidden) > .app-header h1 {
    font-size: 1.1rem !important;
  }

  #app.app-shell:not(.hidden) .header-actions {
    gap: 6px !important;
  }

  #app.app-shell:not(.hidden) .header-actions .install-action,
  #app.app-shell:not(.hidden) #theme-toggle {
    display: none !important;
  }

  #app.app-shell:not(.hidden) #side-panel,
  #app.app-shell:not(.hidden) #admin-topbar {
    display: none !important;
  }

  #app.app-shell:not(.hidden) > .page {
    display: block !important;
  }

  #app.app-shell:not(.hidden) > .page.hidden {
    display: none !important;
  }

  #app.app-shell:not(.hidden) .card,
  #app.app-shell:not(.hidden) article,
  #app.app-shell:not(.hidden) details,
  #app.app-shell:not(.hidden) .item,
  #app.app-shell:not(.hidden) .empty {
    border-radius: 22px !important;
    padding: 14px !important;
  }

  #app.app-shell:not(.hidden) .grid,
  #app.app-shell:not(.hidden) .two-columns,
  #app.app-shell:not(.hidden) .calendar-layout,
  #app.app-shell:not(.hidden) .cool-dashboard-grid,
  #app.app-shell:not(.hidden) .cool-calendar-layout,
  #app.app-shell:not(.hidden) .property-room-layout,
  #app.app-shell:not(.hidden) .document-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app.app-shell:not(.hidden) .stats,
  #app.app-shell:not(.hidden) .mini-grid,
  #app.app-shell:not(.hidden) .report-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #app.app-shell:not(.hidden) .item-row,
  #app.app-shell:not(.hidden) .actions,
  #app.app-shell:not(.hidden) form {
    max-width: 100% !important;
  }

  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  :root:not([data-theme="dark"]) #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  :root[data-theme="dark"] #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    z-index: 90 !important;
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    min-height: 72px !important;
    border: 1px solid #dceaff !important;
    border-radius: 26px !important;
    padding: 8px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 18px 44px rgba(65, 108, 180, .16) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav::-webkit-scrollbar {
    display: none !important;
  }

  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    flex: 0 0 88px !important;
    display: grid !important;
    place-items: center !important;
    gap: 5px !important;
    min-height: 54px !important;
    border-radius: 20px !important;
    padding: 7px 8px !important;
    color: #55708f !important;
    background: #f7fbff !important;
    font-size: .76rem !important;
    font-weight: 850 !important;
  }

  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, #73b7ff, var(--admin-blue)) !important;
    box-shadow: 0 14px 26px rgba(55, 124, 240, .22) !important;
  }
}

@media (max-width: 520px) {
  #app.app-shell:not(.hidden) {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  #app.app-shell:not(.hidden) .stats,
  #app.app-shell:not(.hidden) .mini-grid,
  #app.app-shell:not(.hidden) .report-facts {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app.app-shell:not(.hidden) .header-actions #logout {
    min-width: 0 !important;
    padding: 9px 11px !important;
  }
}

/* PUBLIC MOBILE HIDE COUNT NAV 20260605-163 */
@media (max-width: 760px) {
  #public-catalog .public-section-nav,
  #public-catalog.public-catalog-shell .public-section-nav,
  #public-catalog.public-catalog-shell:not(.hidden) .public-section-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-section-nav,
  :root[data-theme="dark"] #public-catalog .public-section-nav {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-panel-content {
    margin-top: 0 !important;
  }
}

/* PUBLIC MOBILE TIGHT ROOM SECTIONS 20260605-164 */
@media (max-width: 760px) {
  #public-catalog[data-public-panel-active="rooms"] .public-property-group,
  #public-catalog[data-public-panel-active="rooms"] .public-stay-row,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-property-group,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-stay-row,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-property-group,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-stay-row {
    gap: 9px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-property-head,
  #public-catalog[data-public-panel-active="rooms"] .public-stay-row .public-property-head {
    gap: 1px !important;
    padding: 0 2px !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-property-head h2,
  #public-catalog[data-public-panel-active="rooms"] .public-stay-row .public-property-head h2 {
    margin: 0 !important;
    font-size: 1.06rem !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-property-head p,
  #public-catalog[data-public-panel-active="rooms"] .public-stay-row .public-property-head p {
    margin: 2px 0 0 !important;
    font-size: .76rem !important;
    line-height: 1.18 !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-carousel,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-stay-carousel,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-stay-carousel {
    gap: 10px !important;
    padding: 0 2px 2px !important;
    margin: 0 !important;
  }

  #public-catalog[data-public-panel-active="rooms"] .public-stay-card,
  :root:not([data-theme="dark"]) #public-catalog[data-public-panel-active="rooms"] .public-stay-card,
  :root[data-theme="dark"] #public-catalog[data-public-panel-active="rooms"] .public-stay-card {
    margin-bottom: 0 !important;
  }
}

/* ADMIN MOBILE FINAL OVERRIDE 20260605-166 */
@media (max-width: 900px) {
  html body #app.app-shell:not(.hidden) #side-panel.side-panel,
  html body #app.app-shell:not(.hidden) #admin-topbar.admin-topbar,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) #side-panel.side-panel,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) #admin-topbar.admin-topbar,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) #side-panel.side-panel,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) #admin-topbar.admin-topbar {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  html body #app.app-shell:not(.hidden) > .page:not(.hidden) {
    display: block !important;
    margin-top: 0 !important;
    transform: none !important;
  }
}

/* ADMIN MOBILE HEADER AND NAV POLISH 20260605-168 */
html body #app.app-shell:not(.hidden) [data-admin-logo-logout] {
  cursor: pointer !important;
}

/* PUBLIC ROOM DETAIL HIDE HOST 20260605-169 */
#public-catalog .public-detail-host {
  display: none !important;
}

html body #app.app-shell:not(.hidden) [data-admin-logo-logout]:focus-visible {
  outline: 3px solid rgba(96, 165, 250, .42) !important;
  outline-offset: 4px !important;
}

@media (max-width: 900px) {
  html body #app.app-shell:not(.hidden),
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden),
  html[data-theme="dark"] body #app.app-shell:not(.hidden) {
    padding-top: calc(82px + env(safe-area-inset-top)) !important;
    padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header {
    justify-content: flex-start !important;
    min-height: calc(68px + env(safe-area-inset-top)) !important;
    padding: calc(9px + env(safe-area-inset-top)) 12px 9px !important;
    background: rgba(255, 255, 255, .96) !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions,
  html body #app.app-shell:not(.hidden) > .app-header #logout,
  html body #app.app-shell:not(.hidden) > .app-header #theme-toggle,
  html body #app.app-shell:not(.hidden) > .app-header .install-action {
    display: none !important;
    visibility: hidden !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    column-gap: 11px !important;
    align-items: center !important;
    width: min(100%, 318px) !important;
    min-height: 56px !important;
    border: 1px solid #dceaff !important;
    border-radius: 24px !important;
    padding: 6px 12px 6px 6px !important;
    background: #f7fbff !important;
    box-shadow: 0 12px 28px rgba(65, 108, 180, .10) !important;
    transition: transform .18s ease, background .18s ease, box-shadow .18s ease !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout]:active {
    transform: scale(.985) !important;
    background: #edf6ff !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] .brand-mark {
    grid-row: 1 / span 2 !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 17px !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] > div {
    min-width: 0 !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] .app-kicker {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    color: #6b82a0 !important;
    font-size: .58rem !important;
    font-weight: 950 !important;
    letter-spacing: .14em !important;
    line-height: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] h1 {
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 3px 0 0 !important;
    color: #0f2745 !important;
    font-size: .98rem !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] small {
    display: none !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout]::after {
    grid-column: 2 !important;
    content: "Regresar al login" !important;
    margin-top: 2px !important;
    color: #2d71df !important;
    font-size: .72rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 72px !important;
    border-radius: 28px !important;
    padding: 8px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 18px 42px rgba(65, 108, 180, .14) !important;
    scroll-behavior: smooth !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    position: relative !important;
    flex: 0 0 82px !important;
    width: 82px !important;
    min-height: 56px !important;
    border: 1px solid transparent !important;
    border-radius: 21px !important;
    padding: 7px 6px !important;
    color: #60738b !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(0) scale(1) !important;
    transition:
      transform .22s cubic-bezier(.2, .8, .2, 1),
      background-color .22s ease,
      border-color .22s ease,
      color .22s ease,
      box-shadow .22s ease !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button::after {
    display: none !important;
    content: none !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button .portal-nav-icon {
    width: 24px !important;
    height: 24px !important;
    opacity: .76 !important;
    transform: translateY(0) scale(1) !important;
    transition: transform .22s ease, opacity .22s ease, filter .22s ease !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button span:last-child {
    max-width: 74px !important;
    overflow: hidden !important;
    font-size: .72rem !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active {
    color: #1f64c8 !important;
    border-color: #cfe4ff !important;
    background: #edf6ff !important;
    box-shadow: 0 10px 24px rgba(55, 124, 240, .13) !important;
    transform: translateY(-2px) scale(1.02) !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active .portal-nav-icon {
    opacity: 1 !important;
    transform: translateY(-1px) scale(1.06) !important;
    filter: drop-shadow(0 6px 10px rgba(55, 124, 240, .20)) !important;
  }

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:active {
    transform: translateY(0) scale(.97) !important;
  }
}

/* PUBLIC CONTACT HUB 20260606-172 */
#public-catalog .public-contact-panel,
:root:not([data-theme="dark"]) #public-catalog .public-contact-panel,
:root[data-theme="dark"] #public-catalog .public-contact-panel {
  display: grid !important;
  gap: 16px !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  border: 1px solid #dfeeff !important;
  border-radius: 32px !important;
  padding: clamp(16px, 3vw, 28px) !important;
  background:
    radial-gradient(circle at top left, rgba(125, 183, 255, .18), transparent 34%),
    linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 22px 52px rgba(47, 111, 228, .10) !important;
}

#public-catalog .public-contact-intro {
  display: grid !important;
  gap: 7px !important;
}

#public-catalog .public-contact-intro span {
  width: max-content !important;
  border-radius: 999px !important;
  padding: 7px 11px !important;
  color: #1f64c8 !important;
  background: #edf6ff !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-contact-intro h2 {
  margin: 0 !important;
  color: #10243f !important;
  font-size: clamp(1.55rem, 4vw, 2.45rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.05em !important;
  line-height: 1.02 !important;
}

#public-catalog .public-contact-intro p,
#public-catalog .public-contact-direct-card p {
  max-width: 780px !important;
  margin: 0 !important;
  color: #5b6f88 !important;
  font-size: .94rem !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

#public-catalog .public-contact-selected-room,
:root:not([data-theme="dark"]) #public-catalog .public-contact-selected-room,
:root[data-theme="dark"] #public-catalog .public-contact-selected-room {
  display: grid !important;
  gap: 4px !important;
  border: 1px solid #cfe4ff !important;
  border-radius: 22px !important;
  padding: 14px !important;
  color: #11365d !important;
  background: #f0f7ff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .82) !important;
}

#public-catalog .public-contact-selected-room small {
  color: #3579df !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

#public-catalog .public-contact-selected-room strong {
  color: #10243f !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-contact-selected-room span {
  color: #5b6f88 !important;
  font-size: .88rem !important;
  font-weight: 800 !important;
}

#public-catalog .public-contact-ai-card {
  min-width: 0 !important;
}

#public-catalog .public-contact-ai-card .public-ai-chat-panel,
#public-catalog .public-ai-chat-panel.embedded,
:root:not([data-theme="dark"]) #public-catalog .public-contact-ai-card .public-ai-chat-panel,
:root[data-theme="dark"] #public-catalog .public-contact-ai-card .public-ai-chat-panel {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  grid-template-rows: auto minmax(240px, 42vh) auto auto auto !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border: 1px solid #dbeafe !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 16px 34px rgba(47, 111, 228, .09) !important;
  animation: none !important;
}

#public-catalog .public-contact-ai-card .public-ai-chat-panel header {
  border-radius: 0 !important;
}

#public-catalog .public-contact-direct-card,
:root:not([data-theme="dark"]) #public-catalog .public-contact-direct-card,
:root[data-theme="dark"] #public-catalog .public-contact-direct-card {
  display: grid !important;
  gap: 12px !important;
  border: 1px solid #e3eefc !important;
  border-radius: 24px !important;
  padding: 16px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 28px rgba(47, 111, 228, .07) !important;
}

#public-catalog .public-contact-direct-card strong {
  color: #10243f !important;
  font-size: 1.08rem !important;
  font-weight: 950 !important;
}

#public-catalog .public-contact-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

#public-catalog .public-room-ask-button {
  color: #1f64c8 !important;
  background: #eef6ff !important;
}

#public-catalog .public-room-ask-button:hover,
#public-catalog .public-room-ask-button:focus {
  color: #ffffff !important;
  background: linear-gradient(135deg, #75b6ff, #2f6fe4) !important;
}

@media (max-width: 760px) {
  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #public-catalog .public-contact-panel {
    border-radius: 26px !important;
    padding: 14px !important;
  }

  #public-catalog .public-contact-ai-card .public-ai-chat-panel,
  #public-catalog .public-ai-chat-panel.embedded {
    grid-template-rows: auto minmax(260px, 48vh) auto auto auto !important;
    border-radius: 24px !important;
  }
}

/* PUBLIC ROOM CARD QUICK FEATURES 20260605-169 */
#public-catalog .public-card-feature-row,
:root:not([data-theme="dark"]) #public-catalog .public-card-feature-row,
:root[data-theme="dark"] #public-catalog .public-card-feature-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 5px 0 1px !important;
  min-width: 0 !important;
}

#public-catalog .public-card-feature-chip,
:root:not([data-theme="dark"]) #public-catalog .public-card-feature-chip,
:root[data-theme="dark"] #public-catalog .public-card-feature-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 100% !important;
  min-height: 27px !important;
  border: 1px solid #dceaff !important;
  border-radius: 999px !important;
  padding: 5px 8px !important;
  color: #275c9f !important;
  background: #f3f8ff !important;
  box-shadow: 0 7px 14px rgba(65, 108, 180, .06) !important;
  line-height: 1 !important;
}

#public-catalog .public-card-feature-chip .public-amenity-icon {
  display: inline-grid !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  place-items: center !important;
  color: currentColor !important;
  background: transparent !important;
}

#public-catalog .public-card-feature-chip .public-amenity-icon::before {
  width: 15px !important;
  height: 15px !important;
  background: currentColor !important;
}

#public-catalog .public-card-feature-chip b {
  display: block !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#public-catalog .public-card-feature-bath,
:root:not([data-theme="dark"]) #public-catalog .public-card-feature-bath,
:root[data-theme="dark"] #public-catalog .public-card-feature-bath {
  color: #1967ad !important;
  background: #edf7ff !important;
}

#public-catalog .public-card-feature-kitchen,
:root:not([data-theme="dark"]) #public-catalog .public-card-feature-kitchen,
:root[data-theme="dark"] #public-catalog .public-card-feature-kitchen {
  color: #2f6b4f !important;
  background: #f0fbf5 !important;
  border-color: #d8f0e2 !important;
}

#public-catalog .public-card-feature-bed,
:root:not([data-theme="dark"]) #public-catalog .public-card-feature-bed,
:root[data-theme="dark"] #public-catalog .public-card-feature-bed {
  color: #6c4dc3 !important;
  background: #f5f1ff !important;
  border-color: #e4dcff !important;
}

#public-catalog .public-stay-meta {
  display: none !important;
}

@media (max-width: 760px) {
  #public-catalog .public-card-feature-row {
    gap: 5px !important;
    margin-top: 4px !important;
  }

  #public-catalog .public-card-feature-chip {
    min-height: 25px !important;
    padding: 5px 7px !important;
  }

  #public-catalog .public-card-feature-chip .public-amenity-icon,
  #public-catalog .public-card-feature-chip .public-amenity-icon::before {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
  }

  #public-catalog .public-card-feature-chip b {
    font-size: .68rem !important;
  }

  #public-catalog .public-stay-body {
    gap: 2px !important;
  }
}

/* ADMIN ROOMS PRIVATE CATALOG 20260606-171 */
#rooms .admin-room-location-rail,
:root:not([data-theme="dark"]) #rooms .admin-room-location-rail,
:root[data-theme="dark"] #rooms .admin-room-location-rail {
  position: sticky !important;
  top: 92px !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  margin: 0 0 16px !important;
  border: 1px solid #dceaff !important;
  border-radius: 26px !important;
  padding: 10px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 16px 36px rgba(65, 108, 180, .10) !important;
  backdrop-filter: blur(16px) !important;
}

#rooms .admin-room-location-label {
  display: grid !important;
  place-items: center !important;
  min-width: 82px !important;
  min-height: 58px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 20px !important;
  color: #2f6fe4 !important;
  background: #f4f9ff !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

#rooms .admin-room-location-label i {
  width: 20px !important;
  height: 20px !important;
}

#rooms .admin-room-location-pills {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 2px 0 !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

#rooms .admin-room-location-pills::-webkit-scrollbar,
#rooms .admin-room-catalog-carousel::-webkit-scrollbar {
  display: none !important;
}

#rooms .admin-room-location-pills button,
:root:not([data-theme="dark"]) #rooms .admin-room-location-pills button,
:root[data-theme="dark"] #rooms .admin-room-location-pills button {
  flex: 0 0 auto !important;
  display: grid !important;
  gap: 3px !important;
  min-width: 148px !important;
  min-height: 58px !important;
  border: 1px solid #dceaff !important;
  border-radius: 20px !important;
  padding: 9px 13px !important;
  color: #516982 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  text-align: left !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

#rooms .admin-room-location-pills button strong {
  overflow: hidden !important;
  color: #17324f !important;
  font-size: .9rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#rooms .admin-room-location-pills button small {
  color: #6b7f96 !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
}

#rooms .admin-room-location-pills button.active,
:root:not([data-theme="dark"]) #rooms .admin-room-location-pills button.active,
:root[data-theme="dark"] #rooms .admin-room-location-pills button.active {
  border-color: #bcd9ff !important;
  background: #edf6ff !important;
  box-shadow: 0 10px 24px rgba(55, 124, 240, .12) !important;
  transform: translateY(-1px) !important;
}

#rooms .admin-room-catalog-shell {
  display: grid !important;
  gap: 20px !important;
}

#rooms .admin-room-catalog-section,
:root:not([data-theme="dark"]) #rooms .admin-room-catalog-section,
:root[data-theme="dark"] #rooms .admin-room-catalog-section {
  display: grid !important;
  gap: 13px !important;
  border: 1px solid #e4eefb !important;
  border-radius: 30px !important;
  padding: 16px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 18px 44px rgba(65, 108, 180, .08) !important;
}

#rooms .admin-room-section-head h2 {
  margin: 0 !important;
  color: #0f2745 !important;
  font-size: clamp(1.15rem, 2vw, 1.55rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.04em !important;
}

#rooms .admin-room-section-head p {
  margin: 4px 0 0 !important;
  color: #60738b !important;
  font-size: .86rem !important;
  font-weight: 750 !important;
}

#rooms .admin-room-catalog-carousel {
  display: grid !important;
  grid-auto-columns: minmax(250px, 290px) !important;
  grid-auto-flow: column !important;
  gap: 14px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 2px 2px 12px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

#rooms .admin-room-catalog-card,
:root:not([data-theme="dark"]) #rooms .admin-room-catalog-card,
:root[data-theme="dark"] #rooms .admin-room-catalog-card {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  min-width: 0 !important;
  border: 1px solid #dceaff !important;
  border-radius: 24px !important;
  padding: 9px !important;
  color: #0f2745 !important;
  background: #ffffff !important;
  box-shadow: 0 14px 30px rgba(65, 108, 180, .08) !important;
  scroll-snap-align: start !important;
}

#rooms .admin-room-card-media {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #eef5ff !important;
}

#rooms .admin-room-card-cover,
#rooms .admin-room-card-empty,
:root:not([data-theme="dark"]) #rooms .admin-room-card-cover,
:root:not([data-theme="dark"]) #rooms .admin-room-card-empty,
:root[data-theme="dark"] #rooms .admin-room-card-cover,
:root[data-theme="dark"] #rooms .admin-room-card-empty {
  display: grid !important;
  width: 100% !important;
  aspect-ratio: 1 / .78 !important;
  min-height: 168px !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 18px !important;
  padding: 0 !important;
  color: #55708f !important;
  background: linear-gradient(135deg, #edf6ff, #f8fbff) !important;
  box-shadow: none !important;
}

#rooms .admin-room-card-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

#rooms .admin-room-card-cover > span {
  position: absolute !important;
  right: 9px !important;
  bottom: 9px !important;
  border-radius: 999px !important;
  padding: 5px 8px !important;
  color: #ffffff !important;
  background: rgba(15, 23, 42, .72) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
}

#rooms .admin-room-status {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  z-index: 3 !important;
  border-radius: 999px !important;
  padding: 7px 10px !important;
  color: #ffffff !important;
  box-shadow: 0 10px 20px rgba(15, 23, 42, .12) !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

#rooms .admin-room-status.available {
  background: #20b985 !important;
}

#rooms .admin-room-status.occupied {
  background: #2f6fe4 !important;
}

#rooms .admin-room-card-body {
  display: grid !important;
  gap: 9px !important;
  padding: 0 2px 2px !important;
}

#rooms .admin-room-card-title {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  align-items: start !important;
}

#rooms .admin-room-card-title h3 {
  overflow: hidden !important;
  margin: 0 !important;
  color: #0f2745 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#rooms .admin-room-card-title small,
#rooms .admin-room-tenant-strip small {
  color: #64748b !important;
  font-size: .76rem !important;
  font-weight: 750 !important;
}

#rooms .admin-room-card-title > strong {
  color: #0f2745 !important;
  font-size: .93rem !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

#rooms .admin-room-feature-row {
  margin: 0 !important;
}

#rooms .admin-room-tenant-strip {
  display: grid !important;
  gap: 2px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 17px !important;
  padding: 10px !important;
  background: #f5f9ff !important;
}

#rooms .admin-room-tenant-strip.available {
  border-color: #d8f0e2 !important;
  background: #f3fbf6 !important;
}

#rooms .admin-room-tenant-strip span {
  color: #6b7f96 !important;
  font-size: .68rem !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

#rooms .admin-room-tenant-strip strong {
  overflow: hidden !important;
  color: #0f2745 !important;
  font-size: .92rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#rooms .admin-room-card-details {
  border: 1px solid #e5effc !important;
  border-radius: 16px !important;
  padding: 0 !important;
  background: #fbfdff !important;
  box-shadow: none !important;
}

#rooms .admin-room-card-details summary {
  padding: 9px 11px !important;
  color: #2463ad !important;
  font-size: .8rem !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

#rooms .admin-room-card-detail-body {
  display: grid !important;
  gap: 7px !important;
  border-top: 1px solid #e5effc !important;
  padding: 10px !important;
}

#rooms .admin-room-card-detail-body p {
  margin: 0 !important;
  color: #53657c !important;
  font-size: .78rem !important;
  line-height: 1.32 !important;
}

#rooms .admin-room-card-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

#rooms .admin-room-card-actions button {
  width: 100% !important;
  min-height: 34px !important;
  justify-content: center !important;
  font-size: .76rem !important;
}

@media (max-width: 900px) {
  #rooms .admin-room-location-rail {
    position: sticky !important;
    top: calc(76px + env(safe-area-inset-top)) !important;
    margin: -4px 0 12px !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    border-radius: 24px !important;
    padding: 8px !important;
  }

  #rooms .admin-room-location-label {
    min-width: 72px !important;
    min-height: 52px !important;
    border-radius: 18px !important;
    font-size: .72rem !important;
  }

  #rooms .admin-room-location-pills button {
    min-width: 132px !important;
    min-height: 52px !important;
    border-radius: 18px !important;
    padding: 8px 11px !important;
  }

  #rooms .admin-room-catalog-section {
    border-radius: 24px !important;
    padding: 12px !important;
  }

  #rooms .admin-room-catalog-carousel {
    grid-auto-columns: minmax(238px, 78vw) !important;
    gap: 12px !important;
  }
}

/* ADMIN PUBLIC-CATALOG NAVIGATION 20260616-206 */
html body #app.app-shell:not(.hidden),
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden),
html[data-theme="dark"] body #app.app-shell:not(.hidden) {
  display: block !important;
  width: min(100% - 28px, 1420px) !important;
  max-width: 1420px !important;
  min-height: 100dvh !important;
  margin: 0 auto !important;
  padding: calc(104px + env(safe-area-inset-top, 0px)) 0 34px 112px !important;
  color: #10243f !important;
  background:
    radial-gradient(circle at top left, rgba(125, 183, 255, .18), transparent 34%),
    linear-gradient(180deg, #f8fbff, #ffffff) !important;
  border-radius: 0 !important;
}

html body #app.app-shell:not(.hidden) #tabs,
html body #app.app-shell:not(.hidden) #side-panel,
html body #app.app-shell:not(.hidden) #admin-topbar {
  display: none !important;
}

html body #app.app-shell:not(.hidden) > .app-header,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) > .app-header,
html[data-theme="dark"] body #app.app-shell:not(.hidden) > .app-header {
  position: fixed !important;
  top: calc(12px + env(safe-area-inset-top, 0px)) !important;
  left: max(14px, calc((100vw - 1420px) / 2 + 14px)) !important;
  right: max(14px, calc((100vw - 1420px) / 2 + 14px)) !important;
  z-index: 220 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 74px !important;
  margin: 0 !important;
  border: 1px solid rgba(218, 232, 255, .94) !important;
  border-radius: 0 0 28px 28px !important;
  padding: 10px 14px !important;
  color: #10243f !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 18px 42px rgba(47, 111, 228, .10) !important;
  backdrop-filter: blur(18px) !important;
}

html body #app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  cursor: pointer !important;
}

html body #app.app-shell:not(.hidden) > .app-header .brand-mark,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) > .app-header .brand-mark,
html[data-theme="dark"] body #app.app-shell:not(.hidden) > .app-header .brand-mark {
  display: grid !important;
  width: 50px !important;
  height: 50px !important;
  place-items: center !important;
  border-radius: 18px !important;
  color: transparent !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M3 11.2 12 4l9 7.2v8.3c0 .8-.7 1.5-1.5 1.5H15v-6H9v6H4.5c-.8 0-1.5-.7-1.5-1.5v-8.3Z'/%3E%3C/svg%3E") center / 28px 28px no-repeat,
    linear-gradient(135deg, #8fc8ff, #2f6fe4) !important;
  box-shadow: 0 14px 30px rgba(47, 111, 228, .22) !important;
}

html body #app.app-shell:not(.hidden) > .app-header h1 {
  margin: 0 !important;
  color: #10243f !important;
  font-size: clamp(1.05rem, 2vw, 1.32rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.035em !important;
  line-height: 1.02 !important;
}

html body #app.app-shell:not(.hidden) > .app-header .app-kicker,
html body #app.app-shell:not(.hidden) > .app-header small {
  color: #5f7898 !important;
  font-size: .76rem !important;
  font-weight: 850 !important;
}

html body #app.app-shell:not(.hidden) > .app-header .header-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}

html body #app.app-shell:not(.hidden) > .app-header .header-actions button {
  min-height: 42px !important;
  border: 1px solid #dceaff !important;
  border-radius: 999px !important;
  padding: 9px 13px !important;
  color: #1f64c8 !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 10px 20px rgba(47, 111, 228, .08) !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
}

html body #app.app-shell:not(.hidden) > .page,
html body #app.app-shell:not(.hidden) > section.page {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
  position: fixed !important;
  top: calc(112px + env(safe-area-inset-top, 0px)) !important;
  bottom: auto !important;
  left: max(14px, calc((100vw - 1420px) / 2 + 18px)) !important;
  right: auto !important;
  z-index: 210 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  width: 88px !important;
  max-width: 88px !important;
  max-height: calc(100dvh - 130px) !important;
  margin: 0 !important;
  border: 1px solid rgba(213, 227, 248, .92) !important;
  border-radius: 28px !important;
  padding: 10px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 20px 44px rgba(47, 111, 228, .12) !important;
  backdrop-filter: blur(18px) !important;
  scrollbar-width: none !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav::-webkit-scrollbar {
  display: none !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
  display: grid !important;
  grid-template-rows: 30px auto !important;
  place-items: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 74px !important;
  border: 1px solid transparent !important;
  border-radius: 22px !important;
  padding: 10px 5px !important;
  color: #71809b !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .7rem !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  transform: none !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:hover,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:hover,
html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:hover {
  border-color: #cfe0ff !important;
  color: #2f6fe4 !important;
  background: linear-gradient(180deg, #f3f8ff, #eaf3ff) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .86), 0 10px 18px rgba(47, 111, 228, .08) !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon {
  width: 28px !important;
  height: 28px !important;
  color: currentColor !important;
}

html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button span:last-child {
  max-width: 100% !important;
  overflow: hidden !important;
  color: inherit !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  html body #app.app-shell:not(.hidden),
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden),
  html[data-theme="dark"] body #app.app-shell:not(.hidden) {
    width: 100% !important;
    min-height: 100dvh !important;
    padding: calc(94px + env(safe-area-inset-top, 0px)) 14px calc(92px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) > .app-header,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) > .app-header {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    min-height: calc(76px + env(safe-area-inset-top, 0px)) !important;
    border-radius: 0 0 28px 28px !important;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .brand-mark {
    width: 52px !important;
    height: 52px !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions {
    gap: 7px !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions .install-action {
    display: none !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions button {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    overflow: hidden !important;
    padding: 0 !important;
    text-indent: -999px !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions #theme-toggle::before {
    content: "?" !important;
    display: grid !important;
    width: 100% !important;
    height: 100% !important;
    place-items: center !important;
    text-indent: 0 !important;
    font-size: 1.22rem !important;
  }

  html body #app.app-shell:not(.hidden) > .app-header .header-actions #logout::before {
    content: "?" !important;
    display: grid !important;
    width: 100% !important;
    height: 100% !important;
    place-items: center !important;
    text-indent: 0 !important;
    font-size: 1.22rem !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    top: auto !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    display: flex !important;
    gap: 7px !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    min-height: 72px !important;
    border-radius: 28px !important;
    padding: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 18px 42px rgba(65, 108, 180, .14) !important;
    scroll-behavior: smooth !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:not([data-theme="dark"]) body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html[data-theme="dark"] body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    flex: 0 0 82px !important;
    width: 82px !important;
    min-height: 56px !important;
    border-radius: 21px !important;
    padding: 7px 6px !important;
    font-size: .72rem !important;
  }

  html body #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon {
    width: 24px !important;
    height: 24px !important;
  }
}

/* ADMIN PUBLIC NAV HARD OVERRIDE 20260616-206 */
html body main#app.app-shell:not(.hidden) > aside#side-panel.side-panel,
html body main#app.app-shell:not(.hidden) > nav#tabs.tabbar,
html body main#app.app-shell:not(.hidden) > section#admin-topbar.admin-topbar {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html body main#app.app-shell:not(.hidden) > section.page {
  grid-column: auto !important;
  grid-row: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  transform: none !important;
}

/* ADMIN PUBLIC NAV FINAL FIX 20260616-206 */
html body main#app.app-shell:not(.hidden),
html:not([data-theme="dark"]) body main#app.app-shell:not(.hidden),
html[data-theme="dark"] body main#app.app-shell:not(.hidden) {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  width: min(100% - 28px, 1420px) !important;
  max-width: 1420px !important;
  margin: 0 auto !important;
  padding: calc(104px + env(safe-area-inset-top, 0px)) 0 34px 112px !important;
  overflow-x: clip !important;
}

html body main#app.app-shell:not(.hidden) > aside#side-panel,
html body main#app.app-shell:not(.hidden) > nav#tabs,
html body main#app.app-shell:not(.hidden) > section#admin-topbar,
html:not([data-theme="dark"]) body main#app.app-shell:not(.hidden) > aside#side-panel,
html:not([data-theme="dark"]) body main#app.app-shell:not(.hidden) > nav#tabs,
html:not([data-theme="dark"]) body main#app.app-shell:not(.hidden) > section#admin-topbar,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) > aside#side-panel,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) > nav#tabs,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) > section#admin-topbar {
  display: none !important;
  position: absolute !important;
  inset: auto !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html body main#app.app-shell:not(.hidden) > section.page {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  position: relative !important;
  left: auto !important;
  transform: none !important;
}

html body main#app.app-shell:not(.hidden) > section.page.hidden {
  display: none !important;
}

@media (min-width: 761px) {
  html body main#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    top: calc(112px + env(safe-area-inset-top, 0px)) !important;
    bottom: auto !important;
    left: max(14px, calc((100vw - 1420px) / 2 + 18px)) !important;
    right: auto !important;
    display: grid !important;
    width: 88px !important;
    max-width: 88px !important;
  }
}

@media (max-width: 760px) {
  html body main#app.app-shell:not(.hidden),
  html:not([data-theme="dark"]) body main#app.app-shell:not(.hidden),
  html[data-theme="dark"] body main#app.app-shell:not(.hidden) {
    width: 100% !important;
    max-width: none !important;
    padding: calc(94px + env(safe-area-inset-top, 0px)) 14px calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ADMIN PUBLIC NAV SPECIFICITY LOCK 20260616-206 */
:root body main#app#app.app-shell:not(.hidden),
:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  width: min(100% - 28px, 1420px) !important;
  max-width: 1420px !important;
  margin: 0 auto !important;
  padding: calc(104px + env(safe-area-inset-top, 0px)) 0 34px 112px !important;
}

:root body main#app#app.app-shell:not(.hidden) > aside#side-panel.side-panel,
:root body main#app#app.app-shell:not(.hidden) > nav#tabs.tabbar,
:root body main#app#app.app-shell:not(.hidden) > section#admin-topbar.admin-topbar,
:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > aside#side-panel.side-panel,
:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > nav#tabs.tabbar,
:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > section#admin-topbar.admin-topbar,
:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > aside#side-panel.side-panel,
:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > nav#tabs.tabbar,
:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > section#admin-topbar.admin-topbar {
  display: none !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

:root body main#app#app.app-shell:not(.hidden) > section.page {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
}

:root body main#app#app.app-shell:not(.hidden) > section.page.hidden {
  display: none !important;
}

@media (max-width: 760px) {
  :root body main#app#app.app-shell:not(.hidden),
  :root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
  :root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
    width: 100% !important;
    max-width: none !important;
    padding: calc(94px + env(safe-area-inset-top, 0px)) 14px calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ADMIN TENANTS PROPERTIES PAYMENTS CAROUSELS 20260616-206 */
#app.app-shell:not(.hidden) .admin-tenant-carousel-section,
#app.app-shell:not(.hidden) .admin-property-carousel-section,
#app.app-shell:not(.hidden) .admin-payment-carousel-section {
  margin: 18px 0 !important;
}

#app.app-shell:not(.hidden) .admin-tenant-carousel,
#app.app-shell:not(.hidden) .admin-property-carousel,
#app.app-shell:not(.hidden) .admin-payment-carousel {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(280px, 360px) !important;
  gap: 14px !important;
  overflow-x: auto !important;
  padding: 2px 2px 12px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

#app.app-shell:not(.hidden) .admin-tenant-carousel::-webkit-scrollbar,
#app.app-shell:not(.hidden) .admin-property-carousel::-webkit-scrollbar,
#app.app-shell:not(.hidden) .admin-payment-carousel::-webkit-scrollbar {
  display: none !important;
}

#app.app-shell:not(.hidden) .admin-carousel-card,
:root:not([data-theme="dark"]) #app.app-shell:not(.hidden) .admin-carousel-card,
:root[data-theme="dark"] #app.app-shell:not(.hidden) .admin-carousel-card {
  display: grid !important;
  align-content: start !important;
  gap: 13px !important;
  min-height: 260px !important;
  border: 1px solid #dceaff !important;
  border-radius: 28px !important;
  padding: 16px !important;
  color: #10243f !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 18px 38px rgba(65, 108, 180, .10) !important;
  scroll-snap-align: start !important;
}

#app.app-shell:not(.hidden) .admin-carousel-card h3 {
  margin: 0 !important;
  color: #10243f !important;
  font-size: 1.16rem !important;
  font-weight: 950 !important;
  letter-spacing: -.025em !important;
  line-height: 1.1 !important;
}

#app.app-shell:not(.hidden) .admin-carousel-card p {
  margin: 0 !important;
  color: #667894 !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
}

#app.app-shell:not(.hidden) .admin-card-topline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

#app.app-shell:not(.hidden) .admin-card-topline > strong {
  color: #1f64c8 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) .admin-card-facts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#app.app-shell:not(.hidden) .admin-card-facts span {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  border: 1px solid #e3efff !important;
  border-radius: 16px !important;
  padding: 9px !important;
  background: #f3f8ff !important;
}

#app.app-shell:not(.hidden) .admin-card-facts small {
  color: #7890ad !important;
  font-size: .66rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

#app.app-shell:not(.hidden) .admin-card-facts b {
  overflow: hidden !important;
  color: #10243f !important;
  font-size: .86rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#app.app-shell:not(.hidden) .admin-card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: auto !important;
}

#app.app-shell:not(.hidden) .admin-card-actions .button-link,
#app.app-shell:not(.hidden) .admin-card-actions button,
#app.app-shell:not(.hidden) .admin-card-actions a {
  flex: 1 1 auto !important;
  justify-content: center !important;
  text-align: center !important;
}

#app.app-shell:not(.hidden) .admin-tenant-head {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
}

#app.app-shell:not(.hidden) .admin-tenant-head img,
#app.app-shell:not(.hidden) .admin-tenant-head > span {
  display: grid !important;
  width: 56px !important;
  height: 56px !important;
  place-items: center !important;
  border-radius: 20px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #8fc8ff, #2f6fe4) !important;
  box-shadow: 0 14px 26px rgba(47, 111, 228, .18) !important;
  font-weight: 950 !important;
  object-fit: cover !important;
}

#app.app-shell:not(.hidden) .admin-card-details {
  border: 1px solid #e3efff !important;
  border-radius: 18px !important;
  padding: 8px 10px !important;
  background: rgba(243, 248, 255, .72) !important;
}

#app.app-shell:not(.hidden) .admin-card-details summary {
  cursor: pointer !important;
  color: #285b98 !important;
  font-size: .82rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) .admin-card-details > div {
  display: grid !important;
  gap: 8px !important;
  padding-top: 10px !important;
}

#app.app-shell:not(.hidden) .admin-dashboard-priority {
  border: 1px solid #dceaff !important;
  border-radius: 30px !important;
  padding: 16px !important;
  background: rgba(255, 255, 255, .78) !important;
  box-shadow: 0 20px 46px rgba(65, 108, 180, .10) !important;
}

#app.app-shell:not(.hidden) .admin-payment-groups-shell {
  display: grid !important;
  gap: 16px !important;
  margin: 18px 0 !important;
}

#app.app-shell:not(.hidden) .admin-payment-property-section {
  border: 1px solid #dceaff !important;
  border-radius: 28px !important;
  padding: 16px !important;
  background: rgba(255, 255, 255, .66) !important;
  box-shadow: 0 16px 34px rgba(65, 108, 180, .08) !important;
}

#app.app-shell:not(.hidden) .admin-payment-property-section .admin-room-section-head {
  margin-bottom: 12px !important;
}

@media (max-width: 760px) {
  #app.app-shell:not(.hidden) .admin-tenant-carousel,
  #app.app-shell:not(.hidden) .admin-property-carousel,
  #app.app-shell:not(.hidden) .admin-payment-carousel {
    grid-auto-columns: minmax(252px, 82vw) !important;
    gap: 11px !important;
  }

  #app.app-shell:not(.hidden) .admin-carousel-card {
    border-radius: 24px !important;
    padding: 14px !important;
  }
}

/* SQUARED NAV BARS 20260616-206 */
:root {
  --bar-radius-soft: 18px;
  --bar-radius-small: 12px;
  --bar-radius-active: 14px;
}

#public-catalog .public-mobile-header,
#public-catalog .public-top-header,
#public-catalog .public-section-nav,
#public-catalog .public-bottom-nav,
#public-catalog .public-location-pills,
#public-catalog .public-location-rail,
#public-catalog .public-detail-actions,
#public-catalog .public-stay-row-controls,
#app.app-shell:not(.hidden) > .app-header,
#tenant-app.tenant-shell:not(.hidden) > .app-header,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav,
.portal-bottom-nav,
#rooms .admin-room-location-rail,
#rooms .admin-room-location-pills {
  border-radius: var(--bar-radius-soft) !important;
}

#public-catalog .public-mobile-header,
#public-catalog .public-top-header,
#app.app-shell:not(.hidden) > .app-header,
#tenant-app.tenant-shell:not(.hidden) > .app-header {
  border-radius: 0 0 var(--bar-radius-soft) var(--bar-radius-soft) !important;
}

#public-catalog .public-bottom-nav button,
#public-catalog .public-section-nav button,
#public-catalog .public-location-pills button,
#public-catalog .public-property-tabs button,
#public-catalog .public-detail-actions button,
#public-catalog .public-detail-actions a,
#public-catalog .public-stay-row-controls button,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button,
.portal-bottom-nav button,
#rooms .admin-room-location-pills button,
#app.app-shell:not(.hidden) .header-actions button,
#tenant-app.tenant-shell:not(.hidden) .header-actions button,
#app.app-shell:not(.hidden) .admin-carousel-controls button {
  border-radius: var(--bar-radius-small) !important;
}

#public-catalog .public-bottom-nav button.active,
#public-catalog .public-bottom-nav button:hover,
#public-catalog .public-section-nav button.active,
#public-catalog .public-section-nav button:hover,
#public-catalog .public-location-pills button.active,
#public-catalog .public-location-pills button:hover,
#rooms .admin-room-location-pills button.active,
#rooms .admin-room-location-pills button:hover,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:hover,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button.active,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button:hover,
.portal-bottom-nav button.active,
.portal-bottom-nav button:hover {
  border-radius: var(--bar-radius-active) !important;
}

#public-catalog .public-bottom-nav .public-nav-icon,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav .portal-nav-icon,
.portal-bottom-nav .portal-nav-icon {
  border-radius: 12px !important;
}

@media (max-width: 760px) {
  #public-catalog .public-bottom-nav,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav,
  .portal-bottom-nav {
    border-radius: 18px !important;
  }

  #public-catalog .public-bottom-nav button,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button,
  .portal-bottom-nav button {
    border-radius: 13px !important;
  }
}

/* THEME SETTINGS 20260616-206 */
html[data-theme="dark"] body {
  background: #0f172a !important;
}

html[data-theme="dark"] body main#app.app-shell:not(.hidden),
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) {
  color: #e5eefc !important;
  background:
    radial-gradient(circle at top left, rgba(59, 130, 246, .18), transparent 36%),
    linear-gradient(180deg, #0f172a, #111827) !important;
}

html[data-theme="dark"] body main#app.app-shell:not(.hidden) > .app-header,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) > .app-header,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav {
  color: #e5eefc !important;
  border-color: rgba(96, 165, 250, .26) !important;
  background: rgba(17, 24, 39, .94) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .32) !important;
}

html[data-theme="dark"] body main#app.app-shell:not(.hidden) > section.page,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) .card,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) article,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) details,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) .item,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) .card,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) article,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) .item {
  color: #e5eefc !important;
  border-color: rgba(96, 165, 250, .20) !important;
  background: rgba(15, 23, 42, .88) !important;
}

html[data-theme="dark"] body main#app.app-shell:not(.hidden) h1,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) h2,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) h3,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) strong,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) h1,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) h2,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) h3,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) strong {
  color: #f8fbff !important;
}

html[data-theme="dark"] body main#app.app-shell:not(.hidden) small,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) .meta,
html[data-theme="dark"] body main#app.app-shell:not(.hidden) p,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) small,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) .meta,
html[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) p {
  color: #b8c7dc !important;
}

html[data-theme="dark"] body .theme-choice {
  color: #dbeafe !important;
  border-color: rgba(96, 165, 250, .24) !important;
  background: linear-gradient(180deg, #172033, #101827) !important;
}

html[data-theme="dark"] body .theme-choice span {
  color: #aebfd6 !important;
}

html[data-theme="dark"] body .theme-choice.active {
  border-color: #7db7ff !important;
  background: linear-gradient(180deg, #1d3558, #13243d) !important;
  box-shadow: 0 16px 34px rgba(59, 130, 246, .18) !important;
}

/* SHARPER NAV BARS DESKTOP MOBILE 20260616-206 */
:root {
  --bar-radius-soft: 8px;
  --bar-radius-small: 6px;
  --bar-radius-active: 7px;
}

#public-catalog .public-mobile-header,
#public-catalog .public-top-header,
#public-catalog .public-desktop-header,
#public-catalog .public-section-nav,
#public-catalog .public-mobile-main-nav,
#public-catalog .public-bottom-nav,
#public-catalog .public-location-pills,
#public-catalog .public-location-rail,
#public-catalog .public-detail-topbar,
#public-catalog .public-detail-actions,
#public-catalog .public-stay-row-controls,
#public-catalog .public-stay-filter-panel,
#app.app-shell:not(.hidden) > .app-header,
#tenant-app.tenant-shell:not(.hidden) > .app-header,
#app.app-shell:not(.hidden) #admin-topbar,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav,
.portal-bottom-nav,
#rooms .admin-room-location-rail,
#rooms .admin-room-location-pills {
  border-radius: var(--bar-radius-soft) !important;
}

#public-catalog .public-mobile-header,
#public-catalog .public-top-header,
#public-catalog .public-desktop-header,
#app.app-shell:not(.hidden) > .app-header,
#tenant-app.tenant-shell:not(.hidden) > .app-header {
  border-radius: 0 0 var(--bar-radius-soft) var(--bar-radius-soft) !important;
}

#public-catalog .public-desktop-brand,
#public-catalog .public-desktop-actions a,
#public-catalog .public-desktop-actions button,
#public-catalog .public-bottom-nav button,
#public-catalog .public-section-nav button,
#public-catalog .public-mobile-main-nav button,
#public-catalog .public-location-pills button,
#public-catalog .public-location-tab,
#public-catalog .public-rail-filter-button,
#public-catalog .public-filter-toggle,
#public-catalog .public-property-tabs button,
#public-catalog .public-stay-filter-chips button,
#public-catalog .public-detail-actions button,
#public-catalog .public-detail-actions a,
#public-catalog .public-stay-row-controls button,
#public-catalog .public-location-map-back,
#public-catalog .public-map-open-button,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button,
.portal-bottom-nav button,
#rooms .admin-room-location-pills button,
#app.app-shell:not(.hidden) .header-actions button,
#tenant-app.tenant-shell:not(.hidden) .header-actions button,
#app.app-shell:not(.hidden) #admin-topbar .cool-topbar-search,
#app.app-shell:not(.hidden) #admin-topbar .cool-icon-btn,
#app.app-shell:not(.hidden) .admin-carousel-controls button {
  border-radius: var(--bar-radius-small) !important;
}

#public-catalog .public-bottom-nav button.active,
#public-catalog .public-bottom-nav button:hover,
#public-catalog .public-section-nav button.active,
#public-catalog .public-section-nav button:hover,
#public-catalog .public-mobile-main-nav button.active,
#public-catalog .public-mobile-main-nav button:hover,
#public-catalog .public-location-pills button.active,
#public-catalog .public-location-pills button:hover,
#public-catalog .public-location-tab.active,
#public-catalog .public-location-tab:hover,
#public-catalog .public-rail-filter-button.active,
#public-catalog .public-rail-filter-button:hover,
#public-catalog .public-filter-toggle.active,
#public-catalog .public-filter-toggle:hover,
#public-catalog .public-stay-filter-chips button.active,
#public-catalog .public-stay-filter-chips button:hover,
#rooms .admin-room-location-pills button.active,
#rooms .admin-room-location-pills button:hover,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button.active,
#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button:hover,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button.active,
#tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button:hover,
.portal-bottom-nav button.active,
.portal-bottom-nav button:hover {
  border-radius: var(--bar-radius-active) !important;
}

#public-catalog .brand-mark,
#public-catalog .public-house-logo,
#public-catalog .public-nav-icon,
#public-catalog .public-location-tab-icon,
#app.app-shell:not(.hidden) .brand-mark,
#tenant-app.tenant-shell:not(.hidden) .brand-mark,
#app.app-shell:not(.hidden) .portal-nav-icon,
#tenant-app.tenant-shell:not(.hidden) .portal-nav-icon,
.portal-bottom-nav .portal-nav-icon {
  border-radius: 7px !important;
}

@media (min-width: 761px) {
  #public-catalog .public-bottom-nav,
  #public-catalog .public-section-nav,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav,
  .portal-bottom-nav {
    border-radius: 8px !important;
  }

  #public-catalog .public-bottom-nav button,
  #public-catalog .public-section-nav button,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button,
  .portal-bottom-nav button {
    border-radius: 6px !important;
  }
}

/* ADMIN DESKTOP FULL WIDTH + REAL DARK THEME 20260616-206 */
@media (min-width: 761px) {
  html body main#app#app.app-shell:not(.hidden),
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
    width: 100vw !important;
    max-width: none !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: calc(102px + env(safe-area-inset-top, 0px)) 24px 40px 126px !important;
    overflow-x: hidden !important;
    border-radius: 0 !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header,
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > .app-header,
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > .app-header {
    left: 24px !important;
    right: 24px !important;
    top: calc(10px + env(safe-area-inset-top, 0px)) !important;
    width: auto !important;
    max-width: none !important;
  }

  html body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    left: 24px !important;
    top: calc(112px + env(safe-area-inset-top, 0px)) !important;
  }

  html body main#app#app.app-shell:not(.hidden) > section.page:not(.hidden) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  html body main#app#app.app-shell:not(.hidden) .grid.two-columns {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr) !important;
  }

  html body main#app#app.app-shell:not(.hidden) .settings-app-card .actions {
    display: flex !important;
    justify-content: flex-start !important;
  }

  html body main#app#app.app-shell:not(.hidden) #theme-toggle,
  html body main#app#app.app-shell:not(.hidden) [data-settings-theme] {
    display: none !important;
    visibility: hidden !important;
  }
}

html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) {
  color: #10243f !important;
  background:
    radial-gradient(circle at top left, rgba(125, 183, 255, .16), transparent 34%),
    linear-gradient(180deg, #f8fbff, #ffffff) !important;
}

html[data-theme="dark"] body,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
  color: #eaf2ff !important;
  background:
    radial-gradient(circle at top left, rgba(96, 165, 250, .16), transparent 36%),
    linear-gradient(180deg, #08111f 0%, #0f172a 45%, #111827 100%) !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > .app-header,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .22) !important;
  background: rgba(11, 18, 32, .94) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .38) !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > section.page,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .card,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) article,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) details,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .item,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-hero,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .dashboard-hero,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .collapsible-form,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .notice,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) input,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) select,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) textarea {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .22) !important;
  background: rgba(15, 23, 42, .92) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .22) !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) h1,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) h2,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) h3,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) h4,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) strong,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) summary {
  color: #f8fbff !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) p,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) small,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) label,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .meta,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .app-kicker {
  color: #b9c8dd !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.secondary,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice,
html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .badge {
  color: #dbeafe !important;
  border-color: rgba(125, 183, 255, .28) !important;
  background: rgba(30, 41, 59, .92) !important;
}

html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice.active {
  color: #f8fbff !important;
  border-color: #8fc8ff !important;
  background: linear-gradient(180deg, #234876, #162b49) !important;
}

@media (max-width: 760px) {
  #public-catalog .public-bottom-nav,
  #public-catalog .public-section-nav,
  #public-catalog .public-location-pills,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav,
  .portal-bottom-nav {
    border-radius: 8px !important;
  }

  #public-catalog .public-bottom-nav button,
  #public-catalog .public-section-nav button,
  #public-catalog .public-location-pills button,
  #app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  #tenant-app.tenant-shell:not(.hidden) .portal-bottom-nav.tenant-bottom-nav button,
  .portal-bottom-nav button {
    border-radius: 6px !important;
  }
}

/* PUBLIC DESKTOP SHARP SIDEBAR FIX 20260616-206 */
@media (min-width: 761px) {
  #public-catalog.public-catalog-shell:not(.hidden),
  :root:not([data-theme="dark"]) #public-catalog.public-catalog-shell:not(.hidden),
  :root[data-theme="dark"] #public-catalog.public-catalog-shell:not(.hidden) {
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 92px 22px 42px 166px !important;
    overflow-x: hidden !important;
  }

  #public-catalog .public-desktop-header,
  :root:not([data-theme="dark"]) #public-catalog .public-desktop-header,
  :root[data-theme="dark"] #public-catalog .public-desktop-header {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    min-height: 72px !important;
    border-radius: 0 !important;
    border-width: 0 0 1px !important;
    padding: 12px 18px !important;
    transform: none !important;
  }

  #public-catalog .public-desktop-brand,
  #public-catalog .public-desktop-brand:hover,
  #public-catalog .public-desktop-brand:focus,
  #public-catalog .public-desktop-brand:active,
  #public-catalog button.public-desktop-brand:not(.secondary):not(.ghost):not(.danger) {
    border-radius: 6px !important;
  }

  #public-catalog .public-desktop-brand .public-house-logo,
  #public-catalog .public-house-logo {
    border-radius: 8px !important;
  }

  #public-catalog .public-desktop-actions .public-mobile-refresh,
  #public-catalog .public-desktop-actions .public-contact-icon-btn,
  #public-catalog .public-desktop-actions a,
  #public-catalog .public-desktop-actions button {
    border-radius: 6px !important;
  }

  #public-catalog .public-bottom-nav,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav {
    top: 92px !important;
    bottom: 18px !important;
    left: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 126px !important;
    max-width: 126px !important;
    min-height: auto !important;
    height: auto !important;
    border-radius: 8px !important;
    padding: 10px !important;
  }

  #public-catalog .public-bottom-nav button,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button {
    display: grid !important;
    grid-template-rows: 28px auto !important;
    place-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 72px !important;
    border-radius: 6px !important;
    padding: 10px 8px !important;
    font-size: .78rem !important;
    line-height: 1.12 !important;
  }

  #public-catalog .public-bottom-nav button.active,
  #public-catalog .public-bottom-nav button:hover,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button.active,
  :root:not([data-theme="dark"]) #public-catalog .public-bottom-nav button:hover,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button.active,
  :root[data-theme="dark"] #public-catalog .public-bottom-nav button:hover {
    border-radius: 6px !important;
  }

  #public-catalog .public-bottom-nav .public-nav-icon {
    width: 27px !important;
    height: 27px !important;
    border-radius: 6px !important;
  }

  #public-catalog .public-bottom-nav .public-nav-label {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    overflow: visible !important;
    color: inherit !important;
    text-align: center !important;
    text-overflow: clip !important;
    white-space: normal !important;
    word-break: normal !important;
  }

  #public-catalog .public-stay-explorer,
  #public-catalog .public-catalog-hero,
  #public-catalog .public-location-picker,
  #public-catalog .public-contact-panel,
  #public-catalog .public-property-group {
    border-radius: 8px !important;
  }

  #public-catalog .public-stay-explorer-summary,
  #public-catalog .public-stay-explorer-summary span,
  #public-catalog .public-filter-toggle,
  #public-catalog .public-rail-filter-button,
  #public-catalog .public-stay-row-controls,
  #public-catalog .public-stay-row-controls button {
    border-radius: 6px !important;
  }

  #public-catalog .public-stay-row-controls button::before,
  #public-catalog .public-stay-row-controls button::after {
    border-radius: 6px !important;
  }
}

/* ADMIN DESKTOP COMPACT WORKSPACE 20260616-206 */
@media (min-width: 761px) {
  html,
  body {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow-x: hidden !important;
  }

  html body main#app#app.app-shell:not(.hidden),
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 82px 18px 28px 104px !important;
    overflow-x: hidden !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header,
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > .app-header,
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > .app-header {
    box-sizing: border-box !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 64px !important;
    border-radius: 0 !important;
    border-width: 0 0 1px !important;
    padding: 8px 18px 8px 96px !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header .brand-lockup,
  html body main#app#app.app-shell:not(.hidden) > .app-header [data-admin-logo-logout] {
    max-width: none !important;
    width: auto !important;
    min-height: 48px !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header .brand-mark {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header h1 {
    font-size: 1.08rem !important;
  }

  html body main#app#app.app-shell:not(.hidden) > .app-header .header-actions {
    display: none !important;
    visibility: hidden !important;
  }

  html body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    top: 76px !important;
    bottom: 16px !important;
    left: 14px !important;
    width: 76px !important;
    max-width: 76px !important;
    gap: 7px !important;
    padding: 8px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    min-height: 62px !important;
    padding: 7px 4px !important;
    font-size: .66rem !important;
  }

  html body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon {
    width: 25px !important;
    height: 25px !important;
  }

  html body main#app#app.app-shell:not(.hidden) > section.page:not(.hidden),
  html body main#app#app.app-shell:not(.hidden) > .page:not(.hidden) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  html body main#app#app.app-shell:not(.hidden) .grid {
    gap: 14px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .card,
  html body main#app#app.app-shell:not(.hidden) article,
  html body main#app#app.app-shell:not(.hidden) details,
  html body main#app#app.app-shell:not(.hidden) .item {
    padding: 16px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .stats,
  html body main#app#app.app-shell:not(.hidden) .report-mini-stats,
  html body main#app#app.app-shell:not(.hidden) .report-facts {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .report-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .report-actions {
    display: flex !important;
    align-items: end !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }

  html body main#app#app.app-shell:not(.hidden) .report-actions label {
    width: 190px !important;
    min-width: 190px !important;
  }

  html body main#app#app.app-shell:not(.hidden) .property-room-hero {
    grid-template-columns: minmax(0, 1.4fr) minmax(340px, .65fr) !important;
    gap: 18px !important;
  }
}

/* ADMIN ROOT SPECIFICITY OVERRIDE 20260616-206 */
@media (min-width: 761px) {
  html:root body main#app#app.app-shell:not(.hidden),
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 82px 18px 28px 104px !important;
    overflow-x: hidden !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) > section.page:not(.hidden),
  html:root body main#app#app.app-shell:not(.hidden) > .page:not(.hidden) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) > .app-header,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > .app-header,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > .app-header {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 64px !important;
    border-radius: 0 !important;
    padding: 8px 18px 8px 96px !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) > .app-header .header-actions {
    display: none !important;
    visibility: hidden !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    top: 76px !important;
    left: 14px !important;
    bottom: 16px !important;
    width: 76px !important;
    max-width: 76px !important;
    padding: 8px !important;
  }
}

/* PUBLIC PC FINAL SQUARE SIDEBAR 20260616-206 */
#public-catalog .public-detail-highlights article::before {
  content: "\2713" !important;
}

@media (min-width: 761px) {
  html body #public-catalog.public-catalog-shell:not(.hidden),
  html:not([data-theme="dark"]) body #public-catalog.public-catalog-shell:not(.hidden),
  html[data-theme="dark"] body #public-catalog.public-catalog-shell:not(.hidden) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 92px 22px 42px 166px !important;
    overflow-x: hidden !important;
  }

  html body #public-catalog .public-desktop-header,
  html:not([data-theme="dark"]) body #public-catalog .public-desktop-header,
  html[data-theme="dark"] body #public-catalog .public-desktop-header {
    box-sizing: border-box !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 72px !important;
    border-radius: 0 !important;
    border-width: 0 0 1px !important;
    padding: 12px 18px !important;
    transform: none !important;
  }

  html body #public-catalog .public-desktop-brand,
  html body #public-catalog .public-desktop-actions a,
  html body #public-catalog .public-desktop-actions button,
  html body #public-catalog .public-mobile-refresh,
  html body #public-catalog .public-contact-icon-btn {
    border-radius: 6px !important;
  }

  html body #public-catalog .public-house-logo,
  html body #public-catalog .public-desktop-brand .public-house-logo {
    border-radius: 8px !important;
  }

  html body #public-catalog .public-bottom-nav,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav {
    top: 92px !important;
    bottom: 18px !important;
    left: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 126px !important;
    max-width: 126px !important;
    height: auto !important;
    border-radius: 8px !important;
    padding: 10px !important;
  }

  html body #public-catalog .public-bottom-nav button,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav button,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav button {
    display: grid !important;
    grid-template-rows: 28px auto !important;
    place-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 72px !important;
    border-radius: 6px !important;
    padding: 10px 8px !important;
    font-size: .78rem !important;
    line-height: 1.12 !important;
  }

  html body #public-catalog .public-bottom-nav button.active,
  html body #public-catalog .public-bottom-nav button:hover {
    border-radius: 6px !important;
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon {
    width: 27px !important;
    height: 27px !important;
    border-radius: 6px !important;
  }

  html body #public-catalog .public-bottom-nav .public-nav-label {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    overflow: visible !important;
    color: inherit !important;
    text-align: center !important;
    text-overflow: clip !important;
    white-space: normal !important;
    word-break: normal !important;
  }

  html body #public-catalog .public-stay-explorer,
  html body #public-catalog .public-catalog-hero,
  html body #public-catalog .public-location-picker,
  html body #public-catalog .public-contact-panel,
  html body #public-catalog .public-property-group,
  html body #public-catalog .public-room-card {
    border-radius: 8px !important;
  }

  html body #public-catalog .public-stay-explorer-summary,
  html body #public-catalog .public-stay-explorer-summary span,
  html body #public-catalog .public-filter-toggle,
  html body #public-catalog .public-rail-filter-button,
  html body #public-catalog .public-stay-row-controls,
  html body #public-catalog .public-stay-row-controls button {
    border-radius: 6px !important;
  }
}

/* PUBLIC DESKTOP CENTERED MODERN SIDEBAR 20260616-206 */
html body #public-catalog .public-mobile-refresh {
  position: relative !important;
  overflow: hidden !important;
  color: transparent !important;
  text-indent: -999px !important;
}

html body #public-catalog .public-mobile-refresh::before {
  content: "" !important;
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  background: #1f67d8 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.7 6.3A8 8 0 0 0 4.1 10h2.2a5.9 5.9 0 0 1 9.8-2.1L13.5 10.5H21V3l-3.3 3.3ZM6.3 17.7A8 8 0 0 0 19.9 14h-2.2a5.9 5.9 0 0 1-9.8 2.1l2.6-2.6H3V21l3.3-3.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.7 6.3A8 8 0 0 0 4.1 10h2.2a5.9 5.9 0 0 1 9.8-2.1L13.5 10.5H21V3l-3.3 3.3ZM6.3 17.7A8 8 0 0 0 19.9 14h-2.2a5.9 5.9 0 0 1-9.8 2.1l2.6-2.6H3V21l3.3-3.3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  transform: translate(-50%, -50%) !important;
}

@media (min-width: 761px) {
  html body #public-catalog .public-bottom-nav,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav {
    justify-content: center !important;
    gap: 14px !important;
    padding: 14px 10px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(245, 250, 255, .96)) !important;
  }

  html body #public-catalog .public-bottom-nav button,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav button,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav button {
    grid-template-rows: 42px auto !important;
    min-height: 86px !important;
    gap: 8px !important;
    padding: 12px 8px !important;
    color: #245b9f !important;
    background: transparent !important;
  }

  html body #public-catalog .public-bottom-nav button.active,
  html body #public-catalog .public-bottom-nav button:hover,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav button.active,
  html:not([data-theme="dark"]) body #public-catalog .public-bottom-nav button:hover,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav button.active,
  html[data-theme="dark"] body #public-catalog .public-bottom-nav button:hover {
    color: #174f9f !important;
    background: #eaf4ff !important;
    border-color: #cfe2ff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), 0 12px 24px rgba(47, 111, 228, .10) !important;
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon {
    --modern-nav-icon: none;
    position: relative !important;
    display: grid !important;
    width: 44px !important;
    height: 40px !important;
    place-items: center !important;
    border: 1px solid #d8e9ff !important;
    border-radius: 10px !important;
    color: #1f67d8 !important;
    background: linear-gradient(180deg, #f5faff, #e9f4ff) !important;
    box-shadow: 0 10px 18px rgba(31, 103, 216, .10) !important;
    -webkit-mask: none !important;
    mask: none !important;
  }

  html body #public-catalog .public-bottom-nav button.active .public-nav-icon,
  html body #public-catalog .public-bottom-nav button:hover .public-nav-icon {
    color: #ffffff !important;
    border-color: transparent !important;
    background: linear-gradient(135deg, #6db4ff, #2f6fe4) !important;
    box-shadow: 0 12px 22px rgba(47, 111, 228, .22) !important;
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon::before {
    content: "" !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    background: currentColor !important;
    -webkit-mask: var(--modern-nav-icon) center / contain no-repeat !important;
    mask: var(--modern-nav-icon) center / contain no-repeat !important;
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon-bed {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5.5C4 4.7 4.7 4 5.5 4S7 4.7 7 5.5V12h5V8.5C12 7.1 13.1 6 14.5 6H17c2.2 0 4 1.8 4 4v8h-2v-2H5v2H3V5.5h1Zm3 8.5h12v-4c0-1.1-.9-2-2-2h-2.5c-.3 0-.5.2-.5.5V12H7v2Zm-1.3-3.5A2.2 2.2 0 1 0 5.7 6a2.2 2.2 0 0 0 0 4.5Z'/%3E%3C/svg%3E");
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon-pin {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5A7.5 7.5 0 0 0 4.5 10c0 5.4 7.5 11.5 7.5 11.5S19.5 15.4 19.5 10A7.5 7.5 0 0 0 12 2.5Zm0 10.1A2.6 2.6 0 1 1 12 7.4a2.6 2.6 0 0 1 0 5.2Z'/%3E%3C/svg%3E");
  }

  html body #public-catalog .public-bottom-nav .public-nav-icon-chat {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4h14c1.1 0 2 .9 2 2v9.2c0 1.1-.9 2-2 2H9.1L4 21v-4.1c-.6-.3-1-.9-1-1.7V6c0-1.1.9-2 2-2Zm3 5.2h8V7.5H8v1.7Zm0 4h6v-1.7H8v1.7Z'/%3E%3C/svg%3E");
  }

  html body #public-catalog .public-bottom-nav .public-nav-label {
    font-size: .8rem !important;
    font-weight: 950 !important;
    letter-spacing: -.01em !important;
  }
}

/* PUBLIC DESKTOP SIDEBAR CENTER LOCK 20260616-206 */
@media (min-width: 761px) {
  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav,
  html:root:not([data-theme="dark"]) body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav,
  html:root[data-theme="dark"] body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    align-content: center !important;
  }
}

/* PUBLIC DESKTOP SIDEBAR HORIZONTAL CENTER 20260616-206 */
@media (min-width: 761px) {
  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav,
  html:root:not([data-theme="dark"]) body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav,
  html:root[data-theme="dark"] body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav {
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 14px 9px !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav button,
  html:root:not([data-theme="dark"]) body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav button,
  html:root[data-theme="dark"] body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav button {
    width: 100% !important;
    max-width: 104px !important;
    margin-inline: auto !important;
    justify-items: center !important;
    text-align: center !important;
  }
}

/* ADMIN DARK POLISH + UNCUT SIDEBAR 20260616-206 */
@media (min-width: 761px) {
  html:root body main#app#app.app-shell:not(.hidden),
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden),
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
    padding-left: 138px !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) > .app-header,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) > .app-header,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) > .app-header {
    padding-left: 110px !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    top: 78px !important;
    bottom: 24px !important;
    left: 16px !important;
    width: 104px !important;
    max-width: 104px !important;
    gap: 6px !important;
    padding: 10px !important;
    overflow-y: auto !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    min-height: 61px !important;
    padding: 7px 5px !important;
    gap: 4px !important;
    font-size: .7rem !important;
    line-height: 1.05 !important;
    overflow: visible !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button span:last-child {
    display: block !important;
    max-width: 86px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon {
    width: 24px !important;
    height: 24px !important;
  }
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .dashboard-hero .next-action,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .next-action {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .22) !important;
  background: linear-gradient(180deg, rgba(20, 31, 52, .96), rgba(13, 23, 40, .96)) !important;
  box-shadow: inset 0 0 0 1px rgba(125, 183, 255, .08), 0 18px 38px rgba(0, 0, 0, .22) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .dashboard-hero .next-action small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .dashboard-hero .next-action p,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .next-action small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .next-action p {
  color: #aebfda !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .dashboard-hero .next-action strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .next-action strong {
  color: #f8fbff !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-dashboard-priority,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-payment-carousel-section {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .20) !important;
  background: linear-gradient(180deg, rgba(16, 27, 46, .95), rgba(10, 19, 34, .95)) !important;
  box-shadow: inset 0 0 0 1px rgba(125, 183, 255, .08), 0 22px 48px rgba(0, 0, 0, .24) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-dashboard-priority .admin-carousel-card,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-payment-carousel-section .admin-carousel-card {
  border-color: rgba(125, 183, 255, .22) !important;
  background: linear-gradient(180deg, rgba(21, 33, 55, .98), rgba(14, 25, 43, .98)) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-card-facts span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .report-mini-stats span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .report-facts span {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .18) !important;
  background: rgba(9, 18, 32, .72) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) input,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) select,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) textarea,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.secondary,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .button-link.secondary {
  color: #eaf2ff !important;
  border-color: rgba(125, 183, 255, .26) !important;
  background: rgba(14, 27, 47, .92) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.secondary:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .button-link.secondary:hover {
  background: rgba(25, 44, 74, .96) !important;
}

/* PUBLIC DESKTOP MINIMAL NAV ICONS 20260616-206 */
@media (min-width: 761px) {
  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav .public-nav-icon {
    width: 42px !important;
    height: 38px !important;
    border: 1px solid #dbeafe !important;
    border-radius: 9px !important;
    color: #1761c9 !important;
    background: #f7fbff !important;
    box-shadow: none !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav button.active .public-nav-icon,
  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav button:hover .public-nav-icon {
    color: #0f5fc7 !important;
    border-color: #bcd8ff !important;
    background: #edf6ff !important;
    box-shadow: none !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav .public-nav-icon::before {
    width: 23px !important;
    height: 23px !important;
    background: currentColor !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav .public-nav-icon-bed {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6v12'/%3E%3Cpath d='M20 11v7'/%3E%3Cpath d='M4 13h16'/%3E%3Cpath d='M7 10h4'/%3E%3Cpath d='M11 10h5.5a3.5 3.5 0 0 1 3.5 3.5V18'/%3E%3Cpath d='M4 18h16'/%3E%3C/svg%3E") !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav .public-nav-icon-pin {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-5.7 7-12a7 7 0 1 0-14 0c0 6.3 7 12 7 12Z'/%3E%3Ccircle cx='12' cy='9' r='2.4'/%3E%3C/svg%3E") !important;
  }

  html:root body #public-catalog.public-catalog-shell:not(.hidden) nav.public-bottom-nav .public-nav-icon-chat {
    --modern-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 5h14a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H9l-5 4v-4.5A2 2 0 0 1 3 15V7a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M8 10h8'/%3E%3Cpath d='M8 13h5'/%3E%3C/svg%3E") !important;
  }
}

/* ADMIN ROOMS DARK DETAIL FLOW 20260616-206 */
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card {
  cursor: pointer !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card button,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card a,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card details,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card summary {
  cursor: auto !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .room-create-drawer {
  margin-top: 18px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-page {
  display: grid !important;
  gap: 18px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-card {
  border: 1px solid rgba(102, 151, 214, .20) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 42px rgba(15, 45, 84, .08) !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 18px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar h2,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar p {
  margin: 0 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-layout {
  display: grid !important;
  grid-template-columns: minmax(320px, .9fr) minmax(420px, 1.1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-visual {
  display: grid !important;
  gap: 18px !important;
  align-content: start !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-card {
  padding: 18px !important;
  overflow: hidden !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-gallery .admin-room-card-cover,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-gallery .admin-room-card-empty {
  width: 100% !important;
  height: min(56vh, 430px) !important;
  min-height: 260px !important;
  aspect-ratio: auto !important;
  border-radius: 10px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-gallery .admin-room-card-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary {
  display: grid !important;
  gap: 12px !important;
  margin-top: 0 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary h3,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-form-card h3 {
  margin: 0 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary-card .room-photo-block {
  margin-top: 4px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary-card .room-photo-content {
  display: grid !important;
  gap: 14px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary-card .room-photo-head {
  align-items: center !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-summary-card .room-photo-tools {
  justify-content: flex-start !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-form-details {
  border: 1px solid rgba(102, 151, 214, .20) !important;
  border-radius: 10px !important;
  padding: 12px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-field {
  display: grid !important;
  gap: 12px !important;
  align-content: start !important;
  padding: 14px !important;
  border: 1px solid rgba(194, 220, 255, .72) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, .98), rgba(238, 246, 255, .98)) !important;
  box-shadow: 0 14px 34px rgba(74, 144, 226, .08) !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-head {
  display: grid !important;
  gap: 4px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-head strong {
  color: #10213d !important;
  font-size: .98rem !important;
  font-weight: 900 !important;
  letter-spacing: -.015em !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-head small,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-extra span {
  color: #5f7190 !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 42px !important;
  border: 1px solid #dceaff !important;
  border-radius: 14px !important;
  padding: 9px 13px !important;
  color: #275c9f !important;
  background: #f3f8ff !important;
  box-shadow: 0 10px 22px rgba(65, 108, 180, .08) !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip:hover,
html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip.active {
  color: #154f94 !important;
  border-color: #b8d8ff !important;
  background: linear-gradient(180deg, #ffffff, #eaf4ff) !important;
  transform: translateY(-1px) !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip.active {
  box-shadow: 0 0 0 2px rgba(47, 111, 228, .14), 0 14px 30px rgba(65, 108, 180, .14) !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip b {
  color: inherit !important;
  font-size: .88rem !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  line-height: 1.1 !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip .public-amenity-icon {
  display: inline-grid !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  place-items: center !important;
  color: currentColor !important;
  background: transparent !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip .public-amenity-icon::before {
  content: "" !important;
  width: 20px !important;
  height: 20px !important;
  background: currentColor !important;
  -webkit-mask: var(--amenity-icon) center / contain no-repeat !important;
  mask: var(--amenity-icon) center / contain no-repeat !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-water { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2s6 6.4 6 11a6 6 0 0 1-12 0c0-4.6 6-11 6-11Zm0 17a4 4 0 0 0 4-4h-2a2 2 0 0 1-2 2v2Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-electricity { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 5 13h6l-1 9 9-13h-6l1-7Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-wifi { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.5 9.5 17c1.4-1.2 3.6-1.2 5 0L12 19.5Zm-5-5 2 2c1.7-1.4 4.3-1.4 6 0l2-2c-2.8-2.4-7.2-2.4-10 0Zm-4-4 2 2c4-3.5 10-3.5 14 0l2-2c-5.1-4.6-12.9-4.6-18 0Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-bath { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3a4 4 0 0 0-4 4v7h18v2a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a6 6 0 0 1 10.2-4.2L15 4.6l-1.4 1.4-1.8-1.8A4 4 0 0 0 7 3Zm10 6h-6V7h6v2Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-kitchen { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h2v20H7v-8H5a3 3 0 0 1-3-3V2h2v7h1V2h2v7h1V2Zm10 0c2.2 0 4 2.2 4 5v5h-3v10h-2V2h1Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-gas { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.6 3c-.6 2.1.3 3.5 1.3 4.7 1 1.2 2.1 2.6 2.1 5A6 6 0 1 1 6 12.7c0-3 1.8-5.1 3.4-6.9.8-.9 1.5-1.7 2-2.8.5 1.1 1.5 2.1 3.2 3.2-.1-1.2-.2-2.2 0-3.2Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-living { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 10a3 3 0 0 1 3-3h8a3 3 0 0 1 3 3v5h1v2h-1v2h-2v-2H7v2H5v-2H4v-2h1v-5Zm3-1a1 1 0 0 0-1 1v3h10v-3a1 1 0 0 0-1-1H8Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-laundry { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm0 4v12h14V7H5Zm4 1.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm7.5 5a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0Z'/%3E%3C/svg%3E") !important; }
html body main#app#app.app-shell:not(.hidden) #rooms .public-amenity-icon-garage { --amenity-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5 12 4l9 7.5V20h-3v-6H6v6H3v-8.5Zm5 2.5h8v6H8v-6Zm2 1.5v3h4v-3h-4Z'/%3E%3C/svg%3E") !important; }

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-extra {
  display: grid !important;
  gap: 6px !important;
}

html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-extra input {
  min-height: 44px !important;
  border: 1px solid #dceaff !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  color: #16365d !important;
  background: #ffffff !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-shell {
  color: #edf5ff !important;
  background: transparent !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-rail,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-section,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .room-create-drawer,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-card {
  color: #edf5ff !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: linear-gradient(180deg, rgba(16, 27, 46, .98), rgba(9, 18, 32, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .06), 0 22px 48px rgba(0, 0, 0, .28) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-details,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-form-details,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-field,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .property-summary,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .notice,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .public-card-feature-chip {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: rgba(12, 24, 42, .92) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-section-head h2,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar h2,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-card h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms label,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms summary {
  color: #f8fbff !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms p,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .meta,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-section-head p {
  color: #aebfda !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms input,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms select,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms textarea {
  color: #eef6ff !important;
  border-color: rgba(126, 184, 255, .28) !important;
  background: rgba(8, 18, 33, .96) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button.active {
  color: #ffffff !important;
  border-color: rgba(147, 197, 253, .58) !important;
  background: linear-gradient(135deg, rgba(44, 102, 190, .96), rgba(23, 74, 142, .96)) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-head small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-extra span {
  color: #b8ccec !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip {
  color: #dbeafe !important;
  border-color: rgba(126, 184, 255, .24) !important;
  background: rgba(13, 27, 48, .92) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .18) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip.active {
  color: #f8fbff !important;
  border-color: rgba(126, 184, 255, .42) !important;
  background: linear-gradient(180deg, rgba(28, 64, 121, .95), rgba(18, 43, 87, .98)) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-extra input {
  color: #edf5ff !important;
  border-color: rgba(126, 184, 255, .24) !important;
  background: rgba(8, 16, 30, .94) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .room-photo-dropzone {
  color: #dcecff !important;
  border-color: rgba(125, 183, 255, .42) !important;
  background: linear-gradient(180deg, rgba(16, 35, 61, .96), rgba(10, 24, 43, .96)) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .room-photo-dropzone span {
  color: #aebfda !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .room-photo-dropzone.drag-over,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .room-photo-dropzone.is-uploading {
  border-color: rgba(147, 197, 253, .78) !important;
  background: linear-gradient(180deg, rgba(31, 69, 119, .98), rgba(14, 38, 70, .98)) !important;
  box-shadow: 0 18px 34px rgba(30, 90, 180, .24) !important;
}

@media (max-width: 760px) {
  html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-field {
    padding: 12px !important;
    border-radius: 16px !important;
  }

  html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-grid {
    gap: 8px !important;
  }

  html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-selector-chip {
    width: 100% !important;
    justify-content: flex-start !important;
    min-height: 40px !important;
    padding: 9px 11px !important;
  }

  html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-topbar,
  html body main#app#app.app-shell:not(.hidden) #rooms .admin-room-edit-layout {
    grid-template-columns: 1fr !important;
  }
}

/* ADMIN DARK POLISH 20260616-206 */
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden),
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) *,
html:root[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden),
html:root[data-theme="dark"] body #tenant-app.tenant-shell:not(.hidden) * {
  font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #admin-topbar,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .cool-profile-menu summary,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .cool-topbar-search,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .cool-icon-btn {
  color: #edf5ff !important;
  border-color: rgba(126, 184, 255, .24) !important;
  background: linear-gradient(180deg, rgba(11, 21, 38, .96), rgba(8, 15, 28, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .05), 0 18px 38px rgba(0, 0, 0, .26) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.secondary,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.compact,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .button-link.secondary,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .view-link,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .file-button {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .24) !important;
  background: rgba(13, 27, 48, .94) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .18) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.secondary:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) button.compact:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .button-link.secondary:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .view-link:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .file-button:hover {
  color: #ffffff !important;
  border-color: rgba(147, 197, 253, .42) !important;
  background: linear-gradient(180deg, rgba(28, 64, 121, .95), rgba(18, 43, 87, .98)) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button {
  color: #dbeafe !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: rgba(12, 23, 40, .94) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .04), 0 12px 28px rgba(0, 0, 0, .18) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button small {
  color: inherit !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button.active,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-pills button:hover {
  color: #ffffff !important;
  border-color: rgba(147, 197, 253, .56) !important;
  background: linear-gradient(135deg, rgba(44, 102, 190, .96), rgba(23, 74, 142, .98)) !important;
  box-shadow: 0 16px 34px rgba(19, 62, 122, .34) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-label,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .public-stay-row-controls button,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-carousel-controls button {
  color: #dbeafe !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: rgba(12, 23, 40, .94) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .04), 0 12px 28px rgba(0, 0, 0, .18) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-label span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-location-label i,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .public-stay-row-controls button,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title > strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip strong {
  font-weight: 800 !important;
  letter-spacing: -.015em !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-catalog-card,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-details,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip.available {
  background: rgba(12, 24, 42, .94) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title > strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip strong {
  color: #f8fbff !important;
  line-height: 1.15 !important;
}
/* ADMIN DARK CLEANUP 20260616-206 */
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden),
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms {
  font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-nav-group button.active,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-card:first-child .side-nav-group button.active,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-nav-group button:hover,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-card:first-child .side-nav-group button:hover {
  color: #eef6ff !important;
  border-color: rgba(104, 157, 229, .55) !important;
  background: linear-gradient(180deg, rgba(33, 76, 137, .88), rgba(17, 43, 82, .94)) !important;
  box-shadow: inset 0 0 0 1px rgba(147, 197, 253, .14), 0 12px 26px rgba(0, 0, 0, .22) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-nav-group button.active .portal-nav-icon,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-nav-group button.active i,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #side-panel .side-nav-group button.active svg {
  color: #eef6ff !important;
  opacity: 1 !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .app-kicker,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .login-kicker {
  color: #bdd7ff !important;
  background: rgba(32, 55, 90, .72) !important;
  border: 1px solid rgba(126, 184, 255, .22) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms h2,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms b,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms button {
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title h3,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-title > strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-section-head h2 {
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-tenant-strip span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-status,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .public-card-feature-chip b {
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .admin-room-card-actions button,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #rooms .public-stay-row-controls button {
  color: #dbeafe !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: rgba(12, 23, 40, .94) !important;
}

/* ADMIN DARK FINAL ALIGNMENT 20260616-206 */
@media (min-width: 761px) {
  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 112px !important;
    max-width: 112px !important;
    padding: 12px 10px !important;
    gap: 7px !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:root:not([data-theme="dark"]) body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button,
  html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button {
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
    min-height: 66px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 8px 6px !important;
    margin: 0 auto !important;
    gap: 5px !important;
    transform: none !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav .portal-nav-icon {
    display: block !important;
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
    margin: 0 auto !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  html:root body main#app#app.app-shell:not(.hidden) .portal-bottom-nav.admin-bottom-nav button span:last-child {
    display: block !important;
    width: 100% !important;
    max-width: 78px !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .app-kicker,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .login-kicker,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .side-kicker {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: max-content !important;
  align-items: center !important;
  border: 1px solid rgba(126, 184, 255, .22) !important;
  border-radius: 999px !important;
  padding: 5px 10px !important;
  color: #bdd7ff !important;
  background: rgba(34, 54, 88, .78) !important;
  box-shadow: none !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card .badge,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .badge,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .collapsible-form > summary::after {
  color: #dbeafe !important;
  border-color: rgba(126, 184, 255, .22) !important;
  background: rgba(17, 31, 52, .95) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card .theme-choice,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .report-facts span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-card-facts span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .item,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .notice {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .18) !important;
  background: rgba(12, 24, 42, .92) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .04), 0 14px 30px rgba(0, 0, 0, .16) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice.active,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card .theme-choice.active {
  color: #ffffff !important;
  border-color: rgba(147, 197, 253, .54) !important;
  background: linear-gradient(135deg, rgba(42, 91, 164, .92), rgba(24, 58, 107, .96)) !important;
  box-shadow: inset 0 0 0 1px rgba(219, 234, 254, .08), 0 18px 34px rgba(25, 71, 135, .24) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card .theme-choice span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .report-facts span small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-card-facts span small {
  color: #aebfda !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .theme-choice strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .settings-app-card .theme-choice strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .property-room-stats span strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .report-facts span strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-card-facts span strong {
  color: #f8fbff !important;
}

/* ADMIN TENANT PROPERTY WORKFLOW 20260616-206 */
#app.app-shell:not(.hidden) .admin-tenant-workflow {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 16px 0 !important;
}

#app.app-shell:not(.hidden) .admin-tenant-workflow h2 {
  margin: 5px 0 4px !important;
}

#app.app-shell:not(.hidden) .admin-tenant-property-section {
  margin: 18px 0 24px !important;
}

#app.app-shell:not(.hidden) .admin-tenant-property-section .admin-room-section-head {
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
}

#app.app-shell:not(.hidden) .admin-tenant-group-summary {
  display: flex !important;
  align-items: stretch !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#app.app-shell:not(.hidden) .admin-tenant-group-summary span {
  display: grid !important;
  gap: 2px !important;
  min-width: 92px !important;
  padding: 9px 11px !important;
  border: 1px solid #e3efff !important;
  border-radius: 16px !important;
  color: #10243f !important;
  background: #f3f8ff !important;
}

#app.app-shell:not(.hidden) .admin-tenant-group-summary small {
  color: #7890ad !important;
  font-size: .64rem !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#app.app-shell:not(.hidden) .admin-tenant-group-summary strong {
  color: #10243f !important;
  font-size: .96rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) .admin-tenant-card {
  min-height: 360px !important;
}

#app.app-shell:not(.hidden) .admin-tenant-head small {
  display: block !important;
  margin-top: 3px !important;
  overflow: hidden !important;
  color: #6c7f99 !important;
  font-size: .74rem !important;
  font-weight: 800 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#app.app-shell:not(.hidden) .tenant-card-photo-status {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-height: 38px !important;
  padding: 9px 12px !important;
  border: 1px solid #e3efff !important;
  border-radius: 16px !important;
  color: #285b98 !important;
  background: #f3f8ff !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

#app.app-shell:not(.hidden) .tenant-card-photo-status::before {
  content: "" !important;
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #f59e0b !important;
  box-shadow: 0 0 0 5px rgba(245, 158, 11, .12) !important;
}

#app.app-shell:not(.hidden) .tenant-card-photo-status.ready::before {
  background: #16a34a !important;
  box-shadow: 0 0 0 5px rgba(22, 163, 74, .12) !important;
}

#app.app-shell:not(.hidden) .tenant-card-photo-status span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#app.app-shell:not(.hidden) .tenant-card-upload {
  cursor: pointer !important;
}

#app.app-shell:not(.hidden) .tenant-edit-files {
  display: grid !important;
  gap: 12px !important;
  margin: 10px 0 !important;
}

#app.app-shell:not(.hidden) .tenant-empty-card {
  justify-content: start !important;
  min-height: 220px !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-tenant-workflow,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-tenant-group-summary span,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .tenant-card-photo-status {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .18) !important;
  background: rgba(12, 24, 42, .92) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .04), 0 14px 30px rgba(0, 0, 0, .16) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-tenant-head small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-tenant-group-summary small {
  color: #aebfda !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) .admin-tenant-group-summary strong {
  color: #f8fbff !important;
}

@media (max-width: 760px) {
  #app.app-shell:not(.hidden) .admin-tenant-workflow,
  #app.app-shell:not(.hidden) .admin-tenant-property-section .admin-room-section-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  #app.app-shell:not(.hidden) .admin-tenant-group-summary {
    width: 100% !important;
  }

  #app.app-shell:not(.hidden) .admin-tenant-group-summary span {
    flex: 1 1 120px !important;
  }
}

/* ROLE ROUTES 20260616-206 */
.role-entry-nav {
  display: grid !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 18px 0 !important;
}

.role-entry-card {
  display: grid !important;
  gap: 3px !important;
  padding: 14px 15px !important;
  border: 1px solid #d9e4f5 !important;
  border-radius: 18px !important;
  color: #10243f !important;
  text-align: left !important;
  text-decoration: none !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(58, 89, 140, .08) !important;
}

.role-entry-card:hover {
  border-color: #9ebcff !important;
  transform: translateY(-1px) !important;
}

.role-entry-card span {
  color: #6b7c99 !important;
  font-size: .68rem !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.role-entry-card strong {
  color: #0f1f38 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

.role-entry-card small {
  color: #637492 !important;
  font-size: .82rem !important;
}

.role-entry-card.public {
  border-color: #bdd7ff !important;
  background: linear-gradient(135deg, #f7fbff, #eef5ff) !important;
}

.role-entry-card.tenant {
  border-color: #c7efe0 !important;
  background: linear-gradient(135deg, #f7fffb, #eefbf6) !important;
}

.role-entry-card.admin {
  border-color: #e3d7ff !important;
  background: linear-gradient(135deg, #fbf9ff, #f4efff) !important;
}

body[data-access-mode="admin"] .role-entry-nav,
body[data-access-mode="admin"] .cool-public-action,
body[data-access-mode="admin"] .cool-tenant-login,
body[data-access-mode="admin"] .cool-auth-divider,
body[data-access-mode="admin"] .cool-social-row,
body[data-access-mode="home"] .cool-public-action,
body[data-access-mode="home"] .cool-tenant-login,
body[data-access-mode="home"] .cool-landlord-login,
body[data-access-mode="home"] .cool-auth-divider,
body[data-access-mode="tenant"] .role-entry-nav,
body[data-access-mode="tenant"] .cool-public-action,
body[data-access-mode="tenant"] .cool-landlord-login,
body[data-access-mode="tenant"] .cool-auth-divider,
body[data-access-mode="tenant"] .cool-social-row {
  display: none !important;
}

body[data-access-mode="admin"] .cool-landlord-login,
body[data-access-mode="tenant"] .cool-tenant-login {
  display: block !important;
  width: 100% !important;
}

body[data-access-mode="admin"] .cool-login-title p,
body[data-access-mode="tenant"] .cool-login-title p {
  color: #314565 !important;
}

body[data-access-mode="admin"] .cool-auth-foot::before {
  content: "Ruta privada verificada";
}

body[data-access-mode="tenant"] .cool-auth-foot::before {
  content: "Ruta privada: /acceso";
}

body[data-access-mode="admin"] .cool-auth-foot,
body[data-access-mode="tenant"] .cool-auth-foot {
  font-size: 0 !important;
}

body[data-access-mode="admin"] .cool-auth-foot::before,
body[data-access-mode="tenant"] .cool-auth-foot::before {
  color: #7a8aa6 !important;
  font-size: .83rem !important;
}

html:root[data-theme="dark"] body[data-access-mode] .role-entry-card {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .18) !important;
  background: rgba(12, 24, 42, .92) !important;
}

html:root[data-theme="dark"] body[data-access-mode] .role-entry-card strong {
  color: #f8fbff !important;
}

/* ADMIN TENANT COMPACT CARDS 20260616-206 */
#app.app-shell:not(.hidden) #tenants .admin-tenant-carousel {
  grid-auto-columns: minmax(230px, 270px) !important;
  gap: 12px !important;
  padding: 4px 4px 14px !important;
  scrollbar-width: thin !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-carousel::-webkit-scrollbar {
  display: block !important;
  height: 8px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-carousel::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(47, 111, 228, .26) !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-card {
  cursor: pointer !important;
  gap: 10px !important;
  min-height: 255px !important;
  padding: 13px !important;
  border-radius: 24px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-card:hover {
  transform: translateY(-2px) !important;
  border-color: #b8d4ff !important;
  box-shadow: 0 20px 42px rgba(65, 108, 180, .16) !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-head {
  grid-template-columns: 78px minmax(0, 1fr) !important;
  gap: 12px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-head img,
#app.app-shell:not(.hidden) #tenants .admin-tenant-head > span {
  width: 78px !important;
  height: 78px !important;
  border-radius: 24px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-head h3 {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  font-size: 1.02rem !important;
  line-height: 1.08 !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-head p {
  margin-top: 5px !important;
  overflow: hidden !important;
  font-size: .78rem !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 42px !important;
  padding: 9px 10px !important;
  border: 1px solid #e3efff !important;
  border-radius: 17px !important;
  color: #10243f !important;
  background: #f3f8ff !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts strong,
#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts span,
#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts strong {
  font-size: .88rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts span {
  color: #1f64c8 !important;
  font-size: .86rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts small {
  color: #64748b !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

#app.app-shell:not(.hidden) #tenants .admin-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin-top: 0 !important;
}

#app.app-shell:not(.hidden) #tenants .admin-card-actions .compact,
#app.app-shell:not(.hidden) #tenants .admin-card-actions .button-link {
  min-height: 38px !important;
  padding: 8px 9px !important;
  border-radius: 13px !important;
  font-size: .76rem !important;
  line-height: 1.05 !important;
}

#app.app-shell:not(.hidden) #tenants .whatsapp-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  color: #ffffff !important;
  border-color: rgba(37, 211, 102, .18) !important;
  background: linear-gradient(135deg, #25d366, #128c7e) !important;
  box-shadow: 0 12px 24px rgba(18, 140, 126, .22) !important;
}

#app.app-shell:not(.hidden) #tenants .whatsapp-action span {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
  background: #ffffff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='black' d='M16.02 3.2A12.6 12.6 0 0 0 5.1 22.1L3.6 28.8l6.85-1.46A12.6 12.6 0 1 0 16.02 3.2Zm0 2.2a10.4 10.4 0 0 1 8.77 16.02a10.4 10.4 0 0 1-13.55 3.75l-.38-.2l-4.32.92l.93-4.15l-.24-.4A10.4 10.4 0 0 1 16.02 5.4Zm-4.2 5.35c-.23 0-.6.08-.91.43c-.31.35-1.2 1.17-1.2 2.86c0 1.68 1.23 3.31 1.4 3.54c.17.23 2.38 3.8 5.93 5.17c2.95 1.16 3.55.93 4.19.87c.64-.06 2.07-.85 2.36-1.67c.29-.82.29-1.52.2-1.67c-.08-.15-.32-.23-.67-.4c-.35-.17-2.07-1.02-2.39-1.14c-.32-.12-.55-.17-.78.17c-.23.35-.9 1.14-1.1 1.37c-.2.23-.41.26-.76.09c-.35-.17-1.47-.54-2.8-1.73c-1.04-.92-1.74-2.06-1.94-2.41c-.2-.35-.02-.54.15-.71c.16-.16.35-.41.52-.61c.17-.2.23-.35.35-.58c.12-.23.06-.43-.03-.61c-.09-.17-.78-1.88-1.07-2.57c-.28-.67-.57-.58-.78-.59h-.67Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='black' d='M16.02 3.2A12.6 12.6 0 0 0 5.1 22.1L3.6 28.8l6.85-1.46A12.6 12.6 0 1 0 16.02 3.2Zm0 2.2a10.4 10.4 0 0 1 8.77 16.02a10.4 10.4 0 0 1-13.55 3.75l-.38-.2l-4.32.92l.93-4.15l-.24-.4A10.4 10.4 0 0 1 16.02 5.4Zm-4.2 5.35c-.23 0-.6.08-.91.43c-.31.35-1.2 1.17-1.2 2.86c0 1.68 1.23 3.31 1.4 3.54c.17.23 2.38 3.8 5.93 5.17c2.95 1.16 3.55.93 4.19.87c.64-.06 2.07-.85 2.36-1.67c.29-.82.29-1.52.2-1.67c-.08-.15-.32-.23-.67-.4c-.35-.17-2.07-1.02-2.39-1.14c-.32-.12-.55-.17-.78.17c-.23.35-.9 1.14-1.1 1.37c-.2.23-.41.26-.76.09c-.35-.17-1.47-.54-2.8-1.73c-1.04-.92-1.74-2.06-1.94-2.41c-.2-.35-.02-.54.15-.71c.16-.16.35-.41.52-.61c.17-.2.23-.35.35-.58c.12-.23.06-.43-.03-.61c-.09-.17-.78-1.88-1.07-2.57c-.28-.67-.57-.58-.78-.59h-.67Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

#app.app-shell:not(.hidden) #tenants .admin-card-details {
  display: none !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-property-section .admin-room-section-head {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 8px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-property-section .admin-room-section-head p {
  display: none !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-edit-page {
  display: grid !important;
  gap: 16px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-edit-topbar {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px !important;
  border: 1px solid #dceaff !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 18px 38px rgba(65, 108, 180, .10) !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-edit-layout {
  display: grid !important;
  grid-template-columns: minmax(280px, 390px) minmax(0, 1fr) !important;
  gap: 16px !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-panel,
#app.app-shell:not(.hidden) #tenants .admin-tenant-form-panel {
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
  padding: 18px !important;
  border: 1px solid #dceaff !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 18px 38px rgba(65, 108, 180, .10) !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-photo img,
#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-photo span {
  display: grid !important;
  width: 142px !important;
  height: 142px !important;
  margin: 0 auto !important;
  place-items: center !important;
  border-radius: 34px !important;
  object-fit: cover !important;
  color: #fff !important;
  background: linear-gradient(135deg, #8fc8ff, #2f6fe4) !important;
  box-shadow: 0 18px 34px rgba(47, 111, 228, .22) !important;
  font-size: 2.4rem !important;
  font-weight: 950 !important;
}

#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-panel h3,
#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-panel p {
  margin: 0 !important;
  text-align: center !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-edit-summary {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-edit-summary span {
  display: grid !important;
  gap: 3px !important;
  padding: 9px !important;
  border: 1px solid #e3efff !important;
  border-radius: 16px !important;
  background: #f3f8ff !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-edit-summary small {
  color: #7890ad !important;
  font-size: .64rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}

#app.app-shell:not(.hidden) #tenants .tenant-edit-summary strong {
  overflow: hidden !important;
  color: #10243f !important;
  font-size: .82rem !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .admin-tenant-edit-topbar,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .admin-tenant-profile-panel,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .admin-tenant-form-panel,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-edit-summary span {
  color: #eaf2ff !important;
  border-color: rgba(126, 184, 255, .18) !important;
  background: rgba(12, 24, 42, .92) !important;
  box-shadow: inset 0 0 0 1px rgba(126, 184, 255, .04), 0 14px 30px rgba(0, 0, 0, .16) !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts strong,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-edit-summary strong {
  color: #f8fbff !important;
}

html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-card-main-facts small,
html:root[data-theme="dark"] body main#app#app.app-shell:not(.hidden) #tenants .tenant-edit-summary small {
  color: #aebfda !important;
}

@media (max-width: 760px) {
  #app.app-shell:not(.hidden) #tenants .admin-tenant-carousel {
    grid-auto-columns: minmax(232px, 78vw) !important;
  }

  #app.app-shell:not(.hidden) #tenants .admin-tenant-edit-topbar,
  #app.app-shell:not(.hidden) #tenants .admin-tenant-edit-layout {
    grid-template-columns: 1fr !important;
  }
}