/* site-specific: body gradient, catalog, detail, booking, auth, profile, lightbox, site media */
body { background: linear-gradient(180deg, #0d0d0d 0%, #0a0a0a 50%, #0d0d0d 100%); }
h1 { font-family: var(--font-heading); font-size: clamp(1.5rem, 4vw, 1.75rem); font-weight: 700; letter-spacing: -0.02em; margin-bottom: 0.5rem; color: var(--text); }
h1::after { content: ''; display: block; width: 56px; height: 3px; background: linear-gradient(90deg, var(--orange), var(--orange-hover)); margin-top: 0.5rem; border-radius: 2px; box-shadow: 0 0 12px rgba(255, 107, 0, 0.2); }
.subtitle { font-size: 1rem; color: var(--text-muted); margin-bottom: var(--section-gap); line-height: 1.5; }
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.catalog-hero {
  padding: 2rem 0 2.5rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--border);
  position: relative;
  animation: fadeInUp 0.45s ease-out forwards;
}
.catalog-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 90% 70% at 50% 0%, rgba(255, 107, 0, 0.07) 0%, transparent 70%);
  pointer-events: none;
}
.catalog-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: 0.15;
  pointer-events: none;
}
.catalog-hero .catalog-header,
.catalog-hero .subtitle { position: relative; z-index: 1; }
.catalog-hero .catalog-header h1 { font-size: clamp(1.75rem, 5vw, 2.35rem); font-weight: 700; letter-spacing: -0.03em; }
.catalog-hero .catalog-header h1::after { width: 64px; background: linear-gradient(90deg, var(--orange), var(--orange-hover)); box-shadow: 0 0 16px rgba(255, 107, 0, 0.25); }
.catalog-hero .subtitle { line-height: 1.5; font-size: 1rem; margin-bottom: 0; margin-top: 0.5rem; }
.catalog-header {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.75rem;
  padding: 0.5rem 0 1rem; margin-bottom: 0;
  animation: fadeInUp 0.45s ease-out forwards;
}
.catalog-header h1 { margin: 0; }
.catalog-header .link-profile {
  font-size: 0.95rem; color: var(--text-muted); padding: 0.5rem 0.9rem; border-radius: 10px;
  border: 1px solid var(--border); transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}
.catalog-header .link-profile:hover { color: var(--orange); background: var(--orange-soft); border-color: var(--orange); }
.catalog-search-row { display: flex; gap: 0.75rem; align-items: center; margin-bottom: 0.75rem; }
.catalog-search-input { flex: 1; min-width: 0; padding: 0.75rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--card); color: var(--text); font-size: 1rem; font-family: inherit; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15); transition: border-color var(--transition-base), box-shadow var(--transition-base); }
.catalog-search-input:focus { outline: none; border-color: var(--orange); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 0 3px var(--orange-soft); }
.catalog-search-input::placeholder { color: var(--text-muted); }
.btn-filter-toggle { padding: 0.65rem 1.1rem; background: var(--border); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius-md); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.btn-filter-toggle:hover { background: var(--orange-soft); color: var(--orange); border-color: var(--orange); }
.btn-near-me { padding: 0.65rem 1.1rem; background: var(--border); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius-md); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.btn-near-me:hover { background: var(--orange-soft); color: var(--orange); border-color: var(--orange); }
.btn-near-me.active { background: var(--orange-soft); color: var(--orange); border-color: var(--orange); }
.filters.filters-collapsed { display: none; margin-bottom: 1.5rem; }
.filters.filters-expanded { display: flex; }
.catalog-cta { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border); text-align: center; }
.catalog-cta-text { font-size: 0.95rem; color: var(--text-muted); margin: 0 0 0.75rem; }
.catalog-cta-link { display: inline-block; padding: 0.65rem 1.35rem; background: transparent; color: var(--orange); border: 1px solid var(--orange); border-radius: var(--radius-md); font-weight: 600; font-size: 0.95rem; transition: background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.catalog-cta-link:hover { background: var(--orange-soft); color: var(--orange); box-shadow: 0 2px 12px rgba(255, 107, 0, 0.15); }
.catalog-cta-link:active { transform: scale(0.97); }
.my-booking-card { background: linear-gradient(135deg, rgba(255,107,0,0.12) 0%, var(--card) 100%); border: 1px solid rgba(255,107,0,0.35); border-radius: var(--radius-lg); padding: 1.25rem 1.5rem; margin-bottom: 1.5rem; }
.my-booking-card .my-booking-title { font-family: var(--font-heading); font-size: 1rem; font-weight: 700; color: var(--orange); margin-bottom: 0.5rem; letter-spacing: 0.02em; }
.my-booking-card .my-booking-details { font-size: 0.9rem; color: var(--text-muted); margin-bottom: 1rem; line-height: 1.5; }
.my-booking-card .my-booking-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.my-booking-card .my-booking-actions a { display: inline-block; padding: 0.5rem 1rem; border-radius: var(--radius-sm); font-size: 0.9rem; font-weight: 500; text-decoration: none; transition: background 0.2s, color 0.2s; }
.my-booking-card .my-booking-actions .btn-detail { background: var(--orange); color: var(--bg); }
.my-booking-card .my-booking-actions .btn-detail:hover { background: var(--orange-hover); color: var(--bg); }
.my-booking-card .my-booking-actions .btn-review { background: transparent; color: var(--orange); border: 1px solid var(--orange); }
.my-booking-card .my-booking-actions .btn-review:hover { background: var(--orange-soft); color: var(--orange); }
/* Блоки статуса плашки брони */
.my-booking-card .my-booking-org { font-weight: 500; color: var(--text-muted); margin-left: 0.35rem; }
.my-booking-status { margin-bottom: 0.75rem; padding: 0.5rem 0; }
.my-booking-status-label { font-size: 0.95rem; font-weight: 600; }
.my-booking-status--pending .my-booking-status-label { color: var(--orange); }
.my-booking-status--confirmed .my-booking-status-label { color: #86efac; }
.my-booking-status--cancelled .my-booking-status-label { color: var(--text-muted); }
.my-booking-card.my-booking-card--cancelled { background: linear-gradient(135deg, rgba(248,113,113,0.08) 0%, var(--card) 100%); border-color: rgba(248,113,113,0.3); }
.my-booking-card.my-booking-card--confirmed { border-color: rgba(34,197,94,0.35); }
.my-booking-reason { font-size: 0.875rem; color: var(--text-muted); margin: 0.35rem 0 0; padding-left: 0; line-height: 1.4; }
.review-form-block .review-form-toggle { background: none; border: none; color: var(--orange); font-size: 1rem; font-weight: 600; cursor: pointer; padding: 0 0 0.5rem; font-family: inherit; text-align: left; }
.review-form-block .review-form-toggle:hover { text-decoration: underline; }
.review-form-block .review-form-inner { margin-top: 1rem; }
.review-form-block.review-form-collapsed .review-form-inner { display: none; }
.review-form-block h4 { font-size: 1rem; margin: 0 0 0.75rem; color: var(--orange); }
.bar-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.bar-card {
  background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column;
  box-shadow: var(--card-shadow);
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color var(--transition-base);
}
.bar-card:hover { transform: translateY(-3px); box-shadow: var(--card-shadow-hover), var(--card-shadow-glow), 0 0 24px rgba(255, 107, 0, 0.08); border-color: rgba(255, 107, 0, 0.45); }
.bar-card .card-photo { width: 100%; aspect-ratio: 4/3; overflow: hidden; flex-shrink: 0; position: relative; }
.bar-card .card-photo::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 45%; background: linear-gradient(to top, rgba(0,0,0,0.5), transparent); pointer-events: none; }
.bar-card .card-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.bar-card:hover .card-photo img { transform: scale(1.04); }
.bar-card .card-photo .no-photo { width: 100%; height: 100%; min-height: 160px; background: var(--border); display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 0.85rem; }
.bar-card .body { padding: 1rem 1.1rem 1.25rem; flex: 1; display: flex; flex-direction: column; }
.bar-card .name { font-family: var(--font-heading); font-size: 1.2rem; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 0.35rem; color: var(--text); }
.bar-card .card-meta { font-size: 0.85rem; color: var(--text-muted); line-height: 1.4; margin-bottom: 0.5rem; font-weight: 500; }
.bar-card .card-meta .card-cuisine { display: block; margin-bottom: 0.15rem; }
.bar-card .card-meta .card-check { display: block; }
.bar-card .addr { font-size: 0.8rem; color: var(--text-muted); margin-top: 0.25rem; }
.bar-card .card-rating { font-size: 0.8rem; margin: 0 0 0.4rem; }
.bar-card .link-more { display: block; text-align: center; margin-top: auto; padding: 0.75rem 1.15rem; background: var(--orange); color: var(--bg); border-radius: var(--radius-sm); font-size: 0.95rem; font-weight: 600; transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.bar-card .link-more:hover { background: var(--orange-hover); color: var(--bg); transform: translateY(-1px); box-shadow: var(--orange-glow-soft); }
.bar-card .link-more:active { transform: scale(0.98); }
.bar-card-cta .card-photo .no-photo { background: var(--card); font-size: 2rem; }
.bar-card-cta .card-cta-desc { font-size: 0.9rem; margin-bottom: 1rem; }
.bar-card.bar-card-enter { animation: fadeInUp 0.4s ease forwards; }
.bar-card.bar-card-enter[data-stagger="0"] { animation-delay: 0.05s; }
.bar-card.bar-card-enter[data-stagger="1"] { animation-delay: 0.1s; }
.bar-card.bar-card-enter[data-stagger="2"] { animation-delay: 0.15s; }
.bar-card.bar-card-enter[data-stagger="3"] { animation-delay: 0.2s; }
.bar-card.bar-card-enter[data-stagger="4"] { animation-delay: 0.25s; }
.bar-card.bar-card-enter[data-stagger="5"] { animation-delay: 0.3s; }
.bar-card.bar-card-enter[data-stagger="6"] { animation-delay: 0.35s; }
.bar-card.bar-card-enter[data-stagger="7"] { animation-delay: 0.4s; }
.bar-card.bar-card-enter[data-stagger="8"] { animation-delay: 0.45s; }
.bar-card.bar-card-enter[data-stagger="9"] { animation-delay: 0.5s; }
.bar-card.nearest-badge { position: relative; }
.bar-card.nearest-badge::before { content: 'Рядом с вами'; position: absolute; top: 0.75rem; left: 0.75rem; z-index: 2; padding: 0.35rem 0.65rem; background: var(--orange); color: var(--bg); font-size: 0.75rem; font-weight: 600; border-radius: var(--radius-sm); letter-spacing: 0.02em; box-shadow: var(--card-shadow-premium); }
.bar-card .card-distance { font-size: 0.8rem; color: var(--orange); margin-top: 0.2rem; }
.bar-card .card-links { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; margin-bottom: 0.25rem; }
.bar-card .card-link { display: inline-block; padding: 0.4rem 0.75rem; font-size: 0.85rem; font-weight: 600; color: var(--orange); background: transparent; border: 1px solid var(--orange); border-radius: var(--radius-sm); text-decoration: none; transition: background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast); }
.bar-card .card-link:hover { background: var(--orange-soft); color: var(--orange-hover); box-shadow: var(--orange-glow-soft); }
.detail { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.75rem; margin-top: 1.5rem; box-shadow: var(--card-shadow), 0 4px 32px rgba(0, 0, 0, 0.25); overflow: hidden; }
.detail.detail-visible { animation: fadeInUp 0.4s ease forwards; }
.detail .back { margin-bottom: 2rem; }
.detail .back a {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.5rem 1rem; min-height: var(--tap);
  color: var(--text-muted); font-size: 0.9rem; font-weight: 500;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--card); text-decoration: none;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
}
.detail .back a:hover { color: var(--orange); border-color: var(--orange); background: var(--orange-soft); }
.detail-cover-wrap { margin: -1.75rem -1.75rem 0 -1.75rem; border-radius: var(--radius-lg) var(--radius-lg) 0 0; overflow: hidden; position: relative; max-height: 300px; }
.detail-cover-wrap::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 85%; background: linear-gradient(to bottom, transparent 5%, var(--card) 100%); pointer-events: none; }
.detail .cover { width: 100%; display: block; max-height: 300px; object-fit: cover; border-radius: 0; }
.detail .no-photo-big { height: 200px; background: var(--border); border-radius: 0; margin-bottom: 0; display: flex; align-items: center; justify-content: center; color: var(--text-muted); }
.detail .detail-title { margin-top: -2.5rem; position: relative; z-index: 2; margin-bottom: 1rem; font-size: 1.6rem; font-weight: 800; letter-spacing: -0.03em; }
.detail h2 { font-size: 1.4rem; margin-bottom: 1rem; color: var(--text); font-family: var(--font-heading); font-weight: 700; letter-spacing: -0.02em; position: relative; padding-bottom: 0.5rem; }
.detail h2::after { content: ''; position: absolute; bottom: 0; left: 0; width: 40px; height: 2.5px; background: linear-gradient(90deg, var(--orange), var(--orange-hover)); border-radius: 2px; }
.detail h3 { font-size: 1.1rem; margin: 1.75rem 0 0.75rem; color: var(--orange); font-family: var(--font-heading); font-weight: 700; letter-spacing: -0.02em; position: relative; padding-bottom: 0.35rem; }
.detail h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 28px; height: 2px; background: var(--orange); border-radius: 2px; }
.detail-menu-block,
.detail-promo-block { margin-top: 1.75rem; }
.detail-menu-block h3,
.detail-promo-block h3 { margin-top: 0; }
.detail-menu-link,
.detail-promo-link { display: inline-block; margin-top: 0.5rem; padding: 0.65rem 1.25rem; background: var(--orange); color: var(--bg); border-radius: var(--radius-sm); font-weight: 600; font-size: 0.95rem; text-decoration: none; transition: background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.detail-menu-link:hover,
.detail-promo-link:hover { background: var(--orange-hover); color: var(--bg); box-shadow: var(--orange-glow-soft); transform: translateY(-1px); }
.detail-menu-link:active,
.detail-promo-link:active { transform: scale(0.98); }
.detail-menu-preview-wrap,
.detail-promo-preview-wrap { margin-top: 0.75rem; }
.detail-menu-preview,
.detail-promo-preview { display: block; max-width: 100%; width: min(320px, 100%); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--card-shadow); transition: box-shadow var(--transition-base), border-color var(--transition-base); cursor: pointer; }
.detail-menu-preview:hover,
.detail-promo-preview:hover { box-shadow: var(--card-shadow-hover), var(--orange-glow-soft); border-color: rgba(255, 107, 0, 0.35); }
.detail-menu-preview img { width: 100%; height: auto; max-height: 220px; object-fit: cover; display: block; vertical-align: top; }
.detail-promo-preview img { width: 100%; height: auto; max-height: 180px; object-fit: cover; display: block; vertical-align: top; }

/* Блок «Коротко о заведении» */
.detail-info {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 0.75rem 0 1.25rem;
  background: rgba(255, 107, 0, 0.04);
  border: 1px solid rgba(255, 107, 0, 0.18);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.detail-info-item {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 1rem;
  border-bottom: 1px solid rgba(255,107,0,0.1);
  width: 100%;
  box-sizing: border-box;
  line-height: 1.45;
}
.detail-info-item:last-child { border-bottom: none; }
.detail-info-label {
  flex-shrink: 0;
  min-width: 7rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.detail-info-value {
  font-size: 0.95rem;
  color: var(--text);
  line-height: 1.4;
}
.detail-info-link {
  color: var(--text);
  text-decoration: none;
  border-bottom: 1px dashed rgba(255,255,255,0.25);
  transition: color var(--transition-fast), border-color var(--transition-fast);
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.detail-info-link:hover { color: var(--orange); border-color: var(--orange); }
.detail-info-maps-badge {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  font-size: 0.72rem;
  font-weight: 600;
  background: var(--orange-soft);
  color: var(--orange);
  border-radius: 4px;
  letter-spacing: 0.02em;
  vertical-align: middle;
  white-space: nowrap;
  transition: background var(--transition-fast), color var(--transition-fast);
}
.detail-info-link:hover .detail-info-maps-badge { background: var(--orange); color: var(--bg); }

/* Описание заведения */
.detail-description { color: var(--text-muted); line-height: 1.6; margin: 0.25rem 0 0.75rem; font-size: 0.97rem; }

/* Блок «Бизнес-ланч» */
.detail-business-lunch-block { margin-top: 1.75rem; }
.detail-business-lunch-block h3 { margin-top: 0; }
.detail-business-lunch-schedule {
  display: inline-block;
  margin: 0.25rem 0 0.65rem;
  padding: 0.35rem 0.75rem;
  background: rgba(255, 107, 0, 0.1);
  border: 1px solid rgba(255, 107, 0, 0.3);
  border-radius: var(--radius-sm);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--orange);
  letter-spacing: 0.01em;
}

.detail p { color: var(--text-muted); line-height: 1.55; margin-bottom: 0.75rem; }
.detail .hall-scheme { width: 100%; border-radius: var(--radius-sm); margin-top: 0.75rem; max-height: 400px; object-fit: contain; background: #000000; }
.hall-scheme-interactive-wrap { position: relative; width: 100%; border-radius: var(--radius-sm); overflow: hidden; margin-top: 0.75rem; background: #000000; }
.hall-scheme-block #hallSchemeViewerWrap,
.hall-scheme-block #hallSchemeViewerWrap canvas { background: #000000 !important; }
.hall-scheme-content { position: relative; width: 100%; aspect-ratio: 4/3; max-height: 400px; overflow: hidden; }
.hall-scheme-content .hall-scheme-bg { position: absolute; inset: 0; background-size: contain; background-position: center; background-repeat: no-repeat; background-color: var(--card); }
.hall-scheme-content .hall-scheme-canvas-grid { position: absolute; inset: 0; background-color: var(--card); background-image: linear-gradient(to right, var(--border) 1px, transparent 1px), linear-gradient(to bottom, var(--border) 1px, transparent 1px); background-size: 8.33% 8.33%; }
.hall-scheme-content .hall-scheme-zones-pub { position: absolute; inset: 0; pointer-events: none; }
.hall-scheme-content .hall-scheme-walls-pub { position: absolute; inset: 0; pointer-events: none; }
.hall-scheme-content .hall-scheme-walls-svg-pub { position: absolute; inset: 0; width: 100%; height: 100%; }
.hall-scheme-content .hall-scheme-elements-pub { position: absolute; inset: 0; pointer-events: none; }
.hall-scheme-interactive-wrap .hall-scheme-poi-pub { position: absolute; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.4rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.75rem; color: var(--text); box-shadow: 0 1px 4px rgba(0,0,0,0.1); }
.hall-scheme-interactive-wrap .hall-scheme-poi-pub-icon { font-size: 1em; }
.hall-scheme-interactive-wrap .hall-scheme-zone-pub { position: absolute; background: rgba(255, 107, 0, 0.15); border: 1px solid rgba(255, 107, 0, 0.4); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 600; color: var(--text); }
.hall-scheme-interactive-wrap .hall-scheme-zone-pub .hall-scheme-zone-pub-name { padding: 0.2rem 0.4rem; text-align: center; }
.hall-scheme-content .hall-scheme-hotspots { position: absolute; inset: 0; pointer-events: none; }
.hall-scheme-hotspots .hall-scheme-hotspot { pointer-events: auto; position: absolute; width: 48px; height: 48px; margin-left: -24px; margin-top: -24px; border-radius: 50%; cursor: pointer; background: var(--orange); color: var(--bg); border: 2px solid rgba(255,255,255,0.5); transition: border-color 0.2s, background 0.2s, transform 0.2s; display: flex; align-items: center; justify-content: center; font-size: 0.85rem; font-weight: 600; line-height: 1; transform-origin: center; }
.hall-scheme-hotspots .hall-scheme-hotspot.hall-scheme-hotspot-shape { margin: 0; }
.hall-scheme-hotspots .hall-scheme-hotspot:hover { border-color: var(--text); background: var(--orange-hover); transform: scale(1.12); }
.hall-scheme-hotspots .hall-scheme-hotspot.hall-scheme-hotspot-shape:hover { box-shadow: 0 4px 16px rgba(255,107,0,0.4); }
.hall-scheme-hotspots .hall-scheme-hotspot .hall-scheme-hotspot-label { pointer-events: none; }
.hall-scheme-hotspots .hall-scheme-hotspot::after { content: attr(data-table-name); position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); margin-bottom: 8px; padding: 0.4rem 0.65rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.8rem; font-weight: 500; color: var(--text); white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.2s; box-shadow: var(--card-shadow); }
.hall-scheme-hotspots .hall-scheme-hotspot:hover::after { opacity: 1; }
.tables-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1rem; margin-top: 0.75rem; }
.table-card { background: var(--card); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--border); transition: border-color 0.2s, box-shadow 0.2s; cursor: pointer; box-shadow: var(--card-shadow); }
.table-card:hover { border-color: var(--orange); box-shadow: var(--card-shadow-hover), var(--orange-glow-soft); }
.table-card img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; pointer-events: none; }
.table-card .no-img { width: 100%; aspect-ratio: 1; background: var(--card); display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 0.8rem; }
.table-card .info { padding: 0.65rem; font-size: 0.9rem; }
.table-card .name { font-weight: 600; color: var(--text); }
.table-card .capacity { color: var(--text-muted); font-size: 0.8rem; }
.table-detail-panel { display: none; margin-top: 1.25rem; padding: 1.35rem; background: rgba(42, 42, 42, 0.5); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(255, 107, 0, 0.28); border-radius: var(--radius-lg); box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25), var(--orange-glow-soft); }
.table-detail-panel.visible { display: block; animation: fadeInUp 0.3s ease forwards; }
.table-detail-panel .table-detail-photo { margin-bottom: 1rem; border-radius: var(--radius-md); overflow: hidden; background: var(--card); max-height: 280px; }
.table-detail-panel .table-detail-photo img { width: 100%; max-height: 280px; object-fit: cover; display: block; cursor: pointer; }
.table-detail-panel .table-detail-photo .no-photo-detail { width: 100%; height: 140px; display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 0.9rem; background: var(--card); }
.table-detail-panel .table-detail-name { font-family: var(--font-heading); font-size: 1.15rem; font-weight: 700; color: var(--text); margin-bottom: 0.5rem; }
.table-detail-panel .table-detail-desc { color: var(--text-muted); line-height: 1.5; margin-bottom: 1rem; font-size: 0.95rem; }
.table-detail-panel .table-detail-actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.table-detail-panel .btn-book-this { flex: 1 1 55%; padding: 0.75rem 1.35rem; background: var(--orange); color: var(--bg); border-radius: var(--radius-sm); font-weight: 600; font-size: 0.95rem; cursor: pointer; border: none; transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); min-height: var(--tap); }
.table-detail-panel .btn-book-this:hover { background: var(--orange-hover); transform: translateY(-1px); box-shadow: var(--orange-glow-soft); }
.table-detail-panel .btn-table-back { flex: 1 1 40%; padding: 0.75rem 1.1rem; background: transparent; color: var(--text-muted); border-radius: var(--radius-sm); font-weight: 500; font-size: 0.9rem; cursor: pointer; border: 1px solid rgba(255,255,255,0.16); min-height: var(--tap); transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast); }
.table-detail-panel .btn-table-back:hover { border-color: var(--orange); color: var(--orange); background: rgba(255,107,0,0.06); }
.table-detail-panel .btn-book-this:active { transform: scale(0.98); }
.loading { color: var(--text-muted); }
.err { color: #f87171; }
/* Скелетоны загрузки */
@keyframes skeleton-pulse { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; } }
.bar-list-skeleton { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.skeleton-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column; }
.skeleton-card .skeleton-photo { width: 100%; aspect-ratio: 4/3; background: var(--border); animation: skeleton-pulse 1.2s ease-in-out infinite; }
.skeleton-card .skeleton-body { padding: 1rem 1.1rem 1.25rem; }
.skeleton-card .skeleton-line { height: 1rem; background: var(--border); border-radius: 4px; margin-bottom: 0.5rem; animation: skeleton-pulse 1.2s ease-in-out infinite; }
.skeleton-card .skeleton-line.short { width: 60%; }
.skeleton-card .skeleton-line.cta { height: 2.5rem; margin-top: 0.5rem; border-radius: var(--radius-sm); }
/* Пустое состояние каталога */
.empty-state { text-align: center; padding: 2.75rem 1.75rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); margin-bottom: 1.5rem; }
.empty-state-icon { font-size: 3rem; margin-bottom: 1.25rem; opacity: 0.5; }
.empty-state-title { font-family: var(--font-heading); font-size: 1.15rem; font-weight: 700; color: var(--text); margin-bottom: 0.5rem; }
.empty-state-text { font-size: 0.95rem; color: var(--text-muted); margin: 0; }
/* Пустые блоки на странице заведения */
.empty-block { padding: 1.75rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); text-align: center; color: var(--text-muted); font-size: 0.9rem; }
.empty-block-icon { font-size: 2rem; margin-bottom: 0.65rem; opacity: 0.6; }
/* Sticky CTA на мобильных */
@keyframes slideUpCta {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes slideDownCta {
  from { transform: translateY(0); opacity: 1; }
  to { transform: translateY(100%); opacity: 0; }
}
.booking-sticky-cta { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 50; padding: 0.75rem 1rem; padding-bottom: max(0.75rem, env(safe-area-inset-bottom)); background: rgba(13,13,13,0.95); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: 1px solid rgba(255, 107, 0, 0.2); box-shadow: 0 -4px 24px rgba(0,0,0,0.4), 0 -1px 8px rgba(255, 107, 0, 0.08); transform: translateY(100%); }
.booking-sticky-cta .btn-primary { width: 100%; padding: 0.85rem 1rem; font-size: 1rem; border-radius: var(--radius-md); background: var(--orange); color: var(--bg); border: none; font-weight: 600; cursor: pointer; font-family: inherit; transition: background var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.booking-sticky-cta .btn-primary:hover { background: var(--orange-hover); box-shadow: var(--orange-glow-soft); }
.booking-sticky-cta .btn-primary:active { transform: scale(0.98); }
.site-header.header-pending { visibility: hidden; display: block !important; }
.view-hidden { display: none !important; visibility: hidden; }
.filters { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-bottom: 2rem; }
.filters input { padding: 0.6rem 0.85rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--card); color: var(--text); font-size: 0.9rem; font-family: inherit; transition: border-color var(--transition-base), box-shadow var(--transition-base); }
.filters input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-soft); }
.filters input::placeholder { color: var(--text-muted); }
.filters .btn { padding: 0.5rem 1rem; background: var(--orange); color: var(--bg); border: none; border-radius: var(--radius-md); cursor: pointer; font-size: 0.9rem; font-weight: 600; transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.filters .btn:hover { background: var(--orange-hover); color: var(--bg); transform: scale(1.02); box-shadow: 0 4px 16px rgba(255, 107, 0, 0.3); }
.filters .btn:active { transform: scale(0.97); }
.booking-block { margin-top: 2rem; padding: 1.75rem; background: rgba(42, 42, 42, 0.5); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255, 107, 0, 0.28); border-radius: var(--radius-lg); box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25), var(--orange-glow-soft); }
.booking-block h3 { margin-top: 0; margin-bottom: 0.5rem; color: var(--orange); font-weight: 700; position: relative; padding-bottom: 0.35rem; }
.booking-block h3::after { content: ''; position: absolute; bottom: 0; left: 0; width: 32px; height: 2px; background: var(--orange); border-radius: 2px; }

/* Booking stepper */
.booking-steps {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 1.25rem;
  padding: 0.75rem 0;
}
.booking-step {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
}
.step-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--border);
  color: var(--text-muted);
  font-size: 0.8rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}
.step-label {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-muted);
  transition: color 0.3s;
}
.booking-step.active .step-num {
  background: var(--orange);
  color: var(--bg);
  box-shadow: 0 0 12px rgba(255, 107, 0, 0.3);
}
.booking-step.active .step-label { color: var(--text); }
.booking-step.done .step-num {
  background: #22c55e;
  color: #fff;
}
.booking-step.done .step-label { color: var(--text-muted); }
.booking-step-line {
  flex: 1;
  height: 2px;
  background: var(--border);
  margin: 0 0.5rem;
  border-radius: 1px;
  transition: background 0.3s;
}
.booking-step-line.done { background: #22c55e; }
.booking-block .row { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.booking-block label { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; }
.booking-block input, .booking-block select, .booking-block textarea { padding: 0.6rem 0.8rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--card); color: var(--text); font-size: 0.9rem; font-family: inherit; transition: border-color var(--transition-base), box-shadow var(--transition-base); }
.booking-block input:focus, .booking-block select:focus, .booking-block textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-soft); }
.booking-block input[type="date"] { min-width: 10rem; cursor: pointer; }
.booking-block .btn-primary { padding: 0.65rem 1.25rem; min-height: var(--tap); background: var(--orange); color: var(--bg); border: none; border-radius: var(--radius-sm); cursor: pointer; font-weight: 600; font-size: 1rem; transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.booking-block .btn-primary:hover { background: var(--orange-hover); transform: translateY(-1px); box-shadow: var(--orange-glow-soft); }
.booking-block .btn-primary:active { transform: scale(0.98); }
.booking-block .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
.free-tables-list { display: flex; flex-wrap: wrap; gap: 0.65rem; margin: 1rem 0; }
.free-tables-list .table-pick { padding: 0.6rem 0.9rem; background: rgba(42, 42, 42, 0.9); border: 1px solid rgba(255, 107, 0, 0.4); border-radius: var(--radius-sm); cursor: pointer; font-size: 0.9rem; color: var(--text); font-weight: 500; transition: background 0.2s, border-color 0.2s, color 0.2s; }
.free-tables-list .table-pick:hover { border-color: var(--orange); background: var(--orange-soft); color: var(--text); }
.free-tables-list .table-pick.selected { border-color: var(--orange); background: var(--orange); color: var(--bg); }
.booking-success { margin-top: 1.25rem; padding: 1.15rem; background: rgba(34, 197, 94, 0.15); border: 1px solid rgba(34, 197, 94, 0.5); border-radius: var(--radius-sm); color: #86efac; }
.rating-line { font-size: 0.95rem; color: var(--text-muted); margin-bottom: 0.75rem; }
.rating-line .star { color: var(--orange); }
.reviews-summary { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.review-item { padding: 1rem 0; border-bottom: 1px solid var(--border); font-size: 0.9rem; }
.review-item:last-child { border-bottom: none; }
.review-item .r-head { color: var(--text-muted); margin-bottom: 0.35rem; }
.review-form-block { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--border); }
.review-form-block h4 { font-size: 1rem; margin: 0 0 0.75rem; color: var(--orange); }
.review-form-block .row { margin-bottom: 0.75rem; }
.review-form-block input, .review-form-block select, .review-form-block textarea { padding: 0.5rem 0.6rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--card); color: var(--text); font-size: 0.9rem; }
.review-form-block .msg { font-size: 0.9rem; margin-top: 0.75rem; }
.detail .hall-scheme.clickable, .table-card img.clickable { cursor: pointer; }
.detail .hall-scheme.clickable:hover, .table-card img.clickable:hover { opacity: 0.9; }
/* Auth / Registration */
#viewAuth .auth-wrap { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--card-shadow), 0 4px 32px rgba(0, 0, 0, 0.2); padding: 2.25rem 2rem; min-height: 50vh; display: flex; flex-direction: column; justify-content: center; }
#viewAuth input[type="tel"], #viewAuth input[type="text"], #viewAuth input[type="password"], #viewAuth input[type="date"] { transition: border-color var(--transition-base), box-shadow var(--transition-base); font-family: inherit; }
#viewAuth input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-soft); }
#viewAuth .btn-primary { transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); font-weight: 600; }
#viewAuth .btn-primary:hover { transform: scale(1.02); box-shadow: 0 4px 16px rgba(255, 107, 0, 0.3); }
#viewAuth .btn-primary:active { transform: scale(0.97); }
#viewAuth .msg { animation: fadeIn 0.3s ease; }
#viewAuth .msg:not(.err)::before { content: '✓ '; }
#viewRegister { max-width: 420px; margin: 0 auto; padding: 2rem 1.25rem; }
#viewRegister .logo { font-size: 1.75rem; font-weight: 800; color: var(--text); margin-bottom: 1.5rem; letter-spacing: -0.02em; font-family: var(--font-heading); }
#viewRegister .logo span { color: var(--orange); }
#viewRegister h2 { font-size: 1.35rem; margin: 0 0 1.25rem; color: var(--text); font-family: var(--font-heading); font-weight: 700; position: relative; padding-bottom: 0.45rem; }
#viewRegister h2::after { content: ''; position: absolute; bottom: 0; left: 0; width: 36px; height: 2.5px; background: var(--orange); border-radius: 2px; }
#viewRegister .reg-form .row { margin-bottom: 1rem; }
#viewRegister .reg-form label { display: block; font-size: 0.9rem; color: var(--text-muted); margin-bottom: 0.35rem; }
#viewRegister .reg-form input { width: 100%; padding: 0.65rem 0.85rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--card); color: var(--text); font-size: 1rem; font-family: inherit; min-height: var(--tap); box-sizing: border-box; transition: border-color var(--transition-base), box-shadow var(--transition-base); }
#viewRegister .reg-form input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-soft); }
#viewRegister .reg-form input::placeholder { color: var(--text-muted); }
#viewRegister .reg-form .btn-primary { width: 100%; padding: 0.75rem 1rem; margin-top: 0.5rem; min-height: var(--tap); background: var(--orange); color: var(--bg); border: none; border-radius: var(--radius-sm); cursor: pointer; font-weight: 600; font-size: 1rem; transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
#viewRegister .reg-form .btn-primary:hover { background: var(--orange-hover); box-shadow: 0 4px 16px rgba(255, 107, 0, 0.3); }
#viewRegister .reg-form .btn-primary:active { transform: scale(0.97); }
#viewRegister .reg-form .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
#viewRegister .reg-form .code-step { display: none; margin-top: 1rem; }
#viewRegister .reg-form .code-step.show { display: block; }
#viewRegister .reg-form .msg { font-size: 0.9rem; margin-top: 0.5rem; }
#viewRegister .reg-form .err { color: #f87171; }
#viewRegister .age-hint { font-size: 0.85rem; color: var(--text-muted); margin-top: 0.25rem; }
.badge-18 { display: inline-block; padding: 0.2rem 0.5rem; font-size: 0.75rem; font-weight: 600; background: var(--orange-soft); color: var(--orange); border-radius: 4px; margin-left: 0.5rem; }
/* Auth utility classes (replace inline styles) */
.auth-wrap-inner { max-width: 400px; margin: 0 auto; padding: 2rem 1rem; }
.auth-logo { font-size: 1.75rem; font-weight: 700; color: var(--text); margin-bottom: 1.5rem; }
.auth-logo .accent { color: var(--orange); }
.auth-back { margin: 0 0 1rem; font-size: 0.9rem; }
.auth-back a { color: var(--text-muted); }
.auth-h2 { font-size: 1.35rem; margin: 0 0 1rem; color: var(--text); }
.auth-field { margin-bottom: 1rem; }
.auth-field-sm { margin-bottom: 0.5rem; }
.auth-label { display: block; font-size: 0.9rem; color: var(--text-muted); margin-bottom: 0.35rem; }
.auth-input { width: 100%; padding: 0.65rem 0.75rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--card); color: var(--text); font-size: 1rem; min-height: var(--tap); box-sizing: border-box; }
.auth-text { font-size: 0.9rem; color: var(--text-muted); }
.auth-text-mb { margin-bottom: 1rem; }
.auth-msg { font-size: 0.9rem; margin-top: 0.5rem; }
.auth-footer { margin-top: 1.25rem; font-size: 0.9rem; color: var(--text-muted); }
.auth-footer a { color: var(--orange); }
.btn-telegram { display: inline-block; padding: 0.5rem 1rem; background: var(--orange); color: var(--bg); border-radius: var(--radius-sm); font-weight: 500; text-decoration: none; font-size: 0.9rem; }
.btn-telegram-outline { width: 100%; padding: 0.6rem; font-size: 0.9rem; background: transparent; color: var(--orange); border: 1px solid var(--orange); border-radius: var(--radius-sm); cursor: pointer; font-weight: 500; font-family: inherit; }
.auth-inline-hint { margin-left: 0.5rem; font-size: 0.85rem; color: var(--text-muted); }
.auth-btn-full { width: 100%; padding: 0.75rem; min-height: var(--tap); }
#lightbox { display: none; position: fixed; inset: 0; z-index: 9999; align-items: center; justify-content: center; background: rgba(0,0,0,0.88); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 1rem; padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); padding-top: max(1rem, env(safe-area-inset-top)); padding-bottom: max(1rem, env(safe-area-inset-bottom)); box-sizing: border-box; }
#lightbox.show { display: flex; }
#lightbox img { max-width: 100%; max-height: calc(100% - 96px); object-fit: contain; border-radius: 8px; animation: lightboxIn 0.2s ease forwards; }
@keyframes lightboxIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
#lightbox .lightbox-close { position: absolute; top: 1rem; right: 1rem; width: 44px; height: 44px; border: none; background: var(--border); color: var(--text); font-size: 1.5rem; border-radius: var(--radius-sm); cursor: pointer; line-height: 1; opacity: 0.9; }
#lightbox .lightbox-close:hover { background: var(--orange); color: var(--bg); }
#lightbox .lightbox-caption { position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%); color: var(--text-muted); font-size: 0.9rem; background: rgba(0,0,0,0.6); padding: 0.35rem 0.75rem; border-radius: var(--radius-sm); }

/* Личный кабинет — премиум-стиль и появление */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
#viewAuth { opacity: 0; }
#viewAuth.auth-visible { opacity: 1; animation: fadeIn 0.3s ease forwards; }
#viewProfile { opacity: 0; max-width: 420px; margin: 0 auto; padding: 2.25rem 1.75rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--card-shadow), 0 4px 32px rgba(0, 0, 0, 0.2); }
#viewProfile.profile-visible { animation: fadeIn 0.3s ease forwards; }
#viewProfile h2 { font-family: var(--font-heading); font-size: 1.4rem; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 1rem; color: var(--text); position: relative; padding-bottom: 0.45rem; }
#viewProfile h2::after { content: ''; position: absolute; bottom: 0; left: 0; width: 36px; height: 2.5px; background: var(--orange); border-radius: 2px; }
#viewProfile .link-back-catalog { font-size: 0.9rem; color: var(--text-muted); transition: color 0.2s ease; }
#viewProfile .link-back-catalog:hover { color: var(--orange); }
#viewProfile input { border-radius: var(--radius-sm); border: 1px solid var(--border); font-family: inherit; transition: border-color var(--transition-base), box-shadow var(--transition-base); }
#viewProfile input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-soft); }
#viewProfile #btnProfileSave { border-radius: var(--radius-sm); transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); font-weight: 600; }
#viewProfile #btnProfileSave:hover { transform: scale(1.02); box-shadow: 0 4px 16px rgba(255, 107, 0, 0.3); }
#viewProfile #btnProfileSave:active { transform: scale(0.97); }
#viewProfile .msg:not(.err)::before { content: '✓ '; }
#viewProfile .msg { animation: fadeIn 0.3s ease; }
.profile-wrap { max-width: 400px; margin: 0 auto; }
.profile-h2 { font-size: 1.35rem; margin: 0 0 1rem; color: var(--text); }
.profile-field { margin-bottom: 1rem; }

/* ========== Мобильная вёрстка ========== */
@media (max-width: 768px) {
  .wrap { padding: 1rem 1rem; padding-bottom: 1.5rem; }
  .catalog-header { animation: none; padding: 0.25rem 0 1rem; }
  .catalog-hero { padding: 1.5rem 0 2rem; margin-bottom: 1rem; }
  .catalog-hero .catalog-header h1 { font-size: clamp(1.35rem, 5vw, 1.75rem); }
  .catalog-hero .subtitle { font-size: 0.95rem; margin-top: 0.5rem; }
  h1 { font-size: 1.35rem; }
  .subtitle { font-size: 0.9rem; margin-bottom: 1.5rem; }

  /* Упрощённые анимации на мобильных */
  .bar-card:hover img { transform: none; }
  .bar-list { gap: 1.25rem; grid-template-columns: 1fr; }
  .bar-card.bar-card-enter { animation: fadeInUp 0.25s ease forwards; }
  .bar-card.bar-card-enter[data-stagger="0"], .bar-card.bar-card-enter[data-stagger="1"],
  .bar-card.bar-card-enter[data-stagger="2"], .bar-card.bar-card-enter[data-stagger="3"],
  .bar-card.bar-card-enter[data-stagger="4"], .bar-card.bar-card-enter[data-stagger="5"],
  .bar-card.bar-card-enter[data-stagger="6"], .bar-card.bar-card-enter[data-stagger="7"],
  .bar-card.bar-card-enter[data-stagger="8"], .bar-card.bar-card-enter[data-stagger="9"] { animation-delay: 0; }
  #viewProfile.profile-visible { animation-duration: 0.2s; }

  /* Список заведений */
  .bar-card .card-photo { aspect-ratio: 16/9; }
  .skeleton-card .skeleton-photo { aspect-ratio: 16/9; }
  .bar-card .body { padding: 0.85rem 1rem 1rem; }
  .bar-card .name { font-size: 1.1rem; margin-bottom: 0.25rem; }
  .bar-card .card-meta { font-size: 0.8rem; margin-bottom: 0.35rem; }
  .bar-card .addr { font-size: 0.75rem; }
  .bar-card .card-links { gap: 0.35rem; margin-top: 0.35rem; }
  .bar-card .card-link { padding: 0.3rem 0.6rem; font-size: 0.8rem; }
  .bar-card .link-more { padding: 0.65rem 1rem; min-height: var(--tap); font-size: 0.95rem; margin-top: 0.6rem; border-radius: 8px; }

  /* Фильтры — столбиком, полноценные поля */
  .filters { flex-direction: column; gap: 0.85rem; margin-bottom: 1.5rem; }
  .filters input { width: 100%; min-width: 0; padding: 0.65rem 0.75rem; font-size: 16px; min-height: var(--tap); border-radius: 8px; }
  .filters .btn { width: 100%; padding: 0.7rem 1rem; min-height: var(--tap); font-size: 1rem; border-radius: 8px; }

  .detail { padding: 1.25rem; margin-top: 1.25rem; border-radius: var(--radius-lg); }
  .detail-cover-wrap { margin: -1.25rem -1.25rem 0 -1.25rem; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
  .detail .detail-title { margin-top: -2rem; margin-bottom: 0.75rem; }
  .detail .back { margin-bottom: 1.5rem; }
  .detail .back a { display: inline-flex; padding: 0.6rem 1rem; font-size: 0.95rem; }
  .detail .cover, .detail .no-photo-big { border-radius: 0; max-height: 220px; }
  .detail h2 { font-size: 1.4rem; margin-bottom: 0.75rem; }
  .detail h3 { font-size: 1.1rem; margin: 1.5rem 0 0.65rem; }
  .detail p { font-size: 0.95rem; margin-bottom: 0.65rem; }
  .detail-info { margin: 0.65rem 0 1rem; }
  .detail-info-item { padding: 0.55rem 0.85rem; }
  .detail-info-label { min-width: 6rem; font-size: 0.75rem; }
  .detail-info-value { font-size: 0.9rem; }
  .tables-grid { grid-template-columns: repeat(2, 1fr); gap: 0.85rem; margin-top: 0.65rem; }
  .table-card .info { padding: 0.6rem; font-size: 0.85rem; }

  /* Menu/promo previews — compact on mobile */
  .detail-menu-preview,
  .detail-promo-preview { width: min(240px, 100%); }
  .detail-menu-preview img { max-height: 140px; }
  .detail-promo-preview img { max-height: 120px; }

  /* Booking stepper mobile */
  .booking-steps { margin-bottom: 1rem; padding: 0.5rem 0; }
  .step-label { display: none; }
  .step-num { width: 32px; height: 32px; font-size: 0.85rem; }
  .booking-step-line { margin: 0 0.35rem; }

  /* Блок бронирования */
  .booking-block { padding: 1.25rem; margin-top: 1.75rem; border-radius: 12px; }
  .booking-block h3 { font-size: 1.15rem; margin-bottom: 0.75rem; }
  .booking-block .row { flex-direction: column; gap: 0.85rem; margin-bottom: 1rem; align-items: stretch; }
  .booking-block label { flex-direction: column; align-items: stretch; gap: 0.35rem; font-size: 0.95rem; }
  .booking-block input, .booking-block select, .booking-block textarea { width: 100%; min-width: 0; padding: 0.65rem 0.75rem; font-size: 16px; min-height: var(--tap); border-radius: 8px; }
  .booking-block .btn-primary { width: 100%; padding: 0.85rem 1rem; font-size: 1.05rem; border-radius: 10px; }
  .free-tables-list .table-pick { padding: 0.65rem 0.85rem; min-height: var(--tap); font-size: 0.95rem; border-radius: 8px; flex: 1 1 45%; }
  .free-tables-list { gap: 0.6rem; margin: 1rem 0; }
  .booking-success, #bookingError { padding: 1.1rem; margin-top: 1rem; }

  /* Отзывы */
  .reviews-summary { margin-top: 1.75rem; padding-top: 1.25rem; }
  .review-form-block { margin-top: 1.25rem; padding-top: 1.15rem; }
  .review-form-block .row { margin-bottom: 0.65rem; flex-direction: column; }
  .review-form-block input, .review-form-block select, .review-form-block textarea { width: 100%; min-width: 0; padding: 0.6rem 0.75rem; font-size: 16px; min-height: var(--tap); }
  #btnSubmitReview { width: 100%; min-height: var(--tap); padding: 0.75rem; font-size: 1rem; border-radius: 8px; }

  /* Лайтбокс */
  #lightbox .lightbox-close { top: max(0.5rem, env(safe-area-inset-top)); right: max(0.5rem, env(safe-area-inset-right)); width: 48px; height: 48px; font-size: 1.75rem; }
  #lightbox .lightbox-caption { bottom: max(1rem, env(safe-area-inset-bottom)); }
  #lightbox { -webkit-overflow-scrolling: touch; }

  /* iOS zoom prevention */
  .catalog-search-input { font-size: 16px; min-height: var(--tap); padding: 0.7rem 1rem; }
  .catalog-search-row { gap: 0.5rem; }
  .btn-filter-toggle, .btn-near-me { min-height: var(--tap); font-size: 0.95rem; padding: 0.6rem 0.85rem; }

  /* Active states for touch */
  .bar-card:active { transform: translateY(-1px); border-color: rgba(255, 107, 0, 0.4); }
  .bar-card .link-more:active { background: var(--orange-hover); transform: scale(0.97); }
  .catalog-cta-link:active { background: var(--orange-soft); }
  .btn-filter-toggle:active, .btn-near-me:active { background: var(--orange-soft); color: var(--orange); border-color: var(--orange); }
  .detail .back a:active { background: var(--orange-soft); color: var(--orange); border-color: var(--orange); }

  /* Booking block polish */
  .free-tables-list .table-pick { min-height: var(--tap); font-size: 1rem; }
  .booking-block select { font-size: 16px; }

  /* Detail page -- sticky back button */
  .detail .back { position: sticky; top: 56px; z-index: 10; background: var(--card); padding: 0.5rem 0 0.75rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); }
  .detail .back a { min-height: var(--tap); font-size: 1rem; padding: 0.65rem 1.15rem; }

  /* Smooth touch scrolling */
  .tariff-modal-inner, .booking-block { -webkit-overflow-scrolling: touch; }

  /* Auth mobile centering */
  #viewAuth .auth-wrap { min-height: auto; padding: 1.5rem 1rem; }
  /* Sticky CTA with slide-up animation on mobile */
  .booking-sticky-cta { display: block; }
  .booking-sticky-cta.visible { animation: slideUpCta 0.3s ease forwards; }
  .booking-sticky-cta:not(.visible) { animation: slideDownCta 0.25s ease forwards; }
}

/* Очень узкий экран (мелкие телефоны) */
@media (max-width: 380px) {
  .tables-grid { grid-template-columns: 1fr; }
  .free-tables-list .table-pick { flex: 1 1 100%; }
}