*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --maroon:#6b1a2a; --maroon-light:#8c2e42; --maroon-soft:rgba(107,26,42,0.07); --maroon-border:rgba(107,26,42,0.18);
  --bg:#f7f4ef; --bg-card:#ffffff;
  --text-dark:#2a2420; --text-mid:#5a5248; --text-light:#8a8278; --text-faint:#b0a898;
  --sage:#5a6b4e; --sage-soft:rgba(90,107,78,0.1);
  --border:rgba(42,36,32,0.08); --border-strong:rgba(42,36,32,0.12);
}
body { font-family:'Outfit',sans-serif; background:var(--bg); color:var(--text-dark); height:100vh; overflow:hidden; }

/* NAV */
nav { display:flex; justify-content:space-between; align-items:center; padding:10px 24px; background:rgba(247,244,239,0.95); border-bottom:1px solid var(--border); backdrop-filter:blur(12px); position:relative; z-index:100; }
.logo { display:flex; align-items:center; gap:10px; }
.logo-img { width:38px; height:38px; border-radius:50%; object-fit:cover; box-shadow:0 2px 8px rgba(107,26,42,0.2); }
.logo-text { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:600; }
.nav-phone { color:var(--maroon); text-decoration:none; font-size:13px; font-weight:500; border:1px solid var(--maroon-border); padding:6px 14px; border-radius:8px; }
.nav-phone:hover { background:var(--maroon-soft); }
.nav-links { display:flex; gap:24px; list-style:none; }
.nav-links a { color:var(--text-light); text-decoration:none; font-size:12px; letter-spacing:0.8px; text-transform:uppercase; transition:color 0.3s; }
.nav-links a:hover { color:var(--maroon); }

/* MAIN LAYOUT */
.main-layout { display:flex; height:calc(100vh - 56px); overflow:hidden; }

/* LEFT CHAT */
.left { flex:0 0 340px; max-width:340px; min-width:300px; display:flex; flex-direction:column; border-right:1px solid var(--border); background:var(--bg-card); }
.chat-area { flex:1; overflow-y:auto; padding:20px 18px 14px; }
.empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100%; text-align:center; padding:0 8px; }
.empty-desc { font-size:13px; color:var(--text-light); max-width:300px; line-height:1.6; font-weight:300; margin-bottom:20px; }
.prompt-grid { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; max-width:320px; }
.prompt-chip { background:var(--bg); border:1px solid var(--border); border-radius:100px; padding:7px 12px; font-size:12px; color:var(--text-mid); cursor:pointer; font-family:'Outfit',sans-serif; transition:all 0.2s; }
.prompt-chip:hover { border-color:var(--maroon-border); color:var(--maroon); background:var(--maroon-soft); }

/* Messages */
.msg { margin-bottom:14px; }
.msg-user { display:flex; justify-content:flex-end; }
.msg-ai { display:flex; }
.bubble-user { background:var(--maroon); color:#f7f4ef; padding:10px 14px; border-radius:14px 14px 4px 14px; max-width:90%; font-size:14px; line-height:1.5; }
.bubble-ai { background:var(--bg); padding:10px 14px; border-radius:14px; max-width:100%; font-size:14px; line-height:1.65; color:var(--text-mid); font-weight:300; border:1px solid var(--border); }
.bubble-ai strong { color:var(--text-dark); font-weight:500; }
.prop-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.prop-chip { background:#fff; border:1px solid var(--border-strong); border-radius:8px; padding:6px 10px; font-size:12px; font-family:'Outfit',sans-serif; color:var(--text-dark); cursor:pointer; transition:all 0.2s; display:flex; flex-direction:column; align-items:flex-start; gap:1px; text-align:left; }
.prop-chip:hover { border-color:var(--maroon); background:var(--maroon-soft); color:var(--maroon); }
.prop-chip-price { font-size:10px; color:var(--maroon); font-weight:600; }
.prop-chip-inline { display:inline; background:var(--maroon-soft); border:1px solid var(--maroon-border); border-radius:6px; padding:2px 8px; font-size:12px; font-family:'Outfit',sans-serif; color:var(--maroon); font-weight:600; cursor:pointer; transition:all 0.2s; margin-left:4px; }
.prop-chip-inline:hover { background:var(--maroon); color:#fff; border-color:var(--maroon); }
.loading-dots { display:flex; gap:6px; padding:4px 0; }
.loading-dots span { width:7px; height:7px; border-radius:50%; background:var(--maroon); animation:dotPulse 1.4s infinite ease-in-out; }
.loading-dots span:nth-child(2) { animation-delay:0.2s; }
.loading-dots span:nth-child(3) { animation-delay:0.4s; }
@keyframes dotPulse { 0%,80%,100%{opacity:0.3;transform:scale(0.8)} 40%{opacity:1;transform:scale(1)} }
.error-msg { text-align:center; color:#c23838; font-size:13px; padding:8px; background:rgba(194,56,56,0.06); border-radius:8px; margin:8px 0; }

/* Input */
.input-area { padding:10px 14px 14px; border-top:1px solid var(--border); }
.input-wrap { display:flex; gap:8px; align-items:center; }
.input-wrap input { flex:1; border:1px solid var(--border-strong); border-radius:10px; padding:12px 14px; font-size:15px; font-family:'Outfit',sans-serif; color:var(--text-dark); background:#fff; outline:none; transition:all 0.3s; }
.input-wrap input::placeholder { color:var(--text-faint); font-weight:300; }
.input-wrap input:focus { border-color:var(--maroon-light); box-shadow:0 0 0 3px rgba(107,26,42,0.08); }
.send-btn { width:44px; height:44px; border-radius:10px; border:none; background:var(--maroon); cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(107,26,42,0.25); transition:all 0.2s; flex-shrink:0; }
.send-btn:hover { background:var(--maroon-light); transform:scale(1.05); }
.send-btn:disabled { opacity:0.5; cursor:default; transform:none; }
.send-btn svg { width:18px; height:18px; fill:#f0ebe0; }
.reset-row { text-align:center; margin-top:6px; }
.reset-btn { background:none; border:none; padding:4px 10px; font-size:11px; color:var(--text-faint); cursor:pointer; font-family:'Outfit',sans-serif; transition:all 0.2s; }
.reset-btn:hover { color:var(--maroon); }

/* VIEW TOGGLE BAR */
.view-toggle-bar { display:flex; align-items:center; padding:8px 16px; background:var(--bg-card); border-bottom:1px solid var(--border); gap:4px; flex-shrink:0; }
.view-toggle { display:flex; align-items:center; gap:5px; padding:6px 14px; border-radius:8px; border:1px solid var(--border); background:none; font-family:'Outfit',sans-serif; font-size:12px; font-weight:500; color:var(--text-light); cursor:pointer; transition:all 0.2s; }
.view-toggle svg { width:14px; height:14px; fill:currentColor; }
.view-toggle:hover { border-color:var(--maroon-border); color:var(--maroon); }
.view-toggle.active { background:var(--maroon); color:#f7f4ef; border-color:var(--maroon); }
.view-toggle.active svg { fill:#f7f4ef; }
.view-count { margin-left:auto; font-size:11px; color:var(--text-light); font-weight:500; }

/* GRID VIEW */
.grid-view { flex:1; overflow-y:auto; display:none; }
.grid-view.active { display:block; }
.grid-container { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:14px; padding:16px; }
.grid-empty { grid-column:1/-1; display:flex; align-items:center; justify-content:center; height:200px; color:var(--text-faint); font-size:13px; font-weight:300; }
.grid-card { background:#fff; border-radius:10px; overflow:hidden; border:1px solid var(--border); cursor:pointer; transition:all 0.25s; display:flex; flex-direction:column; }
.grid-card:hover { border-color:var(--maroon-border); transform:translateY(-2px); box-shadow:0 6px 20px rgba(107,26,42,0.1); }
.grid-card.active { border-color:var(--maroon); box-shadow:0 0 0 2px var(--maroon-border); }
.grid-card-img { width:100%; height:160px; object-fit:cover; display:block; background:#e8e2d8; }
.grid-card-body { padding:12px 14px 14px; flex:1; display:flex; flex-direction:column; }
.grid-card-tag { display:inline-block; font-size:9px; color:var(--maroon); background:var(--maroon-soft); padding:3px 8px; border-radius:4px; text-transform:uppercase; letter-spacing:1px; margin-bottom:6px; font-weight:500; align-self:flex-start; }
.grid-card-name { font-family:'Cormorant Garamond',serif; font-size:18px; font-weight:600; color:var(--text-dark); margin-bottom:3px; line-height:1.2; }
.grid-card-loc { font-size:11px; color:var(--text-light); margin-bottom:auto; }
.grid-card-foot { display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.grid-card-price { font-size:16px; font-weight:600; color:var(--maroon); }
.grid-card-acres { font-size:10px; color:var(--sage); background:var(--sage-soft); padding:3px 8px; border-radius:100px; font-weight:500; }

/* MAP VIEW */
.map-view { flex:1; display:none; flex-direction:column; overflow:hidden; }
.map-view.active { display:flex; }

/* RIGHT: MAP + CARDS */
.right { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.map-area { flex:1 1 0; min-height:200px; position:relative; border-bottom:1px solid var(--border); }
#map { width:100%; height:100%; }
.map-overlay { position:absolute; top:12px; left:12px; z-index:10; background:rgba(255,255,255,0.92); backdrop-filter:blur(8px); border-radius:8px; padding:8px 14px; font-size:11px; color:var(--text-mid); font-weight:500; border:1px solid var(--border); box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.map-overlay strong { color:var(--maroon); }
.sat-toggle { position:absolute; top:12px; right:12px; z-index:10; background:rgba(255,255,255,0.92); backdrop-filter:blur(8px); border:1px solid var(--border); border-radius:8px; padding:7px 12px; font-size:11px; font-family:'Outfit',sans-serif; font-weight:500; color:var(--text-mid); cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.06); transition:all 0.2s; display:flex; align-items:center; gap:6px; }
.sat-toggle:hover { border-color:var(--maroon-border); color:var(--maroon); }
.sat-toggle.active { background:var(--maroon); color:#f7f4ef; border-color:var(--maroon); }
.sat-toggle svg { width:14px; height:14px; fill:currentColor; }
.states-label { position:absolute; bottom:12px; right:12px; z-index:10; background:rgba(255,255,255,0.88); backdrop-filter:blur(8px); border-radius:6px; padding:6px 10px; font-size:10px; color:var(--text-light); border:1px solid var(--border); }

/* Cards strip */
.cards-strip { flex:0 0 auto; height:230px; overflow-x:auto; overflow-y:hidden; padding:12px 16px; display:flex; gap:12px; background:var(--bg-card); scroll-snap-type:x mandatory; scroll-behavior:smooth; -ms-overflow-style:none; scrollbar-width:none; }
.cards-strip::-webkit-scrollbar { display:none; }
.cards-strip-empty { display:flex; align-items:center; justify-content:center; width:100%; color:var(--text-faint); font-size:13px; font-weight:300; }
.cards-wrap { position:relative; }
.cards-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:15; width:32px; height:32px; border-radius:50%; border:none; background:rgba(255,255,255,0.92); box-shadow:0 2px 8px rgba(0,0,0,0.15); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--text-mid); transition:all 0.15s; }
.cards-arrow:hover { background:#fff; box-shadow:0 2px 12px rgba(0,0,0,0.2); }
.cards-arrow.hide { display:none; }
.cards-arrow-left { left:6px; }
.cards-arrow-right { right:6px; }
.card { flex:0 0 270px; scroll-snap-align:start; background:#fff; border-radius:10px; overflow:hidden; border:1px solid var(--border); text-decoration:none; color:inherit; transition:all 0.25s; cursor:pointer; display:flex; flex-direction:column; }
.card:hover { border-color:var(--maroon-border); transform:translateY(-2px); box-shadow:0 6px 20px rgba(107,26,42,0.1); }
.card.active { border-color:var(--maroon); box-shadow:0 0 0 2px var(--maroon-border); }
.card-img { width:100%; height:105px; object-fit:cover; display:block; background:#e8e2d8; }
.card-body { padding:10px 12px 12px; flex:1; display:flex; flex-direction:column; }
.card-tag { display:inline-block; font-size:9px; color:var(--maroon); background:var(--maroon-soft); padding:3px 8px; border-radius:4px; text-transform:uppercase; letter-spacing:1px; margin-bottom:4px; font-weight:500; align-self:flex-start; }
.card-name { font-family:'Cormorant Garamond',serif; font-size:16px; font-weight:600; color:var(--text-dark); margin-bottom:2px; line-height:1.2; }
.card-loc { font-size:11px; color:var(--text-light); margin-bottom:auto; }
.card-foot { display:flex; justify-content:space-between; align-items:center; margin-top:6px; }
.card-price { font-size:15px; font-weight:600; color:var(--maroon); }
.card-acres { font-size:10px; color:var(--sage); background:var(--sage-soft); padding:3px 8px; border-radius:100px; font-weight:500; }

::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(107,26,42,0.12); border-radius:3px; }

/* ── PROPERTY DETAIL MODAL ── */
#modal-overlay {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,0.55); z-index:200;
  align-items:center; justify-content:center;
  backdrop-filter:blur(3px);
}
#modal-overlay.open { display:flex; animation:modalFadeIn .2s ease; }
@keyframes modalFadeIn { from{opacity:0} to{opacity:1} }

#modal {
  width:800px; max-width:96vw; max-height:92vh;
  background:var(--bg-card); border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column;
  animation:modalSlideUp .22s ease;
  box-shadow:0 20px 60px rgba(0,0,0,0.35);
}
@keyframes modalSlideUp { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none} }

#modal-hdr {
  background:var(--maroon);
  padding:18px 22px;
  display:flex; justify-content:space-between; align-items:flex-start;
}
.mh-left { flex:1; }
.mh-name {
  font-family:'Cormorant Garamond',serif;
  font-size:24px; font-weight:700; color:#f7f4ef; line-height:1.1;
}
.mh-loc { font-size:13px; color:rgba(247,244,239,0.75); margin-top:4px; font-weight:400; }
.mh-tag { font-size:10px; color:rgba(247,244,239,0.5); margin-top:3px; letter-spacing:.06em; text-transform:uppercase; }

#modal-close {
  background:rgba(0,0,0,0.15); border:1px solid rgba(0,0,0,0.2);
  color:rgba(255,255,255,0.8); cursor:pointer;
  width:32px; height:32px; border-radius:8px;
  font-size:18px; display:flex; align-items:center; justify-content:center;
  transition:all .15s; flex-shrink:0;
}
#modal-close:hover { background:rgba(255,255,255,0.2); color:#fff; }

#modal-img {
  width:100%; height:280px; object-fit:cover; display:block; background:#e8e2d8;
}

#modal-view-wrap { position:relative; height:280px; border-bottom:1px solid var(--border); overflow:hidden; }
#modal-img { width:100%; height:100%; object-fit:cover; display:block; background:#e8e2d8; position:absolute; inset:0; z-index:2; transition:opacity 0.3s; }
#modal-img.hidden { opacity:0; pointer-events:none; z-index:1; }
#modal-map { width:100%; height:100%; position:absolute; inset:0; z-index:1; }
#modal-map.shown { z-index:2; }
.modal-view-toggle { position:absolute; top:10px; right:10px; z-index:10; background:rgba(255,255,255,0.92); backdrop-filter:blur(8px); border:1px solid var(--border); border-radius:8px; padding:6px 12px; font-size:11px; font-family:'Outfit',sans-serif; font-weight:500; color:var(--text-mid); cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,0.1); transition:all 0.2s; display:flex; align-items:center; gap:6px; }
.modal-view-toggle:hover { border-color:var(--maroon-border); color:var(--maroon); }
.modal-view-toggle svg { width:14px; height:14px; fill:currentColor; }

/* CAROUSEL */
.carousel-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:11; width:40px; height:40px; border-radius:50%; border:none; background:rgba(0,0,0,0.45); color:#fff; font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; padding-bottom:3px; }
.carousel-arrow:hover { background:rgba(0,0,0,0.7); transform:translateY(-50%) scale(1.05); }
.carousel-arrow.hide { display:none; }
.carousel-prev { left:10px; padding-right:3px; padding-bottom:0; }
.carousel-next { right:10px; padding-left:3px; padding-bottom:0; }
.carousel-counter { position:absolute; bottom:10px; left:50%; transform:translateX(-50%); z-index:10; background:rgba(0,0,0,0.55); color:#fff; font-size:11px; font-weight:500; padding:4px 10px; border-radius:100px; font-family:'Outfit',sans-serif; letter-spacing:0.05em; }
.carousel-counter.hide { display:none; }
.carousel-thumbs { display:flex; gap:4px; padding:8px 10px; background:var(--bg); overflow-x:auto; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.carousel-thumbs::-webkit-scrollbar { height:4px; }
.carousel-thumbs.hide { display:none; }
.carousel-thumb { flex:0 0 auto; width:56px; height:40px; border-radius:4px; border:2px solid transparent; cursor:pointer; object-fit:cover; transition:all 0.15s; opacity:0.65; }
.carousel-thumb:hover { opacity:1; }
.carousel-thumb.active { border-color:var(--maroon); opacity:1; }

#modal-stats {
  padding:14px 22px; display:flex; gap:24px;
  border-bottom:1px solid var(--border);
  background:var(--bg);
}
.ms-item { display:flex; flex-direction:column; gap:2px; }
.ms-label { font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-light); font-weight:500; }
.ms-value { font-family:'Cormorant Garamond',serif; font-size:20px; font-weight:600; color:var(--text-dark); }

#modal-footer {
  padding:18px 22px 22px;
  display:flex; justify-content:space-between; align-items:flex-start; gap:20px;
  overflow-y:auto; flex:1;
}
.mf-desc { font-size:13px; color:var(--text-mid); line-height:1.65; flex:1; font-weight:300; }
.mf-btns { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
.btn-primary {
  padding:10px 22px; background:var(--maroon); border:none;
  color:#f7f4ef; font-family:'Outfit',sans-serif;
  font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  cursor:pointer; border-radius:8px; transition:background .15s; white-space:nowrap; text-decoration:none; text-align:center;
}
.btn-primary:hover { background:var(--maroon-light); }
.btn-secondary {
  padding:10px 22px; background:var(--bg-card);
  border:1px solid var(--border-strong); color:var(--text-mid);
  font-family:'Outfit',sans-serif; font-size:12px; font-weight:500;
  letter-spacing:.06em; text-transform:uppercase; cursor:pointer;
  border-radius:8px; transition:all .15s; white-space:nowrap; text-decoration:none; text-align:center;
}
.btn-secondary:hover { border-color:var(--maroon-border); color:var(--maroon); }

/* ── MOBILE LISTINGS SCREEN ── */
.mob-listings-screen { display:none; }
.mob-tab-bar { display:none; }

/* ── MOBILE LAYOUT ── */
@media (max-width:900px) {
  .main-layout { flex-direction:column; height:calc(100vh - 56px - 58px); }
  /* Hide grid/map toggle bar on mobile - bottom mob-tab-bar handles navigation */
  .view-toggle-bar { display:none !important; }

  /* Hide desktop strip */
  .cards-wrap { display:none !important; }

  .left {
    display:none; flex:none; max-width:100%; min-width:100%;
    height:100%; border-right:none; border-bottom:none;
  }
  .left.mob-active { display:flex; }

  .right {
    display:none; flex:1; min-height:0;
  }
  .right.mob-active { display:flex; }
  .right.mob-active .map-area { flex:1; max-height:none; min-height:0; }
  .right.mob-active #listing-strip-desktop { display:none; }

  .chat-area { padding:14px 16px 10px; }
  .bubble-user, .bubble-ai { font-size:16px; }
  .prop-chip { font-size:14px; }
  .prop-chip-price { font-size:12px; }
  .empty-state { min-height:auto; padding:10px 8px; }
  .empty-desc { font-size:12px; margin-bottom:12px; max-width:100%; }
  .prompt-grid { max-width:100%; gap:5px; }
  .prompt-chip { padding:6px 10px; font-size:11px; }
  .left { padding-bottom:calc(120px + env(safe-area-inset-bottom, 0px)); }
  .input-area { padding:8px 12px calc(10px + env(safe-area-inset-bottom, 0px)); background:var(--bg-card); border-top:1px solid var(--border); position:fixed; bottom:calc(58px + env(safe-area-inset-bottom, 0px)); left:0; right:0; z-index:80; flex-shrink:0; }
  .input-wrap input { padding:10px 12px; font-size:14px; }
  .send-btn { width:40px; height:40px; }
  .nav-links { display:none; }

  /* Mobile listings screen */
  .mob-listings-screen {
    display:none; flex-direction:column; width:100%; height:100%;
    background:var(--bg);
  }
  .mob-listings-screen.mob-active { display:flex; }
  .mob-list-hdr {
    padding:12px 16px 10px; background:var(--bg-card);
    border-bottom:1px solid var(--border); flex-shrink:0;
  }
  .mob-list-count { font-size:11px; color:var(--text-light); font-weight:500; letter-spacing:.4px; text-transform:uppercase; }
  .mob-list-scroll { flex:1; overflow-y:auto; padding:12px; -webkit-overflow-scrolling:touch; }
  .mob-list-empty {
    display:flex; align-items:center; justify-content:center;
    height:200px; color:var(--text-faint); font-size:13px; font-weight:300; text-align:center; padding:20px;
  }
  .mob-cards-col { display:flex; flex-direction:column; gap:10px; }
  .mob-lcard {
    background:#fff; border-radius:10px;
    border:1px solid var(--border); overflow:hidden;
    display:flex; align-items:stretch; cursor:pointer;
    -webkit-tap-highlight-color:transparent; transition:all 0.15s; text-decoration:none; color:inherit;
  }
  .mob-lcard:active { transform:scale(0.985); border-color:var(--maroon-border); }
  .mob-lcard-img {
    width:100px; flex-shrink:0; object-fit:cover;
    background:#e8e2d8; border-radius:9px 0 0 9px;
  }
  .mob-lcard-body { padding:10px 12px; flex:1; min-width:0; display:flex; flex-direction:column; }
  .mob-lcard-name { font-family:'Cormorant Garamond',serif; font-size:15px; font-weight:600; color:var(--text-dark); margin-bottom:2px; line-height:1.2; }
  .mob-lcard-loc { font-size:11px; color:var(--text-light); margin-bottom:4px; }
  .mob-lcard-foot { display:flex; justify-content:space-between; align-items:center; margin-top:auto; }
  .mob-lcard-price { font-size:14px; font-weight:600; color:var(--maroon); }
  .mob-lcard-acres { font-size:10px; color:var(--sage); background:var(--sage-soft); padding:2px 8px; border-radius:100px; font-weight:500; }
  .mob-lcard-tag { display:inline-block; font-size:9px; padding:2px 7px; border-radius:4px; text-transform:uppercase; letter-spacing:.8px; font-weight:500; background:var(--maroon-soft); color:var(--maroon); align-self:flex-start; margin-bottom:4px; }

  /* Tab bar */
  .mob-tab-bar {
    display:flex; position:fixed; bottom:0; left:0; right:0;
    height:calc(58px + env(safe-area-inset-bottom,0px));
    padding-bottom:env(safe-area-inset-bottom,0px);
    background:var(--bg-card); border-top:1px solid var(--border); z-index:90;
  }
  .mob-tab {
    flex:1; display:flex; flex-direction:column; align-items:center;
    justify-content:center; gap:3px; cursor:pointer; border:none;
    background:none; color:var(--text-faint); font-family:'Outfit',sans-serif;
    -webkit-tap-highlight-color:transparent; transition:color .15s;
  }
  .mob-tab.active { color:var(--maroon); }
  .mob-tab svg { width:22px; height:22px; fill:currentColor; }
  .mob-tab span { font-size:10px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; }
  .mob-tab-icon-wrap { position:relative; }
  .mob-tab-dot {
    display:none; width:8px; height:8px; border-radius:50%;
    background:var(--maroon); border:2px solid var(--bg-card);
    position:absolute; top:-2px; right:-5px;
  }
  .mob-tab-dot.show { display:block; }

  /* Modal mobile adjustments */
  #modal-overlay { align-items:center; padding:16px; }
  #modal { width:100%; max-width:480px; max-height:90dvh; border-radius:12px; }
  #modal-view-wrap { height:200px; }
  .carousel-arrow { width:36px; height:36px; font-size:22px; }
  .carousel-thumbs { padding:6px 8px; }
  .carousel-thumb { width:48px; height:36px; }
  #modal-footer { flex-direction:column; gap:14px; }
  .mf-btns { flex-direction:row; flex-wrap:wrap; }
}

@media (min-width:901px) and (max-width:1024px) {
  .left { flex:0 0 300px; max-width:300px; min-width:280px; }
  .empty-desc { font-size:12px; margin-bottom:16px; }
  .prompt-chip { padding:6px 10px; font-size:11px; }
}