:root{
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:40px; --space-8:48px; --space-9:56px;
  --radius-pill:999px; --radius-card:20px; --radius-md:16px; --radius-sx: 14px;
  --border:#e2e8f0;
  --text:#111;
  --muted:#64748b;
  --bg:#fff;
  --bg-soft:#f2f5f9;
  --green:#07DC43;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --max:1280px;
  --font: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --h2:20px;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font);color:var(--text);background:var(--bg)}
a{color:inherit;text-decoration:none}
.container{max-width:var(--max);margin:0 auto;padding:0 16px}
/* Typography */
.h2{font-size:var(--h2);font-weight:900;margin:0 0 var(--space-3)}
/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-pill);font-weight:700;font-size:14px;border:1px solid transparent;cursor:pointer;line-height:1;padding:0 16px;white-space:nowrap}
.btn--md{height:48px}
.btn--lg{height:56px;padding:0 20px}
.btn--sm{height:40px;padding:0 14px}
.btn--sx{height:36px;padding:0 12px;font-size:14px}
.btn--ghost{background:var(--bg-soft);border-color:var(--bg-soft)}
.btn--light{background:#fff;border-color:var(--border)}
.btn--gray{background:var(--border);border-color:var(--border)}
.btn--black{background:#111;color:#fff;border-color:#111}
.btn--green{background:var(--green);border-color:var(--green);color:#0b0b0b}
/* Pills / Tabs */
.tab{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;border:1px solid var(--border);border-radius:var(--radius-pill);font-size:14px;font-weight:700;background:#fff}
.tab.is-active{border-color:var(--green);}

/* Horizontal scrollable tabs (places-tabs): wrap, scroll area, arrows, gradients */
.places-tabs-wrap {
  position: relative;
  width: 100%;
  margin-bottom: var(--space-4);
}
.places-tabs {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.places-tabs::-webkit-scrollbar { display: none; }
.places-tabs .tab.places-tab {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.places-tab.is-active { background: #111; color: #fff; border-color: #111; }
.places-tab.is-active .places-tab__count { color: rgba(255,255,255,0.9); }
.places-tab--cat { align-items: center; gap: 4px; }
.places-tab--cat .places-tab__icon { margin-bottom: 0; }
.places-tab__icon { font-size: 22px; line-height: 1; }
.places-tab__label { }
.places-tab__count { font-size: 13px; color: var(--muted); margin-left: 2px; }
.places-tabs-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #fff;
  box-shadow: var(--shadow);
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 20px;
  line-height: 1;
  color: #333;
  z-index: 2;
}
.places-tabs-arrow:hover { background: var(--bg-soft); }
.places-tabs-arrow--left { left: -8px; }
.places-tabs-arrow--right { right: -8px; }
.places-tabs-arrow.is-hidden { display: none; }
.places-tabs-gradient {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 48px;
  pointer-events: none;
  z-index: 1;
}
.places-tabs-gradient--left {
  left: 0;
  background: linear-gradient(to right, #fff 0%, rgba(255,255,255,0) 100%);
}
.places-tabs-gradient--right {
  right: 0;
  background: linear-gradient(to left, #fff 0%, rgba(255,255,255,0) 100%);
}
.places-tabs-gradient.is-hidden { opacity: 0; transition: opacity 0.2s ease; }
.places-tabs-gradient:not(.is-hidden) { opacity: 1; }
@media (max-width: 980px) {
  .places-tabs-wrap .places-tabs-arrow { display: none; }
  .places-tabs-gradient { display: none; }
  .places-tabs { padding-left: 0; padding-right: 0; }
}

.container-wide{max-width:calc(var(--max) + 260px + var(--space-5));margin:0 auto;padding:0 16px}
