:root {
  color: #111a2e;
  background: #f4f7fb;
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
}

body {
  margin: 0;
}

button,
input,
select,
textarea {
  font: inherit;
}
a {
  color: inherit;
}

button {
  cursor: pointer;
}

svg {
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
  width: 1em;
}

.site-shell {
  background: #f4f7fb;
  min-height: 100vh;
}

.header {
  align-items: center;
  background: #ffffff;
  display: grid;
  gap: 28px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  height: 82px;
  margin: 0 auto;
  padding: 0 48px;
  position: relative;
  z-index: 20;
}

.header-admin {
  background: #0f1f39;
  gap: 12px;
  height: auto;
  min-height: 82px;
  padding: 10px 20px;
}

.header-admin .brand {
  min-width: 0;
}

.header-admin .brand strong {
  color: #ffffff;
}

.header-admin .brand small {
  color: #9fb0c7;
}

.header-admin .nav {
  flex-wrap: wrap;
  gap: 6px clamp(8px, 1vw, 20px);
  row-gap: 6px;
}

.header-admin .nav button, .header-admin .nav a {
  color: #dbe4f0;
  font-size: 12px;
  padding: 8px 0;
}

.header-admin .nav button.active::after, .header-admin .nav a.active::after {
  bottom: 2px;
}

.header-admin .header-actions {
  flex-wrap: wrap;
  gap: 8px 14px;
  row-gap: 8px;
}

.header-admin .icon-text {
  gap: 6px;
}

.header-admin .icon-text svg {
  color: #dbe4f0;
  font-size: 18px;
}

.header-admin .icon-text span {
  color: #dbe4f0;
  font-size: 12px;
}

.header-admin .icon-text.active svg,
.header-admin .icon-text.active span {
  color: #34d399;
}

.header-admin .post-button {
  min-width: 200px;
  padding: 11px 14px;
}

.brand-group {
  align-items: center;
  display: flex;
  gap: 8px;
}

.brand-admin-badge {
  background: rgba(52, 211, 153, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.4);
  border-radius: 999px;
  color: #34d399;
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  padding: 3px 9px;
  text-transform: uppercase;
  white-space: nowrap;
}

.brand {
  align-items: center;
  background: transparent;
  border: 0;
  display: flex;
  gap: 10px;
  min-width: 210px;
  padding: 0;
  text-align: left;
  text-decoration: none;
}

.brand-mark {
  align-items: center;
  color: #12a764;
  display: grid;
  font-size: 35px;
  place-items: center;
}

.brand-mark svg {
  fill: rgba(18, 167, 100, 0.08);
  stroke-width: 2.8;
}

.brand strong {
  display: block;
  font-size: 28px;
  letter-spacing: 0;
  line-height: 0.86;
}

.brand small {
  color: #526171;
  display: block;
  font-size: 10px;
  font-weight: 700;
  margin-top: 5px;
}

.nav {
  align-items: center;
  display: flex;
  gap: clamp(18px, 2.1vw, 44px);
  justify-content: center;
  min-width: 0;
}

.nav button, .nav a {
  background: transparent;
  border: 0;
  color: #111a2e;
  font-size: 13px;
  font-weight: 800;
  padding: 31px 0;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
}

.nav button.active::after, .nav a.active::after {
  background: #13a360;
  border-radius: 999px;
  bottom: 20px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  right: 0;
}

.header-actions {
  align-items: center;
  display: flex;
  gap: 24px;
  justify-content: flex-end;
  position: relative;
}

.icon-text {
  align-items: center;
  background: transparent;
  border: 0;
  display: inline-flex;
  gap: 9px;
  padding: 0;
}

.icon-text svg {
  color: #16233b;
  font-size: 20px;
}

.icon-text span {
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.icon-text.active {
  color: #109457;
}

.icon-text.active svg,
.icon-text.active span {
  color: #109457;
}

.favorites-shortcut {
  position: relative;
}

.favorites-shortcut i {
  background: #14a45f;
  border: 2px solid #ffffff;
  border-radius: 999px;
  height: 10px;
  position: absolute;
  left: 13px;
  top: 1px;
  width: 10px;
}

.post-button {
  background: #089858;
  border: 0;
  border-radius: 7px;
  color: #ffffff;
  display: grid;
  gap: 2px;
  min-height: 58px;
  min-width: 240px;
  padding: 11px 18px;
  text-align: center;
}

.post-button span {
  font-size: 14px;
  font-weight: 900;
}

.post-button small {
  font-size: 11px;
  font-weight: 800;
  opacity: 0.9;
}

.hero {
  min-height: 700px;
  overflow: hidden;
  position: relative;
}

.hero-photo {
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: center right;
  position: absolute;
  width: 100%;
}

.hero-gradient {
  background:
    linear-gradient(180deg, rgba(244, 247, 251, 0) 68%, rgba(238, 243, 248, 0.78) 100%),
    linear-gradient(90deg, #f7faff 0%, rgba(247, 250, 255, 0.96) 24%, rgba(247, 250, 255, 0.54) 42%, rgba(247, 250, 255, 0.08) 62%, rgba(247, 250, 255, 0) 100%);
  inset: 0;
  position: absolute;
}

.hero-inner {
  height: 620px;
  margin: 0 auto;
  max-width: 1760px;
  padding: 68px 48px 0;
  position: relative;
}

.hero-copy {
  max-width: 660px;
  position: relative;
  z-index: 2;
}

.hero h1 {
  color: #10182d;
  font-size: clamp(48px, 4.1vw, 78px);
  line-height: 0.98;
  margin: 0;
}

.hero h1 span {
  color: #10a15e;
  display: block;
  position: relative;
  width: max-content;
}

.hero h1 span::after {
  background: #10a15e;
  border-radius: 999px;
  bottom: -5px;
  content: "";
  height: 4px;
  left: 28%;
  position: absolute;
  transform: rotate(-3deg);
  width: 72%;
}

.hero-copy p {
  color: #526171;
  font-size: clamp(18px, 1.35vw, 25px);
  line-height: 1.34;
  margin: 36px 0 0;
  max-width: 560px;
}

.benefits {
  display: grid;
  gap: 30px;
  grid-template-columns: repeat(4, minmax(118px, 1fr));
  margin-top: 56px;
  max-width: 740px;
}

.benefit {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.benefit-icon,
.tool-icon {
  align-items: center;
  background: #eef5ff;
  border-radius: 50%;
  color: #4574ff;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
}

.benefit-icon {
  font-size: 22px;
  height: 44px;
  width: 44px;
}

.benefit-icon.spark,
.benefit-icon.coin {
  background: #fff0e7;
  color: #ff8247;
}

.benefit-icon.chart {
  background: #eaf8ef;
  color: #22aa63;
}

.benefit-icon.shuffle {
  background: #eef5ff;
  color: #4574ff;
}

.benefit-icon.shield {
  background: #eaf8ef;
  color: #13a360;
}

.benefit strong,
.benefit small {
  display: block;
}

.benefit strong {
  color: #16233b;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.25;
}

.benefit small {
  color: #526171;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  margin-top: 2px;
}

.ai-card {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(212, 221, 231, 0.8);
  border-radius: 8px;
  box-shadow: 0 22px 60px rgba(24, 35, 57, 0.16);
  display: grid;
  gap: 14px;
  left: 48%;
  padding: 19px 21px;
  position: absolute;
  top: 32px;
  width: 238px;
  z-index: 3;
}

.ai-label {
  align-items: center;
  color: #5368ff;
  display: flex;
  font-size: 12px;
  font-weight: 900;
  gap: 8px;
}

.ai-label svg {
  font-size: 18px;
}

.ai-card > strong {
  color: #111a2e;
  font-size: 14px;
  line-height: 1.35;
}

.avatar-row {
  align-items: center;
  display: flex;
}

.avatar-row span,
.avatar-row em {
  align-items: center;
  border: 2px solid #ffffff;
  border-radius: 50%;
  display: grid;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  height: 30px;
  margin-left: -7px;
  place-items: center;
  width: 30px;
}

.avatar-row span:first-child {
  margin-left: 0;
}

.avatar-row span:nth-child(1) {
  background: #d7b390;
}

.avatar-row span:nth-child(2) {
  background: #95b5ca;
}

.avatar-row span:nth-child(3) {
  background: #d9c2a6;
}

.avatar-row span:nth-child(4) {
  background: #7aa884;
}

.avatar-row span:nth-child(5) {
  background: #bd8b74;
}

.avatar-row em {
  background: #dcf8e9;
  color: #129457;
  margin-left: 6px;
}

.ai-card button {
  background: #14223a;
  border: 0;
  border-radius: 7px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
  min-height: 42px;
  padding: 10px 14px;
}

.tour-card {
  align-items: center;
  background: rgba(255, 255, 255, 0.96);
  border-radius: 8px;
  box-shadow: 0 16px 45px rgba(24, 35, 57, 0.14);
  display: flex;
  gap: 11px;
  padding: 14px 17px;
  position: absolute;
  right: 48px;
  top: 390px;
  z-index: 3;
}

.tour-badge {
  align-items: center;
  border: 1px solid #c8d2dd;
  border-radius: 50%;
  color: #14223a;
  display: grid;
  font-size: 13px;
  font-weight: 900;
  height: 42px;
  place-items: center;
  width: 42px;
}

.tour-card strong,
.tour-card small {
  display: block;
}

.tour-card strong {
  font-size: 13px;
  font-weight: 900;
}

.tour-card small {
  color: #526171;
  font-size: 11px;
  font-weight: 800;
  margin-top: 2px;
}

.search-wrap {
  margin: -194px auto 0;
  max-width: 1760px;
  padding: 0 48px;
  position: relative;
  z-index: 6;
}

.search-tabs {
  display: flex;
  width: max-content;
}

.search-tabs button, .search-tabs a {
  background: rgba(255, 255, 255, 0.88);
  border: 0;
  color: #657284;
  font-size: 13px;
  font-weight: 900;
  min-height: 43px;
  min-width: 126px;
  padding: 10px 20px;
}

.search-tabs button:first-child, .search-tabs a:first-child {
  border-radius: 6px 0 0 0;
}

.search-tabs button:last-child, .search-tabs a:last-child {
  border-radius: 0 6px 0 0;
}

.search-tabs .active {
  background: #14223a;
  color: #ffffff;
}

.search-panel {
  align-items: stretch;
  background: #ffffff;
  border: 1px solid #dfe6ee;
  border-radius: 0 8px 8px 8px;
  box-shadow: 0 18px 45px rgba(24, 35, 57, 0.11);
  display: grid;
  grid-template-columns: 1.12fr 1.18fr 0.9fr 0.92fr 0.95fr 184px;
  min-height: 78px;
  overflow: hidden;
}

.search-panel-mega {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: block;
  min-height: 0;
  overflow: visible;
}

.search-panel-mega .mega-bar {
  border-radius: 0 8px 8px 8px;
}

.search-field {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-right: 1px solid #e3e9f0;
  display: flex;
  gap: 14px;
  min-width: 0;
  padding: 17px 22px;
  text-align: left;
}

.search-field svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 25px;
}

.search-field span {
  min-width: 0;
}

.search-field small,
.search-field strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-field small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 800;
}

.search-field strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
  margin-top: 4px;
}

.search-button {
  align-items: center;
  align-self: center;
  background: #0b9f5c;
  border: 0;
  border-radius: 7px;
  color: #ffffff;
  display: flex;
  font-size: 14px;
  font-weight: 900;
  gap: 14px;
  height: 52px;
  justify-content: center;
  margin: 12px 16px;
}

.search-button svg {
  font-size: 23px;
}

.content-shell {
  margin: 112px auto 70px;
  max-width: 1760px;
  padding: 0 48px;
}

.home-feature-grid {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1.85fr) minmax(440px, 0.95fr);
}

.home-left-stack,
.home-right-stack {
  display: grid;
  gap: 34px;
  min-width: 0;
}

.home-left-stack .tool-card,
.home-right-stack .free-card {
  grid-column: auto;
}

.tool-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tool-card,
.free-card,
.listing-card {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.tool-card {
  display: grid;
  gap: 14px;
  min-height: 178px;
  padding: 22px 22px 18px;
}

.tool-icon {
  font-size: 30px;
  height: 36px;
  width: 36px;
}

.tool-icon.gear {
  background: #f0edff;
  color: #6658ff;
}

.tool-icon.trend {
  background: #eaf8ef;
  color: #18a55f;
}

.tool-icon.house {
  background: #fff0e7;
  color: #ff8147;
}

.tool-icon.coin {
  background: #fff3dc;
  color: #f2a62b;
}

.tool-card h2,
.free-card h2,
.section-head h2,
.cities h2 {
  color: #14223a;
  margin: 0;
}

.tool-card h2 {
  font-size: 14px;
  line-height: 1.24;
}

.tool-card p,
.free-card p {
  color: #657284;
  line-height: 1.42;
  margin: 7px 0 0;
}

.tool-card p {
  font-size: 12px;
}

.tool-card button, .tool-card a {
  align-self: end;
  background: #f8fafc;
  border: 1px solid #e2e8ef;
  border-radius: 6px;
  color: #14223a;
  font-size: 13px;
  font-weight: 900;
  min-height: 42px;
}

.free-card {
  align-items: center;
  background: linear-gradient(90deg, #f7fffb 0%, #f2fbf6 100%);
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) 150px;
  min-height: 178px;
  overflow: hidden;
  padding: 24px 26px;
}

.free-card h2 {
  font-size: 22px;
  line-height: 1.15;
}

.free-card p {
  font-size: 14px;
  max-width: 440px;
}

.free-card button {
  align-items: center;
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 16px;
  justify-content: space-between;
  margin-top: 16px;
  min-height: 42px;
  min-width: 250px;
  padding: 0 17px;
}

.free-card button strong {
  font-size: 13px;
}

.free-card small {
  color: #657284;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 9px;
}

.house-graphic {
  height: 116px;
  position: relative;
}

.cloud {
  background: #d8efe2;
  border-radius: 999px;
  height: 18px;
  position: absolute;
  right: 10px;
  top: 14px;
  width: 58px;
}

.cloud::before,
.cloud::after {
  background: #d8efe2;
  border-radius: 50%;
  content: "";
  position: absolute;
}

.cloud::before {
  height: 24px;
  left: 14px;
  top: -9px;
  width: 24px;
}

.cloud::after {
  height: 16px;
  right: 10px;
  top: -5px;
  width: 16px;
}

.home {
  background: #dcf7e9;
  border: 3px solid #81d8a8;
  bottom: 7px;
  position: absolute;
}

.home::before {
  background: #ffffff;
  border-left: 3px solid #0b9f5c;
  border-top: 3px solid #0b9f5c;
  content: "";
  height: 38px;
  left: 14px;
  position: absolute;
  top: -24px;
  transform: rotate(45deg);
  width: 38px;
}

.home.one {
  height: 60px;
  left: 9px;
  width: 82px;
}

.home.two {
  height: 76px;
  right: 6px;
  width: 92px;
}

.main-grid {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1.55fr) minmax(390px, 0.95fr);
  margin-top: 34px;
}

.section-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
}

.cities h2 {
  align-items: center;
  display: flex;
  min-height: 24px;
}

.section-head h2,
.cities h2 {
  font-size: 18px;
  line-height: 1.2;
}

.section-head a {
  align-items: center;
  color: #657284;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  text-decoration: none;
}

.section-head a svg {
  font-size: 16px;
}

.offers {
  min-width: 0;
  overflow: hidden;
}

.listing-loop {
  --listing-gap: 18px;
  --listing-step: calc((100% + var(--listing-gap)) / 4);
  overflow: hidden;
  width: 100%;
}

.listing-grid {
  animation: listing-slide 20s ease-in-out infinite;
  display: flex;
  gap: var(--listing-gap);
  width: 100%;
  will-change: transform;
}

.listing-loop:hover .listing-grid,
.listing-loop:focus-within .listing-grid {
  animation-play-state: paused;
}

.listing-card {
  box-shadow: 0 14px 32px rgba(24, 35, 57, 0.05);
  flex: 0 0 calc((100% - 54px) / 4);
  min-width: 0;
  overflow: hidden;
}

@keyframes listing-slide {
  0%, 12% {
    transform: translateX(0);
  }

  20%, 32% {
    transform: translateX(calc(0px - var(--listing-step)));
  }

  40%, 52% {
    transform: translateX(calc(0px - var(--listing-step) - var(--listing-step)));
  }

  60%, 72% {
    transform: translateX(calc(0px - var(--listing-step) - var(--listing-step) - var(--listing-step)));
  }

  80%, 100% {
    transform: translateX(calc(0px - var(--listing-step) - var(--listing-step) - var(--listing-step) - var(--listing-step)));
  }
}

.property-media {
  --photo-start: center;
  --photo-end: 58% center;
  background-position: center;
  background-size: cover;
  height: 118px;
  position: relative;
}

.listing-card:nth-child(4n + 2) .property-media {
  --photo-start: 66% 66%;
  --photo-end: 78% 66%;
}

.listing-card:nth-child(4n + 3) .property-media {
  --photo-start: 16% 38%;
  --photo-end: 30% 38%;
}

.listing-card:nth-child(4n + 4) .property-media {
  --photo-start: 86% 52%;
  --photo-end: 72% 52%;
}

.property-media span {
  background: #10a15e;
  border-radius: 4px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  left: 14px;
  padding: 5px 8px;
  position: absolute;
  top: 12px;
}

.property-media span.dark {
  background: #14223a;
}

.property-media .favorite-button {
  align-items: center;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.82);
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(20, 34, 58, 0.16);
  color: #14223a;
  display: grid;
  font-size: 19px;
  height: 38px;
  place-items: center;
  position: absolute;
  right: 12px;
  top: 12px;
  transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease, transform 0.16s ease;
  width: 38px;
}

.property-media .favorite-button:hover,
.property-media .favorite-button:focus-visible {
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(20, 34, 58, 0.22);
  color: #0b9f5c;
  transform: translateY(-1px) scale(1.04);
}

.property-media .favorite-button:focus-visible {
  outline: 3px solid rgba(16, 161, 94, 0.24);
  outline-offset: 2px;
}

.property-media .favorite-button svg {
  fill: transparent;
  stroke: currentColor;
  stroke-width: 2.15;
}

.property-media .favorite-button.saved {
  background: #10a15e;
  border-color: #10a15e;
  box-shadow: 0 10px 26px rgba(16, 161, 94, 0.28);
  color: #ffffff;
}

.property-media .favorite-button.saved svg {
  fill: currentColor;
}

.listing-body {
  padding: 12px 14px 14px;
}

.listing-body p {
  color: #3e4b5f;
  font-size: 12px;
  font-weight: 800;
  margin: 0 0 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.listing-body small {
  color: #657284;
  display: block;
  font-size: 11px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.price-row {
  align-items: end;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-top: 12px;
}

.price-row strong {
  color: #14223a;
  font-size: 18px;
  font-weight: 950;
  white-space: nowrap;
}

.price-row span {
  color: #657284;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.cities h2 {
  margin-bottom: 12px;
}

.city-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.city-card {
  background-size: cover;
  border-radius: 8px;
  color: #ffffff;
  display: grid;
  min-height: 102px;
  overflow: hidden;
  padding: 14px 16px;
  place-content: end start;
  position: relative;
}

.city-card strong,
.city-card span {
  position: relative;
  z-index: 1;
}

.city-card strong {
  font-size: 17px;
  font-weight: 950;
  line-height: 1.2;
}

.city-card span {
  font-size: 12px;
  font-weight: 800;
  margin-top: 4px;
  opacity: 0.88;
}

.all-cities {
  align-content: center;
  background: #14223a;
  grid-column: span 2;
  min-height: 102px;
}

.all-cities span {
  font-size: 18px;
  font-weight: 950;
  margin: 0 0 10px;
}

.all-cities strong {
  font-size: 16px;
  font-weight: 800;
  opacity: 0.9;
}

.all-cities button {
  align-items: center;
  background: transparent;
  border: 2px solid rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  color: #ffffff;
  display: grid;
  font-size: 22px;
  height: 44px;
  place-items: center;
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
}

.buy-page {
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0) 32%),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  overflow: auto;
}

.buy-container {
  margin: 0 auto;
  max-width: 1760px;
  padding: 0 48px;
}

.breadcrumb {
  align-items: center;
  color: #718094;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 9px;
  padding-top: 20px;
}

.breadcrumb svg {
  font-size: 12px;
  transform: rotate(-90deg);
}

.breadcrumb strong {
  color: #14223a;
}

.buy-hero {
  align-items: end;
  display: flex;
  justify-content: space-between;
  margin-top: 32px;
}

.buy-hero h1 {
  color: #14223a;
  font-size: 34px;
  line-height: 1.08;
  margin: 0;
}

.buy-hero p {
  color: #526171;
  font-size: 15px;
  font-weight: 700;
  margin: 12px 0 0;
}

.breadcrumb,
.breadcrumb.mini,
.valuation-breadcrumb,
.history-breadcrumb,
.district-breadcrumb,
.negotiation-breadcrumb,
.settings-breadcrumb {
  display: none !important;
}

.rent-hero h1 span {
  color: #10a15e;
}

.buy-search-row {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 190px;
  margin-top: 36px;
}

.buy-search-row .mega-search {
  min-width: 0;
}

.buy-search-row .mega-bar {
  grid-template-columns: minmax(220px, 1.35fr) minmax(190px, 1fr) minmax(140px, 0.78fr) minmax(140px, 0.78fr) minmax(125px, 0.65fr) minmax(190px, 1fr) minmax(128px, auto) 118px;
}

.buy-search-row .mega-field {
  gap: 10px;
  padding-left: 14px;
  padding-right: 14px;
}

.buy-search-row .mega-more {
  padding-left: 14px;
  padding-right: 14px;
}

.buy-search-row .mega-search-btn {
  padding-left: 16px;
  padding-right: 16px;
}

.buy-search-panel {
  align-items: stretch;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  box-shadow: 0 16px 40px rgba(24, 35, 57, 0.09);
  display: grid;
  grid-template-columns: 1.55fr 1fr 1fr 1fr 1.2fr 124px;
  min-height: 76px;
  overflow: hidden;
}

.buy-search-panel .search-field {
  padding: 16px 20px;
}

.buy-search-panel .search-field:first-child strong {
  color: #526171;
  font-weight: 800;
}

.buy-search-button {
  align-items: center;
  align-self: center;
  background: #14223a;
  border: 0;
  border-radius: 7px;
  color: #ffffff;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 11px;
  height: 52px;
  justify-content: center;
  margin: 12px 12px 12px 0;
}

.buy-search-button svg {
  font-size: 22px;
}

.save-search {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 11px;
  min-height: 72px;
  justify-content: center;
  padding: 0 16px;
  text-align: center;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.save-search span {
  line-height: 1.2;
}

.save-search svg {
  color: #526171;
  font-size: 20px;
  transform-origin: 50% 4px;
  transition: color 0.2s ease;
}

.save-search:hover {
  border-color: #c3ccd8;
}

.save-search.saved {
  background: #eafaf1;
  border-color: #10a15e;
  color: #0c7d49;
  box-shadow: 0 0 0 3px rgba(16, 161, 94, 0.14);
}

.save-search.saved svg {
  color: #10a15e;
  animation: bell-ring 0.7s ease;
}

@keyframes bell-ring {
  0% { transform: rotate(0); }
  15% { transform: rotate(16deg); }
  30% { transform: rotate(-14deg); }
  45% { transform: rotate(10deg); }
  60% { transform: rotate(-8deg); }
  75% { transform: rotate(4deg); }
  100% { transform: rotate(0); }
}

/* Interaktywna wyszukiwarka (Kup) */
.buy-search-panel {
  overflow: visible;
  position: relative;
}

.city-field {
  align-items: center;
  background: #ffffff;
  border-right: 1px solid #e3e9f0;
  border-radius: 8px 0 0 8px;
  display: flex;
  gap: 14px;
  min-width: 0;
  padding: 14px 20px;
  position: relative;
}

.city-field > svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 25px;
}

.city-input-wrap {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

.city-input-wrap small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 800;
}

.city-input-wrap input {
  background: transparent;
  border: 0;
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
  margin-top: 4px;
  min-width: 0;
  outline: none;
  padding: 0;
  width: 100%;
}

.city-input-wrap input::placeholder {
  color: #95a1b2;
  font-weight: 800;
}

.city-clear {
  background: #eef2f7;
  border: 0;
  border-radius: 50%;
  color: #526171;
  flex: 0 0 auto;
  font-size: 16px;
  font-weight: 900;
  height: 22px;
  line-height: 1;
  width: 22px;
}

.city-suggest {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  box-shadow: 0 22px 50px rgba(24, 35, 57, 0.18);
  left: 8px;
  max-height: 328px;
  overflow: auto;
  padding: 6px;
  position: absolute;
  right: -32px;
  top: calc(100% + 8px);
  z-index: 60;
}

.city-suggest button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #14223a;
  display: flex;
  font-size: 14px;
  font-weight: 800;
  gap: 10px;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}

.city-suggest button:hover {
  background: #f1f6fb;
}

.city-suggest svg {
  color: #10a15e;
  font-size: 18px;
}

.filter-dd {
  display: flex;
  min-width: 0;
  position: relative;
}

.dd-trigger {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  width: 100%;
}

.dd-trigger > span {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.dd-trigger > svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 20px;
  transition: transform 0.15s ease;
}

.filter-dd.open .dd-trigger > svg {
  transform: rotate(180deg);
}

.dd-trigger.has-value strong {
  color: #0b8f52;
}

.filter-pop {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 22px 50px rgba(24, 35, 57, 0.18);
  left: 0;
  min-width: 280px;
  padding: 16px;
  position: absolute;
  top: calc(100% + 8px);
  z-index: 60;
}

.filter-dd:last-of-type .filter-pop {
  left: auto;
  right: 0;
}

.pop-panel {
  display: grid;
  gap: 14px;
}

.pop-presets {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, 1fr);
}

.pop-presets button {
  background: #f4f7fb;
  border: 1px solid #e3e9f0;
  border-radius: 7px;
  color: #14223a;
  font-size: 13px;
  font-weight: 800;
  min-height: 38px;
  padding: 0 10px;
}

.pop-presets button:hover {
  border-color: #10a15e;
}

.pop-presets button.active {
  background: #eaf8ef;
  border-color: #10a15e;
  color: #0b8f52;
}

.pop-range {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
}

.pop-range label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pop-range span {
  color: #526171;
  font-size: 12px;
  font-weight: 800;
}

.pop-range input {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  font-size: 14px;
  font-weight: 800;
  min-height: 40px;
  outline: none;
  padding: 0 12px;
  width: 100%;
}

.pop-range input:focus {
  border-color: #10a15e;
}

.room-choices {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, 1fr);
}

.room-choices button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  font-size: 13px;
  font-weight: 900;
  min-height: 42px;
}

.room-choices button:hover {
  border-color: #10a15e;
}

.room-choices button.active {
  background: #10a15e;
  border-color: #10a15e;
  color: #ffffff;
}

.pop-clear {
  background: transparent;
  border: 0;
  color: #2d63c8;
  font-size: 13px;
  font-weight: 900;
  padding: 4px 0;
  text-align: left;
}

.range-inputs {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr auto 1fr;
}

.range-inputs input {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #14223a;
  font-size: 13px;
  font-weight: 800;
  min-height: 38px;
  outline: none;
  padding: 0 10px;
  width: 100%;
}

.range-inputs input:focus {
  border-color: #10a15e;
}

.range-inputs em {
  color: #95a1b2;
  font-style: normal;
  font-weight: 900;
}

.filter-muted {
  color: #95a1b2;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
}

.room-pills button.active {
  background: #10a15e;
  border-color: #10a15e;
  box-shadow: none;
  color: #ffffff;
}

.results-head .filter-chip {
  background: #eaf2ff;
  border: 0;
  border-radius: 999px;
  color: #2d63c8;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 12px;
}

.results-head .filter-chip:hover {
  background: #d9e7ff;
}

.results-head .clear-chip {
  background: transparent;
  border: 0;
  color: #c0392b;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 8px;
}

.results-empty {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  justify-items: center;
  margin-top: 18px;
  padding: 54px 24px;
  text-align: center;
}

.results-empty svg {
  color: #b6c1d0;
  font-size: 40px;
}

.results-empty strong {
  color: #14223a;
  font-size: 17px;
  font-weight: 950;
}

.results-empty p {
  color: #6b7888;
  font-size: 14px;
  margin: 0;
}

.results-empty button {
  background: #10a15e;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
  margin-top: 6px;
  min-height: 42px;
  padding: 0 22px;
}

/* Mega-panel wyszukiwania (Kup) */
.mega-search {
  position: relative;
}

.mega-bar {
  align-items: stretch;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  box-shadow: 0 16px 40px rgba(24, 35, 57, 0.09);
  display: grid;
  grid-template-columns: minmax(275px, 1.35fr) minmax(245px, 1fr) minmax(170px, 0.88fr) minmax(170px, 0.88fr) minmax(150px, 0.72fr) minmax(230px, 1.1fr) minmax(145px, auto) 132px;
  min-height: 72px;
}

.mega-cell {
  display: flex;
  min-width: 0;
  position: relative;
}

.mega-cell > .mega-field,
.mega-cell > .mega-more {
  flex: 1;
  width: 100%;
}

.mega-field.active,
.mega-more.active {
  background: #f4f7fb;
}

.mega-field {
  align-items: center;
  background: transparent;
  border: 0;
  border-right: 1px solid #e9eef4;
  cursor: pointer;
  display: flex;
  gap: 12px;
  min-width: 0;
  padding: 13px 16px;
  text-align: left;
}

.mega-field > svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 23px;
}

.mega-field > span {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.mega-field small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 800;
}

.mega-field strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mega-field.has-value strong {
  color: #0b8f52;
}

.mega-field > .chevron,
.mega-field > svg:last-child {
  color: #aab4c2;
  font-size: 18px;
}

.mega-clear {
  align-items: center;
  background: #eef2f7;
  border-radius: 50%;
  color: #526171;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 15px;
  font-weight: 900;
  height: 22px;
  justify-content: center;
  width: 22px;
}

.mega-more {
  align-items: center;
  background: transparent;
  border: 0;
  border-right: 1px solid #e9eef4;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 9px;
  padding: 0 16px;
  white-space: nowrap;
}

.mega-more svg {
  color: #526171;
  font-size: 20px;
}

.mega-more.has-value {
  color: #0b8f52;
}

.mega-more em {
  background: #10a15e;
  border-radius: 999px;
  color: #ffffff;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  min-width: 18px;
  padding: 2px 5px;
  text-align: center;
}

.mega-search-btn {
  align-items: center;
  align-self: center;
  background: #10a15e;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 900;
  gap: 10px;
  height: 52px;
  justify-content: center;
  margin: 10px 10px 10px 14px;
  padding: 0 20px;
}

.mega-search-btn svg {
  flex: 0 0 auto;
  height: 18px;
  stroke-width: 2.7;
  width: 18px;
}

.mega-footer {
  border-top: 1px solid #eef2f7;
  display: flex;
  justify-content: flex-end;
  padding: 12px 14px 4px;
}

.mega-clear-all {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  color: #526171;
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  min-height: 40px;
  padding: 0 18px;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.mega-clear-all:hover {
  border-color: #c3ccd8;
  color: #14223a;
}

.mega-panel {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 28px 60px rgba(24, 35, 57, 0.2);
  display: grid;
  gap: 0;
  grid-template-columns: 1fr 1fr 1fr;
  left: 0;
  margin-top: 10px;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 70;
}

.mega-pop {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 28px 60px rgba(24, 35, 57, 0.2);
  left: 0;
  margin-top: 10px;
  position: absolute;
  top: 100%;
  z-index: 70;
}

.mega-pop-location {
  width: 400px;
}

.mega-pop-price {
  width: 360px;
}

.mega-pop-property {
  width: 280px;
}

.mega-pop-rooms,
.mega-pop-market {
  width: 300px;
}

.mega-pop-more {
  width: 640px;
}

.mega-cell-more .mega-pop,
.mega-cell:last-of-type .mega-pop {
  left: auto;
  right: 0;
}

.mega-pop .mega-col {
  border-right: 0;
}

.mega-col {
  border-right: 1px solid #eef2f7;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px;
}

.mega-col:last-child {
  border-right: 0;
}

.mega-col-label {
  color: #8793a3;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.02em;
  margin: 0;
  text-transform: none;
}

.mega-city-search {
  align-items: center;
  background: #f4f7fb;
  border: 1px solid #e3e9f0;
  border-radius: 9px;
  display: flex;
  gap: 10px;
  padding: 11px 14px;
}

.mega-city-search svg {
  color: #8793a3;
  font-size: 20px;
}

.mega-city-search input {
  background: transparent;
  border: 0;
  color: #14223a;
  font-size: 14px;
  font-weight: 700;
  outline: none;
  width: 100%;
}

.mega-suggest {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 340px;
  overflow-y: auto;
}

.mega-suggest button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #2c3a4f;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 11px;
  padding: 10px 12px;
  text-align: left;
}

.mega-suggest button:hover {
  background: #f4f7fb;
}

.mega-suggest button svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 18px;
}

.mega-suggest button span {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.mega-suggest button strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
}

.mega-suggest button small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 700;
  text-transform: capitalize;
}

.mega-city-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mega-city-pills button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 9px 14px;
}

.mega-city-pills button:hover {
  border-color: #10a15e;
}

.mega-city-pills button.active {
  background: #10a15e;
  border-color: #10a15e;
  color: #ffffff;
}

.mega-recent {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mega-recent button {
  align-items: center;
  background: #f7f9fc;
  border: 0;
  border-radius: 8px;
  color: #2c3a4f;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 10px;
  padding: 11px 14px;
  text-align: left;
}

.mega-recent button:hover {
  background: #eef3f9;
}

.mega-recent svg {
  color: #8793a3;
  font-size: 18px;
}

.mega-price-inputs {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
}

.mega-price-inputs label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mega-price-inputs span {
  color: #8793a3;
  font-size: 12px;
  font-weight: 800;
}

.mega-price-inputs input {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #14223a;
  font-size: 16px;
  font-weight: 800;
  min-height: 46px;
  outline: none;
  padding: 0 14px;
  width: 100%;
}

.mega-price-inputs input:focus {
  border-color: #10a15e;
}

.dual-range {
  height: 28px;
  position: relative;
}

.dual-track {
  background: #e1e8f0;
  border-radius: 999px;
  height: 5px;
  left: 0;
  position: absolute;
  right: 0;
  top: 11px;
}

.dual-fill {
  background: #10a15e;
  border-radius: 999px;
  height: 5px;
  position: absolute;
  top: 11px;
}

.dual-range input[type='range'] {
  -webkit-appearance: none;
  appearance: none;
  background: none;
  height: 28px;
  left: 0;
  margin: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
}

.dual-range input[type='range']::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: #10a15e;
  border: 3px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(16, 161, 94, 0.45);
  cursor: pointer;
  height: 22px;
  pointer-events: auto;
  width: 22px;
}

.dual-range input[type='range']::-moz-range-thumb {
  background: #10a15e;
  border: 3px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(16, 161, 94, 0.45);
  cursor: pointer;
  height: 22px;
  pointer-events: auto;
  width: 22px;
}

.mega-price-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mega-price-presets button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 9px 14px;
}

.mega-price-presets button:hover {
  border-color: #10a15e;
}

.mega-price-presets button.active {
  background: #eaf8ef;
  border-color: #10a15e;
  color: #0b8f52;
}

.mega-property-options {
  display: grid;
  gap: 8px;
}

.mega-property-options button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  color: #14223a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 850;
  min-height: 42px;
  padding: 0 14px;
  text-align: left;
}

.mega-property-options button:hover {
  border-color: #10a15e;
}

.mega-property-options button.active {
  background: #eaf8ef;
  border-color: #10a15e;
  color: #0b8f52;
}

.mega-apply {
  background: #10a15e;
  border: 0;
  border-radius: 9px;
  color: #ffffff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 900;
  margin-top: auto;
  min-height: 48px;
}

.mega-more-grid {
  display: grid;
  gap: 14px 16px;
  grid-template-columns: 1fr 1fr;
}

.mega-select {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mega-select span {
  color: #8793a3;
  font-size: 12px;
  font-weight: 800;
}

.mega-select select {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #14223a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  min-height: 44px;
  outline: none;
  padding: 0 12px;
  width: 100%;
}

.mega-select select:focus {
  border-color: #10a15e;
}

.mega-show-all {
  align-items: center;
  align-self: flex-start;
  background: transparent;
  border: 0;
  color: #0b8f52;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 6px;
  margin-top: 4px;
  padding: 0;
}

.mega-show-all svg {
  font-size: 18px;
}

.mega-select .mega-more-input {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #14223a;
  font-size: 13px;
  font-weight: 800;
  min-height: 44px;
  outline: none;
  padding: 0 12px;
  width: 100%;
}

.mega-select .mega-more-input:focus {
  border-color: #10a15e;
}

.mega-rooms-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mega-rooms-choices button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #14223a;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  min-height: 44px;
  min-width: 52px;
  padding: 0 14px;
}

.mega-rooms-choices button:hover {
  border-color: #10a15e;
}

.mega-rooms-choices button.active {
  background: #10a15e;
  border-color: #10a15e;
  color: #ffffff;
}

.mega-market-choices {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mega-check {
  align-items: center;
  border-radius: 8px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 800;
  gap: 12px;
  padding: 11px 12px;
}

.mega-check:hover {
  background: #f4f7fb;
}

.mega-check input {
  accent-color: #10a15e;
  height: 18px;
  width: 18px;
}

.mega-more-actions {
  display: flex;
  gap: 12px;
  margin-top: 4px;
}

.mega-more-actions .mega-apply {
  flex: 1;
  margin-top: 0;
}

.mega-more-scroll {
  display: flex;
  flex-direction: column;
  gap: 22px;
  max-height: 62vh;
  overflow-y: auto;
  padding-right: 4px;
}

.mega-more-section {
  border-bottom: 1px solid #eef2f7;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 20px;
}

.mega-more-section:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.mega-market-row {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}

.mega-market-row .mega-check {
  background: #f7f9fc;
}

.mega-reset {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  color: #526171;
  cursor: pointer;
  font-size: 14px;
  font-weight: 900;
  min-height: 48px;
  padding: 0 20px;
}

.mega-reset:hover {
  border-color: #c3ccd8;
}

.quick-filter-row {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 225px));
  margin-top: 22px;
}

.rent-quick-row {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.quick-filter {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  display: flex;
  gap: 14px;
  min-height: 66px;
  padding: 12px 18px;
  text-align: left;
}

.quick-filter svg {
  color: #13a360;
  font-size: 23px;
}

.quick-filter:first-child svg {
  color: #ff8247;
}

.quick-filter:last-child svg {
  color: #f2a62b;
}

.rent-quick-row .quick-filter:nth-child(3) svg,
.rent-quick-row .quick-filter:nth-child(4) svg {
  color: #546179;
}

.rent-quick-row .quick-filter:nth-child(5) svg {
  color: #263650;
}

.quick-filter strong,
.quick-filter small {
  display: block;
}

.quick-filter strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
}

.quick-filter small {
  color: #657284;
  font-size: 12px;
  font-weight: 800;
  margin-top: 3px;
}

.buy-toolbar {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}

.buy-results-zone {
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0) 32%),
    linear-gradient(180deg, #eef3f7 0%, #f5f8fb 100%);
  border-top: 1px solid #dbe4ed;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
  margin: 34px calc(50% - 50vw) 0;
  padding: 34px max(48px, calc((100vw - 1760px) / 2 + 48px)) 58px;
  position: relative;
}

.buy-results-zone::before {
  background: linear-gradient(90deg, rgba(16, 161, 94, 0), rgba(16, 161, 94, 0.72), rgba(16, 161, 94, 0));
  content: '';
  height: 2px;
  left: max(48px, calc((100vw - 1760px) / 2 + 48px));
  position: absolute;
  right: max(48px, calc((100vw - 1760px) / 2 + 48px));
  top: -1px;
}

.toolbar-actions {
  align-items: center;
  display: flex;
  gap: 24px;
}

.toolbar-actions label {
  align-items: center;
  color: #657284;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 8px;
}

.toolbar-actions select {
  appearance: none;
  background: transparent;
  border: 0;
  color: #14223a;
  font-weight: 950;
  padding-right: 14px;
}

.sort-select {
  align-items: center;
  display: flex;
  gap: 10px;
  position: relative;
}

.sort-label {
  color: #657284;
  font-size: 13px;
  font-weight: 800;
}

.sort-trigger {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 12px;
  justify-content: space-between;
  min-height: 44px;
  min-width: 230px;
  padding: 0 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sort-trigger:hover {
  border-color: #b9c6d6;
}

.sort-select.open .sort-trigger {
  border-color: #10a15e;
  box-shadow: 0 0 0 3px rgba(16, 161, 94, 0.12);
}

.sort-trigger svg {
  color: #8793a3;
  font-size: 18px;
  transition: transform 0.2s ease;
}

.sort-select.open .sort-trigger svg {
  transform: rotate(180deg);
}

.sort-menu {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 11px;
  box-shadow: 0 22px 48px rgba(24, 35, 57, 0.18);
  display: flex;
  flex-direction: column;
  left: auto;
  min-width: 268px;
  padding: 7px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 40;
}

.sort-menu button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #2c3a4f;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 800;
  gap: 12px;
  justify-content: space-between;
  padding: 11px 13px;
  text-align: left;
}

.sort-menu button:hover {
  background: #f4f7fb;
}

.sort-menu button.active {
  color: #10a15e;
  font-weight: 950;
}

.sort-menu button svg {
  color: #10a15e;
  flex: 0 0 auto;
  font-size: 18px;
}

.view-toggle {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  display: flex;
  overflow: hidden;
}

.view-toggle button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #657284;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  min-height: 44px;
  padding: 0 15px;
}

.view-toggle button.active {
  background: #ffffff;
  color: #14223a;
}

.buy-layout {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: 280px minmax(520px, 1fr) 480px;
  margin-top: 32px;
}

.buy-results-zone .buy-layout {
  margin-top: 0;
}

.buy-layout-results {
  grid-template-columns: minmax(520px, 1fr) 480px;
}

.filters-panel,
.result-card,
.map-card,
.map-ai-card {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.filters-panel {
  padding: 18px 18px 22px;
}

.filters-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.filters-head strong {
  color: #14223a;
  font-size: 15px;
  font-weight: 950;
}

.filters-head button,
.results-head button,
.filter-group a {
  background: transparent;
  border: 0;
  color: #3875e8;
  font-size: 12px;
  font-weight: 900;
  padding: 0;
  text-decoration: none;
}

.filter-group {
  border-top: 1px solid #e6ebf1;
  padding: 16px 0;
}

.filter-group:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.filter-group h3 {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
  margin: 0 0 13px;
}

.place-row {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: space-between;
  margin-bottom: 7px;
}

.place-row button {
  background: transparent;
  border: 0;
  color: #7e8ba0;
  font-size: 18px;
  line-height: 1;
  padding: 0;
}

.range-labels {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: space-between;
  margin-bottom: 15px;
}

.range-labels strong {
  color: #14223a;
}

.range-labels.muted strong,
.range-labels.muted span {
  color: #a6b1bf;
}

.range-track {
  background: #10a15e;
  border-radius: 999px;
  height: 5px;
  position: relative;
}

.range-track span {
  background: #10a15e;
  border-radius: 50%;
  height: 13px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 13px;
}

.room-pills {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, 1fr);
}

.room-pills button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 5px;
  color: #14223a;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
}

.room-pills button.selected {
  border-color: #10a15e;
  box-shadow: inset 0 0 0 1px #10a15e;
  color: #0b8f52;
}

.check-row {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 9px;
  margin-top: 12px;
}

.check-row input {
  accent-color: #10a15e;
  height: 16px;
  margin: 0;
  width: 16px;
}

.more-filters {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #14223a;
  display: flex;
  font-size: 13px;
  font-weight: 950;
  gap: 10px;
  justify-content: center;
  min-height: 42px;
  width: 100%;
}

.results-column {
  min-width: 0;
}

.results-head {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  min-height: 44px;
}

.results-head h2 {
  color: #14223a;
  font-size: 16px;
  font-weight: 950;
  margin: 0 14px 0 0;
}

.results-head span {
  background: #eaf2ff;
  border-radius: 999px;
  color: #2d63c8;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 12px;
}

.result-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.result-card {
  display: grid;
  gap: 20px;
  grid-template-columns: 265px minmax(0, 1fr) 178px;
  min-height: 190px;
  overflow: hidden;
  padding: 0 18px 0 0;
}

.result-photo {
  background-size: cover;
  min-height: 190px;
  position: relative;
}

.result-photo.photo-2 {
  background-size: 300%;
}

.result-photo button {
  align-items: center;
  background: rgba(255, 255, 255, 0.9);
  border: 0;
  border-radius: 50%;
  color: #ffffff;
  display: grid;
  font-size: 25px;
  height: 36px;
  place-items: center;
  position: absolute;
  right: 14px;
  top: 14px;
  width: 36px;
}

.result-photo button svg {
  stroke: #ffffff;
  stroke-width: 2.4;
}

.new-photo-badge {
  background: #10a15e;
  border-radius: 4px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 950;
  left: 13px;
  padding: 5px 8px;
  position: absolute;
  top: 13px;
}

.result-info {
  min-width: 0;
  padding: 21px 0 18px;
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.tag-row span {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 950;
  gap: 4px;
  padding: 5px 9px;
}

.tag-row svg {
  font-size: 12px;
}

.hot-tag {
  background: #fff1e8;
  color: #ff6e2f;
}

.green-tag {
  background: #e9f8ef;
  color: #109759;
}

.result-info h3 {
  color: #14223a;
  font-size: 18px;
  line-height: 1.2;
  margin: 0 0 5px;
}

.result-info p,
.result-info small {
  color: #526171;
  display: block;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
}

.result-info small {
  margin-top: 8px;
}

.score-line {
  margin-top: 18px;
}

.score-line span {
  background: #fff7de;
  border-radius: 4px;
  color: #4f6c08;
  font-size: 12px;
  font-weight: 950;
  padding: 5px 8px;
}

.saving {
  color: #0c9556;
  display: block;
  font-size: 13px;
  margin-top: 9px;
}

.amenities-row {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 17px;
}

.amenities-row span {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 850;
  gap: 6px;
}

.amenities-row svg {
  color: #718094;
  font-size: 15px;
}

.result-info em {
  color: #657284;
  display: block;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  margin-top: 14px;
}

.result-side {
  align-items: end;
  display: grid;
  justify-items: end;
  padding: 22px 0 18px;
}

.result-side > strong {
  color: #14223a;
  font-size: 25px;
  font-weight: 950;
}

.result-side span {
  align-self: start;
  color: #657284;
  font-size: 12px;
  font-weight: 800;
  margin-top: 6px;
}

.result-side button, .result-side a {
  align-self: end;
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 950;
  min-height: 44px;
  padding: 0 18px;
}

.rent-side {
  align-content: start;
  gap: 11px;
  grid-template-rows: auto auto;
  padding-top: 23px;
}

.rent-side button {
  align-items: center;
  align-self: start;
  background: transparent;
  border: 0;
  color: #718094;
  display: grid;
  font-size: 22px;
  height: auto;
  min-height: 0;
  padding: 0;
  place-items: center;
}

.rent-side button svg {
  stroke-width: 2.1;
}

.rent-side > strong {
  align-items: baseline;
  display: flex;
  gap: 4px;
  white-space: nowrap;
}

.rent-side > strong small {
  color: #526171;
  font-size: 13px;
  font-weight: 900;
}

.map-column {
  display: grid;
  gap: 18px;
  min-width: 0;
  position: sticky;
  top: 18px;
}

.map-card {
  overflow: hidden;
  padding: 0;
}

.satellite-map {
  background: #dbe5db;
  height: 595px;
  overflow: hidden;
  position: relative;
}

.satellite-map-clickable {
  cursor: pointer;
}

.satellite-tiles {
  height: 640px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 640px;
}

.satellite-tiles img {
  filter: saturate(0.92) contrast(1.02) brightness(1.04);
  height: 256px;
  position: absolute;
  width: 256px;
}

.satellite-map-shade {
  background:
    linear-gradient(180deg, rgba(242, 249, 245, 0.38), rgba(226, 239, 229, 0.22)),
    radial-gradient(circle at 50% 52%, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.44));
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

.map-current,
.draw-area {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(24, 35, 57, 0.11);
  color: #14223a;
  display: flex;
  font-size: 12px;
  font-weight: 950;
  gap: 8px;
  min-height: 38px;
  padding: 0 13px;
  position: absolute;
  top: 18px;
  z-index: 3;
}

.map-current {
  left: 18px;
}

.map-current span {
  background: #10a15e;
  border-radius: 3px;
  height: 14px;
  width: 14px;
}

.draw-area {
  right: 18px;
}

.map-city {
  color: rgba(20, 34, 58, 0.92);
  font-size: 24px;
  font-weight: 950;
  left: 50%;
  position: absolute;
  top: 49%;
  transform: translate(-50%, -50%);
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
  z-index: 3;
}

.map-price {
  background: #ffffff;
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(24, 35, 57, 0.1);
  color: #12a764;
  font-size: 12px;
  font-weight: 950;
  padding: 7px 12px;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 3;
}

.map-price-center-label {
  z-index: 5;
}

.map-center-pin {
  background: #10a15e;
  border: 3px solid rgba(255, 255, 255, 0.96);
  border-radius: 50%;
  box-shadow: 0 10px 20px rgba(18, 34, 58, 0.2);
  height: 22px;
  position: absolute;
  transform: translate(-50%, -50%);
  width: 22px;
  z-index: 4;
}

.map-center-pin::after {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 11px solid #10a15e;
  content: '';
  left: 50%;
  position: absolute;
  top: 100%;
  transform: translateX(-50%);
}

.map-zoom {
  bottom: 18px;
  box-shadow: 0 8px 20px rgba(24, 35, 57, 0.13);
  display: grid;
  position: absolute;
  right: 18px;
  z-index: 3;
}

.map-zoom button {
  background: #ffffff;
  border: 0;
  color: #526171;
  font-size: 22px;
  font-weight: 700;
  height: 42px;
  width: 42px;
}

.map-zoom button + button {
  border-top: 1px solid #dce4ec;
}

.map-attribution {
  background: rgba(255, 255, 255, 0.82);
  border-radius: 4px;
  bottom: 6px;
  color: #526171;
  font-size: 10px;
  font-weight: 800;
  left: 8px;
  padding: 3px 5px;
  position: absolute;
  text-decoration: none;
  z-index: 3;
}

.map-ai-card {
  padding: 24px;
}

.map-ai-card p {
  color: #526171;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.45;
  margin: 14px 0 22px;
}

.map-ai-card button {
  align-items: center;
  background: #14223a;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: flex;
  font-size: 13px;
  font-weight: 950;
  gap: 10px;
  justify-content: center;
  min-height: 48px;
  width: 100%;
}

.guides-page {
  background: linear-gradient(180deg, #f8fafc 0%, #f3f7fb 100%);
  min-height: calc(100vh - 82px);
  padding-bottom: 42px;
}

.guides-container {
  margin: 0 auto;
  max-width: 1760px;
  padding: 0 48px;
}

.guides-hero {
  min-height: 320px;
  overflow: hidden;
  position: relative;
}

.guides-hero img {
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: right center;
  position: absolute;
  width: 100%;
}

.guides-hero-shade {
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0) 74%, #f8fafc 100%),
    linear-gradient(90deg, #f8fafc 0%, rgba(248, 250, 252, 0.98) 34%, rgba(248, 250, 252, 0.62) 56%, rgba(248, 250, 252, 0.08) 92%);
  inset: 0;
  position: absolute;
}

.guides-hero-inner {
  min-height: 320px;
  position: relative;
  z-index: 1;
}

.guides-hero-inner > div {
  max-width: 720px;
  padding-top: 54px;
}

.guides-hero h1 {
  color: #14223a;
  font-size: clamp(44px, 4.3vw, 68px);
  line-height: 0.98;
  margin: 0;
  max-width: 660px;
}

.guides-hero p {
  color: #526171;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.45;
  margin: 18px 0 0;
  max-width: 620px;
}

.guides-search {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  box-shadow: 0 14px 36px rgba(24, 35, 57, 0.08);
  display: grid;
  gap: 12px;
  grid-template-columns: 22px minmax(0, 1fr) 104px;
  margin-top: 28px;
  min-height: 56px;
  padding: 7px 8px 7px 18px;
  width: min(660px, 100%);
}

.guides-search svg {
  color: #718094;
  font-size: 20px;
}

.guides-search input {
  border: 0;
  color: #14223a;
  min-height: 42px;
  outline: none;
  padding: 0;
}

.guides-search input::placeholder {
  color: #9aa5b4;
  font-weight: 800;
}

.guides-search button {
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 950;
  min-height: 42px;
}

.popular-links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 16px;
}

.popular-links span {
  color: #526171;
  font-size: 12px;
  font-weight: 900;
}

.popular-links a {
  color: #316fd8;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}

.guides-layout {
  align-items: start;
  display: grid;
  gap: 34px;
  grid-template-columns: minmax(0, 1fr) 360px;
  margin-top: 22px;
}

.guides-main {
  min-width: 0;
}

.guides-section {
  margin-top: 0;
}

.guides-section + .guides-section {
  margin-top: 34px;
}

.guide-topic-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
}

.guide-topic-head h2,
.quick-guides-card h2,
.related-offers h2 {
  color: #14223a;
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}

.guide-topic-head > div {
  display: flex;
  gap: 8px;
}

.guide-topic-head button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 50%;
  color: #526171;
  display: grid;
  height: 30px;
  place-items: center;
  width: 30px;
}

.guide-topic-head button:first-child svg {
  transform: rotate(90deg);
}

.guide-topic-head button:last-child svg {
  transform: rotate(-90deg);
}

.guide-topic-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.guide-topic-card,
.article-card,
.guide-ai-card,
.quick-guides-card,
.related-offers {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.guide-topic-card {
  display: grid;
  justify-items: center;
  min-height: 172px;
  padding: 22px 14px 18px;
  text-align: center;
}

.guide-topic-icon {
  align-items: center;
  color: #13a360;
  display: grid;
  font-size: 42px;
  height: 52px;
  place-items: center;
}

.guide-topic-icon.percent {
  color: #9b5cff;
}

.guide-topic-icon.key,
.guide-topic-icon.paint {
  color: #ff8247;
}

.guide-topic-icon.chart {
  color: #3f7df1;
}

.guide-topic-icon.scale {
  color: #7867ed;
}

.guide-topic-card h3 {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  line-height: 1.2;
  margin: 12px 0 0;
}

.guide-topic-card p {
  color: #526171;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  margin: 8px 0 0;
}

.guide-topic-card small {
  align-self: end;
  color: #657284;
  font-size: 11px;
  font-weight: 850;
  margin-top: 18px;
}

.article-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.article-card {
  overflow: hidden;
}

.article-image {
  background-size: cover;
  height: 160px;
  position: relative;
}

.article-image::after {
  background: linear-gradient(180deg, rgba(20, 34, 58, 0.1), rgba(20, 34, 58, 0.36));
  content: "";
  inset: 0;
  position: absolute;
}

.article-image span {
  background: #315fc5;
  border-radius: 4px;
  color: #ffffff;
  font-size: 10px;
  font-weight: 950;
  left: 12px;
  padding: 5px 7px;
  position: absolute;
  top: 12px;
  z-index: 1;
}

.article-card:nth-child(2) .article-image span {
  background: #0b9f5c;
}

.article-card:nth-child(3) .article-image span {
  background: #f49a31;
}

.article-card:nth-child(4) .article-image span {
  background: #316fd8;
}

.article-body {
  padding: 18px;
}

.article-body h3 {
  color: #14223a;
  font-size: 17px;
  line-height: 1.25;
  margin: 0;
}

.article-body p {
  color: #526171;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.42;
  margin: 10px 0 18px;
}

.article-body > div {
  align-items: center;
  color: #657284;
  display: flex;
  font-size: 11px;
  font-weight: 850;
  justify-content: space-between;
}

.article-body > div span:last-child {
  align-items: center;
  display: flex;
  gap: 5px;
}

.related-offers {
  background: linear-gradient(90deg, #f8fffb 0%, #eff7f2 100%);
  margin-top: 28px;
  padding: 20px;
}

.related-offers > p {
  color: #526171;
  font-size: 12px;
  font-weight: 800;
  margin: 5px 0 18px;
}

.related-offer-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.related-offer-grid article {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) 92px;
  min-height: 104px;
  overflow: hidden;
  padding: 14px 0 14px 14px;
}

.related-offer-grid h3 {
  color: #14223a;
  font-size: 12px;
  line-height: 1.2;
  margin: 0;
}

.related-offer-grid span {
  color: #526171;
  display: block;
  font-size: 11px;
  font-weight: 850;
  margin-top: 4px;
}

.related-offer-grid a {
  align-items: center;
  color: #0b9f5c;
  display: flex;
  font-size: 11px;
  font-weight: 950;
  gap: 6px;
  margin-top: 18px;
  text-decoration: none;
}

.related-offer-image {
  background-size: cover;
  border-radius: 6px 0 0 6px;
  min-height: 76px;
}

.guides-sidebar {
  display: grid;
  gap: 18px;
  position: sticky;
  top: 18px;
}

.guide-ai-card {
  background: linear-gradient(180deg, #f8fffb 0%, #eef8f3 100%);
  padding: 22px;
}

.guide-ai-card > p {
  color: #526171;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
  margin: 14px 0 16px;
}

.ai-question-box {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 7px;
  padding: 16px;
}

.ai-question-box strong {
  color: #14223a;
  display: block;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.45;
}

.guide-ai-card > button {
  align-items: center;
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: flex;
  font-size: 13px;
  font-weight: 950;
  justify-content: space-between;
  margin-top: 16px;
  min-height: 44px;
  padding: 0 18px;
  width: 100%;
}

.advisor-users {
  align-items: center;
  display: flex;
  gap: 12px;
  margin-top: 14px;
}

.advisor-users .avatar-row span {
  height: 24px;
  width: 24px;
}

.advisor-users small {
  color: #526171;
  font-size: 11px;
  font-weight: 850;
}

.quick-guides-card {
  padding: 22px;
}

.quick-guides-card > div {
  display: grid;
  gap: 2px;
  margin-top: 15px;
}

.quick-guides-card article {
  align-items: center;
  border-bottom: 1px solid #edf1f5;
  display: grid;
  gap: 12px;
  grid-template-columns: 34px minmax(0, 1fr) 18px;
  min-height: 64px;
}

.quick-guides-card article > span {
  align-items: center;
  background: #edf3ff;
  border-radius: 8px;
  color: #3f7df1;
  display: grid;
  font-size: 18px;
  height: 34px;
  place-items: center;
  width: 34px;
}

.quick-guides-card article:nth-child(2) > span {
  background: #f1edff;
  color: #9b5cff;
}

.quick-guides-card article:nth-child(3) > span {
  background: #fff4df;
  color: #f49a31;
}

.quick-guides-card article:nth-child(4) > span {
  background: #e9f8ef;
  color: #10a15e;
}

.quick-guides-card p {
  margin: 0;
}

.quick-guides-card strong {
  color: #14223a;
  display: block;
  font-size: 12px;
  font-weight: 950;
}

.quick-guides-card small {
  color: #526171;
  display: block;
  font-size: 11px;
  font-weight: 750;
  margin-top: 3px;
}

.quick-guides-card article > svg {
  color: #9aa5b4;
  transform: rotate(-90deg);
}

.quick-guides-card > button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #0b9f5c;
  border-radius: 6px;
  color: #0b9f5c;
  display: flex;
  font-size: 12px;
  font-weight: 950;
  gap: 8px;
  justify-content: center;
  margin-top: 18px;
  min-height: 42px;
  width: 100%;
}

.add-page {
  background: linear-gradient(180deg, #f8fafc 0%, #f3f7fb 100%);
  min-height: calc(100vh - 82px);
  padding-bottom: 56px;
}

.add-container {
  margin: 0 auto;
  max-width: 1760px;
  padding: 0 48px;
}

.add-title {
  margin-top: 28px;
}

.add-title h1 {
  color: #14223a;
  font-size: 36px;
  line-height: 1.1;
  margin: 0;
}

.add-title h1 span {
  color: #10a15e;
}

.add-title p {
  color: #526171;
  font-size: 14px;
  font-weight: 750;
  margin: 8px 0 0;
}

.add-progress {
  align-items: center;
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 34px;
  max-width: 1120px;
}

.add-progress div {
  align-items: center;
  color: #657284;
  display: flex;
  font-size: 12px;
  font-weight: 950;
  gap: 10px;
  min-width: 0;
  position: relative;
}

.add-progress div:not(:last-child)::after {
  background: #d9e2ec;
  content: "";
  height: 2px;
  left: calc(100% + 8px);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
}

.add-progress span {
  align-items: center;
  background: #eef3f8;
  border-radius: 50%;
  color: #657284;
  display: grid;
  flex: 0 0 auto;
  height: 28px;
  place-items: center;
  width: 28px;
}

.add-progress .active {
  color: #14223a;
}

.add-progress .active span {
  background: #10a15e;
  color: #ffffff;
}

.add-progress .completed {
  color: #14223a;
}

.add-progress .completed span {
  background: #10a15e;
  color: #ffffff;
}

.add-progress .completed span svg {
  font-size: 13px;
}

.add-layout {
  align-items: start;
  display: grid;
  gap: 30px;
  grid-template-columns: minmax(0, 1fr) 360px;
  margin-top: 30px;
}

.add-form-column {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.add-form-card,
.listing-preview-card,
.add-side-card,
.add-footer-benefits {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.add-form-card {
  padding: 24px;
}

.add-form-card h2,
.listing-preview-card h2,
.add-side-card h2,
.add-footer-benefits h2 {
  color: #14223a;
  font-size: 16px;
  line-height: 1.2;
  margin: 0 0 18px;
}

.add-three-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.add-field {
  display: grid;
  gap: 7px;
  min-width: 0;
  position: relative;
}

.add-field.full {
  margin-top: 18px;
}

.add-field > span,
.add-field label {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
}

.required-star {
  color: #e11d48;
}

.optional-label {
  color: #5f6f83;
}

.add-field input,
.add-field select,
.editor-box textarea {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #14223a;
  min-height: 44px;
  padding: 12px 13px;
  width: 100%;
}

.add-field input::placeholder,
.editor-box textarea::placeholder {
  color: #9aa5b4;
}

.add-field select {
  appearance: none;
  background:
    linear-gradient(45deg, transparent 50%, #7e8ba0 50%) calc(100% - 16px) 19px / 6px 6px no-repeat,
    linear-gradient(135deg, #7e8ba0 50%, transparent 50%) calc(100% - 12px) 19px / 6px 6px no-repeat,
    #ffffff;
  padding-right: 34px;
}

.add-field > small {
  bottom: 11px;
  color: #9aa5b4;
  font-size: 11px;
  font-weight: 800;
  position: absolute;
  right: 12px;
}

.input-with-suffix {
  position: relative;
}

.input-with-suffix em {
  color: #657284;
  font-size: 12px;
  font-style: normal;
  font-weight: 850;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.input-with-suffix input {
  padding-right: 58px;
}

.editor-box {
  border: 1px solid #dce4ec;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
}

.editor-toolbar {
  align-items: center;
  border-bottom: 1px solid #e3e9f0;
  display: flex;
  gap: 4px;
  min-height: 38px;
  padding: 0 9px;
}

.editor-toolbar button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #526171;
  display: grid;
  font-size: 13px;
  font-weight: 950;
  height: 28px;
  place-items: center;
  width: 28px;
}

.editor-box textarea {
  border: 0;
  border-radius: 0;
  min-height: 128px;
  resize: vertical;
}

.editor-box small {
  bottom: 10px;
  color: #9aa5b4;
  font-size: 11px;
  font-weight: 800;
  position: absolute;
  right: 12px;
}

.add-checkbox-grid {
  display: grid;
  gap: 13px 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.add-checkbox-grid label {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
}

.add-checkbox-grid input {
  accent-color: #10a15e;
  height: 15px;
  margin: 0;
  width: 15px;
}

.next-step-button {
  align-items: center;
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: flex;
  font-size: 13px;
  font-weight: 950;
  gap: 10px;
  justify-content: center;
  margin-top: 22px;
  min-height: 46px;
  min-width: 190px;
}

.contact-actions {
  display: flex;
  justify-content: flex-end;
}

.back-step-button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #3f4d60;
  font-size: 13px;
  font-weight: 900;
  min-height: 46px;
  min-width: 130px;
}

.add-location-card {
  padding-bottom: 18px;
}

.add-location-subtitle {
  color: #5f6f83;
  font-size: 12px;
  font-weight: 750;
  margin: -7px 0 18px;
}

.add-location-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.add-location-grid .add-field:nth-child(1) {
  grid-column: 1 / -1;
}

.add-location-grid .add-field:nth-child(2),
.add-location-grid .add-field:nth-child(3) {
  grid-column: span 2;
}

.add-location-grid .add-field:nth-child(4) {
  grid-column: span 2;
}

.add-location-grid .add-field:nth-child(5),
.add-location-grid .add-field:nth-child(6) {
  grid-column: span 1;
}

.add-location-map {
  background:
    linear-gradient(180deg, rgba(230, 239, 247, 0.75) 0%, rgba(237, 244, 250, 0.7) 100%),
    repeating-linear-gradient(0deg, rgba(166, 185, 203, 0.2) 0 1px, transparent 1px 38px),
    repeating-linear-gradient(90deg, rgba(166, 185, 203, 0.22) 0 1px, transparent 1px 40px),
    radial-gradient(circle at 30% 65%, rgba(113, 190, 155, 0.25) 0 24%, transparent 24%),
    radial-gradient(circle at 76% 36%, rgba(121, 199, 232, 0.24) 0 19%, transparent 19%),
    #edf3f8;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  height: 390px;
  margin-top: 16px;
  position: relative;
}

.real-location-map {
  background: #dfe8f0;
  overflow: hidden;
}

.real-location-surface,
.real-location-tiles {
  inset: 0;
  position: absolute;
}

.real-location-surface {
  cursor: grab;
  touch-action: none;
}

.real-location-surface:active {
  cursor: grabbing;
}

.real-location-tiles img {
  height: 256px;
  position: absolute;
  user-select: none;
  width: 256px;
}

.real-location-pin {
  cursor: grab;
  pointer-events: auto;
  position: absolute;
  touch-action: none;
  z-index: 3;
}

.real-location-pin:active {
  cursor: grabbing;
}

.real-location-label {
  pointer-events: none;
  position: absolute;
  white-space: nowrap;
  z-index: 4;
}

.real-location-pin-tool {
  align-items: center;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(20, 34, 58, 0.12);
  color: #14223a;
  cursor: grab;
  display: grid;
  height: 34px;
  place-items: center;
  position: absolute;
  right: 12px;
  top: 86px;
  touch-action: none;
  width: 34px;
  z-index: 5;
}

.real-location-pin-tool:active {
  cursor: grabbing;
}

.real-location-pin-tool svg {
  color: #10a15e;
  font-size: 17px;
}

.real-location-zoom {
  background: #ffffff;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(20, 34, 58, 0.12);
  display: grid;
  overflow: hidden;
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 5;
}

.real-location-zoom button {
  background: #ffffff;
  border: 0;
  color: #14223a;
  font-size: 18px;
  font-weight: 950;
  height: 32px;
  width: 32px;
}

.real-location-zoom button + button {
  border-top: 1px solid #e1e7ef;
}

.real-location-attribution {
  background: rgba(255, 255, 255, 0.9);
  border-radius: 4px;
  bottom: 8px;
  color: #526171;
  font-size: 10px;
  font-weight: 800;
  padding: 3px 6px;
  position: absolute;
  right: 8px;
  text-decoration: none;
  z-index: 5;
}

.add-location-pin {
  align-items: center;
  background: #10a15e;
  border: 3px solid rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  color: #ffffff;
  display: grid;
  font-size: 18px;
  height: 36px;
  left: 54%;
  place-items: center;
  position: absolute;
  top: 49%;
  transform: translate(-50%, -50%);
  width: 36px;
}

.add-location-map-label {
  background: rgba(255, 255, 255, 0.93);
  border: 1px solid #d5dee8;
  border-radius: 999px;
  color: #3a4b60;
  font-size: 11px;
  font-weight: 850;
  left: 54%;
  padding: 4px 9px;
  position: absolute;
  top: calc(49% - 36px);
  transform: translateX(-50%);
}

.add-location-note {
  align-items: center;
  background: #f3fbf7;
  border: 1px solid #d8efe4;
  border-radius: 7px;
  color: #4f637a;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  gap: 8px;
  margin: 14px 0 0;
  min-height: 42px;
  padding: 0 12px;
}

.add-location-note svg {
  color: #10a15e;
  font-size: 15px;
}

.add-location-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 18px;
}

.add-step-title {
  margin-top: 0;
}

.add-step-title h1 {
  font-size: 30px;
}

.add-photos-card {
  padding: 24px;
}

.photo-upload-box {
  align-items: center;
  border: 1px dashed #cbd6e2;
  border-radius: 8px;
  color: #526171;
  cursor: pointer;
  display: grid;
  justify-items: center;
  min-height: 150px;
  padding: 28px 20px;
  text-align: center;
}

.photo-upload-box input {
  display: none;
}

.photo-upload-box svg {
  color: #536981;
  font-size: 28px;
  margin-bottom: 16px;
}

.photo-upload-box strong {
  color: #10a15e;
  font-size: 13px;
  font-weight: 950;
}

.photo-upload-box span {
  color: #536981;
  font-size: 12px;
  font-weight: 750;
  margin-top: 6px;
}

.photo-tip-note {
  align-items: center;
  background: #f3fbf7;
  border: 1px solid #d8efe4;
  border-radius: 7px;
  color: #4f637a;
  display: flex;
  gap: 12px;
  margin: 20px 0 28px;
  min-height: 72px;
  padding: 14px 16px;
}

.photo-tip-note > svg {
  background: #dff7eb;
  border-radius: 999px;
  color: #10a15e;
  flex: 0 0 auto;
  font-size: 34px;
  padding: 8px;
}

.photo-tip-note span,
.photo-tip-note strong,
.photo-tip-note small {
  display: block;
}

.photo-tip-note strong {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
}

.photo-tip-note small {
  color: #526171;
  font-size: 11px;
  font-weight: 750;
  margin-top: 4px;
}

.photo-tour-card {
  background: #f8fbff;
  border: 1px solid #dbe7f3;
  border-radius: 10px;
  margin: 16px 0 22px;
  padding: 14px;
}

.photo-tour-head {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.photo-tour-badge {
  align-items: center;
  background: #e6f1ff;
  border: 1px solid #b8d3f5;
  border-radius: 999px;
  color: #245593;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-content: center;
  min-width: 50px;
  padding: 4px 10px;
}

.photo-tour-head strong,
.photo-tour-head small {
  display: block;
}

.photo-tour-head strong {
  color: #13243d;
  font-size: 13px;
}

.photo-tour-head small {
  color: #5f748a;
  font-size: 12px;
  margin-top: 2px;
}

.photo-tour-input {
  margin-top: 2px;
}

.photo-tour-input small {
  color: #5f748a;
}

.photo-tour-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.photo-tour-provider {
  color: #1f4f88;
  font-size: 12px;
  font-weight: 800;
  margin: 10px 0 0;
}

.photo-tour-error {
  color: #b3261e;
  font-size: 12px;
  font-weight: 800;
  margin: 10px 0 0;
}

.added-photos-head h3 {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  margin: 0 0 16px;
}

.added-photos-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.added-photo {
  aspect-ratio: 1.28;
  background: #f4f7fa;
  border-radius: 8px;
  cursor: grab;
  overflow: hidden;
  position: relative;
}

.added-photo.dragging {
  cursor: grabbing;
  opacity: 0.55;
}

.added-photo.drop-target {
  box-shadow: 0 0 0 3px rgba(16, 161, 94, 0.35);
}

.added-photo img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.main-photo-badge {
  background: #10a15e;
  border-radius: 999px;
  color: #ffffff;
  font-size: 10px;
  font-weight: 950;
  left: 8px;
  padding: 5px 8px;
  position: absolute;
  top: 8px;
}

.remove-photo-button {
  align-items: center;
  background: rgba(255, 255, 255, 0.92);
  border: 0;
  border-radius: 999px;
  color: #536171;
  display: grid;
  font-size: 18px;
  font-weight: 950;
  height: 26px;
  place-items: center;
  position: absolute;
  right: 8px;
  top: 8px;
  width: 26px;
}

.photo-order-controls {
  bottom: 8px;
  display: flex;
  gap: 6px;
  left: 8px;
  position: absolute;
}

.photo-order-controls button {
  align-items: center;
  background: rgba(20, 34, 58, 0.82);
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  display: grid;
  font-size: 20px;
  font-weight: 950;
  height: 28px;
  place-items: center;
  width: 28px;
}

.photo-order-controls button:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

.empty-photos-box {
  align-items: center;
  background: #f8fbfd;
  border: 1px solid #e0e8f0;
  border-radius: 8px;
  color: #526171;
  display: flex;
  gap: 10px;
  min-height: 64px;
  padding: 14px;
}

.empty-photos-box svg {
  color: #10a15e;
  font-size: 22px;
}

.empty-photos-box p {
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
  margin: 0;
}

.sort-photos-button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #3f4d60;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  gap: 8px;
  margin-top: 18px;
  min-height: 42px;
  padding: 0 18px;
}

.photos-actions {
  margin-top: 16px;
}

.photos-actions .next-step-button {
  min-width: 320px;
}

.add-extra-card {
  overflow: hidden;
  padding: 0;
}

.extra-section {
  border-bottom: 1px solid #e6edf3;
  padding: 22px 24px;
}

.extra-section:last-of-type {
  border-bottom: 0;
}

.extra-section h2 {
  margin-bottom: 18px;
}

.extra-details-grid {
  display: grid;
  gap: 18px 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.extra-option-grid {
  display: grid;
  gap: 12px 16px;
}

.media-option-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.amenities-option-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.extra-option-grid label {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #42536a;
  display: flex;
  font-size: 12px;
  font-weight: 850;
  gap: 10px;
  min-height: 42px;
  padding: 0 12px;
}

.extra-option-grid label.selected {
  background: #f1fbf6;
  border-color: #bfead3;
  box-shadow: 0 0 0 2px rgba(16, 161, 94, 0.08);
}

.extra-option-grid input {
  accent-color: #10a15e;
  height: 14px;
  margin: 0;
  width: 14px;
}

.extra-option-grid svg {
  color: #5f7289;
  flex: 0 0 auto;
  font-size: 16px;
}

.extra-option-grid label.selected svg,
.extra-option-grid label.selected input + svg {
  color: #10a15e;
}

.media-billing-panel {
  border-top: 1px solid #e6edf3;
  margin-top: 16px;
  padding-top: 16px;
}

.media-billing-panel h3 {
  color: #2b4058;
  font-size: 14px;
  margin: 0 0 12px;
}

.media-billing-grid {
  display: grid;
  gap: 10px;
}

.media-billing-row {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) 280px;
}

.media-billing-controls {
  display: grid;
  gap: 8px;
}

.media-billing-row span {
  color: #33475f;
  font-size: 13px;
  font-weight: 800;
}

.media-billing-row select {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #22364e;
  font-size: 13px;
  font-weight: 800;
  min-height: 40px;
  padding: 0 12px;
}

.media-billing-row input {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #22364e;
  font-size: 13px;
  font-weight: 800;
  min-height: 38px;
  padding: 0 12px;
}

.amenities-option-grid label.selected span {
  color: #173c2c;
}

.extra-actions {
  margin: 26px 24px 24px;
}

.extra-actions .next-step-button {
  min-width: 300px;
}

.final-preview-layout {
  grid-template-columns: minmax(0, 1fr) 320px;
}

.final-preview-card {
  overflow: hidden;
  padding: 18px;
}

.final-preview-main {
  display: grid;
  gap: 24px;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
}

.final-gallery {
  position: relative;
}

.free-listing-badge {
  background: #10a15e;
  border-radius: 6px 6px 0 0;
  color: #ffffff;
  display: inline-flex;
  font-size: 11px;
  font-weight: 950;
  left: 0;
  padding: 9px 16px;
  position: absolute;
  top: 0;
  z-index: 2;
}

.final-main-photo {
  aspect-ratio: 1.72;
  background-position: center;
  background-size: cover;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}

.final-main-photo::after {
  background: linear-gradient(180deg, rgba(20, 34, 58, 0.05), rgba(20, 34, 58, 0.18));
  content: '';
  inset: 0;
  position: absolute;
}

.final-main-photo button {
  align-items: center;
  background: rgba(255, 255, 255, 0.92);
  border: 0;
  border-radius: 50%;
  color: #2f4056;
  display: grid;
  font-size: 30px;
  font-weight: 850;
  height: 36px;
  place-items: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  z-index: 2;
}

.final-main-photo button:first-of-type {
  left: 18px;
}

.final-main-photo button:last-of-type {
  right: 18px;
}

.final-main-photo span {
  background: rgba(20, 34, 58, 0.82);
  border-radius: 999px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 950;
  padding: 7px 10px;
  position: absolute;
  right: 14px;
  top: 14px;
  z-index: 2;
}

.final-thumbnails {
  display: flex;
  gap: 10px;
  margin-top: 12px;
  overflow-x: auto;
  padding: 3px 3px 6px;
}

.final-thumbnails button {
  aspect-ratio: 1.25;
  background-position: center;
  background-size: cover;
  border: 0;
  border-radius: 7px;
  flex: 0 0 96px;
  opacity: 0.86;
  overflow: hidden;
  position: relative;
}

.final-thumbnails button span {
  background: rgba(18, 34, 58, 0.9);
  border-radius: 999px;
  bottom: 6px;
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  left: 6px;
  line-height: 1;
  padding: 5px 7px;
  position: absolute;
}

.final-thumbnails button.active {
  box-shadow: 0 0 0 3px #10a15e;
  opacity: 1;
}

.final-preview-info h2 {
  color: #14223a;
  font-size: 22px;
  font-weight: 950;
  margin: 0 0 6px;
}

.final-location {
  color: #526171;
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 18px;
}

.final-preview-info > strong {
  color: #10a15e;
  display: block;
  font-size: 26px;
  font-weight: 950;
  margin-bottom: 18px;
}

.final-preview-info > strong small {
  color: #526171;
  font-size: 12px;
  font-weight: 850;
}

.final-rent-deposit {
  color: #3b4e66;
  display: block;
  font-size: 13px;
  font-weight: 850;
  margin: -10px 0 18px;
}

.final-meta-row {
  border-bottom: 1px solid #e4ebf2;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-bottom: 20px;
}

.final-meta-row span {
  color: #405269;
  display: grid;
  font-size: 12px;
  font-weight: 850;
  gap: 5px;
}

.final-meta-row svg {
  color: #5f7289;
  font-size: 17px;
}

.final-meta-row small {
  font-size: 11px;
  font-weight: 800;
}

.final-description-block,
.final-details-block {
  border-bottom: 1px solid #e4ebf2;
  padding: 20px 0;
}

.final-details-block {
  border-bottom: 0;
  padding-bottom: 0;
}

.final-description-block h3,
.final-details-block h3,
.final-features h3 {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  margin: 0 0 12px;
}

.final-description-block p {
  color: #3f4d60;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.55;
  margin: 0;
  white-space: pre-wrap;
}

.final-details-block dl {
  display: grid;
  gap: 10px 28px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.final-details-block div {
  display: grid;
  gap: 4px;
  grid-template-columns: 120px minmax(0, 1fr);
}

.final-details-block dt {
  color: #6a7b91;
  font-size: 11px;
  font-weight: 850;
}

.final-details-block dd {
  color: #24354c;
  font-size: 11px;
  font-weight: 900;
  margin: 0;
}

.final-features {
  border-top: 1px solid #e4ebf2;
  margin-top: 22px;
  padding-top: 20px;
}

.final-features > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
}

.final-features span {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #405269;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
}

.final-features svg {
  color: #5f7289;
  font-size: 15px;
}

.final-actions {
  border-top: 1px solid #e4ebf2;
  margin: 28px -18px -18px;
  padding: 24px 18px;
}

.final-actions .next-step-button {
  min-width: 300px;
}

.final-side-card {
  padding: 22px;
}

.next-list article > span {
  background: #e9f8ef;
  color: #10a15e;
}

.free-publish-card {
  align-items: center;
  background: #f3fbf7;
  border: 1px solid #d8efe4;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 36px minmax(0, 1fr);
  padding: 18px;
}

.free-publish-card > span {
  align-items: center;
  background: #dff7eb;
  border-radius: 50%;
  color: #10a15e;
  display: grid;
  font-size: 18px;
  height: 36px;
  place-items: center;
  width: 36px;
}

.free-publish-card p {
  margin: 0;
}

.free-publish-card strong,
.free-publish-card small {
  display: block;
}

.free-publish-card strong {
  color: #0b9f5c;
  font-size: 13px;
  font-weight: 950;
}

.free-publish-card small {
  color: #526171;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.45;
  margin-top: 4px;
}

.photos-preview-image {
  background-position: 55% 56%;
  background-size: 170%;
  height: 300px;
}

.preview-meta-icons {
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 16px;
}

.preview-meta-icons span {
  align-items: center;
  display: inline-flex;
  gap: 6px;
}

.preview-meta-icons svg {
  color: #536981;
  font-size: 15px;
}

.secure-note {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  margin: 2px 0 0;
}

.secure-note svg {
  color: #10a15e;
  font-size: 17px;
}

.add-sidebar {
  display: grid;
  gap: 18px;
  position: sticky;
  top: 18px;
}

.listing-preview-card,
.add-side-card {
  padding: 18px;
}

.preview-image {
  background-position: 48% 58%;
  background-size: 190%;
  border-radius: 7px;
  height: 210px;
  overflow: hidden;
  position: relative;
}

.preview-image button {
  align-items: center;
  background: rgba(255, 255, 255, 0.85);
  border: 0;
  border-radius: 50%;
  color: #ffffff;
  display: grid;
  font-size: 22px;
  height: 34px;
  place-items: center;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 34px;
}

.preview-image span {
  align-items: center;
  background: rgba(20, 34, 58, 0.78);
  border-radius: 999px;
  bottom: 12px;
  color: #ffffff;
  display: flex;
  font-size: 11px;
  font-weight: 950;
  gap: 5px;
  padding: 6px 9px;
  position: absolute;
  right: 12px;
}

.preview-body {
  padding: 17px 0 13px;
}

.preview-body p {
  color: #14223a;
  font-size: 13px;
  font-weight: 950;
  margin: 0 0 8px;
}

.preview-body strong {
  color: #10a15e;
  display: block;
  font-size: 22px;
  font-weight: 950;
  margin-bottom: 8px;
}

.preview-body strong small {
  color: #526171;
  font-size: 11px;
  font-weight: 850;
}

.preview-rent-deposit {
  color: #3b4e66;
  display: block;
  font-size: 12px;
  font-weight: 850;
  margin: -4px 0 8px;
}

.preview-meta {
  color: #526171;
  display: flex;
  flex-wrap: wrap;
  font-size: 11px;
  font-weight: 850;
  gap: 9px;
  margin-bottom: 9px;
}

.preview-body > span {
  align-items: center;
  color: #526171;
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  gap: 5px;
  margin: 0 11px 8px 0;
}

.preview-description {
  color: #526171 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1.35;
}

.preview-body em {
  background: #e9f8ef;
  border-radius: 999px;
  color: #0b9f5c;
  display: inline-block;
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
  padding: 5px 8px;
}

.preview-button,
.help-card button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #0b9f5c;
  font-size: 12px;
  font-weight: 950;
  min-height: 40px;
  width: 100%;
}

.tips-list {
  display: grid;
  gap: 18px;
}

.tips-list article,
.help-card > div,
.add-footer-benefits article {
  display: grid;
  gap: 12px;
  grid-template-columns: 32px minmax(0, 1fr);
}

.tips-list article > span,
.help-card > div > span,
.add-footer-benefits article > span {
  align-items: center;
  background: #fff4df;
  border-radius: 50%;
  color: #d28b20;
  display: grid;
  font-size: 17px;
  height: 32px;
  place-items: center;
  width: 32px;
}

.tips-list article:nth-child(2) > span,
.add-footer-benefits article:nth-child(2) > span {
  background: #edf3ff;
  color: #3f7df1;
}

.tips-list article:nth-child(3) > span,
.add-footer-benefits article:nth-child(3) > span {
  background: #f6f0dc;
  color: #d39a37;
}

.tips-list article:nth-child(4) > span,
.add-footer-benefits article:nth-child(4) > span {
  background: #e9f8ef;
  color: #10a15e;
}

.tips-list p,
.help-card p,
.add-footer-benefits p {
  margin: 0;
}

.tips-list strong,
.help-card strong,
.add-footer-benefits strong {
  color: #14223a;
  display: block;
  font-size: 12px;
  font-weight: 950;
}

.tips-list small,
.help-card small,
.add-footer-benefits small {
  color: #526171;
  display: block;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  margin-top: 3px;
}

.help-card > p {
  color: #526171;
  font-size: 12px;
  font-weight: 800;
  margin: -4px 0 18px;
}

.help-card > div {
  margin-bottom: 16px;
}

.help-card > div > span {
  background: #e8f8f7;
  color: #209f96;
}

.help-card > div:nth-of-type(2) > span {
  background: #e9f8ef;
  color: #10a15e;
}

.help-card button {
  color: #14223a;
  margin-top: 3px;
}

.add-footer-benefits {
  margin-top: 32px;
  padding: 22px;
}

.add-footer-benefits > div {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 18px;
}

.sell-page {
  background: #f7fafc;
  min-height: calc(100vh - 82px);
  padding-bottom: 34px;
}

.sell-hero {
  min-height: 372px;
  overflow: hidden;
  position: relative;
}

.sell-hero-photo {
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: right center;
  position: absolute;
  width: 100%;
}

.sell-hero-gradient {
  background:
    linear-gradient(180deg, rgba(247, 250, 252, 0) 72%, #f7fafc 100%),
    linear-gradient(90deg, #f8fbfd 0%, rgba(248, 251, 253, 0.99) 38%, rgba(248, 251, 253, 0.66) 58%, rgba(248, 251, 253, 0.05) 88%);
  inset: 0;
  position: absolute;
}

.sell-hero-inner {
  margin: 0 auto;
  max-width: 1760px;
  min-height: 372px;
  padding: 0 48px;
  position: relative;
}

.sell-copy {
  max-width: 580px;
  padding-top: 46px;
  position: relative;
  z-index: 1;
}

.sell-copy h1 {
  color: #14223a;
  font-size: clamp(36px, 3.2vw, 58px);
  line-height: 1.03;
  margin: 0;
}

.sell-copy h1 span {
  color: #10a15e;
  display: block;
}

.sell-copy p {
  color: #526171;
  font-size: 15px;
  font-weight: 800;
  margin: 14px 0 0;
}

.sell-benefit-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 32px;
}

.sell-benefit-row span {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
}

.sell-benefit-row svg {
  color: #10a15e;
  font-size: 16px;
}

.sell-primary {
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: block;
  font-size: 14px;
  font-weight: 950;
  margin-top: 28px;
  min-height: 48px;
  min-width: 240px;
  padding: 0 22px;
}

.sell-copy > small {
  color: #657284;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin: 9px 0 0 42px;
}

.sell-container {
  margin: 0 auto;
  max-width: 1760px;
  padding: 0 48px;
}

.sell-section {
  margin-top: 32px;
}

.sell-section h2,
.sell-info-card h2,
.sell-valuation-card h2,
.sell-channels-card h2,
.sell-feature-strip h2 {
  color: #14223a;
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}

.sell-steps {
  display: grid;
  gap: 38px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 24px;
}

.sell-step {
  display: grid;
  justify-items: center;
  min-width: 0;
  position: relative;
  text-align: center;
}

.sell-step:not(:last-child)::after {
  background: #cfd9e5;
  content: "";
  height: 2px;
  left: calc(50% + 40px);
  position: absolute;
  top: 28px;
  width: calc(100% - 42px);
}

.sell-step > span {
  align-items: center;
  background: #eaf8ef;
  border: 1px solid #c6ecd8;
  border-radius: 50%;
  color: #10a15e;
  display: grid;
  font-size: 25px;
  height: 56px;
  place-items: center;
  width: 56px;
}

.sell-step:nth-child(2) > span,
.sell-step:nth-child(3) > span {
  background: #f2edff;
  border-color: #d9ceff;
  color: #7a61f0;
}

.sell-step:nth-child(4) > span {
  background: #edf6ff;
  border-color: #d5e9ff;
  color: #3b86e8;
}

.sell-step strong {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
  margin-top: 13px;
}

.sell-step p {
  color: #526171;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  margin: 6px 0 0;
  max-width: 150px;
}

.sell-card-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: 1.02fr 1fr 1fr;
  margin-top: 38px;
}

.sell-info-card,
.sell-valuation-card,
.sell-channels-card,
.sell-feature-strip,
.testimonial-card,
.sell-bottom-cta {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.sell-info-card,
.sell-valuation-card,
.sell-channels-card {
  min-height: 276px;
  padding: 22px;
}

.sell-reasons,
.sell-channel-list {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.sell-reasons div,
.sell-channel-list div {
  display: grid;
  gap: 12px;
  grid-template-columns: 28px minmax(0, 1fr);
}

.sell-reasons span,
.sell-channel-list span {
  align-items: center;
  border-radius: 50%;
  display: grid;
  font-size: 17px;
  height: 26px;
  place-items: center;
  width: 26px;
}

.sell-reasons div:nth-child(1) span,
.sell-channel-list div:nth-child(1) span {
  background: #e9f8ef;
  color: #10a15e;
}

.sell-reasons div:nth-child(2) span,
.sell-channel-list div:nth-child(2) span {
  background: #edf3ff;
  color: #3f7df1;
}

.sell-reasons div:nth-child(3) span,
.sell-channel-list div:nth-child(3) span {
  background: #ffeef4;
  color: #f35b8f;
}

.sell-reasons div:nth-child(4) span,
.sell-channel-list div:nth-child(4) span {
  background: #f1edff;
  color: #7867ed;
}

.sell-reasons div:nth-child(5) span,
.sell-channel-list div:nth-child(5) span {
  background: #fff4df;
  color: #d28b20;
}

.sell-reasons p,
.sell-channel-list p {
  margin: 0;
}

.sell-reasons strong,
.sell-channel-list strong {
  color: #14223a;
  display: block;
  font-size: 12px;
  font-weight: 950;
}

.sell-reasons small,
.sell-channel-list small {
  color: #526171;
  display: block;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  margin-top: 2px;
}

.sell-valuation-card > p {
  color: #526171;
  font-size: 11px;
  font-weight: 800;
  margin: 7px 0 17px;
}

.valuation-input {
  border: 1px solid #dce4ec;
  border-radius: 6px;
  color: #9aa5b4;
  font-size: 12px;
  font-weight: 800;
  min-height: 48px;
  padding: 15px 16px;
}

.sell-valuation-card button, .sell-valuation-card a {
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
  margin-top: 12px;
  min-height: 42px;
  width: 100%;
}

.valuation-result {
  background: #f8fbfd;
  border: 1px solid #e2e8ef;
  border-radius: 6px;
  margin-top: 18px;
  min-height: 120px;
  padding: 16px;
  position: relative;
}

.valuation-result span,
.valuation-result small,
.valuation-result em {
  color: #526171;
  display: block;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.valuation-result strong {
  color: #10a15e;
  display: block;
  font-size: 24px;
  font-weight: 950;
  margin-top: 6px;
}

.mini-building {
  bottom: 18px;
  display: flex;
  gap: 5px;
  position: absolute;
  right: 18px;
}

.mini-building span {
  background: #cdeedc;
  border: 2px solid #83d9a9;
  height: 48px;
  width: 28px;
}

.mini-building span:first-child {
  height: 34px;
  margin-top: 14px;
}

.valuation-page {
  background: #f8fbfd;
  color: #14223a;
  min-height: calc(100vh - 82px);
  padding: 28px 0 24px;
}

.valuation-shell {
  margin: 0 auto;
  max-width: 1900px;
  padding: 0 38px;
}

.valuation-breadcrumb {
  display: inline-flex !important;
  margin-bottom: 22px;
}

.valuation-breadcrumb button, .valuation-breadcrumb a {
  background: transparent;
  border: 0;
  color: #768398;
  font-size: 12px;
  font-weight: 800;
  padding: 0;
}

.valuation-breadcrumb button.active, .valuation-breadcrumb a.active {
  color: #14223a;
}

.valuation-title h1 {
  font-size: 36px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  margin: 0;
}

.valuation-title p {
  color: #526171;
  font-size: 15px;
  font-weight: 800;
  margin: 12px 0 0;
}

.valuation-title.result h1 {
  align-items: center;
  display: flex;
  gap: 12px;
}

.valuation-title.result svg {
  background: #0b9f5c;
  border-radius: 50%;
  color: #ffffff;
  font-size: 24px;
  padding: 5px;
}

.valuation-progress {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 30px 0 38px;
}

.valuation-progress button {
  align-items: start;
  background: transparent;
  border: 0;
  color: #7a8798;
  display: grid;
  gap: 9px;
  grid-template-columns: 34px minmax(0, 1fr);
  min-height: 54px;
  min-width: 0;
  padding: 0;
  position: relative;
  text-align: left;
}

.valuation-progress button:not(:last-child)::after {
  background: #dfe7ef;
  content: "";
  height: 1px;
  left: 46px;
  position: absolute;
  right: -20px;
  top: 16px;
}

.valuation-progress button.active:not(:last-child)::after {
  background: #b8e8ce;
}

.valuation-progress.complete button:not(:last-child)::after {
  background: #0b9f5c;
  height: 2px;
}

.valuation-progress span {
  align-items: center;
  background: #e9eef5;
  border-radius: 50%;
  color: #516072;
  display: grid;
  flex: 0 0 34px;
  font-size: 12px;
  font-weight: 950;
  height: 34px;
  place-items: center;
  position: relative;
  z-index: 1;
}

.valuation-progress strong {
  color: inherit;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.2;
  overflow: hidden;
  position: relative;
  text-overflow: ellipsis;
  white-space: normal;
  z-index: 1;
}

.valuation-progress button.active {
  color: #0b9f5c;
}

.valuation-progress button.active span {
  background: #0b9f5c;
  color: #ffffff;
}

.valuation-layout {
  align-items: start;
  display: grid;
  gap: 40px;
  grid-template-columns: minmax(0, 1.25fr) minmax(520px, 700px);
}

.valuation-result-layout {
  align-items: start;
  display: grid;
  gap: 64px;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 560px);
}

.valuation-result-main,
.valuation-result-sidebar {
  display: grid;
  gap: 22px;
}

.valuation-result-hero {
  align-items: center;
  display: grid;
  gap: 36px;
  grid-template-columns: minmax(0, 1fr) 230px;
  min-height: 306px;
  padding: 36px 42px;
}

.valuation-result-hero span,
.valuation-result-hero em,
.valuation-result-hero p {
  color: #526171;
  display: block;
  font-size: 13px;
  font-style: normal;
  font-weight: 850;
  margin: 0;
}

.valuation-result-hero span {
  color: #27364d;
  font-size: 16px;
  font-weight: 950;
}

.valuation-result-hero strong {
  color: #0b9f5c;
  display: block;
  font-size: 46px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  margin: 38px 0 24px;
}

.valuation-result-hero em {
  color: #27364d;
  font-size: 18px;
  font-weight: 950;
}

.valuation-result-hero p {
  line-height: 1.65;
  margin-top: 28px;
  max-width: 900px;
}

.valuation-house-graphic.result {
  height: 180px;
}

.valuation-house-graphic.result span {
  font-size: 72px;
  height: 142px;
  width: 142px;
}

.valuation-house-graphic.result i:first-of-type {
  height: 40px;
  width: 40px;
}

.valuation-house-graphic.result i:last-of-type {
  height: 70px;
  width: 62px;
}

.valuation-result-details {
  padding: 28px 30px;
}

.valuation-result-details h2 {
  color: #27364d;
  font-size: 16px;
  font-weight: 950;
  margin: 0 0 24px;
}

.valuation-result-details > div {
  display: grid;
  gap: 26px 36px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.valuation-result-details article {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: 34px minmax(0, 1fr);
}

.valuation-result-details article > span,
.valuation-next-card button > span {
  align-items: center;
  background: #e7f8ef;
  border-radius: 50%;
  color: #0b9f5c;
  display: grid;
  font-size: 17px;
  height: 34px;
  place-items: center;
  width: 34px;
}

.valuation-result-details p {
  display: grid;
  gap: 4px;
  margin: 0;
}

.valuation-result-details strong {
  color: #526171;
  font-size: 12px;
  font-weight: 850;
}

.valuation-result-details small {
  color: #27364d;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.45;
}

.valuation-result-actions {
  align-items: center;
  border-top: 1px solid #e7edf3;
  display: grid;
  gap: 18px;
  grid-template-columns: auto 1fr auto;
  margin: 28px -30px -8px;
  padding: 22px 30px 0;
}

.valuation-result-actions .valuation-back:first-child svg {
  transform: rotate(180deg);
}

.valuation-result-actions .valuation-back:nth-child(2) {
  justify-self: end;
}

.valuation-result-actions .valuation-back:nth-child(2) {
  gap: 12px;
  min-width: 226px;
}

.valuation-result-actions .valuation-back:nth-child(2) svg {
  flex: 0 0 auto;
  margin-right: 2px;
}

.valuation-summary-card,
.valuation-market-card,
.valuation-next-card,
.valuation-info-card {
  padding: 24px;
}

.valuation-summary-card p {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: 0 0 22px;
}

.valuation-summary-card p span,
.valuation-summary-card small,
.valuation-market-card p,
.valuation-info-card p {
  color: #526171;
  font-size: 12px;
  font-weight: 850;
}

.valuation-market-status {
  background: #f4f8fb;
  border: 1px solid #dfe7ef;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 12px 14px;
}

.valuation-market-status strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
}

.valuation-market-status span {
  color: #526171;
  font-size: 12px;
  font-weight: 850;
}

.valuation-summary-card p strong {
  color: #0b9f5c;
  font-size: 13px;
  font-weight: 950;
}

.valuation-summary-card p:nth-of-type(3) strong,
.valuation-summary-card p:nth-of-type(4) strong {
  color: #27364d;
}

.valuation-market-scale {
  background: #dfe5ec;
  border-radius: 999px;
  height: 8px;
  margin: 16px 0 14px;
  overflow: hidden;
  position: relative;
}

.valuation-market-scale span {
  background: #0b9f5c;
  border-radius: inherit;
  display: block;
  height: 100%;
  position: relative;
  transition: width 0.22s ease;
}

.valuation-market-scale em {
  background: #0b9f5c;
  border-radius: 6px;
  bottom: calc(100% + 8px);
  color: #ffffff;
  font-size: 12px;
  font-style: normal;
  font-weight: 950;
  min-width: 46px;
  padding: 7px 10px;
  position: absolute;
  right: auto;
.valuation-result-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
  text-align: center;
  transform: translateX(-50%);
}

.valuation-market-scale span em {
  left: 100%;
}

.valuation-market-scale.empty em {
  left: 0;
  transform: none;
}

.valuation-market-labels {
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 850;
  justify-content: space-between;
}

.valuation-next-card {
  display: grid;
  gap: 14px;
}

.valuation-next-card h2,
.valuation-info-card h2 {
  margin-bottom: 4px;
}

.valuation-next-card button {
  align-items: center;
  background: transparent;
  border: 0;
  display: grid;
  gap: 14px;
  grid-template-columns: 34px minmax(0, 1fr) 18px;
  padding: 0;
  text-align: left;
}

.valuation-next-card button strong {
  color: #27364d;
  font-size: 12px;
  font-weight: 950;
}

.valuation-next-card button > svg {
  color: #526171;
  transform: rotate(-90deg);
}

.valuation-info-card button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #0b9f5c;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  gap: 8px;
  padding: 18px 0 0;
}

.valuation-form-section h2 {
  font-size: 22px;
  font-weight: 950;
  margin: 0;
}

.valuation-form-section > p {
  color: #657284;
  font-size: 14px;
  font-weight: 800;
  margin: 8px 0 24px;
}

.valuation-form-card,
.valuation-preview-card {
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(24, 35, 57, 0.05);
}

.valuation-form-card {
  padding: 30px 28px 22px;
}

.valuation-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.valuation-field span {
  color: #27364d;
  font-size: 13px;
  font-weight: 900;
}

.valuation-field small {
  color: #7a8798;
  font-size: 12px;
  font-weight: 800;
}

.valuation-field input,
.valuation-field select,
.valuation-input-control {
  background: #ffffff;
  border: 1px solid #d5dee8;
  border-radius: 6px;
  color: #14223a;
  min-height: 52px;
  width: 100%;
}

.valuation-field input,
.valuation-field select {
  font-size: 13px;
  font-weight: 800;
  padding: 0 14px;
}

.valuation-field input::placeholder {
  color: #97a3b2;
}

.valuation-input-control {
  align-items: center;
  display: grid;
  gap: 9px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 0 13px;
}

.valuation-input-control svg {
  color: #7d8a9a;
  font-size: 17px;
}

.valuation-input-control input {
  border: 0;
  min-height: 50px;
  padding: 0;
}

.valuation-location-field {
  position: relative;
}

.valuation-location-suggest {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  box-shadow: 0 22px 50px rgba(24, 35, 57, 0.18);
  left: 0;
  max-height: 330px;
  overflow: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 80;
}

.valuation-location-suggest button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #14223a;
  display: flex;
  font-size: 14px;
  font-weight: 850;
  gap: 10px;
  min-height: 42px;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}

.valuation-location-suggest button:hover {
  background: #f1f6fb;
}

.valuation-location-suggest svg {
  color: #97a3b2;
  flex: 0 0 auto;
  font-size: 18px;
}

.valuation-location-suggest button > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.valuation-location-suggest strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.valuation-location-suggest small {
  color: #7a8798;
  font-size: 12px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: capitalize;
  white-space: nowrap;
}

.valuation-location-suggest p {
  color: #657284;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
  padding: 11px 12px;
}

.valuation-location-spinner {
  animation: map-spin 0.7s linear infinite;
  border: 2px solid #d4dce6;
  border-radius: 50%;
  border-top-color: #10a15e;
  height: 18px;
  pointer-events: none;
  position: absolute;
  right: 16px;
  top: 17px;
  width: 18px;
}

.valuation-input-control.suffix {
  grid-template-columns: minmax(0, 1fr) auto;
}

.valuation-input-control em {
  color: #27364d;
  font-size: 12px;
  font-style: normal;
  font-weight: 950;
}

.valuation-note {
  align-items: center;
  background: linear-gradient(90deg, #f1fbf6 0%, #f7fbfd 100%);
  border: 1px solid #dcefe5;
  border-radius: 6px;
  display: grid;
  gap: 14px;
  grid-template-columns: 38px minmax(0, 1fr);
  margin: 26px 0 28px;
  min-height: 74px;
  padding: 12px 18px;
}

.valuation-note > span {
  align-items: center;
  background: #e1f7eb;
  border-radius: 6px;
  color: #10a15e;
  display: grid;
  font-size: 20px;
  height: 38px;
  place-items: center;
  width: 38px;
}

.valuation-note p {
  display: grid;
  gap: 3px;
  margin: 0;
}

.valuation-note strong {
  font-size: 12px;
  font-weight: 950;
}

.valuation-note small {
  color: #526171;
  font-size: 11px;
  font-weight: 800;
}

.valuation-grid {
  display: grid;
  gap: 24px;
}

.valuation-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.valuation-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.valuation-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.valuation-grid.five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.valuation-details-grid {
  gap: 22px 26px;
}

.valuation-section-title {
  color: #27364d;
  font-size: 13px;
  font-weight: 950;
  margin: 0 0 22px;
}

.valuation-section-title:not(:first-child) {
  border-top: 1px solid #e7edf3;
  margin-top: 32px;
  padding-top: 28px;
}

.valuation-note.compact {
  grid-template-columns: 32px minmax(0, 1fr);
  margin: 24px 0 0;
  min-height: 48px;
  padding: 8px 14px;
}

.valuation-note.compact > span {
  font-size: 16px;
  height: 32px;
  width: 32px;
}

.valuation-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.valuation-toggle button {
  background: #ffffff;
  border: 1px solid #d8e0ea;
  color: #5d697a;
  font-size: 12px;
  font-weight: 900;
  min-height: 42px;
}

.valuation-toggle button:first-child {
  border-radius: 6px 0 0 6px;
}

.valuation-toggle button:last-child {
  border-left: 0;
  border-radius: 0 6px 6px 0;
}

.valuation-toggle button.active {
  border-color: #22bb72;
  color: #0b9f5c;
  position: relative;
  z-index: 1;
}

.valuation-toggle button.active + button {
  border-left-color: #22bb72;
}

.valuation-input-control.wide-suffix {
  grid-template-columns: minmax(0, 1fr) max-content;
}

.valuation-condition-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.valuation-condition-grid button {
  background: #ffffff;
  border: 1px solid #d8e0ea;
  border-radius: 6px;
  color: #526171;
  display: grid;
  gap: 8px;
  min-height: 128px;
  padding: 18px;
  text-align: left;
}

.valuation-condition-grid button.active,
.valuation-amenity-grid button.active {
  background: #f1fbf6;
  border-color: #22bb72;
  color: #0b9f5c;
}

.valuation-condition-grid svg {
  color: #55677a;
  font-size: 22px;
}

.valuation-condition-grid button.active svg,
.valuation-amenity-grid button.active svg {
  color: #0b9f5c;
}

.valuation-condition-grid strong {
  color: #27364d;
  font-size: 12px;
  font-weight: 950;
}

.valuation-condition-grid button.active strong,
.valuation-amenity-grid button.active span {
  color: #0b9f5c;
}

.valuation-condition-grid small {
  color: #526171;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.45;
}

.valuation-amenity-grid {
  display: grid;
  gap: 16px 18px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.valuation-amenity-grid button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d8e0ea;
  border-radius: 6px;
  color: #526171;
  display: grid;
  gap: 10px;
  grid-template-columns: 22px minmax(0, 1fr);
  min-height: 64px;
  padding: 10px 16px;
  text-align: left;
}

.valuation-amenity-grid svg {
  color: #5f7083;
  font-size: 19px;
}

.valuation-amenity-grid span {
  color: #526171;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.25;
  overflow-wrap: anywhere;
  white-space: normal;
}

.legal-grid {
  align-items: end;
}

.valuation-toggle-wide {
  max-width: 240px;
}

.history-page {
  background: #f7fafc;
  min-height: calc(100vh - 82px);
  padding: 26px 0 48px;
}

.history-shell {
  margin: 0 auto;
  max-width: 1740px;
  padding: 0 48px;
}

.history-breadcrumb {
  color: #7a8798;
  display: inline-flex !important;
  padding: 0;
}

.history-breadcrumb button, .history-breadcrumb a {
  background: transparent;
  border: 0;
  color: #7a8798;
  font-size: 12px;
  font-weight: 800;
  padding: 0;
}

.history-breadcrumb button.active, .history-breadcrumb a.active {
  color: #14223a;
}

.history-title {
  margin: 30px 0 30px;
}

.history-title h1 {
  color: #14223a;
  font-size: 36px;
  line-height: 1.1;
  margin: 0 0 12px;
}

.history-title p {
  color: #526171;
  font-size: 15px;
  font-weight: 800;
  margin: 0;
}

.history-filter-panel,
.history-chart-card,
.history-insights-card,
.history-alert-card,
.history-side-card {
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(20, 34, 58, 0.06);
}

.history-filter-panel {
  margin-bottom: 28px;
  padding: 22px 28px;
}

.history-filter-grid {
  align-items: end;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(320px, 1.6fr) minmax(170px, 1fr) minmax(170px, 1fr) minmax(190px, 1fr) 210px;
}

.history-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.history-field > span {
  color: #657284;
  font-size: 11px;
  font-weight: 900;
}

.history-field > div,
.history-field select,
.history-field input {
  background: #ffffff;
  border: 1px solid #d6e0ea;
  border-radius: 6px;
  color: #14223a;
  min-height: 48px;
}

.history-field .history-location-picker {
  border: 0;
  display: block;
  min-height: 48px;
  padding: 0;
  position: relative;
}

.history-location-display {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d6e0ea;
  border-radius: 6px;
  color: #14223a;
  cursor: pointer;
  display: grid;
  gap: 10px;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  min-height: 48px;
  padding: 0 14px;
  text-align: left;
  width: 100%;
}

.history-location-picker.active .history-location-display {
  border-color: #10a15e;
  box-shadow: 0 0 0 3px rgba(16, 161, 94, 0.1);
}

.history-location-display svg {
  color: #8793a3;
  font-size: 18px;
}

.history-location-display span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.history-location-display small {
  color: #8793a3;
  font-size: 11px;
  font-weight: 900;
}

.history-location-display strong {
  color: #14223a;
  font-size: 13px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.history-location-display.empty strong {
  color: #8793a3;
  font-weight: 850;
  line-height: 1.2;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.history-location-pop {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 28px 60px rgba(24, 35, 57, 0.2);
  display: flex;
  flex-direction: column;
  gap: 14px;
  left: 0;
  padding: 22px;
  position: absolute;
  top: calc(100% + 10px);
  width: 400px;
  z-index: 70;
}

.history-location-search {
  align-items: center;
  background: #f4f7fb;
  border: 1px solid #e3e9f0;
  border-radius: 9px;
  display: flex;
  gap: 10px;
  min-height: 46px;
  padding: 0 14px;
}

.history-location-search svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 20px;
}

.history-location-search input {
  background: transparent;
  border: 0;
  color: #14223a;
  font-size: 14px;
  font-weight: 700;
  min-height: 0;
  outline: none;
  padding: 0;
  width: 100%;
}

.history-location-suggest {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 300px;
  overflow-y: auto;
  padding: 0;
}

.history-location-pop {
  top: calc(100% + 10px);
}

.history-location-suggest button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #2c3a4f;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 11px;
  min-height: 0;
  padding: 10px 12px;
  text-align: left;
}

.history-location-suggest button:hover {
  background: #f4f7fb;
}

.history-location-suggest button svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 18px;
}

.history-location-suggest button span {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.history-location-suggest button strong,
.history-location-suggest button small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.history-location-suggest button strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
}

.history-location-suggest button small,
.history-location-suggest p {
  color: #657284;
  font-size: 12px;
  font-weight: 700;
  text-transform: capitalize;
}

.history-location-suggest p {
  margin: 0;
  padding: 12px;
}

.history-field > div {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  padding: 0 14px;
}

.history-field svg {
  color: #6f8197;
  font-size: 17px;
}

.history-field strong {
  font-size: 13px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.history-field select,
.history-field input {
  font-size: 13px;
  font-weight: 900;
  padding: 0 14px;
  width: 100%;
}

.history-field .history-location-pop {
  align-items: stretch;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 28px 60px rgba(24, 35, 57, 0.2);
  display: flex;
  flex-direction: column;
  gap: 14px;
  grid-template-columns: none;
  left: 0;
  padding: 22px;
  position: absolute;
  top: calc(100% + 10px);
  width: 400px;
  z-index: 70;
}

.history-field .history-location-search {
  align-items: center;
  background: #f4f7fb;
  border: 1px solid #e3e9f0;
  border-radius: 9px;
  display: flex;
  gap: 10px;
  grid-template-columns: none;
  min-height: 46px;
  padding: 0 14px;
}

.history-field .history-location-search input {
  background: transparent;
  border: 0;
  font-size: 14px;
  font-weight: 700;
  min-height: 0;
  padding: 0;
}

.history-field .history-location-suggest {
  align-items: stretch;
  border: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  grid-template-columns: none;
  max-height: 300px;
  overflow-y: auto;
  padding: 0;
}

.history-field.compact > div,
.history-dual-input {
  border: 0;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: 48px;
  padding: 0;
}

.history-search {
  align-items: center;
  background: #0aa35f;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  gap: 9px;
  justify-content: center;
  min-height: 48px;
}

.history-popular-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.history-popular-row span {
  color: #657284;
  font-size: 13px;
  font-weight: 900;
}

.history-popular-row button {
  background: #f7fafc;
  border: 1px solid #dbe4ee;
  border-radius: 999px;
  color: #33445d;
  font-size: 12px;
  font-weight: 900;
  min-height: 30px;
  padding: 0 18px;
}

.history-popular-row .history-clear {
  background: transparent;
  border: 0;
  color: #0aa35f;
  margin-left: auto;
  padding: 0;
}

.history-layout {
  align-items: start;
  display: grid;
  gap: 24px;
  grid-template-columns: minmax(0, 1fr) 360px;
}

.history-main-column {
  display: grid;
  gap: 22px;
  min-width: 0;
}

.history-chart-card {
  padding: 28px;
}

.history-chart-head {
  align-items: start;
  display: flex;
  gap: 22px;
  justify-content: space-between;
  margin-bottom: 24px;
}

.history-chart-head h2 {
  align-items: center;
  color: #14223a;
  display: flex;
  gap: 8px;
  font-size: 20px;
  line-height: 1.25;
  margin: 0 0 16px;
}

.history-chart-head h2 svg {
  color: #91a0b2;
  font-size: 15px;
}

.history-chart-head strong {
  color: #0d1b35;
  display: block;
  font-size: 40px;
  font-weight: 950;
  line-height: 1;
  margin-bottom: 9px;
}

.history-chart-head p {
  color: #0aa35f;
  font-size: 15px;
  font-weight: 950;
  margin: 0;
}

.history-chart-head p.negative {
  color: #dc4a3d;
}

.history-chart-head p span {
  color: #526171;
  font-size: 13px;
}

.history-source-note {
  color: #7a8798;
  display: block;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.45;
  max-width: 620px;
  margin-top: 10px;
}

.history-chart-head label {
  align-items: center;
  color: #657284;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 12px;
  white-space: nowrap;
}

.history-chart-head select {
  background: #ffffff;
  border: 1px solid #d6e0ea;
  border-radius: 6px;
  color: #14223a;
  font-size: 13px;
  font-weight: 900;
  min-height: 42px;
  padding: 0 12px;
}

.history-chart-mode {
  align-items: center;
  background: #f1fbf6;
  border: 1px solid #cfead9;
  border-radius: 999px;
  color: #0aa35f;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  justify-content: center;
  min-height: 34px;
  padding: 0 14px;
  white-space: nowrap;
}

.history-chart-wrap {
  min-width: 0;
  outline: none;
  overflow: hidden;
  position: relative;
}

.history-chart-wrap:focus,
.history-chart-wrap:focus-visible,
.history-chart-wrap svg:focus,
.history-chart-wrap svg:focus-visible {
  outline: none;
}

.history-chart-wrap.empty .history-line,
.history-chart-wrap.empty .history-dot,
.history-chart-wrap.empty .history-area,
.history-chart-wrap.empty .history-guide,
.history-chart-wrap.empty .history-tooltip {
  opacity: 0.22;
}

.history-chart-empty {
  align-items: center;
  background: rgba(255, 255, 255, 0.88);
  border: 1px dashed #cfd9e5;
  border-radius: 8px;
  color: #526171;
  display: grid;
  gap: 6px;
  left: 50%;
  max-width: min(360px, calc(100% - 32px));
  padding: 16px 18px;
  position: absolute;
  text-align: center;
  top: 48%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.history-chart-empty strong {
  color: #14223a;
  font-size: 24px;
  font-weight: 950;
  line-height: 1;
}

.history-chart-empty span {
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

.history-chart-wrap svg {
  display: block;
  height: auto;
  overflow: visible;
  width: 100%;
}

.history-chart-wrap line {
  stroke: #e6edf3;
  stroke-width: 1;
}

.history-chart-wrap text {
  fill: #738399;
  font-size: 11px;
  font-weight: 800;
  stroke: none;
}

.history-area {
  fill: url(#historyArea);
  stroke: none;
}

.history-line {
  fill: none;
  stroke: #0aa35f;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 4;
}

.history-dot {
  fill: #ffffff;
  stroke: #0aa35f;
  stroke-width: 3;
  transition: r 0.12s ease, stroke-width 0.12s ease;
}

.history-dot.active {
  filter: drop-shadow(0 4px 10px rgba(10, 163, 95, 0.28));
  stroke-width: 4;
}

.history-guide {
  stroke: #cfd9e5 !important;
  stroke-dasharray: 5 5;
}

.history-tooltip {
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid #dce6ef;
  border-radius: 6px;
  box-shadow: 0 10px 24px rgba(20, 34, 58, 0.14);
  color: #14223a;
  display: grid;
  gap: 4px;
  min-height: 48px;
  padding: 9px 11px;
  pointer-events: none;
  position: relative;
}

.history-tooltip::after {
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid #dce6ef;
  border-right: 1px solid #dce6ef;
  bottom: -5px;
  content: '';
  height: 9px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%) rotate(45deg);
  width: 9px;
}

.history-tooltip span {
  color: #657284;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
}

.history-tooltip strong {
  font-size: 14px;
  font-weight: 950;
  line-height: 1.1;
  white-space: nowrap;
}

.history-months {
  color: #738399;
  display: grid;
  font-size: 11px;
  font-weight: 800;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin-top: -4px;
}

.history-stat-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 22px;
}

.history-stat-grid article {
  border: 1px solid #dfe7ef;
  border-radius: 7px;
  display: grid;
  gap: 7px;
  min-height: 108px;
  padding: 18px;
}

.history-stat-grid article.positive {
  background: #f1fbf6;
  border-color: #cbeedc;
}

.history-stat-grid article.negative {
  background: #fff5f3;
  border-color: #f2d0ca;
}

.history-stat-grid span,
.history-stat-grid small {
  color: #657284;
  font-size: 12px;
  font-weight: 850;
}

.history-stat-grid strong {
  color: #14223a;
  font-size: 20px;
  font-weight: 950;
}

.history-stat-grid .positive strong,
.history-stat-grid .positive small {
  color: #0aa35f;
}

.history-stat-grid .negative strong,
.history-stat-grid .negative small {
  color: #dc4a3d;
}

.history-insights-card {
  padding: 26px 28px;
}

.history-insights-card h2,
.history-side-card h2 {
  color: #14223a;
  font-size: 17px;
  line-height: 1.2;
  margin: 0 0 22px;
}

.history-insights-card > div {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.history-insights-card article {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: 48px minmax(0, 1fr);
}

.history-insights-card article > span,
.history-alert-card > span {
  background: #eaf8ef;
  border-radius: 50%;
  color: #10a15e;
  display: grid;
  font-size: 20px;
  height: 48px;
  place-items: center;
  width: 48px;
}

.history-insights-card article:nth-child(2) > span {
  background: #eef5ff;
  color: #3577d4;
}

.history-insights-card article:nth-child(3) > span {
  background: #f4edff;
  color: #965ee8;
}

.history-insights-card p,
.history-alert-card p {
  margin: 0;
}

.history-insights-card strong,
.history-alert-card strong {
  color: #14223a;
  display: block;
  font-size: 13px;
  font-weight: 950;
  margin-bottom: 5px;
}

.history-insights-card small,
.history-alert-card small {
  color: #526171;
  display: block;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.45;
}

.history-alert-card {
  align-items: center;
  background: #f1fbf6;
  border-color: #d1efdf;
  display: grid;
  gap: 16px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  padding: 18px 24px;
}

.history-alert-feedback {
  align-items: center;
  background: #eaf8ef;
  border: 1px solid #cfead9;
  border-radius: 8px;
  color: #1f5a3e;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  grid-column: 2 / 4;
  justify-self: start;
  margin-top: -6px;
  max-width: 720px;
  padding: 7px 12px;
}

.history-alert-card button,
.history-side-card button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe2d8;
  border-radius: 6px;
  color: #0aa35f;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  gap: 8px;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
}

.history-sidebar {
  display: grid;
  gap: 22px;
  min-width: 0;
}

.history-side-card {
  padding: 24px;
}

.history-side-card.compare > button:not(:last-child) {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  display: flex;
  justify-content: space-between;
  margin: 0;
  min-height: 42px;
  padding: 0 12px;
  width: 100%;
}

.history-side-card.compare > button:not(:last-child).active {
  background: #eaf8ef;
}

.history-side-card.compare span {
  color: #33445d;
  font-size: 13px;
  font-weight: 900;
}

.history-side-card.compare strong {
  align-items: center;
  color: #0aa35f;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  gap: 5px;
}

.history-side-card.compare button,
.history-side-card.recent button {
  color: #14223a;
  margin-top: 18px;
  width: 100%;
}

.history-side-card.recent article {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 12px;
  grid-template-columns: 72px minmax(0, 1fr) 16px;
  margin-bottom: 16px;
}

.history-side-card.recent img {
  aspect-ratio: 1.28;
  border-radius: 6px;
  height: auto;
  object-fit: cover;
  width: 72px;
}

.history-side-card.recent p {
  display: grid;
  gap: 4px;
  margin: 0;
  min-width: 0;
}

.history-side-card.recent strong,
.history-side-card.recent span,
.history-side-card.recent small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.history-side-card.recent strong {
  color: #14223a;
  font-size: 13px;
  font-weight: 950;
}

.history-side-card.recent span {
  color: #526171;
  font-size: 12px;
  font-weight: 800;
}

.history-side-card.recent small {
  align-items: center;
  color: #0aa35f;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 5px;
}

.valuation-subtitle {
  color: #27364d;
  font-size: 15px;
  font-weight: 950;
  margin: 34px 0 22px;
}

.valuation-actions-row {
  align-items: center;
  border-top: 1px solid #e7edf3;
  display: flex;
  justify-content: space-between;
  margin: 32px -28px 0;
  padding: 20px 28px 0;
}

.valuation-back,
.valuation-next {
  align-items: center;
  border-radius: 6px;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
}

.valuation-back {
  background: #ffffff;
  border: 1px solid #d8e0ea;
  color: #27364d;
}

.valuation-next {
  background: #0b9f5c;
  border: 0;
  color: #ffffff;
  gap: 8px;
  min-width: 320px;
}

.valuation-sidebar {
  display: grid;
  gap: 18px;
}

.valuation-preview-card {
  padding: 24px;
}

.valuation-preview-card h2 {
  color: #27364d;
  font-size: 17px;
  font-weight: 950;
  margin: 0 0 18px;
}

.valuation-estimate-box {
  align-items: center;
  background: linear-gradient(110deg, #f7fbfd 0%, #effbf4 100%);
  border: 1px solid #dcefe5;
  border-radius: 6px;
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) 170px;
  min-height: 224px;
  padding: 28px;
}

.valuation-estimate-box span,
.valuation-estimate-box small,
.valuation-estimate-box em,
.valuation-estimate-box p {
  color: #526171;
  display: block;
  font-size: 13px;
  font-style: normal;
  font-weight: 850;
  margin: 0;
}

.valuation-estimate-box strong {
  color: #14223a;
  display: block;
  font-size: 34px;
  font-weight: 950;
  letter-spacing: 4px;
  margin: 22px 0;
}

.valuation-estimate-box strong.valuation-price-range {
  color: #0b9f5c;
  font-size: 30px;
  letter-spacing: 0;
  margin: 18px 0 22px;
}

.valuation-estimate-box strong.valuation-price-range::after {
  content: "";
}

.valuation-estimate-box strong::after {
  color: #0b9f5c;
  content: " zł";
  font-size: 22px;
  letter-spacing: 0;
}

.valuation-estimate-box em {
  color: #14223a;
  font-size: 16px;
  font-weight: 950;
  letter-spacing: 4px;
  margin: 8px 0 12px;
}

.valuation-house-graphic {
  align-items: end;
  display: grid;
  height: 126px;
  justify-items: center;
  position: relative;
}

.valuation-house-graphic span {
  align-items: center;
  border: 2px dashed #6dd19d;
  border-radius: 50%;
  color: #10a15e;
  display: grid;
  font-size: 46px;
  height: 98px;
  place-items: center;
  width: 98px;
}

.valuation-house-graphic i {
  border: 2px solid #61c890;
  bottom: 0;
  display: block;
  position: absolute;
}

.valuation-house-graphic i:first-of-type {
  border-radius: 50%;
  height: 28px;
  left: 4px;
  width: 28px;
}

.valuation-house-graphic i:last-of-type {
  height: 45px;
  right: 2px;
  width: 42px;
}

.valuation-driver-list {
  display: grid;
  gap: 16px;
}

.valuation-driver-list.compact {
  gap: 16px;
}

.valuation-driver-list div,
.valuation-benefit-grid div {
  align-items: start;
  display: grid;
  gap: 13px;
  grid-template-columns: 38px minmax(0, 1fr);
}

.valuation-driver-list span,
.valuation-benefit-grid span,
.valuation-trust-row > span {
  align-items: center;
  background: #e7f8ef;
  border-radius: 50%;
  color: #0b9f5c;
  display: grid;
  font-size: 18px;
  height: 38px;
  place-items: center;
  width: 38px;
}

.valuation-driver-list div:nth-child(2) span {
  background: #e9f2ff;
  color: #3b7eed;
}

.valuation-driver-list div:nth-child(3) span {
  background: #fff3d9;
  color: #d49618;
}

.valuation-driver-list div:nth-child(4) span {
  background: #e8fbf8;
  color: #10a996;
}

.valuation-driver-list div:nth-child(5) span {
  background: #fff0e8;
  color: #ed7d45;
}

.valuation-driver-list p,
.valuation-benefit-grid p,
.valuation-trust-row p {
  display: grid;
  gap: 3px;
  margin: 0;
}

.valuation-driver-list strong,
.valuation-benefit-grid strong,
.valuation-trust-row strong {
  color: #27364d;
  font-size: 13px;
  font-weight: 950;
}

.valuation-driver-list small,
.valuation-benefit-grid small,
.valuation-trust-row small {
  color: #657284;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.valuation-benefit-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.valuation-progress-card > div:first-child {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.valuation-progress-card strong,
.valuation-progress-card span {
  color: #27364d;
  font-size: 12px;
  font-weight: 950;
}

.valuation-progress-bar {
  background: #dfe5ec;
  border-radius: 999px;
  height: 8px;
  margin: 13px 0 28px;
  overflow: hidden;
}

.valuation-progress-bar span {
  background: #0b9f5c;
  border-radius: inherit;
  display: block;
  height: 100%;
  transition: width 0.22s ease;
}

.valuation-check-list {
  display: grid;
  gap: 13px;
}

.valuation-check-list p {
  align-items: center;
  color: #8390a0;
  display: flex;
  font-size: 12px;
  font-weight: 850;
  gap: 9px;
  margin: 0;
}

.valuation-check-list svg {
  border: 1px solid #cad4df;
  border-radius: 50%;
  color: #a6b1bf;
  font-size: 18px;
  padding: 3px;
}

.valuation-check-list p.done {
  color: #0b9f5c;
  font-weight: 950;
}

.valuation-check-list p.done svg {
  background: #0b9f5c;
  border-color: #0b9f5c;
  color: #ffffff;
}

.valuation-trust-row {
  align-items: center;
  background: linear-gradient(90deg, #f1fbf6 0%, #f8fbfd 100%);
  border: 1px solid #dcefe5;
  border-radius: 8px;
  display: grid;
  gap: 14px 16px;
  grid-template-columns: 36px minmax(0, 1fr) 36px minmax(0, 1fr) 36px minmax(0, 1fr);
  margin-top: 42px;
  min-height: 80px;
  padding: 18px 28px;
}

.sell-feature-strip {
  margin-top: 18px;
  padding: 22px;
}

.sell-feature-strip > div {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 20px;
}

.sell-feature-strip article {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: 34px minmax(0, 1fr);
}

.sell-feature-strip article > span {
  align-items: center;
  background: #fff4df;
  border-radius: 50%;
  color: #d28b20;
  display: grid;
  font-size: 19px;
  height: 34px;
  place-items: center;
  width: 34px;
}

.sell-feature-strip article:nth-child(2) > span {
  background: #ffeef4;
  color: #f35b8f;
}

.sell-feature-strip article:nth-child(3) > span {
  background: #f1edff;
  color: #7867ed;
}

.sell-feature-strip article:nth-child(4) > span {
  background: #edf3ff;
  color: #3f7df1;
}

.sell-feature-strip article:nth-child(5) > span {
  background: #e9f8ef;
  color: #10a15e;
}

.sell-feature-strip p {
  margin: 0;
}

.sell-feature-strip strong {
  color: #14223a;
  display: block;
  font-size: 11px;
  font-weight: 950;
}

.sell-feature-strip small {
  color: #526171;
  display: block;
  font-size: 10px;
  font-weight: 750;
  margin-top: 3px;
}

.testimonial-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
}

.testimonial-card {
  min-height: 156px;
  padding: 22px;
  position: relative;
}

.testimonial-head {
  align-items: center;
  display: flex;
  gap: 12px;
}

.testimonial-head > span {
  align-items: center;
  background: #e8d0b3;
  border-radius: 50%;
  color: #14223a;
  display: grid;
  font-weight: 950;
  height: 42px;
  place-items: center;
  width: 42px;
}

.testimonial-head strong,
.testimonial-head small {
  display: block;
}

.testimonial-head strong {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
}

.testimonial-head small {
  color: #10a15e;
  font-size: 11px;
  font-weight: 950;
  margin-top: 2px;
}

.testimonial-card > p {
  color: #14223a;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.45;
  margin: 15px 0 13px;
}

.stars {
  align-items: center;
  color: #f5a400;
  display: flex;
  gap: 3px;
}

.stars svg {
  fill: #f5a400;
  font-size: 13px;
}

.stars span {
  color: #14223a;
  font-size: 12px;
  font-weight: 950;
  margin-left: 6px;
}

.testimonial-nav {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 50%;
  color: #526171;
  display: grid;
  font-size: 24px;
  height: 34px;
  place-items: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
}

.testimonial-nav.prev {
  left: -18px;
}

.testimonial-nav.next {
  right: -18px;
}

.testimonial-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

.testimonial-dots span {
  background: #14223a;
  border-radius: 999px;
  height: 6px;
  opacity: 0.35;
  width: 6px;
}

.testimonial-dots span:first-child {
  opacity: 1;
  width: 18px;
}

.sell-bottom-cta {
  align-items: center;
  background: linear-gradient(90deg, #f8fffb 0%, #effaf4 100%);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 244px;
  margin-top: 26px;
  padding: 18px 22px;
}

.sell-bottom-cta strong,
.sell-bottom-cta span,
.sell-bottom-cta small {
  display: block;
}

.sell-bottom-cta strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
}

.sell-bottom-cta span,
.sell-bottom-cta small {
  color: #526171;
  font-size: 11px;
  font-weight: 800;
  margin-top: 3px;
}

.sell-bottom-cta button, .sell-bottom-cta a {
  background: #0b9f5c;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
  min-height: 42px;
}

.sell-bottom-cta small {
  grid-column: 2;
  margin-top: -8px;
  text-align: center;
}

.services-page {
  background: linear-gradient(180deg, #f8fafc 0%, #f2f6fa 100%);
  min-height: calc(100vh - 82px);
  padding: 0 0 64px;
}

.services-frame {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(520px, 680px);
  margin: 0 auto;
  max-width: 1920px;
  padding: 0 0 0 96px;
}

.services-main {
  min-width: 0;
  padding-right: 22px;
}

.services-hero {
  border-radius: 0;
  min-height: 228px;
  overflow: hidden;
  position: relative;
}

.services-hero img {
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: right center;
  position: absolute;
  width: 100%;
}

.services-hero::after {
  background: linear-gradient(90deg, #f8fafc 0%, rgba(248, 250, 252, 0.98) 42%, rgba(248, 250, 252, 0.42) 74%, rgba(248, 250, 252, 0.08) 100%);
  content: "";
  inset: 0;
  position: absolute;
}

.services-hero-copy {
  max-width: 720px;
  padding: 38px 0 0;
  position: relative;
  z-index: 1;
}

.services-hero h1 {
  color: #14223a;
  font-size: 38px;
  line-height: 1.08;
  margin: 0;
}

.services-hero h1 span {
  color: #10a15e;
}

.services-hero p {
  color: #526171;
  font-size: 15px;
  font-weight: 750;
  line-height: 1.55;
  margin: 17px 0 0;
  max-width: 650px;
}

.services-search {
  align-items: stretch;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  box-shadow: 0 16px 40px rgba(24, 35, 57, 0.08);
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(220px, 0.8fr) 134px;
  min-height: 76px;
  overflow: hidden;
}

.services-search .search-field {
  padding: 17px 24px;
}

.services-search .buy-search-button {
  margin: 12px;
}

.services-section {
  margin-top: 42px;
}

.services-section > h2,
.services-section .section-head h2 {
  color: #14223a;
  font-size: 20px;
  line-height: 1.2;
  margin: 0 0 22px;
}

.service-category-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.service-category-card,
.recommended-company,
.service-panel {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
}

.service-category-card {
  min-height: 168px;
  padding: 23px 22px 20px;
}

.service-icon {
  align-items: center;
  background: #eaf8ef;
  border-radius: 12px;
  color: #13a360;
  display: grid;
  font-size: 25px;
  height: 42px;
  margin-bottom: 17px;
  place-items: center;
  width: 42px;
}

.service-icon.scale {
  background: #f1edff;
  color: #7867ed;
}

.service-icon.paint {
  background: #fff0e7;
  color: #f58244;
}

.service-icon.truck {
  background: #edf3ff;
  color: #4f7cff;
}

.service-icon.sofa {
  background: #fff4df;
  color: #be8433;
}

.service-icon.camera {
  background: #ffeef4;
  color: #f35b8f;
}

.service-icon.city {
  background: #e8f8f7;
  color: #209f96;
}

.service-icon.dots {
  background: #f1f4f8;
  color: #657284;
}

.service-category-card h3,
.recommended-company h3,
.directory-card h3,
.profile-panel h2,
.profile-about h3 {
  color: #14223a;
  margin: 0;
}

.service-category-card h3 {
  font-size: 14px;
  font-weight: 950;
}

.service-category-card p {
  color: #526171;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
  margin: 18px 0;
  min-height: 56px;
}

.service-category-card a {
  align-items: center;
  color: #0b9f5c;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  gap: 7px;
  text-decoration: none;
}

.recommended-company-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.recommended-company {
  display: grid;
  justify-items: center;
  min-height: 195px;
  padding: 18px 18px 17px;
  position: relative;
  text-align: center;
}

.recommended-badge {
  align-items: center;
  background: #e9f8ef;
  border: 1px solid #8be0b4;
  border-radius: 999px;
  color: #0b9f5c;
  display: inline-flex;
  font-size: 10px;
  font-weight: 950;
  gap: 4px;
  justify-self: start;
  padding: 4px 7px;
}

.company-logo {
  align-items: center;
  color: #2e6df2;
  display: grid;
  font-size: 52px;
  height: 58px;
  margin-top: 6px;
  place-items: center;
  width: 72px;
}

.company-logo.hammer {
  color: #101827;
}

.company-logo.letter {
  color: #d39a37;
}

.company-logo.truck {
  color: #111827;
}

.recommended-company h3 {
  font-size: 13px;
  font-weight: 950;
  margin-top: 6px;
}

.recommended-company p,
.directory-card p,
.profile-head p {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 11px;
  font-weight: 950;
  gap: 4px;
  justify-content: center;
  margin: 5px 0;
}

.recommended-company p svg,
.directory-card p svg,
.profile-head p svg {
  color: #f5a400;
  fill: #f5a400;
  font-size: 12px;
}

.recommended-company small,
.recommended-company em {
  color: #526171;
  display: block;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.35;
}

.recommended-company button {
  align-self: end;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 5px;
  color: #0b9f5c;
  font-size: 12px;
  font-weight: 950;
  margin-top: 14px;
  min-height: 34px;
  width: 100%;
}

.service-steps-section {
  margin-bottom: 18px;
}

.service-steps {
  align-items: start;
  display: grid;
  gap: 36px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  position: relative;
}

.service-step {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: 50px minmax(0, 1fr);
  position: relative;
}

.service-step:not(:last-child)::after {
  background: #cfd9e5;
  content: "";
  height: 2px;
  left: calc(100% + 8px);
  position: absolute;
  top: 25px;
  width: 20px;
}

.service-step > span {
  align-items: center;
  background: #eaf8ef;
  border: 1px solid #c6ecd8;
  border-radius: 50%;
  color: #13a360;
  display: grid;
  font-size: 24px;
  height: 50px;
  place-items: center;
  width: 50px;
}

.service-step h3 {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  margin: 0;
}

.service-step p {
  color: #526171;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  margin: 5px 0 0;
}

.services-preview {
  border-left: 1px solid #dce4ec;
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 0 0 0 18px;
}

.service-panel {
  border-radius: 0;
  min-width: 0;
  padding: 30px 36px 28px;
}

.breadcrumb.mini {
  font-size: 11px;
  padding-top: 0;
}

.directory-panel h2 {
  color: #14223a;
  font-size: 24px;
  line-height: 1.15;
  margin: 28px 0 8px;
}

.directory-panel > p {
  color: #526171;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
  margin: 0 0 22px;
}

.service-mini-search {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 92px;
  min-height: 60px;
  overflow: hidden;
}

.service-mini-search .search-field {
  padding: 12px 14px;
}

.service-mini-search .search-field svg {
  font-size: 15px;
}

.service-mini-search .search-field small {
  font-size: 10px;
}

.service-mini-search .search-field strong {
  font-size: 11px;
}

.service-mini-search > button {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-left: 1px solid #e3e9f0;
  color: #14223a;
  display: flex;
  font-size: 11px;
  font-weight: 950;
  gap: 8px;
  justify-content: center;
}

.directory-list {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.directory-card {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  display: grid;
  gap: 16px;
  grid-template-columns: 136px minmax(0, 1fr) 96px 22px;
  min-height: 126px;
  padding: 12px;
}

.directory-photo {
  background-size: 210%;
  border-radius: 6px;
  min-height: 102px;
}

.directory-card h3 {
  font-size: 15px;
  line-height: 1.2;
}

.directory-card p {
  justify-content: flex-start;
}

.directory-card span,
.directory-card small,
.directory-card em {
  color: #526171;
  display: flex;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  gap: 5px;
  margin-top: 7px;
}

.directory-card em {
  color: #0b9f5c;
  font-weight: 900;
}

.directory-card > button {
  align-self: end;
  background: #0b9f5c;
  border: 0;
  border-radius: 5px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 950;
  min-height: 32px;
}

.directory-card > svg {
  color: #657284;
  font-size: 20px;
  justify-self: end;
}

.more-companies {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 5px;
  color: #14223a;
  display: flex;
  font-size: 11px;
  font-weight: 950;
  gap: 6px;
  justify-content: center;
  margin-top: 16px;
  min-height: 34px;
  width: 100%;
}

.profile-panel {
  padding: 0;
  overflow: hidden;
}

.profile-cover {
  background-position: center 58%;
  background-size: cover;
  height: 128px;
  position: relative;
}

.profile-cover::after {
  background: linear-gradient(180deg, rgba(20, 34, 58, 0.05), rgba(20, 34, 58, 0.35));
  content: "";
  inset: 0;
  position: absolute;
}

.profile-head {
  display: grid;
  gap: 18px;
  grid-template-columns: 82px minmax(0, 1fr) 170px;
  padding: 0 28px 20px;
}

.profile-logo {
  align-items: center;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(24, 35, 57, 0.15);
  color: #111827;
  display: grid;
  font-size: 43px;
  height: 82px;
  margin-top: -41px;
  place-items: center;
  position: relative;
  width: 82px;
  z-index: 2;
}

.profile-head h2 {
  font-size: 24px;
  line-height: 1.2;
  margin-top: 20px;
}

.profile-head p {
  justify-content: flex-start;
  margin-top: 6px;
}

.profile-head span {
  color: #526171;
  display: block;
  font-size: 12px;
  font-weight: 750;
  margin-top: 7px;
}

.profile-head > button {
  align-self: start;
  background: #14223a;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
  margin-top: 20px;
  min-height: 42px;
}

.profile-actions {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 28px 22px;
}

.profile-actions button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 5px;
  color: #14223a;
  display: flex;
  font-size: 11px;
  font-weight: 900;
  gap: 7px;
  justify-content: center;
  min-height: 34px;
}

.profile-tabs {
  border-bottom: 1px solid #dce4ec;
  border-top: 1px solid #dce4ec;
  display: flex;
  gap: 24px;
  padding: 0 28px;
}

.profile-tabs button {
  background: transparent;
  border: 0;
  color: #526171;
  font-size: 12px;
  font-weight: 950;
  min-height: 50px;
  padding: 0;
}

.profile-tabs .active {
  color: #14223a;
  position: relative;
}

.profile-tabs .active::after {
  background: #10a15e;
  bottom: 0;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  right: 0;
}

.profile-about {
  padding: 22px 28px 30px;
}

.profile-about h3 {
  font-size: 15px;
}

.profile-about p {
  color: #526171;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.55;
  margin: 12px 0 18px;
}

.profile-stats {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-stats span {
  color: #526171;
  display: grid;
  font-size: 10px;
  font-weight: 850;
  gap: 6px;
  line-height: 1.25;
}

.profile-stats svg {
  color: #0b9f5c;
  font-size: 22px;
}

/* Sprawdź na mapie + strona mapy */
.mega-map-link {
  align-items: center;
  background: #eaf8ef;
  border: 1px solid #bce6cf;
  border-radius: 9px;
  color: #0b8f52;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 10px;
  padding: 12px 14px;
}

.mega-map-link:hover {
  background: #def2e6;
}

.mega-map-link svg {
  font-size: 18px;
}

.mega-map-link span {
  flex: 1;
  text-align: left;
}

.map-search-page {
  background: #eef3f8;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px clamp(16px, 4vw, 48px) 40px;
}

.map-search-bar {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(24, 35, 57, 0.09);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 14px;
}

.map-back {
  align-items: center;
  background: #f4f7fb;
  border: 0;
  border-radius: 9px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 6px;
  min-height: 46px;
  padding: 0 16px;
}

.map-back svg {
  font-size: 18px;
  transform: rotate(90deg);
}

.map-back:hover {
  background: #e9eff6;
}

.map-field {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  display: flex;
  gap: 8px;
  min-height: 46px;
  padding: 0 12px;
  position: relative;
}

.map-field svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 18px;
}

.map-field input,
.map-field select {
  background: transparent;
  border: 0;
  color: #14223a;
  font-size: 13px;
  font-weight: 800;
  outline: none;
  width: 100%;
}

.map-field select {
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238793a3' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
  background-position: right 2px center;
  background-repeat: no-repeat;
  background-size: 16px;
  cursor: pointer;
  padding-right: 22px;
  user-select: none;
}

.map-field select:focus,
.map-field input:focus {
  outline: none;
}

.map-field:focus-within {
  border-color: #10a15e;
}

.map-field-city {
  flex: 1;
  min-width: 220px;
}

.map-field-num {
  width: 118px;
}

.map-field-select {
  min-width: 170px;
}

.map-field-select select {
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-suggest {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 10px;
  box-shadow: 0 18px 40px rgba(24, 35, 57, 0.18);
  display: flex;
  flex-direction: column;
  left: 0;
  max-height: 360px;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
}

.map-suggest button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #2c3a4f;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 11px;
  padding: 10px 12px;
  text-align: left;
}

.map-suggest button:hover {
  background: #f4f7fb;
}

.map-suggest button svg {
  color: #8793a3;
  flex: 0 0 auto;
  font-size: 17px;
}

.map-suggest button span {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.map-suggest button strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
}

.map-suggest button small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 700;
  text-transform: capitalize;
}

.map-suggest-empty {
  color: #8793a3;
  font-size: 13px;
  font-weight: 700;
  margin: 0;
  padding: 12px;
}

.map-suggest-spinner {
  animation: map-spin 0.7s linear infinite;
  border: 2px solid #d4dce6;
  border-radius: 50%;
  border-top-color: #10a15e;
  flex: 0 0 auto;
  height: 16px;
  width: 16px;
}

@keyframes map-spin {
  to {
    transform: rotate(360deg);
  }
}

.map-search-btn {
  align-items: center;
  background: #10a15e;
  border: 0;
  border-radius: 9px;
  color: #ffffff;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  min-height: 46px;
  padding: 0 22px;
}

.map-search-btn svg {
  font-size: 18px;
}

.map-reset-btn {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  color: #526171;
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  min-height: 46px;
  padding: 0 18px;
}

.map-reset-btn:hover {
  border-color: #c3ccd8;
}

.map-city-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.map-city-chips button {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 999px;
  color: #14223a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 8px 16px;
}

.map-city-chips button:hover {
  border-color: #10a15e;
}

.map-city-chips button.active {
  background: #10a15e;
  border-color: #10a15e;
  color: #ffffff;
}

.map-stage {
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(24, 35, 57, 0.14);
  overflow: hidden;
  position: relative;
}

.map-count {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 999px;
  box-shadow: 0 6px 18px rgba(24, 35, 57, 0.16);
  color: #14223a;
  font-size: 13px;
  font-weight: 800;
  left: 16px;
  padding: 9px 16px;
  position: absolute;
  top: 16px;
  z-index: 20;
}

.map-count strong {
  color: #0b8f52;
  font-weight: 950;
}

.imap {
  background: #d8e2ec;
  height: clamp(460px, 64vh, 720px);
  position: relative;
  width: 100%;
}

.imap-surface {
  cursor: grab;
  height: 100%;
  overflow: hidden;
  position: absolute;
  inset: 0;
  touch-action: none;
}

.imap-surface:active {
  cursor: grabbing;
}

.imap-tiles img {
  position: absolute;
  user-select: none;
  -webkit-user-drag: none;
}

.imap-labels {
  pointer-events: none;
}

.imap-marker {
  background: #10a15e;
  border: 2px solid #ffffff;
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(15, 60, 38, 0.4);
  color: #ffffff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  padding: 6px 12px;
  position: absolute;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  z-index: 10;
}

.imap-marker:hover {
  background: #0b8f52;
  z-index: 15;
}

.imap-marker.active {
  background: #14223a;
  transform: translate(-50%, -50%) scale(1.08);
  z-index: 16;
}

.imap-zoom {
  bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: absolute;
  right: 16px;
  z-index: 20;
}

.imap-zoom button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 9px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 20px;
  font-weight: 900;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.imap-zoom button:hover {
  background: #f4f7fb;
}

.map-offer-card {
  background: #ffffff;
  border-radius: 16px;
  bottom: 18px;
  box-shadow: 0 26px 60px rgba(24, 35, 57, 0.32);
  display: flex;
  flex-direction: column;
  left: 16px;
  overflow: hidden;
  position: absolute;
  width: 320px;
  z-index: 25;
}

.map-offer-close {
  align-items: center;
  background: rgba(20, 34, 58, 0.55);
  backdrop-filter: blur(4px);
  border: 0;
  border-radius: 50%;
  color: #ffffff;
  cursor: pointer;
  display: flex;
  font-size: 16px;
  font-weight: 900;
  height: 30px;
  justify-content: center;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 30px;
  z-index: 2;
}

.map-offer-close:hover {
  background: rgba(20, 34, 58, 0.8);
}

.map-offer-photo {
  background-position: center;
  background-size: cover;
  height: 150px;
  position: relative;
  width: 100%;
}

.map-offer-photo::after {
  background: linear-gradient(180deg, rgba(20, 34, 58, 0) 55%, rgba(20, 34, 58, 0.18) 100%);
  content: '';
  inset: 0;
  position: absolute;
}

.map-offer-body {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 16px 18px 18px;
}

.map-offer-body strong {
  color: #0b8f52;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -0.01em;
}

.map-offer-body h3 {
  color: #14223a;
  font-size: 15px;
  margin: 4px 0 0;
}

.map-offer-body p {
  color: #526171;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  margin: 0;
}

.map-offer-body small {
  color: #8793a3;
  font-size: 12px;
  font-weight: 750;
}

.map-offer-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.map-offer-tags span {
  background: #eaf8ef;
  border-radius: 7px;
  color: #0b8f52;
  font-size: 11px;
  font-weight: 850;
  padding: 5px 10px;
}

.district-ranking-page {
  background: #f7fafc;
  border-top: 1px solid #e6edf3;
  min-height: calc(100vh - 82px);
  padding: 26px 0 24px;
}

.district-ranking-shell {
  margin: 0 auto;
  max-width: 1780px;
  padding: 0 44px;
}

.district-breadcrumb {
  align-items: center;
  color: #768398;
  display: inline-flex !important;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  margin-bottom: 24px;
}

.district-breadcrumb button, .district-breadcrumb a {
  background: transparent;
  border: 0;
  color: #768398;
  font-size: 12px;
  font-weight: 800;
  padding: 0;
}

.district-breadcrumb button.active, .district-breadcrumb a.active {
  color: #14223a;
}

.district-breadcrumb svg {
  font-size: 14px;
  transform: rotate(-90deg);
}

.district-breadcrumb strong {
  color: #526171;
}

.district-ranking-title {
  margin-bottom: 28px;
}

.district-ranking-title h1 {
  color: #14223a;
  font-size: 34px;
  line-height: 1.1;
  margin: 0;
}

.district-ranking-title p {
  color: #526171;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
  margin: 11px 0 0;
}

.district-filter-card {
  align-items: end;
  background: #ffffff;
  border: 1px solid #e2e8ef;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(20, 34, 58, 0.04);
  display: grid;
  gap: 20px;
  grid-template-columns: 1.05fr 1fr 1.05fr 1.05fr 1fr auto;
  margin-bottom: 26px;
  padding: 22px 20px;
}

.district-filter-card label {
  border-right: 1px solid #dfe7ef;
  display: grid;
  gap: 7px;
  padding-right: 20px;
}

.district-filter-card label:nth-of-type(5) {
  border-right: 0;
}

.district-filter-card span {
  color: #657284;
  font-size: 11px;
  font-weight: 900;
}

.district-filter-card select {
  appearance: none;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #14223a;
  font-size: 13px;
  font-weight: 900;
  min-height: 44px;
  padding: 0 36px 0 14px;
}

.district-filter-card button,
.district-methodology button {
  align-items: center;
  background: #0aa35f;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  gap: 8px;
  justify-content: center;
  min-height: 48px;
  padding: 0 25px;
  white-space: nowrap;
}

.district-ranking-tabs {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 22px;
  max-width: 940px;
}

.district-ranking-tabs button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 7px;
  color: #14223a;
  display: grid;
  gap: 2px 12px;
  grid-template-columns: 32px minmax(0, 1fr);
  min-height: 64px;
  padding: 12px 16px;
  text-align: left;
}

.district-ranking-tabs button.active {
  background: #f3fff8;
  border-color: #0aa35f;
  color: #0a8f54;
}

.district-ranking-tabs svg {
  font-size: 24px;
  grid-row: span 2;
}

.district-ranking-tabs strong {
  font-size: 12px;
  font-weight: 950;
}

.district-ranking-tabs span {
  color: #657284;
  font-size: 10px;
  font-weight: 850;
}

.district-ranking-layout {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 560px);
}

.district-ranking-table-card,
.district-side-card {
  background: #ffffff;
  border: 1px solid #e2e8ef;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(20, 34, 58, 0.035);
}

.district-ranking-table-card {
  min-width: 0;
  padding: 28px 28px 22px;
}

.district-ranking-table-card h2,
.district-side-card h2 {
  color: #14223a;
  font-size: 16px;
  line-height: 1.2;
  margin: 0 0 22px;
}

.district-table-wrap {
  min-width: 0;
  overflow-x: auto;
}

.district-table-wrap table {
  border-collapse: collapse;
  min-width: 980px;
  width: 100%;
}

.district-table-wrap tbody tr {
  border-bottom: 1px solid #e8eef4;
}

.district-table-wrap tbody tr:last-child {
  border-bottom: none;
}

.district-table-wrap th {
  border-bottom: 1px solid #e5edf4;
  color: #8390a3;
  font-size: 11px;
  font-weight: 950;
  padding: 0 12px 14px;
  text-align: left;
}

.district-table-wrap td {
  color: #526171;
  font-size: 12px;
  font-weight: 850;
  padding: 16px 12px;
  vertical-align: middle;
}

.district-table-wrap td strong {
  color: #14223a;
  display: block;
  font-size: 13px;
  font-weight: 950;
}

.district-table-wrap td small {
  color: #7a8798;
  display: block;
  font-size: 10px;
  font-weight: 800;
  margin-top: 3px;
}

.district-rank-number {
  align-items: center;
  background: #eef3f8;
  border-radius: 999px;
  color: #14223a;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  height: 26px;
  justify-content: center;
  width: 26px;
}

.district-rank-number.top-1 {
  background: #ffbf29;
  color: #ffffff;
}

.district-rank-number.top-2 {
  background: #dce5ee;
  color: #526171;
}

.district-rank-number.top-3 {
  background: #ffb486;
  color: #ffffff;
}

.district-change,
.district-rating,
.district-rating-list em {
  align-items: center;
  color: #0aa35f;
  display: inline-flex;
  font-weight: 950;
  gap: 5px;
}

.district-change-cell {
  white-space: nowrap;
}

.district-change {
  line-height: 1;
  vertical-align: middle;
}

.district-change svg,
.district-rating svg,
.district-rating-list svg {
  fill: currentColor;
  font-size: 13px;
  stroke-width: 2.1;
}

.district-popularity {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 130px;
  position: relative;
}

.district-popularity em {
  color: #14223a;
  font-style: normal;
  min-width: 52px;
}

.district-popularity::after {
  background: #e2e8ef;
  border-radius: 999px;
  content: '';
  height: 6px;
  width: 82px;
}

.district-popularity i {
  background: #0aa35f;
  border-radius: 999px;
  height: 6px;
  left: 64px;
  max-width: 82px;
  position: absolute;
  width: 60px;
}

.district-score {
  background: #effcf5;
  border: 1px solid #bdebd2;
  border-radius: 6px;
  color: #0a8f54;
  display: inline-flex;
  font-weight: 950;
  padding: 6px 10px;
}

.district-show-all,
.district-side-card button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 6px;
  color: #14223a;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  gap: 7px;
  justify-content: center;
  min-height: 40px;
}

.district-show-all {
  margin: 22px auto 0;
  max-width: 480px;
  width: 100%;
}

.district-ranking-side {
  display: grid;
  gap: 28px;
  min-width: 0;
}

.district-side-card {
  padding: 24px;
}

.district-rating-list {
  display: grid;
  gap: 14px;
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
}

.district-rating-list li {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: 26px minmax(0, 1fr) auto;
}

.district-rating-list li > span {
  align-items: center;
  background: #e8eef5;
  border-radius: 999px;
  color: #355072;
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  height: 24px;
  justify-content: center;
  width: 24px;
}

.district-rating-list li:nth-child(1) > span {
  background: #ffbf29;
  color: #ffffff;
}

.district-rating-list li:nth-child(2) > span {
  background: #dce5ee;
  color: #526171;
}

.district-rating-list li:nth-child(3) > span {
  background: #ffb486;
  color: #ffffff;
}

.district-rating-list li:nth-child(4) > span {
  background: #e6f4ff;
  border: 1px solid #bfdfff;
  color: #1f5f99;
}

.district-rating-list li:nth-child(5) > span {
  background: #e6f4ff;
  border: 1px solid #bfdfff;
  color: #1f5f99;
}

.district-rating-list strong {
  color: #526171;
  font-size: 13px;
  font-weight: 900;
}

.district-rating-list em {
  font-size: 13px;
  font-style: normal;
}

.district-side-card > button {
  width: 100%;
}

.district-map {
  border: 1px solid #dfe7ef;
  border-radius: 10px;
  height: 392px;
  overflow: hidden;
  position: relative;
}

.district-map .imap {
  height: 100%;
}

.district-map .imap-marker {
  align-items: center;
  background: #10a15e;
  border: 2px solid #ffffff;
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(14, 64, 40, 0.35);
  display: inline-flex;
  font-size: 12px;
  font-weight: 950;
  height: 34px;
  justify-content: center;
  min-width: 34px;
  padding: 0;
}

.district-map .imap-marker.rank-1 {
  background: #ffbf29;
  border-color: #fff7dc;
  color: #ffffff;
}

.district-map .imap-marker.rank-2 {
  background: #dce5ee;
  border-color: #f7fbff;
  color: #355072;
}

.district-map .imap-marker.rank-3 {
  background: #ffb486;
  border-color: #fff1e6;
  color: #ffffff;
}

.district-methodology {
  align-items: center;
  background: linear-gradient(90deg, #effcf5, #ffffff);
  border: 1px solid #d8eee3;
  border-radius: 8px;
  display: grid;
  gap: 18px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  margin-top: 26px;
  padding: 22px 26px;
}

.district-methodology > span {
  align-items: center;
  background: #dff8eb;
  border-radius: 999px;
  color: #0aa35f;
  display: inline-flex;
  font-size: 27px;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.district-methodology p {
  display: grid;
  gap: 4px;
  margin: 0;
}

.district-methodology strong {
  color: #14223a;
  font-size: 13px;
  font-weight: 950;
}

.district-methodology small {
  color: #657284;
  font-size: 12px;
  font-weight: 800;
}

.district-methodology button {
  background: #ffffff;
  border: 1px solid #0aa35f;
  color: #0a8f54;
}

.negotiation-page {
  background: #f7fafc;
  border-top: 1px solid #e6edf3;
  min-height: calc(100vh - 82px);
  padding: 24px 0 30px;
}

.negotiation-shell {
  margin: 0 auto;
  max-width: 1780px;
  padding: 0 44px;
}

.negotiation-breadcrumb {
  align-items: center;
  color: #768398;
  display: inline-flex !important;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  margin-bottom: 18px;
}

.negotiation-breadcrumb button, .negotiation-breadcrumb a {
  background: transparent;
  border: 0;
  color: #768398;
  font-size: 12px;
  font-weight: 800;
  padding: 0;
}

.negotiation-breadcrumb button.active, .negotiation-breadcrumb a.active {
  color: #14223a;
}

.negotiation-breadcrumb svg {
  font-size: 14px;
  transform: rotate(-90deg);
}

.valuation-breadcrumb svg {
  font-size: 12px;
  transform: rotate(-90deg);
}

.negotiation-breadcrumb strong {
  color: #526171;
}

.negotiation-title {
  margin-bottom: 18px;
}

.negotiation-title h1 {
  color: #14223a;
  font-size: 42px;
  margin: 0;
}

.negotiation-title p {
  color: #657284;
  font-size: 14px;
  font-weight: 750;
  margin: 8px 0 0;
}

.negotiation-picker {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 250px minmax(0, 1fr);
  margin-bottom: 14px;
}

.negotiation-picker label {
  color: #334355;
  font-size: 13px;
  font-weight: 900;
}

.negotiation-picker select {
  background: #ffffff;
  border: 1px solid #d8e3ee;
  border-radius: 8px;
  color: #26364b;
  font-size: 13px;
  font-weight: 750;
  min-height: 40px;
  padding: 0 12px;
}

.negotiation-picker select:focus {
  border-color: #0fa861;
  box-shadow: 0 0 0 3px rgba(15, 168, 97, 0.18);
  outline: 0;
}

.negotiation-layout {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) 370px;
}

.negotiation-main,
.negotiation-side {
  display: grid;
  gap: 14px;
}

.negotiation-card {
  background: #ffffff;
  border: 1px solid #e3eaf1;
  border-radius: 10px;
  padding: 18px;
}

.negotiation-offer {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: 190px minmax(0, 1fr) 220px;
}

.negotiation-offer-photo {
  background-position: center;
  background-size: cover;
  border-radius: 8px;
  height: 108px;
}

.negotiation-offer-body h2 {
  color: #14223a;
  font-size: 28px;
  margin: 0;
}

.negotiation-offer-body p {
  color: #526171;
  font-size: 14px;
  margin: 4px 0;
}

.negotiation-offer-body small {
  color: #7b889a;
  font-size: 12px;
  font-weight: 800;
}

.negotiation-price {
  text-align: right;
}

.negotiation-price span,
.negotiation-price em {
  color: #6f7d90;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.negotiation-price strong {
  color: #14223a;
  display: block;
  font-size: 38px;
  margin: 6px 0;
}

.negotiation-range p {
  color: #334355;
  font-size: 13px;
  font-weight: 900;
  margin: 0;
}

.negotiation-range-head > div > small {
  color: #657284;
  display: block;
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 8px;
}

.negotiation-range-head {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) 230px;
}

.negotiation-range h3 {
  color: #0a9e58;
  font-size: 50px;
  margin: 6px 0 4px;
}

.negotiation-range > small {
  color: #657284;
  display: block;
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 12px;
}

.negotiation-range-badge {
  background: #e9f7ef;
  border-radius: 5px;
  color: #0b8f52;
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  line-height: 1.2;
  margin-top: 0;
  padding: 6px 10px;
}

.negotiation-chance {
  --chance-color: #10a15e;
  --needle-rotation: -31deg;
  background: #ffffff;
  border: 1px solid #e4ebf2;
  border-radius: 8px;
  display: grid;
  gap: 2px 10px;
  grid-template-columns: minmax(0, 1fr) 58px;
  min-height: 106px;
  padding: 12px 14px;
}

.negotiation-chance span,
.negotiation-chance small {
  color: #6e7b90;
  display: block;
  font-size: 11px;
  font-weight: 850;
}

.negotiation-chance strong {
  color: var(--chance-color);
  display: block;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -0.01em;
  line-height: 1.05;
  margin: 0;
}

.negotiation-gauge {
  align-self: start;
  height: 38px;
  justify-self: end;
  margin-top: 8px;
  position: relative;
  width: 54px;
}

.negotiation-gauge::before {
  border: 4px solid var(--chance-color);
  border-bottom: 0;
  border-radius: 999px 999px 0 0;
  content: '';
  inset: 3px 3px 9px;
  position: absolute;
}

.negotiation-gauge::after {
  background: var(--chance-color);
  border-radius: 999px;
  content: '';
  height: 3px;
  left: 50%;
  position: absolute;
  top: 22px;
  transform: translate(0, -50%) rotate(var(--needle-rotation));
  transform-origin: 2px 50%;
  width: 15px;
}

.negotiation-gauge i {
  background: #ffffff;
  border: 3px solid var(--chance-color);
  border-radius: 999px;
  display: block;
  height: 8px;
  left: 50%;
  position: absolute;
  top: 22px;
  transform: translateX(-50%);
  width: 8px;
}

.negotiation-chance span,
.negotiation-chance strong,
.negotiation-chance small {
  grid-column: 1;
}

.negotiation-chance .negotiation-gauge {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.negotiation-chance small {
  line-height: 1.38;
  margin-top: 2px;
  max-width: 205px;
}

.negotiation-chance.chance-low {
  --chance-color: #d94141;
  --needle-rotation: -158deg;
}

.negotiation-chance.chance-medium {
  --chance-color: #e58a1a;
  --needle-rotation: -90deg;
}

.negotiation-chance.chance-high {
  --chance-color: #10a15e;
  --needle-rotation: -22deg;
}

.negotiation-line {
  background: #e4ebf2;
  border-radius: 999px;
  height: 5px;
  margin: 8px 12px 12px;
  position: relative;
}

.negotiation-line::before {
  background: #10a15e;
  border-radius: 999px;
  content: '';
  inset: 0 26% 0 0;
  position: absolute;
}

.negotiation-line .dot {
  background: #ffffff;
  border: 2px solid #10a15e;
  border-radius: 999px;
  height: 11px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 11px;
}

.negotiation-line .dot.left {
  left: 0;
}

.negotiation-line .dot.middle {
  left: 74%;
}

.negotiation-line .dot.right {
  border-color: #d9e2ec;
  left: 100%;
}

.negotiation-line-meta {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.negotiation-line-meta strong {
  color: #14223a;
  display: block;
  font-size: 18px;
}

.negotiation-line-meta small {
  color: #6f7d90;
  font-size: 12px;
  font-weight: 800;
}

.negotiation-why h3,
.negotiation-side h3 {
  color: #14223a;
  font-size: 20px;
  margin: 0 0 12px;
}

.negotiation-why-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.negotiation-why-grid article {
  align-items: start;
  background: #ffffff;
  border: 1px solid #edf2f7;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 22px minmax(0, 1fr);
  padding: 10px;
}

.negotiation-why-grid article span {
  align-items: center;
  background: #e9f8f0;
  border-radius: 999px;
  color: #10a15e;
  display: inline-flex;
  font-size: 13px;
  height: 22px;
  justify-content: center;
  width: 22px;
}

.negotiation-why-grid article span svg {
  font-size: 12px;
}

.negotiation-why-grid strong {
  color: #263850;
  display: block;
  font-size: 12px;
  margin-bottom: 4px;
}

.negotiation-why-grid small {
  color: #657284;
  font-size: 11px;
  font-weight: 750;
}

.negotiation-cta {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.negotiation-cta strong {
  color: #14223a;
  font-size: 16px;
}

.negotiation-cta p {
  color: #657284;
  font-size: 13px;
  margin: 4px 0 0;
}

.negotiation-cta button,
.negotiation-side .ghost {
  background: #10a15e;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  min-height: 44px;
  padding: 0 16px;
}

.negotiation-cta-action {
  text-align: center;
}

.negotiation-cta-action small {
  color: #7b889a;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 6px;
}

.negotiation-side .ghost {
  background: #ffffff;
  border: 1px solid #d7e0eb;
  color: #334355;
  margin-top: 12px;
  width: 100%;
}

.negotiation-steps {
  color: #526171;
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
}

.negotiation-steps li {
  font-size: 13px;
  font-weight: 850;
}

.negotiation-transactions {
  display: grid;
  gap: 10px;
}

.negotiation-transactions article {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 68px minmax(0, 1fr) auto;
}

.negotiation-transactions .photo {
  background-position: center;
  background-size: cover;
  border-radius: 6px;
  height: 52px;
}

.negotiation-transactions strong {
  color: #1f324b;
  display: block;
  font-size: 12px;
}

.negotiation-transactions small,
.negotiation-transactions em {
  color: #6f7d90;
  display: block;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
}

.negotiation-transactions .price {
  text-align: right;
}

.negotiation-side .tip strong {
  color: #0a8f54;
  display: block;
  font-size: 14px;
}

.negotiation-side .tip p {
  color: #526171;
  font-size: 13px;
  margin: 6px 0 0;
}

.negotiation-note {
  background: #fffaf1;
  border-color: #f3e2bf;
}

.negotiation-note strong {
  color: #8a6720;
  display: block;
  font-size: 13px;
}

.negotiation-note p {
  color: #8a6f34;
  font-size: 12px;
  font-weight: 750;
  margin: 6px 0 0;
}

.negotiation-footer {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  padding-top: 12px;
  padding-bottom: 12px;
}

.negotiation-footer span {
  color: #0a9e58;
  display: inline-flex;
  font-size: 16px;
}

.negotiation-footer p,
.negotiation-footer small {
  color: #6e7d90;
  font-size: 11px;
  font-weight: 800;
  margin: 0;
}

@media (max-width: 1280px) {
  .negotiation-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .negotiation-range-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .negotiation-offer {
    grid-template-columns: 170px minmax(0, 1fr);
  }

  .negotiation-price {
    grid-column: 1 / -1;
    text-align: left;
  }

  .negotiation-why-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .negotiation-footer {
    grid-template-columns: 20px minmax(0, 1fr);
  }

  .negotiation-footer small {
    grid-column: 2;
  }
}

@media (max-width: 760px) {
  .negotiation-shell {
    padding: 0 14px;
  }

  .negotiation-picker {
    grid-template-columns: 1fr;
  }

  .negotiation-title h1 {
    font-size: 32px;
  }

  .negotiation-range h3 {
    font-size: 34px;
  }

  .negotiation-line-meta {
    grid-template-columns: 1fr;
  }

  .negotiation-cta {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1380px) {
  .district-filter-card {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .district-filter-card label {
    border-right: 0;
    padding-right: 0;
  }

  .district-filter-card button {
    grid-column: 1 / -1;
  }

  .district-ranking-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .district-ranking-side {
    grid-template-columns: minmax(0, 0.86fr) minmax(360px, 1fr);
  }
}

@media (max-width: 1100px) {
  .district-ranking-shell {
    padding: 0 24px;
  }

  .district-ranking-tabs,
  .district-ranking-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .district-methodology {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .district-methodology button {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .district-ranking-page {
    padding-top: 18px;
  }

  .district-ranking-shell {
    padding: 0 16px;
  }

  .district-ranking-title h1 {
    font-size: 26px;
  }

  .district-filter-card,
  .district-ranking-tabs,
  .district-ranking-side,
  .district-methodology {
    grid-template-columns: 1fr;
  }

  .district-filter-card,
  .district-ranking-table-card,
  .district-side-card,
  .district-methodology {
    padding: 18px;
  }

  .district-map {
    height: 300px;
  }
}

@media (max-width: 1380px) {
  .header {
    gap: 18px;
    padding: 0 28px;
  }

  .nav {
    gap: 17px;
  }

  .nav button, .nav a,
  .icon-text span {
    font-size: 12px;
  }

  .post-button {
    min-width: 210px;
  }

  .hero-inner,
  .search-wrap,
  .content-shell {
    padding-left: 32px;
    padding-right: 32px;
  }

  .tool-card {
    grid-column: span 3;
  }

  .home-left-stack .tool-card {
    grid-column: auto;
  }

  .free-card {
    grid-column: span 12;
  }

  .home-right-stack .free-card {
    grid-column: auto;
  }

  .home-feature-grid {
    grid-template-columns: 1fr;
  }

  .main-grid {
    grid-template-columns: 1fr;
  }

  .buy-container {
    padding-left: 32px;
    padding-right: 32px;
  }

  .buy-results-zone {
    padding-left: 32px;
    padding-right: 32px;
  }

  .buy-results-zone::before {
    left: 32px;
    right: 32px;
  }

  .buy-search-row {
    grid-template-columns: 1fr;
  }

  .save-search {
    justify-self: start;
  }

  .buy-layout {
    grid-template-columns: 270px minmax(0, 1fr);
  }

  .map-column {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) 380px;
    position: static;
  }

  .satellite-map {
    height: 420px;
  }

  .guides-container {
    padding-left: 32px;
    padding-right: 32px;
  }

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

  .guides-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    position: static;
  }

  .guide-topic-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .article-grid,
  .related-offer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .listing-loop {
    --listing-step: calc(100% + var(--listing-gap));
  }
  
  .listing-card {
    flex-basis: calc((100% - var(--listing-gap)) / 2);
  }

  .add-container {
    padding-left: 32px;
    padding-right: 32px;
  }

  .add-layout {
    grid-template-columns: minmax(0, 1fr) 330px;
  }

  .sell-hero-inner,
  .sell-container,
  .valuation-shell {
    padding-left: 32px;
    padding-right: 32px;
  }

  .valuation-layout {
    gap: 32px;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 440px);
  }

  .valuation-result-layout {
    gap: 32px;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  }

  .valuation-result-hero {
    grid-template-columns: minmax(0, 1fr) 170px;
    padding: 30px;
  }

  .valuation-result-hero strong {
    font-size: 36px;
  }

  .valuation-result-details > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .valuation-grid.three,
  .valuation-grid.four,
  .valuation-grid.five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .valuation-condition-grid,
  .valuation-amenity-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .valuation-benefit-grid {
    grid-template-columns: 1fr;
  }

  .sell-card-grid {
    grid-template-columns: 1fr;
  }

  .sell-feature-strip > div {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .services-frame {
    grid-template-columns: 1fr;
    padding-left: 32px;
    padding-right: 32px;
  }

  .services-main {
    padding-right: 0;
  }

  .services-preview {
    border-left: 0;
    padding-left: 0;
  }

  .service-category-grid,
  .recommended-company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .header {
    grid-template-columns: 1fr auto;
    height: auto;
    padding-bottom: 18px;
    padding-top: 18px;
  }

  .nav {
    grid-column: 1 / -1;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 4px;
  }

  .nav button, .nav a {
    padding: 8px 0 12px;
  }

  .nav button.active::after, .nav a.active::after {
    bottom: 3px;
  }

  .header-actions {
    gap: 14px;
  }

  .icon-text span {
    display: none;
  }

  .notification-popover {
    right: -18px;
    top: calc(100% + 12px);
  }

  .notifications-head h1 {
    font-size: 29px;
  }

  .notifications-tabs {
    border-radius: 16px;
    flex-wrap: wrap;
  }

  .notifications-tabs button {
    flex: 1 1 calc(50% - 6px);
  }

  .notification-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .notification-meta {
    grid-column: 2;
    justify-content: flex-start;
  }

  .hero {
    min-height: 720px;
  }

  .hero-inner {
    height: 720px;
    padding-top: 52px;
  }

  .hero-gradient {
    background:
      linear-gradient(180deg, rgba(244, 247, 251, 0) 62%, rgba(238, 243, 248, 0.84) 100%),
      linear-gradient(90deg, #f7faff 0%, rgba(247, 250, 255, 0.92) 34%, rgba(247, 250, 255, 0.18) 74%, rgba(247, 250, 255, 0) 100%);
  }

  .benefits {
    grid-template-columns: repeat(2, minmax(0, 220px));
  }

  .ai-card {
    left: auto;
    right: 32px;
    top: 42px;
  }

  .tour-card {
    right: 32px;
    top: 455px;
  }

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

  .search-button {
    grid-column: span 2;
  }

  .buy-search-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .buy-search-button {
    grid-column: span 2;
    margin: 12px;
  }

  .mega-bar {
    grid-template-columns: 1fr 1fr;
  }

  .mega-cell {
    border-bottom: 1px solid #e9eef4;
  }

  .mega-cell-more {
    grid-column: span 2;
  }

  .buy-results-zone {
    margin-top: 28px;
    padding-left: 18px;
    padding-right: 18px;
  }

  .buy-results-zone::before {
    left: 18px;
    right: 18px;
  }

  .mega-cell-more .mega-more {
    justify-content: center;
    min-height: 52px;
  }

  .mega-search-btn {
    grid-column: span 2;
    margin: 12px;
  }

  .mega-pop {
    left: 0;
    max-width: calc(100vw - 48px);
    right: auto;
    width: 100%;
  }

  .mega-cell-more .mega-pop {
    left: 0;
    right: auto;
  }

  .mega-pop-more {
    width: 100%;
  }

  .mega-more-grid {
    grid-template-columns: 1fr;
  }

  .quick-filter-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .buy-toolbar {
    gap: 18px;
    grid-template-columns: 1fr;
  }

  .toolbar-actions {
    justify-content: space-between;
  }

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

  .filters-panel {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filters-head,
  .more-filters {
    grid-column: 1 / -1;
  }

  .filter-group {
    border-top: 1px solid #e6ebf1;
  }

  .map-column {
    grid-template-columns: 1fr;
  }

  .guides-hero h1 {
    font-size: 48px;
  }

  .guides-sidebar {
    grid-template-columns: 1fr;
  }

  .add-progress {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: none;
  }

  .add-progress div:not(:last-child)::after {
    display: none;
  }

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

  .add-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    position: static;
  }

  .listing-preview-card {
    grid-row: span 2;
  }

  .add-footer-benefits > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sell-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

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

  .valuation-result-layout {
    grid-template-columns: 1fr;
  }

  .valuation-result-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .valuation-progress {
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .valuation-progress button:not(:last-child)::after {
    display: none;
  }

  .valuation-sidebar {
    grid-template-columns: 1fr;
  }

  .valuation-result-actions {
    grid-template-columns: 1fr 1fr;
  }

  .valuation-result-actions .valuation-next {
    grid-column: 1 / -1;
  }

  .valuation-trust-row {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .sell-step:not(:last-child)::after {
    display: none;
  }

  .testimonial-grid {
    grid-template-columns: 1fr;
  }

  .testimonial-nav {
    display: none;
  }

  .services-search,
  .service-mini-search {
    grid-template-columns: 1fr;
  }

  .services-search .search-field,
  .service-mini-search .search-field {
    border-right: 0;
    border-top: 1px solid #e3e9f0;
  }

  .services-search .search-field:first-child,
  .service-mini-search .search-field:first-child {
    border-top: 0;
  }

  .services-search .buy-search-button {
    margin: 12px;
  }

  .service-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-step:not(:last-child)::after {
    display: none;
  }

  .directory-card {
    grid-template-columns: 120px minmax(0, 1fr);
  }

  .directory-card > button,
  .directory-card > svg {
    justify-self: start;
  }

  .profile-head {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .profile-head > button {
    grid-column: 1 / -1;
    margin-top: 0;
  }

  .profile-actions,
  .profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .header {
    display: flex;
    flex-wrap: wrap;
    padding: 16px 18px;
  }

  .map-field-num,
  .map-field-select {
    flex: 1;
    width: auto;
  }

  .map-offer-card {
    left: 12px;
    right: 12px;
    width: auto;
  }

  .brand {
    min-width: 0;
  }

  .brand strong {
    font-size: 24px;
  }

  .header-actions {
    margin-left: auto;
  }

  .post-button {
    display: none;
  }

  .hero {
    min-height: 760px;
  }

  .hero-photo {
    object-position: 68% center;
  }

  .hero-gradient {
    background:
      linear-gradient(180deg, rgba(247, 250, 255, 0.94) 0%, rgba(247, 250, 255, 0.82) 54%, #eef3f8 100%);
  }

  .hero-inner,
  .search-wrap,
  .content-shell {
    padding-left: 18px;
    padding-right: 18px;
  }

  .hero-inner {
    height: 760px;
    padding-top: 44px;
  }

  .hero h1 {
    font-size: 48px;
  }

  .hero-copy p {
    font-size: 18px;
    margin-top: 30px;
  }

  .benefits {
    gap: 18px;
    grid-template-columns: 1fr 1fr;
    margin-top: 34px;
  }

  .ai-card {
    left: 18px;
    right: auto;
    top: 388px;
    width: min(270px, calc(100% - 36px));
  }

  .tour-card {
    left: 18px;
    right: auto;
    top: 590px;
  }

  .search-wrap {
    margin-top: -88px;
  }

  .search-tabs {
    width: 100%;
  }

  .search-tabs button, .search-tabs a {
    flex: 1;
    min-width: 0;
    padding-left: 10px;
    padding-right: 10px;
  }

  .search-panel {
    grid-template-columns: 1fr;
  }

  .search-field {
    border-right: 0;
    border-top: 1px solid #e3e9f0;
  }

  .search-field:first-child {
    border-top: 0;
  }

  .search-button {
    grid-column: auto;
  }

  .content-shell {
    margin-top: 34px;
  }

  .buy-container {
    padding-left: 18px;
    padding-right: 18px;
  }

  .buy-hero h1 {
    font-size: 30px;
  }

  .buy-search-panel,
  .quick-filter-row {
    grid-template-columns: 1fr;
  }

  .buy-search-panel .search-field {
    border-right: 0;
    border-top: 1px solid #e3e9f0;
  }

  .buy-search-panel .search-field:first-child {
    border-top: 0;
  }

  .buy-search-button {
    grid-column: auto;
  }

  .toolbar-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .filters-panel {
    grid-template-columns: 1fr;
  }

  .result-card {
    grid-template-columns: 1fr;
    padding: 0;
  }

  .result-info,
  .result-side {
    padding-left: 18px;
    padding-right: 18px;
  }

  .result-side {
    align-items: start;
    justify-items: start;
    padding-top: 0;
  }

  .satellite-map {
    height: 470px;
  }

  .guides-container {
    padding-left: 18px;
    padding-right: 18px;
  }

  .guides-hero {
    min-height: 520px;
  }

  .guides-hero-shade {
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.97) 0%, rgba(248, 250, 252, 0.9) 66%, #f8fafc 100%);
  }

  .guides-hero-inner > div {
    padding-top: 42px;
  }

  .guides-hero h1 {
    font-size: 38px;
  }

  .guides-hero p {
    font-size: 16px;
  }

  .guides-search {
    grid-template-columns: 20px minmax(0, 1fr);
    padding-bottom: 12px;
  }

  .guides-search button {
    grid-column: 1 / -1;
  }

  .popular-links {
    gap: 10px 14px;
  }

  .guide-topic-grid,
  .article-grid,
  .related-offer-grid,
  .guides-sidebar {
    grid-template-columns: 1fr;
  }

  .article-image {
    height: 190px;
  }

  .add-container {
    padding-left: 18px;
    padding-right: 18px;
  }

  .add-title h1 {
    font-size: 30px;
  }

  .add-progress,
  .add-three-grid,
  .add-location-grid,
  .add-checkbox-grid,
  .add-sidebar,
  .add-footer-benefits > div {
    grid-template-columns: 1fr;
  }

  .listing-preview-card {
    grid-row: auto;
  }

  .add-form-card,
  .listing-preview-card,
  .add-side-card,
  .add-footer-benefits {
    padding: 18px;
  }

  .preview-image {
    height: 190px;
  }

  .next-step-button {
    width: 100%;
  }

  .add-location-actions {
    flex-direction: column-reverse;
    gap: 10px;
  }

  .extra-details-grid,
  .media-option-grid,
  .amenities-option-grid {
    grid-template-columns: 1fr;
  }

  .media-billing-row {
    grid-template-columns: 1fr;
  }

  .extra-actions .next-step-button {
    min-width: 0;
  }

  .back-step-button {
    width: 100%;
  }

  .sell-hero {
    min-height: 680px;
  }

  .sell-hero-gradient {
    background: linear-gradient(180deg, rgba(248, 251, 253, 0.97) 0%, rgba(248, 251, 253, 0.9) 58%, #f7fafc 100%);
  }

  .sell-hero-inner,
  .sell-container,
  .valuation-shell {
    padding-left: 18px;
    padding-right: 18px;
  }

  .valuation-page {
    padding-top: 22px;
  }

  .valuation-title h1 {
    font-size: 28px;
  }

  .valuation-progress {
    grid-template-columns: 1fr;
    margin: 28px 0;
  }

  .valuation-progress button {
    min-height: 34px;
  }

  .valuation-grid.two,
  .valuation-grid.three,
  .valuation-grid.four,
  .valuation-grid.five {
    grid-template-columns: 1fr;
  }

  .valuation-result-hero {
    grid-template-columns: 1fr;
    padding: 22px;
  }

  .valuation-result-hero strong {
    font-size: 32px;
    line-height: 1.15;
  }

  .valuation-result-details > div,
  .valuation-result-sidebar,
  .valuation-result-actions {
    grid-template-columns: 1fr;
  }

  .valuation-result-actions .valuation-back:nth-child(2) {
    justify-self: stretch;
  }

  .valuation-result-actions button {
    width: 100%;
  }

  .valuation-condition-grid,
  .valuation-amenity-grid {
    grid-template-columns: 1fr;
  }

  .valuation-toggle-wide {
    max-width: none;
  }

  .valuation-form-card,
  .valuation-preview-card {
    padding: 18px;
  }

  .valuation-actions-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
    margin-left: -18px;
    margin-right: -18px;
    padding-left: 18px;
    padding-right: 18px;
  }

  .valuation-next,
  .valuation-back {
    width: 100%;
  }

  .valuation-next {
    min-width: 0;
  }

  .valuation-estimate-box {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .valuation-house-graphic {
    height: 116px;
  }

  .valuation-benefit-grid,
  .valuation-trust-row {
    grid-template-columns: 1fr;
  }

  .valuation-trust-row > span {
    margin-top: 8px;
  }

  .sell-copy {
    padding-top: 36px;
  }

  .sell-copy h1 {
    font-size: 36px;
  }

  .sell-benefit-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .sell-steps,
  .sell-feature-strip > div,
  .testimonial-grid,
  .sell-bottom-cta {
    grid-template-columns: 1fr;
  }

  .sell-bottom-cta small {
    grid-column: auto;
    margin-top: -6px;
    text-align: left;
  }

  .services-frame {
    padding-left: 18px;
    padding-right: 18px;
  }

  .services-hero {
    min-height: 310px;
  }

  .services-hero::after {
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.96) 0%, rgba(248, 250, 252, 0.88) 62%, rgba(248, 250, 252, 0.45) 100%);
  }

  .services-hero-copy {
    padding-top: 32px;
  }

  .services-hero h1 {
    font-size: 31px;
  }

  .service-category-grid,
  .recommended-company-grid,
  .service-steps,
  .profile-actions,
  .profile-stats {
    grid-template-columns: 1fr;
  }

  .service-panel {
    padding-left: 18px;
    padding-right: 18px;
  }

  .directory-card {
    grid-template-columns: 1fr;
  }

  .directory-photo {
    min-height: 160px;
  }

  .profile-head {
    grid-template-columns: 1fr;
  }

  .profile-logo {
    margin-top: -41px;
  }

  .profile-actions,
  .profile-tabs,
  .profile-about,
  .profile-head {
    padding-left: 18px;
    padding-right: 18px;
  }

  .profile-tabs {
    gap: 16px;
    overflow-x: auto;
  }

  .tool-card,
  .free-card {
    grid-column: span 12;
  }

  .free-card {
    grid-template-columns: 1fr;
  }

  .house-graphic {
    display: none;
  }

  .main-grid {
    gap: 28px;
  }

  .section-head {
    align-items: flex-start;
    gap: 12px;
  }

  .listing-grid,
  .city-grid {
    grid-template-columns: 1fr;
  }
  .listing-loop {
    --listing-step: calc((100% + var(--listing-gap)) / 2);
  }
  
  .listing-card {
    flex-basis: 100%;
  }

  .all-cities {
    grid-column: auto;
  }
}

@media (max-width: 460px) {
  .hero h1 {
    font-size: 39px;
  }

  .benefits {
    grid-template-columns: 1fr;
  }

  .tour-card {
    align-items: flex-start;
    flex-direction: column;
    top: 610px;
  }

  .free-card button {
    min-width: 0;
    width: 100%;
  }

  .price-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .view-toggle {
    width: 100%;
  }

  .view-toggle button {
    flex: 1;
    justify-content: center;
  }
}

@media (max-width: 1280px) {
  .history-shell {
    padding-left: 28px;
    padding-right: 28px;
  }

  .history-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .history-search {
    grid-column: span 2;
  }

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

  .history-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .history-page {
    padding-top: 20px;
  }

  .history-shell {
    padding-left: 18px;
    padding-right: 18px;
  }

  .history-title {
    margin: 22px 0;
  }

  .history-title h1 {
    font-size: 30px;
  }

  .history-filter-panel,
  .history-chart-card,
  .history-insights-card,
  .history-alert-card,
  .history-side-card {
    padding: 18px;
  }

  .history-filter-grid {
    grid-template-columns: 1fr 1fr;
  }

  .history-field.location,
  .history-search {
    grid-column: 1 / -1;
  }

  .history-popular-row .history-clear {
    margin-left: 0;
  }

  .history-chart-head {
    display: grid;
  }

  .history-chart-head strong {
    font-size: 32px;
  }

  .history-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .history-stat-grid article {
    min-height: 116px;
  }

  .history-insights-card > div,
  .history-sidebar {
    grid-template-columns: 1fr;
  }

  .history-insights-card article {
    align-items: start;
  }

  .history-alert-card {
    align-items: start;
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .history-alert-card button {
    grid-column: 1 / -1;
    width: 100%;
  }
}

@media (max-width: 620px) {
  .history-filter-grid,
  .history-stat-grid {
    grid-template-columns: 1fr;
  }

  .history-field.compact > div,
  .history-dual-input {
    grid-template-columns: 1fr 1fr;
  }

  .history-chart-head label {
    align-items: stretch;
    display: grid;
    white-space: normal;
  }

  .history-months {
    font-size: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    row-gap: 6px;
  }

  .history-side-card.recent article {
    grid-template-columns: 64px minmax(0, 1fr) 16px;
  }

  .history-side-card.recent img {
    width: 64px;
  }
}

.login-shell {
  background: #f3f5f8;
}

.login-page {
  background: #f3f5f8;
  min-height: calc(100vh - 82px);
  overflow: hidden;
  position: relative;
}

.login-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
  gap: 48px;
  margin: 0 auto;
  max-width: 1280px;
  min-height: calc(100vh - 82px);
  padding: 42px 34px 168px;
  position: relative;
}

.login-left,
.login-right {
  position: relative;
}

.login-left {
  display: grid;
  grid-template-rows: auto auto minmax(180px, 1fr);
  min-width: 0;
}

.login-right {
  align-items: start;
  display: flex;
  justify-content: center;
}

.login-room-photo {
  align-self: end;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 12px;
  height: 280px;
  margin-top: 18px;
  width: min(660px, 100%);
}

.login-room-photo::after {
  background:
    linear-gradient(90deg, rgba(243, 245, 248, 0.12) 0%, rgba(243, 245, 248, 0.05) 62%, rgba(243, 245, 248, 0.34) 100%),
    linear-gradient(180deg, rgba(243, 245, 248, 0.08) 0%, rgba(243, 245, 248, 0.02) 30%, rgba(243, 245, 248, 0) 80%, rgba(243, 245, 248, 0.26) 100%);
  content: "";
  inset: 0;
  position: absolute;
}

.login-intro {
  max-width: 560px;
}

.login-intro h1 {
  color: #14223a;
  font-size: 46px;
  font-weight: 950;
  line-height: 1.04;
  margin: 0;
}

.login-intro h1 span {
  color: #128f50;
  display: block;
}

.login-intro p {
  color: #596678;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  margin: 16px 0 0;
  max-width: 560px;
}

.login-benefits {
  display: grid;
  gap: 20px;
  margin-top: 30px;
  max-width: 620px;
}

.login-benefits article {
  align-items: center;
  display: flex;
  gap: 14px;
}

.login-benefits article > span,
.login-trust article > span {
  align-items: center;
  background: #e5f4eb;
  border-radius: 999px;
  box-shadow: none;
  color: #16a464;
  display: grid;
  flex: 0 0 auto;
  height: 36px;
  place-items: center;
  width: 36px;
}

.login-benefits svg,
.login-trust svg {
  font-size: 18px;
  stroke-width: 2;
}

.login-benefits p,
.login-trust p {
  margin: 0;
}

.login-benefits strong {
  color: #14223a;
  display: block;
  font-size: 14px;
  font-weight: 950;
}

.login-benefits small {
  color: #5b697a;
  display: block;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  margin-top: 4px;
}

.login-card {
  background: #ffffff;
  border: 1px solid #e1e7ef;
  border-radius: 10px;
  box-shadow: 0 16px 42px rgba(20, 37, 62, 0.08);
  display: grid;
  gap: 14px;
  padding: 28px 28px 22px;
  width: min(430px, 100%);
}

.login-card-head {
  text-align: left;
}

.login-card-head h2 {
  color: #14223a;
  font-size: 38px;
  font-weight: 950;
  line-height: 1.1;
  margin: 0;
}

.login-card-head p {
  align-items: center;
  color: #5f7087;
  display: flex;
  font-size: 14px;
  font-weight: 750;
  gap: 5px;
  margin: 6px 0 2px;
}

.login-card-head p button {
  background: transparent;
  border: 0;
  color: #109253;
  font-size: 14px;
  font-weight: 900;
  padding: 0;
}

.login-field {
  display: grid;
  gap: 8px;
}

.login-field > span {
  color: #142238;
  font-size: 12px;
  font-weight: 900;
}

.login-field div {
  position: relative;
}

.login-field input {
  background: #ffffff;
  border: 1px solid #d8e0ea;
  border-radius: 6px;
  color: #07142b;
  font-size: 13px;
  font-weight: 800;
  height: 42px;
  outline: none;
  padding: 0 38px 0 14px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  width: 100%;
}

.login-field input:focus {
  border-color: #16a464;
  box-shadow: 0 0 0 3px rgba(22, 164, 100, 0.11);
}

.login-field input::placeholder {
  color: #8492a6;
}

.login-field svg {
  color: #6b7b90;
  font-size: 15px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.login-options-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-top: -2px;
}

.remember-me {
  align-items: center;
  color: #647487;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
}

.remember-me input {
  accent-color: #109253;
  margin: 0;
}

.forgot-password {
  background: transparent;
  border: 0;
  color: #108d50;
  font-size: 12px;
  font-weight: 950;
  padding: 0;
}

.login-submit {
  background: #17a960;
  border: 0;
  border-radius: 6px;
  box-shadow: none;
  color: #ffffff;
  font-size: 15px;
  font-weight: 950;
  height: 44px;
  width: 100%;
}

.login-divider {
  align-items: center;
  color: #6e7d92;
  display: grid;
  font-size: 13px;
  font-weight: 850;
  grid-template-columns: 1fr auto 1fr;
  gap: 9px;
}

.login-divider::before,
.login-divider::after {
  background: #dfe5ed;
  content: "";
  height: 1px;
}

.social-login {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe5ed;
  border-radius: 6px;
  color: #142238;
  display: flex;
  font-size: 14px;
  font-weight: 900;
  gap: 10px;
  height: 42px;
  justify-content: center;
  width: 100%;
}

.google-mark,
.facebook-mark {
  align-items: center;
  display: grid;
  flex: 0 0 18px;
  font-size: 14px;
  font-weight: 950;
  height: 18px;
  place-items: center;
  width: 18px;
}

.google-mark {
  color: #1a73e8;
  font-family: Arial, sans-serif;
}

.facebook-mark {
  background: #1877f2;
  border-radius: 999px;
  color: #ffffff;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1;
}

.login-security-note {
  align-items: center;
  color: #7a8798;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  margin: 2px 0 0;
}

.login-security-note svg {
  font-size: 14px;
}

.login-field-row {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr 1fr;
}

.terms-checkbox {
  align-items: flex-start;
  color: #5f7087;
  display: flex;
  font-size: 12px;
  font-weight: 750;
  gap: 9px;
  line-height: 1.4;
}

.terms-checkbox input {
  accent-color: #109253;
  margin-top: 2px;
}

.register-choice-card {
  padding-bottom: 26px;
}

.register-choice-subtitle {
  color: #5f7087;
  font-size: 14px;
  font-weight: 750;
  margin: 6px 0 2px;
}

.register-choice-list {
  display: grid;
  gap: 12px;
  margin-top: 6px;
}

.register-choice-option {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe5ed;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 40px minmax(0, 1fr) 16px;
  padding: 14px 16px;
  text-align: left;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.register-choice-option:hover {
  border-color: #16a464;
  box-shadow: 0 0 0 3px rgba(22, 164, 100, 0.1);
}

.register-choice-option > span:first-child {
  align-items: center;
  background: #e8f8ef;
  border-radius: 999px;
  color: #109253;
  display: grid;
  height: 40px;
  place-items: center;
  width: 40px;
}

.register-choice-option > span:first-child svg {
  height: 18px;
  width: 18px;
}

.register-choice-copy {
  display: grid;
  gap: 2px;
}

.register-choice-copy strong {
  color: #14223a;
  font-size: 14px;
  font-weight: 900;
}

.register-choice-copy small {
  color: #5f7087;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.register-choice-option > svg {
  color: #109253;
  height: 16px;
  width: 16px;
}

.register-choice-footer {
  color: #5f7087;
  font-size: 14px;
  font-weight: 750;
  margin-top: 4px;
  text-align: center;
}

.register-choice-footer button {
  background: transparent;
  border: 0;
  color: #109253;
  font-size: 14px;
  font-weight: 900;
  padding: 0;
}

.register-type-tabs {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr 1fr;
}

.register-type-tabs button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe5ed;
  border-radius: 999px;
  color: #5f7087;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  gap: 7px;
  height: 38px;
  justify-content: center;
}

.register-type-tabs button.active {
  background: #17a960;
  border-color: #17a960;
  color: #ffffff;
}

@media (max-width: 600px) {
  .login-field-row,
  .register-type-tabs {
    grid-template-columns: 1fr;
  }
}

.register-pending-card {
  justify-items: center;
  padding: 34px 28px;
  text-align: center;
}

.register-pending-icon {
  align-items: center;
  background: #fff4e0;
  border-radius: 999px;
  color: #b8770a;
  display: grid;
  height: 56px;
  place-items: center;
  width: 56px;
}

.register-pending-icon svg {
  height: 24px;
  width: 24px;
}

.register-pending-card h2 {
  color: #14223a;
  font-size: 26px;
  font-weight: 950;
  margin: 16px 0 0;
}

.register-pending-lead {
  color: #14223a;
  font-size: 14px;
  font-weight: 750;
  margin: 10px 0 0;
}

.register-pending-lead strong {
  color: #b8770a;
}

.register-pending-note {
  color: #5f7087;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  margin: 10px 0 20px;
}

.register-pending-card .login-submit {
  width: auto;
  min-width: 220px;
  padding: 0 24px;
}

.login-trust {
  align-items: center;
  background: #f5f7fa;
  border-top: 1px solid #e2e8f0;
  bottom: 0;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  left: 0;
  min-height: 122px;
  padding: 24px 48px;
  position: absolute;
  right: 0;
}

.login-trust article {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.login-trust article > span {
  background: #e6f8ef;
  box-shadow: none;
  height: 38px;
  width: 38px;
}

.login-trust svg {
  font-size: 17px;
}

.login-trust strong {
  color: #14223a;
  display: block;
  font-size: 13px;
  font-weight: 950;
  line-height: 1.2;
}

.login-trust small {
  color: #63748a;
  display: block;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  margin-top: 4px;
}

@media (max-width: 1080px) {
  .login-page {
    background: #f8fafc;
    min-height: calc(100vh - 82px);
    overflow: auto;
  }

  .login-stage {
    grid-template-columns: 1fr;
    gap: 24px;
    max-width: 760px;
    min-height: auto;
    padding: 26px 16px 34px;
  }

  .login-left,
  .login-right {
    width: 100%;
  }

  .login-left {
    grid-template-rows: auto auto auto;
  }

  .login-right {
    justify-content: stretch;
  }

  .login-room-photo {
    border-radius: 8px;
    height: 220px;
    margin-top: 22px;
    position: relative;
    width: 100%;
  }

  .login-intro,
  .login-benefits {
    width: 100%;
  }

  .login-intro h1 {
    font-size: 34px;
  }

  .login-intro p {
    font-size: 13px;
    max-width: none;
  }

  .login-benefits {
    gap: 14px;
    margin-top: 18px;
  }

  .login-benefits strong {
    font-size: 13px;
  }

  .login-benefits small {
    font-size: 11px;
  }

  .login-card {
    padding: 22px 16px 18px;
    width: 100%;
  }

  .login-card-head h2 {
    font-size: 28px;
  }

  .login-card-head p,
  .login-card-head p button,
  .login-field > span,
  .login-field input,
  .remember-me,
  .forgot-password,
  .login-submit,
  .social-login,
  .login-divider,
  .login-security-note {
    font-size: 13px;
  }

  .login-card-head h2 {
    font-size: 22px;
  }

  .login-options-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .login-field input,
  .login-submit,
  .social-login {
    height: 44px;
  }

  .login-trust {
    border-top: 1px solid #e2e8f0;
    min-height: 0;
    padding: 16px;
    position: static;
    grid-template-columns: 1fr;
  }

  .login-trust article > span {
    height: 34px;
    width: 34px;
  }

  .login-trust strong {
    font-size: 12px;
  }

  .login-trust small {
    font-size: 10px;
  }
}

.notify-bell {
  position: relative;
}

.notify-bell-wrap {
  position: relative;
}

.notify-bell.open {
  color: #0b9152;
}

.notify-bell i {
  background: #14a45f;
  border: 2px solid #ffffff;
  border-radius: 999px;
  height: 10px;
  position: absolute;
  right: -2px;
  top: -2px;
  width: 10px;
}

.notification-popover {
  background: #ffffff;
  border: 1px solid #d8e1ec;
  border-radius: 12px;
  box-shadow: 0 30px 60px rgba(16, 28, 52, 0.18);
  position: absolute;
  right: 0;
  top: calc(100% + 16px);
  width: min(360px, calc(100vw - 24px));
  z-index: 60;
}

.notification-popover::before {
  background: #ffffff;
  border-left: 1px solid #d8e1ec;
  border-top: 1px solid #d8e1ec;
  content: "";
  height: 12px;
  position: absolute;
  right: 17px;
  top: -7px;
  transform: rotate(45deg);
  width: 12px;
}

.notification-popover-head {
  align-items: center;
  background: linear-gradient(180deg, #17b567 0%, #109457 100%);
  border-radius: 12px 12px 0 0;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  padding: 13px 14px;
}

.notification-popover-head h3 {
  font-size: 13px;
  margin: 0;
}

.notification-popover-head button {
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 7px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  height: 30px;
  padding: 0 10px;
}

.notification-popover-list {
  display: grid;
}

.notification-popover-item {
  align-items: start;
  border-top: 1px solid #eef2f7;
  display: grid;
  gap: 9px;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  padding: 11px 14px;
}

.notification-popover-item strong {
  color: #15233f;
  display: block;
  font-size: 13px;
  line-height: 1.25;
}

.notification-popover-item small {
  color: #5b6880;
  display: block;
  font-size: 12px;
  line-height: 1.35;
  margin-top: 2px;
}

.notification-popover-item em {
  color: #76849c;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.notification-icon {
  align-items: center;
  border-radius: 11px;
  display: grid;
  flex: 0 0 auto;
  height: 38px;
  place-items: center;
  width: 38px;
}

.notification-icon svg {
  font-size: 17px;
}

.account-menu-wrap {
  position: relative;
}

.account-menu-trigger.open {
  color: #0b9152;
}

.account-menu-trigger.open svg {
  color: #0b9152;
}

.account-popover {
  background: #ffffff;
  border: 1px solid #d8e1ec;
  border-radius: 12px;
  box-shadow: 0 30px 60px rgba(16, 28, 52, 0.18);
  display: grid;
  padding: 8px;
  position: absolute;
  right: 0;
  top: calc(100% + 16px);
  width: min(240px, calc(100vw - 24px));
  z-index: 60;
}

.account-popover::before {
  background: #ffffff;
  border-left: 1px solid #d8e1ec;
  border-top: 1px solid #d8e1ec;
  content: "";
  height: 12px;
  position: absolute;
  right: 17px;
  top: -7px;
  transform: rotate(45deg);
  width: 12px;
}

.account-popover button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #1f2d42;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 10px;
  min-height: 42px;
  padding: 0 10px;
  text-align: left;
  width: 100%;
}

.account-popover button:hover {
  background: #f2f6fa;
}

.account-popover button svg {
  color: #6b7b90;
  font-size: 16px;
}

.account-popover-logout {
  border-top: 1px solid #eef2f7;
  border-radius: 0 0 8px 8px;
  color: #c23b3b;
  margin-top: 4px;
  padding-top: 12px !important;
}

.account-popover-logout svg {
  color: #c23b3b !important;
}

.account-popover-logout:hover {
  background: #fdecec !important;
}

.notification-icon.listing {
  background: #eef5ff;
  color: #3d76ec;
}

.notification-icon.messages {
  background: #e9f8ef;
  color: #0e9959;
}

.notification-icon.system {
  background: #fff2e6;
  color: #e3782f;
}

.notification-unread-dot {
  background: #15a35f;
  border-radius: 999px;
  height: 8px;
  margin-top: 5px;
  width: 8px;
}

.notifications-page {
  background: #f5f7fa;
  min-height: calc(100vh - 82px);
  padding: 20px 18px;
}

.notifications-shell {
  margin: 0 auto;
  max-width: none;
}

.notifications-panel {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 12px;
  box-shadow: 0 18px 32px rgba(28, 38, 58, 0.07);
  max-width: none;
  padding: 18px;
  width: 100%;
}

.notifications-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.notifications-head h1 {
  color: #1c2a43;
  font-size: 37px;
  letter-spacing: -0.02em;
  margin: 0;
}

.notifications-head button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #556178;
  display: grid;
  height: 34px;
  place-items: center;
  width: 34px;
}

.notifications-head button:hover {
  background: #eef3f8;
  color: #1d2a45;
}

.notifications-tabs {
  background: #f2f5f8;
  border: 1px solid #ebf0f6;
  border-radius: 999px;
  display: flex;
  gap: 8px;
  margin-top: 22px;
  padding: 6px;
}

.notifications-tabs button {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #526073;
  font-size: 14px;
  font-weight: 700;
  min-height: 40px;
  padding: 0 20px;
}

.notifications-tabs button.active {
  background: linear-gradient(180deg, #17ba67 0%, #129657 100%);
  box-shadow: 0 8px 14px rgba(18, 150, 87, 0.25);
  color: #ffffff;
}

.notifications-group {
  margin-top: 22px;
}

.notifications-group h2 {
  color: #32405a;
  font-size: 22px;
  margin: 0 0 10px;
}

.notifications-list {
  border-top: 1px solid #eaf0f5;
}

.notification-row {
  align-items: center;
  border-bottom: 1px solid #edf2f7;
  display: grid;
  gap: 14px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 15px 2px;
}

.notification-copy strong {
  color: #1a2a45;
  display: block;
  font-size: 16px;
  line-height: 1.28;
}

.notification-copy p {
  color: #526073;
  font-size: 14px;
  line-height: 1.4;
  margin: 3px 0 0;
}

.notification-meta {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: flex-end;
}

.notification-meta small {
  color: #748399;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.notification-meta svg {
  color: #8191a7;
  font-size: 15px;
}

.favorites-page {
  background: #f5f7fa;
  min-height: calc(100vh - 82px);
  padding: 24px 20px;
}

.favorites-shell {
  margin: 0 auto;
  max-width: 1420px;
}

.favorites-head {
  align-items: start;
  display: flex;
  justify-content: space-between;
  gap: 18px;
}

.favorites-head h1 {
  color: #162742;
  font-size: clamp(36px, 3vw, 52px);
  letter-spacing: -0.02em;
  margin: 0;
}

.favorites-head p {
  color: #66778f;
  font-size: 15px;
  font-weight: 600;
  margin: 10px 0 0;
}

.favorites-saved-pill {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce5ef;
  border-radius: 999px;
  color: #1c2e4a;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
}

.favorites-saved-pill svg {
  color: #16a35f;
}

.favorites-toolbar {
  align-items: center;
  border-bottom: 1px solid #e4ebf3;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-top: 18px;
  padding-bottom: 10px;
}

.favorites-tabs {
  display: flex;
  gap: 4px;
}

.favorites-tabs button {
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: #4f617c;
  font-size: 15px;
  font-weight: 800;
  min-height: 38px;
  padding: 0 10px;
}

.favorites-tabs button.active {
  border-bottom-color: #14a15d;
  color: #14a15d;
}

.favorites-controls {
  align-items: center;
  display: flex;
  gap: 10px;
}

.favorites-sort-control {
  align-items: center;
  background: #fdfefe;
  border: 1px solid #d8e1ec;
  border-radius: 10px;
  color: #52627b;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 4px;
  min-height: 40px;
  padding: 0 11px;
  position: relative;
}

.favorites-sort-control span {
  color: #61728b;
  font-size: 12px;
  font-weight: 700;
}

.favorites-sort-control select {
  appearance: none;
  background: transparent;
  border: 0;
  color: #1f304a;
  font-size: 13px;
  font-weight: 800;
  min-height: 36px;
  padding: 0 20px 0 2px;
}

.favorites-sort-control::after {
  border-bottom: 1.7px solid #52637d;
  border-right: 1.7px solid #52637d;
  content: '';
  height: 6px;
  pointer-events: none;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-62%) rotate(45deg);
  width: 6px;
}

.favorites-sort-control:focus-within {
  border-color: #16a15d;
  box-shadow: 0 0 0 3px rgba(22, 161, 93, 0.14);
}

.favorites-sort-control select:focus {
  outline: none;
}

.favorites-filter-button {
  align-items: center;
  background: #fdfefe;
  border: 1px solid #d8e1ec;
  border-radius: 10px;
  color: #22324d;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  min-height: 40px;
  padding: 0 14px;
}

.favorites-filter-button:hover {
  background: #ffffff;
  border-color: #c8d6e7;
}

.favorites-filter-button.active {
  background: #eaf7ef;
  border-color: #bfe7cf;
  color: #157d4c;
}

.favorites-filter-button.subtle {
  color: #4f617a;
}

.favorites-filters-panel {
  background: linear-gradient(180deg, #fbfdff 0%, #f5f9ff 100%);
  border: 1px solid #dce7f3;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
}

.favorites-search-input {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d5e1ef;
  border-radius: 10px;
  display: flex;
  gap: 8px;
  min-height: 40px;
  padding: 0 11px;
}

.favorites-search-input svg {
  color: #7387a3;
  font-size: 14px;
}

.favorites-search-input input {
  background: transparent;
  border: 0;
  color: #1f304a;
  flex: 1;
  font-size: 13px;
  font-weight: 700;
  min-width: 0;
}

.favorites-search-input input:focus {
  outline: none;
}

.favorites-quick-toggles {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.favorites-quick-toggles button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d7e3f1;
  border-radius: 999px;
  color: #3e5574;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  min-height: 34px;
  padding: 0 11px;
}

.favorites-quick-toggles button:hover {
  border-color: #bdd2e8;
}

.favorites-quick-toggles button.active {
  background: #e9f7ef;
  border-color: #b9e4ca;
  color: #187947;
}

.favorites-filter-button svg {
  color: #5f6f86;
  font-size: 13px;
}

.favorites-layout {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) 300px;
  margin-top: 18px;
}

.favorites-list {
  display: grid;
  gap: 12px;
}

.favorite-card {
  background: #ffffff;
  border: 1px solid #e2e9f2;
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(20, 38, 63, 0.05);
  display: grid;
  gap: 12px;
  grid-template-columns: 300px minmax(0, 1fr) auto;
  min-height: 168px;
  padding: 9px;
}

.favorite-card.empty {
  align-items: center;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  min-height: 220px;
  padding: 28px 20px;
  text-align: center;
}

.favorite-card.empty .favorite-content {
  max-width: 460px;
  padding-top: 0;
}

.favorite-card.empty .favorite-content p {
  display: block;
  margin: 10px 0 0;
}

.favorite-empty-cta {
  align-items: center;
  background: #169a5b;
  border: 0;
  border-radius: 10px;
  color: #ffffff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 8px;
  margin-top: 14px;
  min-height: 40px;
  padding: 0 16px;
}

.favorite-empty-cta:hover {
  background: #12844d;
}

.favorite-empty-cta svg {
  font-size: 14px;
  stroke-width: 2.4;
}

.favorite-photo {
  background-position: center;
  background-size: cover;
  border-radius: 10px;
  min-height: 148px;
  position: relative;
}

.favorite-badge {
  background: #e8f7ef;
  border-radius: 8px;
  color: #129457;
  font-size: 12px;
  font-weight: 800;
  left: 10px;
  padding: 4px 9px;
  position: absolute;
  top: 10px;
}

.favorite-badge.rent {
  background: #eaf2ff;
  color: #3b6fdb;
}

.favorite-photos-count {
  align-items: center;
  background: rgba(17, 27, 42, 0.86);
  border-radius: 7px;
  bottom: 8px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  left: 8px;
  min-height: 25px;
  padding: 0 8px;
  position: absolute;
}

.favorite-content {
  padding-top: 4px;
}

.favorite-content strong {
  color: #192a45;
  display: block;
  font-size: 22px;
  line-height: 1;
}

.favorite-content h3 {
  color: #14233d;
  font-size: 17px;
  margin: 8px 0 0;
}

.favorite-content p {
  align-items: center;
  color: #62738d;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 6px;
  margin: 8px 0 0;
}

.favorite-content p svg {
  color: #7a8ca6;
  font-size: 13px;
}

.favorite-content ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}

.favorite-content li {
  align-items: center;
  color: #455a75;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
}

.favorite-content li svg {
  color: #6f819b;
  font-size: 13px;
}

.favorite-content small {
  color: #7a8ca4;
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-top: 10px;
}

.favorite-actions {
  align-self: start;
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  position: relative;
}

.favorite-actions button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #71829c;
  display: grid;
  height: 24px;
  place-items: center;
  width: 24px;
}

.favorite-actions .favorite-like {
  color: #e14c56;
}

.favorite-actions .favorite-like svg {
  fill: currentColor;
  stroke: none;
}

.favorite-more {
  color: #000000;
}

.favorite-more svg {
  font-size: 16px;
  stroke-width: 3.6;
}

.favorite-actions button:hover {
  background: transparent;
  opacity: 0.8;
}

.favorite-menu {
  background: #ffffff;
  border: 1px solid #d6e1ee;
  border-radius: 10px;
  box-shadow: 0 14px 28px rgba(24, 40, 62, 0.14);
  display: grid;
  min-width: 196px;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
}

.favorite-menu button {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-bottom: 1px solid #edf2f7;
  border-radius: 0;
  color: #1d2f49;
  display: flex;
  font-size: 13px;
  font-weight: 700;
  height: auto;
  justify-content: flex-start;
  min-height: 38px;
  opacity: 1;
  padding: 0 12px;
  width: 100%;
}

.favorite-menu button:last-child {
  border-bottom: 0;
}

.favorite-menu button:hover {
  background: #f5f8fc;
  opacity: 1;
}

.favorite-menu button:disabled {
  color: #9aa8ba;
  cursor: default;
}

.favorites-feedback {
  align-items: center;
  background: #edf7f1;
  border: 1px solid #cce8d9;
  border-radius: 10px;
  color: #2f5f45;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  margin: 10px 0 0;
  min-height: 34px;
  padding: 0 11px;
}

.favorites-contact-overlay {
  align-items: center;
  background: rgba(11, 21, 38, 0.42);
  backdrop-filter: blur(3px);
  display: grid;
  inset: 0;
  padding: 16px;
  position: fixed;
  z-index: 140;
}

.favorites-contact-modal {
  background: linear-gradient(180deg, #f4fff9 0%, #ffffff 48%);
  border: 1px solid #d8ebdf;
  border-radius: 16px;
  box-shadow: 0 18px 46px rgba(15, 33, 26, 0.2);
  margin: 0 auto;
  max-width: 430px;
  padding: 20px 18px 16px;
  position: relative;
  width: 100%;
}

.favorites-contact-close {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #60758d;
  font-size: 30px;
  line-height: 1;
  position: absolute;
  right: 9px;
  top: 8px;
}

.favorites-contact-close:hover {
  background: #edf6f1;
}

.favorites-contact-badge {
  align-items: center;
  background: linear-gradient(180deg, #1db46a 0%, #149558 100%);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(20, 149, 88, 0.28);
  color: #ffffff;
  display: inline-grid;
  height: 44px;
  place-items: center;
  width: 44px;
}

.favorites-contact-modal h2 {
  color: #1d3048;
  font-size: 30px;
  line-height: 1.08;
  margin: 12px 28px 10px 0;
}

.favorites-contact-modal p {
  margin: 0;
}

.favorites-contact-modal p strong {
  color: #1e334d;
  display: block;
  font-size: 16px;
  line-height: 1.3;
}

.favorites-contact-modal p small {
  color: #6c8099;
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-top: 4px;
}

.favorites-contact-phone {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cbe4d6;
  border-radius: 11px;
  color: #196c42;
  display: inline-flex;
  font-size: 20px;
  font-weight: 900;
  gap: 10px;
  margin-top: 14px;
  min-height: 52px;
  padding: 0 15px;
  text-decoration: none;
}

.favorites-contact-phone:hover {
  background: #f2fbf6;
}

.favorites-contact-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}

.favorites-contact-actions button {
  background: #ffffff;
  border: 1px solid #d6e3f0;
  border-radius: 8px;
  color: #2f4662;
  font-size: 14px;
  font-weight: 800;
  min-height: 40px;
  padding: 0 14px;
}

.favorites-sidebar {
  align-self: start;
  display: grid;
  gap: 12px;
  position: sticky;
  top: 96px;
}

.favorites-side-card,
.favorites-side-note {
  background: #ffffff;
  border: 1px solid #e1e9f2;
  border-radius: 12px;
  padding: 14px;
}

.favorites-side-card h2 {
  color: #20304a;
  font-size: 17px;
  margin: 0;
}

.favorites-side-card ul {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}

.favorites-side-card li {
  align-items: center;
  color: #3f516e;
  display: flex;
  justify-content: space-between;
}

.favorites-side-card li span {
  align-items: center;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
}

.favorites-side-card li span svg {
  color: #16a35f;
  font-size: 14px;
}

.favorites-side-card li strong {
  color: #61728a;
  font-size: 13px;
}

.favorites-side-card button {
  align-items: center;
  background: transparent;
  border: 0;
  border-top: 1px solid #e7edf5;
  color: #6a7c93;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 7px;
  margin-top: 12px;
  min-height: 36px;
  padding: 8px 0 0;
}

.favorites-side-card button + button {
  margin-top: 2px;
}

.favorites-side-note {
  align-items: start;
  background: #f2f8f4;
  border-color: #deece3;
  display: grid;
  gap: 10px;
  grid-template-columns: 28px minmax(0, 1fr);
  padding: 12px 12px;
}

.favorites-side-note-icon {
  align-items: center;
  align-self: center;
  color: #19a663;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.favorites-side-note-icon svg {
  height: 21px;
  width: 21px;
}

.favorites-side-note-copy strong {
  color: #1f3f30;
  display: block;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

.favorites-side-note-copy p {
  color: #4d6b5a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  margin: 4px 0 0;
}

.account-page {
  background: #f5f7fa;
  min-height: calc(100vh - 82px);
  padding: 16px 18px;
}

.account-layout {
  display: grid;
  gap: 14px;
  grid-template-columns: 256px minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1820px;
}

.account-sidebar,
.account-panel,
.account-profile-card,
.account-stats article {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 10px;
}

.account-sidebar {
  align-self: start;
  background: linear-gradient(180deg, #ffffff 0%, #fcfffd 100%);
  border: 1px solid #dfe8f2;
  border-radius: 18px;
  box-shadow: 0 18px 44px -34px rgba(21, 54, 82, 0.45);
  display: grid;
  gap: 10px;
  padding: 10px;
  position: sticky;
  top: 94px;
}

.account-profile-card {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 34px minmax(0, 1fr);
  padding: 10px;
}

.account-avatar {
  align-items: center;
  background: #e8f4ff;
  border-radius: 999px;
  color: #20344f;
  display: grid;
  font-size: 15px;
  font-weight: 800;
  height: 34px;
  line-height: 1;
  place-items: center;
  width: 34px;
}

.account-profile-card strong {
  color: #13243d;
  display: block;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.25;
}

.account-profile-card small {
  color: #5f7187;
  display: block;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 2px;
}

.account-profile-card em {
  background: #e8f8ef;
  border-radius: 999px;
  color: #109253;
  display: inline-block;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  margin-top: 7px;
  padding: 3px 8px;
}

.account-profile-card em.pending {
  background: #fff4e0;
  color: #b8770a;
}

.account-menu {
  padding: 2px 4px;
}

.account-menu h3 {
  color: #6f7d90;
  font-size: 10px;
  letter-spacing: 0.02em;
  margin: 8px 6px 6px;
  text-transform: uppercase;
}

.account-menu button, .account-menu a {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #27384f;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  min-height: 33px;
  padding: 0 8px;
  text-align: left;
  width: 100%;
}

.account-menu button svg, .account-menu a svg {
  color: #7d8ca0;
  font-size: 14px;
}

.account-menu button span, .account-menu a span {
  background: #e8f8ef;
  border-radius: 999px;
  color: #109253;
  font-size: 10px;
  font-weight: 900;
  padding: 1px 6px;
}

.account-menu button .tag, .account-menu a .tag {
  border-radius: 4px;
  font-size: 9px;
  padding: 1px 5px;
}

.account-menu button.active, .account-menu a.active {
  background: #ebf6f0;
  color: #109253;
}

.account-premium-card {
  background: #fbfcfe;
  border: 1px solid #e3e9f0;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  margin-top: 6px;
  padding: 10px;
}

.account-premium-card strong {
  align-items: center;
  color: #22364e;
  display: inline-flex;
  font-size: 12px;
  gap: 6px;
}

.account-premium-card strong svg {
  color: #16a464;
  font-size: 15px;
}

.account-premium-card p {
  color: #6d7c8f;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.35;
  margin: 6px 0 0;
}

.account-premium-card button {
  background: #16a464;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  height: 34px;
  width: 100%;
}

.account-main {
  display: grid;
  gap: 12px;
  align-content: start;
}

.account-help-contact-page {
  background: linear-gradient(180deg, #f6f8fb 0%, #eef3f7 100%);
}

.help-contact-panel {
  background: #f6f8fb;
  border: 1px solid #dee7f0;
  border-radius: 16px;
  display: grid;
  gap: 18px;
  padding: 18px;
}

.help-contact-header {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.help-contact-header h1 {
  color: #192b45;
  font-size: 38px;
  line-height: 1.02;
  margin: 0;
}

.help-contact-header p {
  color: #5f7187;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.45;
  margin: 10px 0 0;
  max-width: 640px;
}

.help-contact-visual {
  align-items: center;
  background: radial-gradient(circle at 20% 20%, rgba(12, 165, 95, 0.13), rgba(12, 165, 95, 0));
  border-radius: 999px;
  display: inline-flex;
  gap: 14px;
  padding: 10px 16px;
}

.help-contact-visual span,
.help-contact-visual strong {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  justify-content: center;
}

.help-contact-visual span {
  background: #f4fbf7;
  border: 1px solid #d9ece2;
  color: #44aa75;
  font-size: 18px;
  height: 34px;
  width: 34px;
}

.help-contact-visual strong {
  background: #ddf6e8;
  border: 1px solid #c9ead9;
  color: #109a5a;
  font-size: 22px;
  font-weight: 700;
  height: 48px;
  width: 48px;
}

.help-contact-section {
  background: #ffffff;
  border: 1px solid #dfe7f0;
  border-radius: 12px;
  padding: 16px;
}

.help-contact-section > h2 {
  color: #1d2f49;
  font-size: 30px;
  margin: 0 0 14px;
}

.help-contact-channel-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.help-contact-channel-card {
  background: #ffffff;
  border: 1px solid #e3e9f1;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-height: 190px;
  padding: 14px;
}

.help-contact-channel-head {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: 40px minmax(0, 1fr);
}

.help-contact-channel-icon,
.help-contact-more-icon {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 19px;
  height: 40px;
  justify-content: center;
  width: 40px;
}

.help-contact-channel-icon.green,
.help-contact-more-icon.green {
  background: #e6f8ef;
  color: #109a5a;
}

.help-contact-channel-icon.blue,
.help-contact-more-icon.blue {
  background: #e8f0ff;
  color: #2f6de3;
}

.help-contact-channel-icon.violet {
  background: #f0ecff;
  color: #7454d8;
}

.help-contact-channel-icon.orange {
  background: #fff0df;
  color: #ef9123;
}

.help-contact-more-icon.gold {
  background: #fff4d8;
  color: #c78907;
}

.help-contact-more-icon.red {
  background: #ffe7eb;
  color: #d63c5f;
}

.help-contact-channel-head h3 {
  color: #1f3049;
  font-size: 16px;
  margin: 0;
}

.help-contact-channel-head em {
  background: #ddf5e8;
  border-radius: 999px;
  color: #109253;
  display: inline-block;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  margin-top: 5px;
  padding: 3px 7px;
}

.help-contact-channel-card p {
  color: #5f7187;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.42;
  margin: 0;
}

.help-contact-channel-action {
  align-items: center;
  background: transparent;
  border: 0;
  border-top: 1px solid #e5ecf4;
  color: #3e546f;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  justify-content: space-between;
  margin-top: auto;
  min-height: 40px;
  padding: 9px 0 0;
  width: 100%;
}

.help-contact-channel-action svg {
  font-size: 15px;
  transform: rotate(-90deg);
}

.help-contact-middle-grid {
  background: transparent;
  border: 0;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  padding: 0;
}

.help-contact-faq-card,
.help-contact-form-card {
  background: #ffffff;
  border: 1px solid #dfe7f0;
  border-radius: 12px;
  padding: 16px;
}

.help-contact-form-card {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.help-contact-form-card.is-highlighted {
  animation: helpContactFormHighlight 3s ease;
  border-color: #1ab069;
  box-shadow: 0 0 0 3px rgba(17, 163, 95, 0.22);
}

@keyframes helpContactFormHighlight {
  0% {
    border-color: #1ab069;
    box-shadow: 0 0 0 0 rgba(17, 163, 95, 0.35);
  }

  25% {
    border-color: #14a661;
    box-shadow: 0 0 0 6px rgba(17, 163, 95, 0.22);
  }

  60% {
    border-color: #28b975;
    box-shadow: 0 0 0 4px rgba(17, 163, 95, 0.18);
  }

  100% {
    border-color: #dfe7f0;
    box-shadow: 0 0 0 0 rgba(17, 163, 95, 0);
  }
}

.help-contact-faq-card header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.help-contact-faq-card h2,
.help-contact-form-card h2 {
  color: #1d2f49;
  font-size: 24px;
  margin: 0;
}

.help-contact-faq-card header button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #0f9c5b;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  padding: 0;
}

.help-contact-faq-card header button svg,
.help-contact-more-card button svg {
  font-size: 14px;
}

.help-contact-faq-list {
  display: grid;
  gap: 8px;
}

.help-contact-faq-list details {
  border: 1px solid #e3eaf2;
  border-radius: 8px;
  padding: 0 12px;
}

.help-contact-faq-list summary {
  align-items: center;
  color: #2a3d57;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 800;
  justify-content: space-between;
  list-style: none;
  min-height: 44px;
}

.help-contact-faq-list summary::-webkit-details-marker {
  display: none;
}

.help-contact-faq-list summary svg {
  color: #7a8ca2;
  font-size: 14px;
  transform: rotate(0deg);
  transition: transform 0.16s ease;
}

.help-contact-faq-list details[open] summary svg {
  transform: rotate(180deg);
}

.help-contact-faq-list details p {
  color: #60748c;
  font-size: 12px;
  font-weight: 740;
  line-height: 1.42;
  margin: 0 0 12px;
}

.help-contact-form-card form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.help-contact-form-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.help-contact-form-card input,
.help-contact-form-card select,
.help-contact-form-card textarea {
  background: #fbfdff;
  border: 1px solid #dde5ef;
  border-radius: 8px;
  color: #2a3d57;
  font-size: 13px;
  font-weight: 760;
  min-height: 44px;
  padding: 0 12px;
}

.help-contact-form-card textarea {
  min-height: 128px;
  padding: 11px 12px;
  resize: vertical;
}

.help-contact-form-card button {
  background: linear-gradient(90deg, #10a15e 0%, #0fbf6b 100%);
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  min-height: 44px;
}

.help-contact-form-card button:disabled {
  cursor: not-allowed;
  opacity: 0.72;
}

.help-contact-form-feedback {
  border-radius: 8px;
  font-size: 12px;
  font-weight: 820;
  line-height: 1.4;
  margin: 0;
  padding: 10px 12px;
}

.help-contact-form-feedback.success {
  background: #e8f8ef;
  border: 1px solid #ccebd9;
  color: #0b8d4f;
}

.help-contact-form-feedback.error {
  background: #fff1f3;
  border: 1px solid #ffd8de;
  color: #bd2f54;
}

.help-contact-more-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.help-contact-more-card {
  background: #ffffff;
  border: 1px solid #e3eaf2;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 180px;
  padding: 14px;
}

.help-contact-more-card h3 {
  color: #1f3049;
  font-size: 15px;
  margin: 0;
}

.help-contact-more-card p {
  color: #5f7187;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.42;
  margin: 8px 0 14px;
}

.help-contact-more-card button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #109253;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  padding: 0;
}

@media (max-width: 1280px) {
  .help-contact-channel-grid,
  .help-contact-more-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .help-contact-middle-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .help-contact-header {
    grid-template-columns: 1fr;
  }

  .help-contact-header h1,
  .help-contact-section > h2,
  .help-contact-faq-card h2,
  .help-contact-form-card h2 {
    font-size: 24px;
  }

  .help-contact-form-row,
  .help-contact-channel-grid,
  .help-contact-more-grid {
    grid-template-columns: 1fr;
  }
}

.account-listings-page {
  background: linear-gradient(180deg, #f4f7fb 0%, #eef3f8 100%);
}

.listings-head h1 {
  align-items: center;
  display: inline-flex;
  gap: 10px;
}

.listings-head h1 small {
  background: #e8f8ef;
  border-radius: 999px;
  color: #129357;
  font-size: 13px;
  font-weight: 900;
  padding: 4px 10px;
}

.listings-toolbar-card,
.listings-table {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 10px;
  padding: 12px;
}

.listings-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.listings-tabs button {
  background: #f5f8fc;
  border: 1px solid #e0e8f2;
  border-radius: 8px;
  color: #3a4d67;
  font-size: 12px;
  font-weight: 900;
  height: 34px;
  padding: 0 12px;
}

.listings-tabs button.active {
  background: #14995b;
  border-color: #14995b;
  color: #ffffff;
}

.listings-actions-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(240px, 1fr);
  margin-top: 10px;
}

.listings-search {
  align-items: center;
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #7a8ba2;
  display: flex;
  gap: 8px;
  height: 38px;
  padding: 0 10px;
}

.listings-search input {
  border: 0;
  color: #2f445d;
  flex: 1;
  font-size: 12px;
  font-weight: 800;
  min-width: 0;
}

.listings-search input:focus {
  outline: none;
}

.listings-actions-row select {
  background: #f8fbff;
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #344860;
  font-size: 12px;
  font-weight: 800;
  height: 38px;
  padding: 0 10px;
}

.listings-promoted-filter {
  align-items: center;
  color: #445a73;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  white-space: nowrap;
}

.listings-promoted-filter input {
  accent-color: #109253;
}

.listings-add-new {
  align-items: center;
  background: #0f1f39;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  height: 38px;
  justify-content: center;
  padding: 0 13px;
  white-space: nowrap;
}

.listings-feedback {
  background: #ecf7f1;
  border: 1px solid #d5eadc;
  border-radius: 8px;
  color: #21553b;
  font-size: 12px;
  font-weight: 800;
  margin: 0;
  padding: 9px 11px;
}

.listings-table {
  display: grid;
  gap: 8px;
}

.listings-empty {
  border: 1px dashed #d8e2ee;
  border-radius: 9px;
  color: #576b84;
  display: grid;
  gap: 6px;
  justify-items: center;
  min-height: 110px;
  padding: 20px;
  place-content: center;
}

.listings-empty strong {
  color: #22364e;
  font-size: 13px;
}

.listings-empty small {
  font-size: 11px;
  font-weight: 700;
}

.listing-row {
  align-items: center;
  border: 1px solid #e5ebf2;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: 120px minmax(210px, 1fr) minmax(150px, 0.9fr) 140px 86px 86px minmax(180px, 0.8fr);
  min-height: 96px;
  padding: 8px;
}

.listing-photo {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 8px;
  height: 74px;
  width: 120px;
}

.listing-main-copy h3 {
  color: #1a2d47;
  font-size: 16px;
  margin: 0;
}

.listing-main-copy p {
  color: #60748d;
  font-size: 12px;
  font-weight: 750;
  margin: 4px 0 0;
}

.listing-main-copy small {
  color: #71849b;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 5px;
}

.listing-price-box strong {
  color: #1f3047;
  display: block;
  font-size: 26px;
  line-height: 1;
}

.listing-price-box small {
  color: #62748c;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 5px;
}

.listing-inline-edit {
  display: grid;
  gap: 6px;
}

.listing-inline-edit label {
  color: #58708a;
  display: grid;
  font-size: 10px;
  font-weight: 900;
  gap: 4px;
}

.listing-inline-edit input {
  border: 1px solid #d6e1ee;
  border-radius: 7px;
  color: #1e3047;
  font-size: 12px;
  font-weight: 800;
  height: 32px;
  padding: 0 8px;
}

.listing-status span {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  min-height: 22px;
  padding: 0 9px;
}

.listing-status.active span {
  background: #e9f7ef;
  color: #129357;
}

.listing-status.paused span {
  background: #fff5df;
  color: #c98a00;
}

.listing-status.archived span {
  background: #eff3f7;
  color: #607084;
}

.listing-status small {
  color: #667a93;
  display: block;
  font-size: 10px;
  font-weight: 800;
  margin-top: 5px;
}

.listing-status em {
  background: #e8f1ff;
  border-radius: 999px;
  color: #2f68d8;
  display: inline-block;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  margin-top: 6px;
  padding: 2px 7px;
}

.listing-metrics strong {
  align-items: center;
  color: #263a53;
  display: inline-flex;
  font-size: 18px;
  font-weight: 900;
  gap: 5px;
}

.listing-metrics strong svg {
  color: #7f8da0;
  height: 13px;
  width: 13px;
}

.listing-metrics small {
  color: #6f8198;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 4px;
}

.listing-actions {
  display: grid;
  gap: 6px;
}

.listing-actions button {
  background: #14995b;
  border: 0;
  border-radius: 7px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  height: 30px;
  padding: 0 10px;
}

.listing-actions button.ghost {
  background: #ffffff;
  border: 1px solid #d6e0ec;
  color: #334a63;
}

.listing-actions button.ghost.danger {
  border-color: #f0b9bf;
  color: #d33a46;
}

.listing-delete-overlay {
  align-items: center;
  background: rgba(19, 31, 51, 0.35);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 20px;
  position: fixed;
  z-index: 50;
}

.listing-delete-modal {
  background: #ffffff;
  border: 1px solid #e4e9f1;
  border-radius: 16px;
  max-width: 520px;
  padding: 18px;
  position: relative;
  width: min(100%, 520px);
}

.listing-delete-close {
  background: transparent;
  border: 0;
  color: #7e8da0;
  font-size: 26px;
  line-height: 1;
  padding: 0;
  position: absolute;
  right: 12px;
  top: 8px;
}

.listing-delete-icon {
  align-items: center;
  background: #ffecee;
  border-radius: 999px;
  color: #e33f4b;
  display: grid;
  height: 52px;
  margin: 6px auto 12px;
  place-items: center;
  width: 52px;
}

.listing-delete-icon svg {
  height: 24px;
  width: 24px;
}

.listing-delete-modal h2 {
  color: #1d3049;
  font-size: 34px;
  margin: 0;
  text-align: center;
}

.listing-delete-modal > p {
  color: #5d6f86;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.4;
  margin: 10px 0 14px;
  text-align: center;
}

.listing-delete-reasons > strong {
  color: #2b3d56;
  display: block;
  font-size: 13px;
  margin-bottom: 8px;
}

.listing-delete-reasons > strong small {
  color: #7f8fa4;
  font-weight: 700;
}

.listing-delete-reasons {
  display: grid;
  gap: 8px;
}

.listing-delete-reasons button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dde5ee;
  border-radius: 10px;
  color: #20314a;
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 16px;
  min-height: 62px;
  padding: 10px 12px;
  text-align: left;
}

.listing-delete-reasons button span b {
  display: block;
  font-size: 12px;
}

.listing-delete-reasons button span small {
  color: #6f8094;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 4px;
}

.listing-delete-reasons button i {
  border: 1px solid #b8c5d4;
  border-radius: 999px;
  display: block;
  height: 14px;
  width: 14px;
}

.listing-delete-reasons button.active {
  border-color: #e9b8bc;
}

.listing-delete-reasons button.active i {
  background: #e33f4b;
  border-color: #e33f4b;
}

.listing-delete-actions {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin-top: 12px;
}

.listing-delete-actions button {
  border-radius: 9px;
  font-size: 13px;
  font-weight: 900;
  height: 42px;
}

.listing-delete-actions .secondary {
  background: #ffffff;
  border: 1px solid #d6e0ec;
  color: #34495f;
}

.listing-delete-actions .danger {
  background: #e33f4b;
  border: 0;
  color: #ffffff;
}

.listing-pause-modal {
  background: #ffffff;
  border: 1px solid #e4e9f1;
  border-radius: 16px;
  max-width: 520px;
  padding: 18px;
  position: relative;
  width: min(100%, 520px);
}

.listing-pause-icon {
  align-items: center;
  background: #fff3e7;
  border-radius: 999px;
  color: #ec9a22;
  display: grid;
  height: 52px;
  margin: 6px auto 12px;
  place-items: center;
  width: 52px;
}

.listing-pause-icon svg {
  height: 23px;
  width: 23px;
}

.listing-pause-modal h2 {
  color: #1d3049;
  font-size: 34px;
  margin: 0;
  text-align: center;
}

.listing-pause-description {
  color: #5d6f86;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.4;
  margin: 10px 0 14px;
  text-align: center;
}

.listing-pause-options {
  display: grid;
  gap: 8px;
}

.listing-pause-options > strong {
  color: #2b3d56;
  display: block;
  font-size: 13px;
  margin-bottom: 2px;
}

.listing-pause-options button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dde5ee;
  border-radius: 10px;
  color: #20314a;
  display: grid;
  gap: 10px;
  grid-template-columns: 30px 1fr 16px;
  min-height: 62px;
  padding: 10px 12px;
  text-align: left;
}

.listing-pause-option-icon {
  align-items: center;
  background: #f3f7fb;
  border-radius: 8px;
  color: #596a81;
  display: grid;
  height: 24px;
  place-items: center;
  width: 24px;
}

.listing-pause-option-icon svg {
  height: 12px;
  width: 12px;
}

.listing-pause-options button span b {
  display: block;
  font-size: 12px;
}

.listing-pause-options button span small {
  color: #6f8094;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 4px;
}

.listing-pause-options button i {
  border: 1px solid #b8c5d4;
  border-radius: 999px;
  display: block;
  height: 14px;
  width: 14px;
}

.listing-pause-options button.active {
  border-color: #9cd7b3;
}

.listing-pause-options button.active .listing-pause-option-icon {
  background: #e9f7ef;
  color: #14995b;
}

.listing-pause-options button.active i {
  background: #14995b;
  border-color: #14995b;
}

.listing-pause-note {
  align-items: center;
  background: #ecf8f1;
  border: 1px solid #d8ecdf;
  border-radius: 8px;
  color: #3a6a4f;
  display: grid;
  font-size: 9px;
  font-weight: 600;
  gap: 6px;
  grid-template-columns: 12px minmax(0, 1fr);
  letter-spacing: 0;
  line-height: 1.25;
  margin: 8px 0 0;
  padding: 6px 8px;
}

.listing-pause-note svg {
  color: #14995b;
  height: 10px;
  width: 10px;
}

.listing-delete-actions .confirm {
  background: #14995b;
  border: 0;
  color: #ffffff;
}

@media (max-width: 1460px) {
  .listing-row {
    grid-template-columns: 120px minmax(210px, 1fr) minmax(150px, 1fr) 120px 90px 90px;
  }

  .listing-actions {
    grid-column: 2 / -1;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .listings-actions-row {
    grid-template-columns: 1fr;
  }

  .listing-row {
    grid-template-columns: 1fr;
  }

  .listing-photo {
    height: 170px;
    width: 100%;
  }

  .listing-actions {
    grid-template-columns: 1fr 1fr;
  }
}

.messages-page {
  background: #f7f9fc;
  min-height: calc(100vh - 82px);
  height: calc(100vh - 82px);
  display: flex;
  padding: 12px;
}

.messages-shell {
  margin: 0 auto;
  max-width: 1800px;
  width: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.messages-page .messages-breadcrumb {
  align-items: center;
  color: #718094;
  display: inline-flex;
  gap: 8px;
  margin: 2px 0 8px;
}

.messages-page .messages-breadcrumb button, .messages-page .messages-breadcrumb a {
  background: transparent;
  border: 0;
  color: #718094;
  font-size: 12px;
  font-weight: 800;
  padding: 0;
}

.messages-page .messages-breadcrumb button.active, .messages-page .messages-breadcrumb a.active {
  color: #14223a;
}

.messages-page .messages-breadcrumb svg {
  font-size: 12px;
  transform: rotate(-90deg);
}

.messages-header h1 {
  color: #13243d;
  font-size: 46px;
  line-height: 1;
  margin: 6px 0 16px;
}

.messages-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: 320px minmax(0, 1fr) 300px;
  min-height: 0;
}

.messages-threads,
.messages-chat,
.messages-details {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  min-height: 0;
  height: 100%;
}

.messages-threads {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.messages-search-row {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 36px;
  padding: 12px;
}

.messages-search-row > button {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #7588a2;
  display: grid;
  line-height: 0;
  place-items: center;
  padding: 0;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.messages-search-row > button svg {
  height: 14px;
  width: 14px;
}

.messages-search-row > button.active {
  background: #edf5ff;
  border-color: #d4e4fb;
  color: #2f5ea6;
}

.messages-search-input {
  align-items: center;
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #7a8ba2;
  display: flex;
  gap: 8px;
  height: 38px;
  padding: 0 10px;
}

.messages-search-input input {
  border: 0;
  color: #31465f;
  flex: 1;
  font-size: 13px;
  font-weight: 700;
  min-width: 0;
}

.messages-search-input input:focus,
.messages-composer input:focus {
  outline: none;
}

.messages-filters {
  border-top: 1px solid #edf2f7;
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  padding: 8px 10px;
  pointer-events: none;
  transform: translateY(-4px);
  transition: max-height 0.22s ease, opacity 0.2s ease, transform 0.2s ease;
}

.messages-filters.open {
  max-height: 64px;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.messages-filters button {
  align-items: center;
  background: #f7f9fc;
  border: 1px solid #e1e8f1;
  border-radius: 8px;
  color: #51667f;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  gap: 4px;
  height: 28px;
  justify-content: center;
  min-width: 0;
  padding: 0 6px;
  width: 100%;
  white-space: nowrap;
}

.messages-filters button.active {
  background: #e9f6ee;
  border-color: #cbe8d8;
  color: #167e4e;
}

.messages-filters button span {
  align-items: center;
  background: #ffffff;
  border-radius: 999px;
  display: inline-flex;
  font-size: 10px;
  height: 16px;
  justify-content: center;
  min-width: 16px;
  padding: 0 5px;
}

.messages-thread-list {
  border-top: 1px solid #edf2f7;
  overflow: auto;
}

.messages-empty-list {
  color: #70839c;
  font-size: 12px;
  font-weight: 700;
  margin: 16px 12px;
}

.messages-thread-list button {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #edf2f7;
  display: grid;
  gap: 10px;
  grid-template-columns: 34px minmax(0, 1fr) 56px;
  min-height: 72px;
  padding: 0 12px;
  text-align: left;
  width: 100%;
}

.messages-thread-list button.active {
  background: #edf7f2;
}

.messages-thread-avatar,
.messages-chat-user > span,
.message-avatar {
  background-color: #dce6f3;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 999px;
}

.messages-thread-avatar {
  height: 32px;
  width: 32px;
}

.messages-thread-copy {
  min-width: 0;
}

.messages-thread-copy strong {
  color: #1a2d47;
  display: block;
  font-size: 13px;
  line-height: 1.1;
}

.messages-thread-copy small {
  color: #637792;
  display: block;
  font-size: 12px;
  line-height: 1.25;
  margin-top: 4px;
}

.messages-thread-meta {
  align-content: center;
  display: grid;
  gap: 6px;
  justify-items: center;
  min-width: 56px;
  text-align: center;
}

.messages-thread-meta em {
  color: #72839a;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  justify-self: center;
}

.messages-thread-meta i {
  align-items: center;
  background: #17a764;
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  line-height: 1;
  width: 18px;
}

.messages-chat {
  display: grid;
  grid-template-rows: 58px minmax(0, 1fr) 56px;
}

.messages-chat-head {
  align-items: center;
  border-bottom: 1px solid #e8eef5;
  display: flex;
  justify-content: space-between;
  padding: 0 14px;
}

.messages-chat-user {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 32px minmax(0, 1fr);
}

.messages-chat-user > span {
  height: 32px;
  width: 32px;
}

.messages-chat-user strong {
  color: #162841;
  display: block;
  font-size: 15px;
  line-height: 1;
}

.messages-chat-user small {
  color: #6e8199;
  font-size: 11px;
  font-weight: 700;
}

.messages-chat-listing {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 42px minmax(0, 1fr) auto 18px;
}

.messages-chat-listing img {
  border-radius: 6px;
  height: 32px;
  object-fit: cover;
  width: 42px;
}

.messages-chat-listing strong {
  color: #162841;
  display: block;
  font-size: 12px;
  line-height: 1.2;
}

.messages-chat-listing small {
  color: #182c45;
  font-size: 12px;
  font-weight: 900;
}

.messages-chat-listing button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #7a8da5;
  display: grid;
  line-height: 0;
  place-items: center;
  padding: 0;
}

.messages-chat-listing .messages-mark-read {
  background: #edf5ff;
  border: 1px solid #d4e4fb;
  border-radius: 7px;
  color: #2e5fa9;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  height: 26px;
  line-height: 1;
  padding: 0 10px;
}

.messages-bubbles {
  display: grid;
  gap: 14px;
  overflow: auto;
  padding: 18px 14px;
}

.message-row {
  align-items: flex-end;
  display: grid;
  gap: 10px;
  grid-template-columns: 30px minmax(0, auto);
}

.message-row.mine {
  grid-template-columns: minmax(0, auto);
  justify-content: end;
}

.message-avatar {
  height: 28px;
  width: 28px;
}

.messages-bubbles article {
  background: #ffffff;
  border: 1px solid #dfe6ef;
  border-radius: 10px;
  max-width: 420px;
  padding: 12px 14px;
}

.message-row.mine article {
  background: #eaf8f0;
  border-color: #d9ebdf;
  max-width: 500px;
}

.messages-bubbles p {
  color: #23374f;
  font-size: 13px;
  line-height: 1.32;
  margin: 0;
}

.message-attachment-card {
  align-items: flex-start;
  background: #f2f7f4;
  border: 1px solid #d7e8dd;
  border-radius: 8px;
  color: #315847;
  display: grid;
  gap: 8px;
  grid-template-columns: 16px minmax(0, 1fr);
  margin-bottom: 8px;
  padding: 8px;
}

.message-attachment-card > div {
  min-width: 0;
}

.message-attachment-card strong {
  display: block;
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-attachment-card small {
  color: #4c6f60;
  display: block;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 2px;
}

.message-business-card {
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(121, 186, 255, 0.18) 0%, rgba(121, 186, 255, 0) 52%),
    linear-gradient(180deg, #f8fcff 0%, #eef6ff 100%);
  border: 1px solid #cfe2f8;
  border-radius: 12px;
  box-shadow: 0 8px 16px rgba(60, 105, 173, 0.12);
  margin-bottom: 8px;
  padding: 10px;
}

.message-business-card-top {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 30px minmax(0, 1fr);
  margin-bottom: 8px;
}

.message-business-card-badge {
  align-items: center;
  background: linear-gradient(180deg, #3691ee 0%, #1f73cc 100%);
  border-radius: 999px;
  color: #ffffff;
  display: grid;
  height: 30px;
  place-items: center;
  width: 30px;
}

.message-business-card-badge svg {
  height: 14px;
  width: 14px;
}

.message-business-card-top em {
  color: #4976a8;
  display: block;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.message-business-card-top strong {
  color: #1e3d61;
  display: block;
  font-size: 13px;
  line-height: 1.2;
  margin-top: 2px;
}

.message-business-card-grid {
  display: grid;
  gap: 6px;
}

.message-business-card-grid a {
  align-items: center;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid #d4e3f4;
  border-radius: 8px;
  color: #2a4c72;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  gap: 6px;
  min-height: 28px;
  padding: 0 8px;
  text-decoration: none;
}

.message-business-card-grid a svg {
  color: #2f6cab;
  height: 12px;
  width: 12px;
}

.message-business-card-grid a:hover {
  background: #ffffff;
  border-color: #b9d1eb;
}

.message-row.mine .message-business-card {
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(88, 201, 132, 0.18) 0%, rgba(88, 201, 132, 0) 52%),
    linear-gradient(180deg, #f4fcf8 0%, #e8f7ef 100%);
  border-color: #c8e6d6;
  box-shadow: 0 8px 16px rgba(28, 116, 74, 0.12);
}

.message-row.mine .message-business-card-badge {
  background: linear-gradient(180deg, #21a965 0%, #17834e 100%);
}

.message-row.mine .message-business-card-top em {
  color: #2d7d57;
}

.message-row.mine .message-business-card-top strong {
  color: #204a38;
}

.message-row.mine .message-business-card-grid a {
  border-color: #cbe4d7;
  color: #25533f;
}

.message-row.mine .message-business-card-grid a svg {
  color: #1b8d57;
}

.messages-bubbles small {
  align-items: center;
  color: #7c8da5;
  display: inline-flex;
  float: right;
  font-size: 11px;
  font-weight: 800;
  gap: 3px;
  margin-top: 6px;
}

.messages-bubbles small svg {
  color: #90a0b4;
  height: 12px;
  width: 12px;
}

.messages-bubbles small.message-meta.pending svg {
  color: #90a0b4;
}

.messages-bubbles small.message-meta.read svg {
  color: #2d69c7;
}

.message-checks {
  align-items: center;
  display: inline-flex;
  margin-left: 3px;
}

.message-checks svg {
  height: 10px;
  width: 10px;
}

.message-checks.pending {
  color: #8ea0b7;
}

.message-checks.read {
  background: transparent;
  border-radius: 0;
  color: #2d69c7;
  gap: 0;
  padding: 0;
}

.message-checks.read svg + svg {
  margin-left: -3px;
}

.messages-composer {
  align-items: center;
  border-top: 1px solid #e8eef5;
  display: grid;
  gap: 8px;
  grid-template-columns: 34px 78px minmax(0, 1fr) 34px;
  padding: 0 10px;
}

.messages-composer button {
  align-items: center;
  background: #f6f9fd;
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #71839d;
  display: grid;
  height: 30px;
  line-height: 0;
  place-items: center;
  padding: 0;
}

.messages-composer button svg {
  height: 14px;
  width: 14px;
}

.messages-composer button.send {
  background: #16a464;
  border-color: #16a464;
  color: #ffffff;
}

.messages-composer button.send svg {
  transform: scale(0.85);
}

.messages-composer button.card-action {
  background: #edf6ff;
  border-color: #d1e3f8;
  color: #245a98;
  font-size: 11px;
  font-weight: 900;
}

.messages-composer input {
  border: 1px solid #dce4ee;
  border-radius: 8px;
  color: #2b4059;
  font-size: 14px;
  font-weight: 700;
  height: 30px;
  padding: 0 10px;
}

.messages-composer-note {
  color: #567089;
  font-size: 11px;
  font-weight: 800;
  margin: 4px 0 0;
  padding: 0 12px 8px;
}

.messages-composer-note.moderation {
  color: #35644d;
}

.messages-details {
  display: flex;
  flex-direction: column;
  padding: 14px 12px;
}

.messages-details h2 {
  color: #1c2f49;
  font-size: 24px;
  line-height: 1;
  margin: 0 0 12px;
}

.messages-details article {
  border-top: 1px solid #e8eef5;
  display: grid;
  gap: 10px;
  grid-template-columns: 86px minmax(0, 1fr);
  padding: 12px 0;
}

.messages-details article img {
  border-radius: 8px;
  height: 68px;
  object-fit: cover;
  width: 86px;
}

.messages-details article strong {
  color: #1b2d47;
  display: block;
  font-size: 13px;
  line-height: 1.2;
}

.messages-details article em {
  color: #21344d;
  display: block;
  font-size: 13px;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  margin-top: 3px;
}

.messages-details article p {
  color: #657992;
  font-size: 12px;
  font-weight: 700;
  margin: 6px 0 0;
}

.messages-details article small {
  color: #70839c;
  font-size: 11px;
  font-weight: 800;
}

.messages-details > button {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-top: 1px solid #e8eef5;
  color: #4a5f79;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: space-between;
  min-height: 48px;
  text-align: left;
}

.messages-details > button span {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.messages-details > button svg {
  height: 14px;
  width: 14px;
}

.messages-safety-tip {
  background: #eef8f2;
  border: 1px solid #d7ebdf;
  border-radius: 8px;
  margin-top: auto;
  padding: 12px;
}

.messages-safety-tip strong {
  align-items: center;
  color: #24563c;
  display: inline-flex;
  font-size: 12px;
  gap: 6px;
}

.messages-safety-tip p {
  color: #5a7869;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  margin: 6px 0 0;
}

.block-user-overlay {
  align-items: center;
  background: rgba(10, 22, 36, 0.42);
  backdrop-filter: blur(3px);
  display: grid;
  inset: 0;
  padding: 16px;
  position: fixed;
  z-index: 129;
}

.block-user-modal {
  background:
    radial-gradient(120% 120% at 0% 0%, #f2fff8 0%, #ffffff 52%),
    #ffffff;
  border: 1px solid #d7e9de;
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(12, 32, 24, 0.2);
  margin: 0 auto;
  max-width: 560px;
  padding: 20px 20px 18px;
  position: relative;
  width: 100%;
}

.block-user-badge {
  align-items: center;
  background: linear-gradient(180deg, #1fb86c 0%, #14985a 100%);
  border-radius: 999px;
  box-shadow: 0 8px 16px rgba(20, 152, 90, 0.25);
  color: #ffffff;
  display: inline-grid;
  height: 44px;
  margin-bottom: 12px;
  place-items: center;
  width: 44px;
}

.block-user-badge svg {
  height: 22px;
  width: 22px;
}

.block-user-close {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #5f7289;
  font-size: 32px;
  line-height: 1;
  position: absolute;
  right: 10px;
  top: 8px;
}

.block-user-close:hover {
  background: #eef6f1;
}

.block-user-modal h2 {
  color: #16314c;
  font-size: 34px;
  line-height: 1.1;
  margin: 0 36px 12px 0;
}

.block-user-modal p {
  color: #4d637c;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.46;
  margin: 0;
}

.block-user-modal p strong {
  color: #177c49;
}

.block-user-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 18px;
}

.block-user-confirm,
.block-user-cancel {
  border-radius: 8px;
  font-size: 15px;
  font-weight: 900;
  min-height: 42px;
  min-width: 118px;
  padding: 0 16px;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.block-user-confirm {
  background: linear-gradient(180deg, #1bb066 0%, #149457 100%);
  border: 0;
  box-shadow: 0 8px 16px rgba(20, 148, 87, 0.22);
  color: #ffffff;
}

.block-user-confirm:hover {
  transform: translateY(-1px);
}

.block-user-cancel {
  background: #ffffff;
  border: 1px solid #cfe0d8;
  color: #2b465d;
}

.block-user-cancel:hover {
  background: #f5fbf8;
}

.messages-composer input:disabled,
.messages-composer button:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.delete-chat-overlay {
  align-items: center;
  background: rgba(10, 22, 36, 0.42);
  backdrop-filter: blur(3px);
  display: grid;
  inset: 0;
  padding: 16px;
  position: fixed;
  z-index: 129;
}

.delete-chat-modal {
  background: #ffffff;
  border: 1px solid #edd8da;
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(32, 12, 16, 0.2);
  margin: 0 auto;
  max-width: 560px;
  padding: 20px 20px 18px;
  position: relative;
  width: 100%;
}

.delete-chat-close {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #7f5f67;
  font-size: 32px;
  line-height: 1;
  position: absolute;
  right: 10px;
  top: 8px;
}

.delete-chat-close:hover {
  background: #fbf1f3;
}

.delete-chat-badge {
  align-items: center;
  background: linear-gradient(180deg, #e15a6a 0%, #c83f50 100%);
  border-radius: 999px;
  box-shadow: 0 8px 16px rgba(200, 63, 80, 0.22);
  color: #ffffff;
  display: inline-grid;
  height: 44px;
  margin-bottom: 12px;
  place-items: center;
  width: 44px;
}

.delete-chat-badge svg {
  height: 22px;
  width: 22px;
}

.delete-chat-modal h2 {
  color: #4c1f27;
  font-size: 32px;
  line-height: 1.1;
  margin: 0 36px 12px 0;
}

.delete-chat-modal p {
  color: #6b4b52;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
  margin: 0;
}

.delete-chat-modal p strong {
  color: #b73647;
}

.delete-chat-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 18px;
}

.delete-chat-confirm,
.delete-chat-cancel {
  border-radius: 8px;
  font-size: 15px;
  font-weight: 900;
  min-height: 42px;
  min-width: 118px;
  padding: 0 16px;
}

.delete-chat-confirm {
  background: linear-gradient(180deg, #e15a6a 0%, #c83f50 100%);
  border: 0;
  box-shadow: 0 8px 16px rgba(200, 63, 80, 0.2);
  color: #ffffff;
}

.delete-chat-cancel {
  background: #ffffff;
  border: 1px solid #e7ced2;
  color: #6b4b52;
}

.report-user-overlay {
  align-items: center;
  background: rgba(11, 22, 38, 0.5);
  display: grid;
  inset: 0;
  padding: 16px;
  position: fixed;
  z-index: 130;
}

.report-user-modal {
  background: #ffffff;
  border-radius: 14px;
  margin: 0 auto;
  max-width: 460px;
  padding: 16px 18px 18px;
  position: relative;
  width: 100%;
}

.report-user-modal.step-3 {
  max-width: 410px;
  padding: 20px 24px 24px;
}

.report-user-close {
  background: transparent;
  border: 0;
  color: #617388;
  font-size: 25px;
  line-height: 1;
  position: absolute;
  right: 12px;
  top: 10px;
}

.report-user-modal h2 {
  color: #14263f;
  font-size: 27px;
  margin: 0 28px 12px;
  text-align: center;
}

.report-user-progress {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 6px 18px;
}

.report-user-progress-segment {
  background: #dce4ee;
  border-radius: 999px;
  height: 4px;
}

.report-user-progress-segment.active {
  background: #16a260;
}

.report-user-modal h3 {
  color: #12253d;
  font-size: 21px;
  margin: 0;
  text-align: center;
}

.report-user-step2-title {
  font-size: 33px;
}

.report-user-step2-title em {
  color: #617287;
  font-size: 0.64em;
  font-style: normal;
  font-weight: 700;
}

.report-user-modal > p {
  color: #617186;
  font-size: 13px;
  line-height: 1.4;
  margin: 8px auto 12px;
  max-width: 320px;
  text-align: center;
}

.report-user-step2-intro {
  font-size: 18px;
  line-height: 1.5;
  margin: 14px auto 14px;
  max-width: 410px;
}

.report-user-anon-note {
  max-width: 390px;
  margin-bottom: 14px;
  text-wrap: pretty;
}

.report-user-field-label {
  color: #1c2f47;
  display: block;
  font-size: 14px;
  font-weight: 900;
  margin: 14px 2px 7px;
}

.report-user-upload-note {
  color: #6d7f96;
  font-size: 12px;
  font-weight: 700;
  margin: -3px 2px 8px;
}

.report-user-reasons {
  display: grid;
  gap: 8px;
}

.report-user-reasons button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce5ee;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: 24px minmax(0, 1fr) 18px;
  min-height: 58px;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.report-user-reasons button.active {
  background: #eef8f2;
  border-color: #14a15f;
}

.report-user-reason-icon {
  color: #4d6078;
}

.report-user-reasons button.active .report-user-reason-icon {
  color: #119056;
}

.report-user-reason-copy strong {
  color: #1b2f47;
  display: block;
  font-size: 13px;
}

.report-user-reason-copy small {
  color: #6e8097;
  display: block;
  font-size: 11px;
  margin-top: 3px;
}

.report-user-reasons button i {
  border: 1px solid #a9b7ca;
  border-radius: 999px;
  height: 14px;
  width: 14px;
}

.report-user-reasons button.active i {
  border: 4px solid #18a464;
}

.report-user-textarea {
  border: 1px solid #d6e0eb;
  border-radius: 10px;
  color: #263b54;
  font-size: 13px;
  font-weight: 700;
  height: 124px;
  padding: 10px 10px 24px;
  resize: none;
  width: 100%;
}

.report-user-textarea:focus {
  outline: none;
}

.report-user-textarea-wrap {
  position: relative;
}

.report-user-textarea-wrap small {
  color: #8e9cae;
  font-size: 11px;
  font-weight: 800;
  position: absolute;
  right: 10px;
  bottom: 7px;
}

.report-user-upload {
  align-items: center;
  background: #ffffff;
  border: 1px dashed #cfd9e6;
  border-radius: 10px;
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 10px;
  place-items: center;
  text-align: center;
  width: 100%;
}

.report-user-upload > span {
  color: #304960;
  font-size: 18px;
}

.report-user-upload strong {
  color: #283d57;
  font-size: 13px;
}

.report-user-upload small {
  color: #6c7f95;
  font-size: 11px;
  font-weight: 700;
}

.report-user-files {
  margin-top: 8px;
}

.report-user-files p {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 4px 2px;
}

.report-user-files span {
  color: #29415c;
  font-size: 12px;
  font-weight: 700;
}

.report-user-files button {
  background: transparent;
  border: 0;
  color: #199556;
  font-size: 11px;
  font-weight: 900;
  padding: 0;
}

.report-user-error {
  color: #bd2c37;
  font-size: 12px;
  font-weight: 800;
  margin: 6px 2px 0;
}

.report-user-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr 1fr;
  margin-top: 12px;
}

.report-user-primary,
.report-user-secondary {
  border-radius: 8px;
  font-size: 13px;
  font-weight: 900;
  height: 40px;
  width: 100%;
}

.report-user-primary {
  background: #14a05f;
  border: 0;
  color: #ffffff;
  margin-top: 14px;
}

.report-user-actions .report-user-primary {
  margin-top: 0;
}

.report-user-secondary {
  background: #ffffff;
  border: 1px solid #d4dde8;
  color: #34485f;
}

.report-user-close:disabled,
.report-user-primary:disabled,
.report-user-secondary:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.report-user-success {
  align-items: center;
  background: #eef8f2;
  border: 1px solid #d5eadc;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: 28px minmax(0, 1fr);
  margin: 12px 0;
  padding: 10px;
}

.report-user-success > span {
  align-items: center;
  background: #17a463;
  border-radius: 999px;
  color: #ffffff;
  display: grid;
  height: 28px;
  width: 28px;
}

.report-user-success strong {
  color: #18573a;
  display: block;
  font-size: 13px;
}

.report-user-success small {
  color: #3f7058;
  display: block;
  font-size: 11px;
  font-weight: 800;
  margin-top: 3px;
}

.report-user-finish-hero {
  align-items: center;
  background: #eef4f1;
  border-radius: 999px;
  display: grid;
  height: 132px;
  margin: 8px auto 14px;
  place-items: center;
  position: relative;
  width: 132px;
}

.report-user-finish-hero::before,
.report-user-finish-hero::after {
  color: #21a464;
  content: "";
  position: absolute;
}

.report-user-finish-hero::before {
  border: 2px solid #21a464;
  border-radius: 2px;
  height: 5px;
  left: -6px;
  top: 24px;
  transform: rotate(45deg);
  width: 5px;
}

.report-user-finish-hero::after {
  border-top: 2px solid #21a464;
  border-bottom: 2px solid #21a464;
  height: 9px;
  right: -12px;
  top: 40px;
  width: 20px;
}

.report-user-finish-icon {
  align-items: center;
  background: linear-gradient(180deg, #1fb66b 0%, #109457 100%);
  border-radius: 22px;
  color: #ffffff;
  display: grid;
  height: 72px;
  place-items: center;
  width: 72px;
}

.report-user-finish-icon svg {
  height: 42px;
  width: 42px;
}

.report-user-finish-title {
  color: #14263f;
  font-size: 39px;
  line-height: 1.15;
  text-align: center;
}

.report-user-finish-intro {
  color: #5f7188;
  font-size: 15px;
  line-height: 1.48;
  margin: 10px auto 16px;
  max-width: 300px;
  text-align: center;
}

.report-user-summary {
  border: 1px solid #d5dde8;
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 16px 16px 12px;
}

.report-user-summary > strong {
  color: #20324a;
  display: block;
  font-size: 13px;
  margin-bottom: 14px;
}

.report-user-summary-grid {
  display: grid;
  gap: 12px 16px;
  grid-template-columns: 132px minmax(0, 1fr);
  margin-bottom: 12px;
}

.report-user-summary-grid span {
  color: #63758c;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.report-user-summary-grid b {
  color: #2a3d56;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  text-align: left;
}

.report-user-summary p {
  align-items: center;
  color: #546982;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  margin: 0;
}

.report-user-summary p svg {
  height: 13px;
  width: 13px;
}

.report-user-summary small {
  color: #63758c;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 14px;
  text-align: right;
}

@media (max-width: 1300px) {
  .messages-grid {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .messages-details {
    grid-column: 1 / -1;
  }
}

@media (max-width: 980px) {
  .messages-grid {
    grid-template-columns: 1fr;
  }

  .messages-threads,
  .messages-chat,
  .messages-details {
    min-height: auto;
  }
}

.account-heading {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  height: fit-content;
  min-height: 0;
  padding: 12px 16px;
}

.account-heading h1 {
  color: #13243d;
  font-size: 44px;
  line-height: 1;
  margin: 0;
}

.account-heading h1 span {
  font-size: 0.78em;
  vertical-align: 0.06em;
}

.account-heading p {
  color: #647487;
  font-size: 13px;
  font-weight: 750;
  margin: 8px 0 0;
}

.account-heading button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 7px;
  color: #32455e;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
}

.account-widget-customizer {
  display: grid;
  gap: 8px;
  justify-items: stretch;
}

.account-widget-customizer.centered {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 10px;
  margin: 0 auto;
  max-width: 1240px;
  padding: 12px;
  width: 100%;
}

.account-widget-customizer-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
}

.account-widget-customizer-head strong {
  color: #1f334d;
  font-size: 14px;
  font-weight: 900;
}

.account-widget-customizer-head > div:first-child {
  display: grid;
  gap: 4px;
}

.account-widget-customizer-head small {
  color: #5f748a;
  font-size: 13px;
  font-weight: 700;
}

.account-widget-customizer-head-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.account-widget-customizer-head button {
  background: #ffffff;
  border: 1px solid #d8e3ef;
  border-radius: 7px;
  color: #304760;
  font-size: 11px;
  font-weight: 800;
  min-height: 30px;
  padding: 0 10px;
}

.account-widget-customizer-head button svg {
  height: 12px;
  width: 12px;
}

.account-widget-customizer-head.secondary {
  border-top: 1px solid #ecf2f7;
  margin-top: 2px;
  padding-top: 16px;
}

.account-widget-customizer-head.secondary strong {
  font-size: 15px;
}

.account-widget-catalog {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-widget-card {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dde8f2;
  border-radius: 14px;
  box-shadow: 0 12px 26px -26px rgba(20, 52, 77, 0.5);
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: 84px;
  padding: 14px;
}

.account-widget-card > span {
  align-items: center;
  border-radius: 12px;
  display: grid;
  height: 44px;
  line-height: 0;
  place-items: center;
  width: 44px;
}

.account-widget-card > span svg {
  height: 17px;
  width: 17px;
}

.account-widget-card > div {
  display: grid;
  gap: 4px;
}

.account-widget-card strong {
  color: #173048;
  font-size: 13px;
  font-weight: 900;
}

.account-widget-card small {
  color: #6a7f94;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.account-widget-card button {
  align-items: center;
  background: #f5fbf7;
  border: 1px solid #cae8d8;
  border-radius: 9px;
  color: #0f9b59;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 6px;
  height: 32px;
  padding: 0 11px;
}

.account-widget-card button svg {
  height: 11px;
  width: 11px;
}

.account-widget-card.green > span {
  background: #ebf8f0;
  color: #17a35f;
}

.account-widget-card.blue > span {
  background: #edf5ff;
  color: #3478ec;
}

.account-widget-card.amber > span {
  background: #fff5e8;
  color: #d38a15;
}

.account-widget-card.pink > span {
  background: #fff0f4;
  color: #d64c78;
}

.account-widget-tip {
  align-items: center;
  background: #f6fbff;
  border: 1px solid #dce9f6;
  border-radius: 12px;
  color: #4e6580;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 44px;
  padding: 0 14px;
}

.account-widget-tip svg {
  color: #f0b22d;
  height: 14px;
  width: 14px;
}

.account-widget-tip span {
  font-size: 12px;
  font-weight: 700;
}

.account-widget-launch {
  align-items: center;
  background: #ffffff;
  border: 1px dashed #c7d4e3;
  border-radius: 8px;
  color: #2e445f;
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  justify-content: center;
  min-height: 42px;
  min-width: 180px;
  padding: 0 16px;
}

.account-widget-editor {
  background: transparent;
  border: 0;
  border-radius: 0;
  display: grid;
  gap: 10px;
  justify-self: stretch;
  padding: 0;
  width: 100%;
}

.account-widget-editor article {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e1eaf3;
  border-radius: 12px;
  box-shadow: 0 10px 24px -28px rgba(21, 52, 79, 0.65);
  cursor: grab;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 54px;
  padding: 10px 12px;
}

.account-widget-editor article:active {
  cursor: grabbing;
}

.account-widget-editor article.drop-target {
  background: #edf9f2;
  border-color: #8fd5af;
}

.account-widget-editor article strong {
  color: #1c334a;
  font-size: 13px;
  font-weight: 900;
}

.account-widget-editor-controls {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.account-widget-editor-controls select,
.account-widget-editor-controls button:not(.account-toggle) {
  background: #ffffff;
  border: 1px solid #d3e0ed;
  border-radius: 8px;
  color: #304960;
  font-size: 11px;
  font-weight: 800;
  height: 32px;
  padding: 0 10px;
}

.account-widget-editor-controls small {
  color: #7b8899;
  font-size: 10px;
  font-weight: 800;
}

.account-widget-editor-controls button:disabled {
  opacity: 0.45;
}

@media (max-width: 980px) {
  .account-widget-customizer.centered {
    border-radius: 14px;
    padding: 16px;
  }

  .account-widget-customizer-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-widget-customizer-head-actions {
    justify-content: flex-start;
  }

  .account-widget-catalog {
    grid-template-columns: 1fr;
  }
}

.account-stats {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.account-stats article {
  display: grid;
  gap: 8px;
  grid-template-columns: 34px minmax(0, 1fr);
  padding: 14px;
}

.account-stats article > span {
  align-items: center;
  background: #ecf6ff;
  border-radius: 999px;
  color: #3778ef;
  display: grid;
  font-size: 16px;
  height: 34px;
  line-height: 0;
  place-items: center;
  width: 34px;
}

.account-stats article > span svg,
.account-alerts article > span svg,
.account-searches article > span svg,
.account-tools article > span svg,
.account-menu button svg, .account-menu a svg {
  height: 14px;
  width: 14px;
}

.account-stats article:nth-child(2) > span {
  background: #fff1f3;
  color: #ef4968;
}

.account-stats article:nth-child(3) > span {
  background: #fff8e8;
  color: #f3a10b;
}

.account-stats article:nth-child(4) > span {
  background: #edf3ff;
  color: #2f78ff;
}

.account-stats article strong {
  color: #15253d;
  font-size: 29px;
  line-height: 1;
}

.account-stats article small {
  color: #607084;
  font-size: 12px;
  font-weight: 750;
  grid-column: 2;
}

.account-stats article button {
  background: transparent;
  border: 0;
  color: #109253;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 5px;
  grid-column: 2;
  justify-self: start;
  padding: 0;
}

.account-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: 1.25fr 0.95fr;
  min-height: 320px;
}

.account-grid.account-grid-empty {
  grid-template-columns: 1fr;
  min-height: calc(100vh - 220px);
}

.account-grid.account-grid-empty.editor-open {
  min-height: auto;
}

.account-widget-slot.wide {
  grid-column: 1 / -1;
}

.account-empty-add {
  align-items: start;
  display: grid;
  grid-column: 1 / -1;
  justify-items: center;
  min-height: calc(100vh - 320px);
  padding: 10px 0 0;
}

.account-empty-state-card {
  align-items: center;
  display: grid;
  justify-items: center;
  max-width: 860px;
  text-align: center;
}

.account-empty-visual {
  display: block;
  height: 118px;
  margin-bottom: 16px;
  position: relative;
  width: 286px;
}

.account-empty-visual::before {
  background: linear-gradient(180deg, rgba(231, 249, 239, 0.9) 0%, rgba(240, 252, 246, 0.8) 100%);
  border-radius: 16px;
  content: "";
  height: 76px;
  left: 42px;
  position: absolute;
  top: 22px;
  width: 196px;
}

.account-empty-visual::after {
  border: 2px dashed #c9edd7;
  border-radius: 999px;
  content: "";
  height: 48px;
  position: absolute;
  right: 14px;
  top: 10px;
  width: 48px;
}

.account-empty-visual .left-chip,
.account-empty-visual .right-chip {
  align-items: center;
  background: #ecf8f1;
  border: 1px solid #d7ecdf;
  border-radius: 14px;
  color: #14a05f;
  display: grid;
  height: 46px;
  line-height: 0;
  place-items: center;
  position: absolute;
  top: 52px;
  width: 50px;
  z-index: 2;
}

.account-empty-visual .left-chip {
  left: 0;
}

.account-empty-visual .right-chip {
  background: #17a65f;
  border-color: #17a65f;
  border-radius: 999px;
  color: #ffffff;
  height: 46px;
  left: 236px;
  top: 40px;
  width: 46px;
}

.account-empty-visual .center-chip {
  align-items: center;
  background: linear-gradient(180deg, #effaf4 0%, #f7fcf9 100%);
  border: 1px solid #d7ecdf;
  border-radius: 16px;
  color: #14a05f;
  display: grid;
  height: 88px;
  justify-items: center;
  left: 92px;
  position: relative;
  top: 16px;
  width: 110px;
  z-index: 2;
}

.account-empty-visual .center-chip svg {
  height: 22px;
  margin-top: 8px;
  width: 22px;
}

.account-empty-visual .center-chip i {
  background: #9fdcba;
  border-radius: 999px;
  display: block;
  height: 6px;
  margin-top: 2px;
  width: 40px;
}

.account-empty-state-card h2 {
  color: #20334c;
  font-size: 43px;
  line-height: 1;
  margin: 2px 0 10px;
}

.account-empty-state-card p {
  color: #6c7c90;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.35;
  margin: 0 0 20px;
  max-width: 760px;
}

.account-empty-add-button {
  align-items: center;
  background: #13a15f;
  border: 0;
  border-radius: 9px;
  color: #ffffff;
  display: inline-flex;
  font-size: 18px;
  font-weight: 900;
  gap: 8px;
  min-height: 52px;
  padding: 0 24px;
}

.account-empty-add-button svg {
  height: 16px;
  width: 16px;
}

.account-panel {
  padding: 12px;
}

.account-panel-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.account-panel-head h2 {
  color: #15253d;
  font-size: 18px;
  margin: 0;
}

.account-panel-head button {
  background: transparent;
  border: 0;
  color: #109253;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 5px;
  padding: 0;
}

.account-listings {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.account-listings article {
  border: 1px solid #e3e9f0;
  border-radius: 8px;
  overflow: hidden;
}

.account-listings .photo {
  background-size: cover;
  height: 118px;
}

.account-listings article strong,
.account-listings article h3,
.account-listings article p,
.account-listings article small {
  display: block;
  padding: 0 10px;
}

.account-listings article strong {
  color: #15253d;
  font-size: 20px;
  margin-top: 8px;
}

.account-listings article h3 {
  color: #1e2f46;
  font-size: 13px;
  margin-top: 4px;
}

.account-listings article p {
  color: #607084;
  font-size: 11px;
  margin-top: 3px;
}

.account-listings article small {
  color: #718094;
  font-size: 10px;
  margin: 6px 0 4px;
}

.account-listings article em {
  color: #7b899b;
  display: block;
  font-size: 10px;
  font-style: normal;
  margin: 0 0 10px;
  padding: 0 10px;
}

.account-alerts {
  display: grid;
  gap: 8px;
}

.account-alerts article {
  align-items: center;
  border: 1px solid #e5ebf2;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 30px minmax(0, 1fr) 28px;
  min-height: 62px;
  padding: 8px 10px;
}

.account-alerts article > span {
  align-items: center;
  background: #ebf6f0;
  border-radius: 999px;
  color: #109253;
  display: grid;
  font-size: 14px;
  height: 30px;
  line-height: 0;
  place-items: center;
  width: 30px;
}

.account-alerts strong {
  color: #1f3047;
  display: block;
  font-size: 12px;
}

.account-alerts small {
  color: #708094;
  display: block;
  font-size: 10px;
  margin-top: 2px;
}

.account-alerts em {
  color: #67788c;
  display: block;
  font-size: 10px;
  font-style: normal;
  margin-top: 3px;
}

.account-toggle {
  background: #d7dee8;
  border: 0;
  border-radius: 999px;
  height: 16px;
  justify-self: center;
  padding: 0;
  position: relative;
  transition: background-color 0.18s ease;
  width: 26px;
}

.account-toggle::after {
  background: #ffffff;
  border-radius: 999px;
  content: "";
  height: 10px;
  left: 3px;
  position: absolute;
  top: 3px;
  transition: transform 0.18s ease;
  width: 10px;
}

.account-toggle.on {
  background: #15a660;
}

.account-toggle.on::after {
  transform: translateX(10px);
}

.account-add-alert {
  align-items: center;
  background: transparent;
  border: 0;
  color: #2b3d56;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  justify-self: start;
  padding: 2px 0 0;
}

.account-add-alert svg,
.account-new-search svg {
  color: #109253;
  font-size: 13px;
}

.account-searches-panel {
  grid-column: 1;
}

.account-searches {
  display: grid;
  gap: 4px;
}

.account-searches article {
  align-items: center;
  border-bottom: 1px solid #edf1f5;
  display: grid;
  gap: 8px;
  grid-template-columns: 26px minmax(0, 1fr) 120px 88px 18px;
  min-height: 58px;
  padding: 6px 0;
}

.account-searches article > span {
  align-items: center;
  background: #ebf6f0;
  border-radius: 999px;
  color: #109253;
  display: grid;
  font-size: 13px;
  height: 26px;
  line-height: 0;
  place-items: center;
  width: 26px;
}

.account-searches strong {
  color: #1f3047;
  display: block;
  font-size: 12px;
}

.account-searches small {
  color: #6f7f92;
  display: block;
  font-size: 10px;
  margin-top: 2px;
}

.account-searches em,
.account-searches b {
  color: #6f7f92;
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.3;
}

.account-searches b {
  color: #243750;
  font-weight: 900;
}

.account-searches-empty {
  color: #6f7f92;
  font-size: 11px;
  line-height: 1.5;
  margin: 6px 0 2px;
}

.account-searches article > button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #7f8da0;
  display: inline-flex;
  font-size: 15px;
  justify-content: center;
  padding: 0;
}

.account-searches .account-search-remove {
  color: #d34d4d;
  font-size: 11px;
  font-weight: 900;
}

.account-searches-empty-state {
  align-items: center;
  border: 1px dashed #cfd9e5;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  justify-items: center;
  margin-top: 10px;
  padding: 26px 16px;
  text-align: center;
}

.account-searches-empty-state strong {
  color: #1f3047;
  font-size: 18px;
}

.account-searches-empty-state p {
  color: #62748a;
  font-size: 12px;
  margin: 0;
  max-width: 520px;
}

.account-searches-page-head {
  align-items: start;
  gap: 12px;
}

.account-searches-page-head h1 {
  color: #12233e;
  font-size: 42px;
  letter-spacing: -0.02em;
  line-height: 1.02;
  margin: 0;
}

.account-searches-page-head p {
  color: #607288;
  font-size: 13px;
  font-weight: 760;
  margin: 10px 0 0;
  max-width: 760px;
}

.account-searches-stats {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 12px 0;
}

.account-searches-stats article {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid #dce6f2;
  border-radius: 10px;
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 10px 12px;
}

.account-searches-stats small {
  color: #617388;
  font-size: 11px;
  font-weight: 800;
}

.account-searches-stats strong {
  color: #12233e;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.account-searches-toolbar {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(240px, 1fr) auto auto;
  margin: 6px 0 16px;
}

.account-searches-input {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d5dfeb;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  grid-template-columns: 16px minmax(0, 1fr);
  min-height: 44px;
  padding: 0 12px;
}

.account-searches-input svg {
  color: #7f8ea2;
  height: 14px;
  width: 14px;
}

.account-searches-input input {
  background: transparent;
  border: 0;
  color: #1c2d45;
  font-size: 13px;
  font-weight: 750;
  outline: none;
}

.account-searches-input input::placeholder {
  color: #8a97a9;
}

.account-searches-mode-tabs {
  background: #f0f4f9;
  border-radius: 999px;
  display: inline-flex;
  padding: 3px;
}

.account-searches-mode-tabs button {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #5c6f86;
  font-size: 11px;
  font-weight: 900;
  height: 34px;
  min-width: 88px;
  padding: 0 14px;
}

.account-searches-mode-tabs button.active {
  background: #ffffff;
  box-shadow: 0 4px 10px rgba(38, 59, 91, 0.12);
  color: #12233e;
}

.account-searches-sort {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.account-searches-sort span {
  color: #667a90;
  font-size: 11px;
  font-weight: 850;
}

.account-searches-sort select {
  background: #ffffff;
  border: 1px solid #d3ddea;
  border-radius: 9px;
  color: #243850;
  font-size: 12px;
  font-weight: 820;
  height: 36px;
  padding: 0 10px;
}

.account-searches-page .account-searches {
  gap: 8px;
}

.account-searches-page .account-searches article {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e1e8f2;
  border-radius: 12px;
  grid-template-columns: 32px minmax(0, 1fr) auto auto auto auto;
  min-height: 74px;
  padding: 10px 12px;
}

.account-searches-page .account-searches article > span {
  height: 30px;
  width: 30px;
}

.account-searches-page .account-searches small {
  font-size: 11px;
}

.account-searches-page .account-searches em {
  align-items: center;
  color: #6b7d92;
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  gap: 5px;
  white-space: nowrap;
}

.account-searches-page .account-searches em svg {
  color: #8a99aa;
  height: 11px;
  width: 11px;
}

.account-searches-page .account-searches .account-search-mode-pill {
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 10px;
  text-transform: uppercase;
}

.account-searches-page .account-searches .account-search-mode-pill.buy {
  background: #ecf7ff;
  color: #1a5d99;
}

.account-searches-page .account-searches .account-search-mode-pill.rent {
  background: #edf9f1;
  color: #16844d;
}

.account-searches-page .account-searches .account-search-open {
  align-items: center;
  background: #f5f8fc;
  border: 1px solid #d8e3ef;
  border-radius: 8px;
  color: #1f3552;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 6px;
  height: 34px;
  padding: 0 10px;
}

.account-searches-page .account-searches .account-search-open svg {
  height: 12px;
  width: 12px;
}

.account-searches-page .account-searches .account-search-remove {
  align-items: center;
  color: #c44b4b;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  gap: 6px;
}

.account-searches-page .account-searches .account-search-remove svg {
  height: 12px;
  width: 12px;
}

.account-searches-empty-state.filtered {
  margin-top: 16px;
}

.account-new-search,
.account-tools-more {
  align-items: center;
  background: transparent;
  border: 0;
  color: #109253;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  justify-self: end;
  margin-top: 8px;
  padding: 0;
}

.account-tools {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-tools article:last-child {
  grid-column: 1 / -1;
}

.account-tools {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.account-tools article {
  align-items: start;
  border: 1px solid #e5ebf2;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 28px minmax(0, 1fr);
  min-height: 74px;
  padding: 10px;
}

.account-tools article > span {
  align-items: center;
  background: #eef4ff;
  border-radius: 8px;
  color: #3a76e5;
  display: grid;
  font-size: 14px;
  height: 28px;
  line-height: 0;
  place-items: center;
  width: 28px;
}

.account-tools article:nth-child(2) > span {
  background: #eef8ff;
  color: #4a79f0;
}

.account-tools article:nth-child(3) > span {
  background: #eef3ff;
  color: #6b7ef3;
}

.account-tools article:nth-child(4) > span {
  background: #edf8f0;
  color: #3ba75f;
}

.account-tools article:nth-child(5) > span {
  background: #f3efff;
  color: #7e61e9;
}

.account-tools strong {
  color: #1f3047;
  display: block;
  font-size: 12px;
}

.account-tools small {
  color: #6f7f92;
  display: block;
  font-size: 10px;
  margin-top: 3px;
}

@media (max-width: 1200px) {
  .account-layout {
    grid-template-columns: 1fr;
  }

  .account-grid {
    grid-template-columns: 1fr;
  }

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

  .account-widget-editor article {
    grid-template-columns: 1fr;
  }

  .account-widget-editor-controls {
    flex-wrap: wrap;
  }

  .account-listings,
  .account-tools {
    grid-template-columns: 1fr;
  }

  .account-searches article {
    grid-template-columns: 26px minmax(0, 1fr);
    padding: 8px 0;
  }

  .account-searches em,
  .account-searches b,
  .account-searches article > button {
    display: none;
  }

  .account-searches-page .account-searches article {
    gap: 8px;
    grid-template-columns: 26px minmax(0, 1fr);
    padding: 10px;
  }

  .account-searches-page .account-searches article > button,
  .account-searches-page .account-searches .account-search-open {
    display: inline-flex;
    justify-self: start;
  }

  .account-searches-page .account-searches em,
  .account-searches-page .account-searches b {
    display: none;
  }

  .account-searches-toolbar {
    grid-template-columns: 1fr;
  }

  .account-searches-sort {
    justify-content: space-between;
  }

  .account-searches-stats {
    grid-template-columns: 1fr;
  }

  .account-searches-page-head h1 {
    font-size: 33px;
  }

  .account-tools article:last-child {
    grid-column: auto;
  }
}

.account-settings-page {
  background: #f5f7fa;
  min-height: calc(100vh - 82px);
  padding: 18px;
}

.account-settings-main {
  align-content: start;
}

.price-alerts-page {
  background: linear-gradient(180deg, #f4f7fb 0%, #eef3f9 100%);
}

.price-alerts-heading {
  display: grid;
  gap: 10px;
}

.price-alerts-heading small {
  align-items: center;
  color: #7a8ba0;
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  gap: 6px;
}

.price-alerts-heading small svg {
  color: #a2afc1;
  font-size: 12px;
  transform: rotate(-45deg);
}

.price-alerts-heading h1 {
  color: #162742;
  font-size: 38px;
  letter-spacing: -0.01em;
  margin: 0;
}

.price-alerts-heading p {
  color: #5d7088;
  font-size: 13px;
  font-weight: 760;
  margin: 8px 0 0;
  max-width: 780px;
}

.price-alerts-settings {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe5f0;
  border-radius: 9px;
  color: #2a3e58;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  height: 38px;
  justify-self: end;
  padding: 0 13px;
}

.price-alerts-hero {
  background: #ffffff;
  border: 1px solid #dfe8f1;
  border-radius: 14px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(280px, 1fr) minmax(220px, 360px) minmax(200px, 280px);
  padding: 16px;
}

.price-alerts-hero-main h2 {
  color: #152841;
  font-size: 33px;
  line-height: 1.05;
  margin: 8px 0 2px;
}

.price-alerts-hero-main p {
  color: #2b4059;
  font-size: 17px;
  font-weight: 800;
  margin: 0;
}

.price-alerts-hero-main > small {
  align-items: center;
  color: #5f738c;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 5px;
  margin-top: 9px;
}

.price-alerts-badge {
  background: #e9f8ef;
  border-radius: 999px;
  color: #0f9657;
  display: inline-block;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  padding: 3px 9px;
  text-transform: uppercase;
}

.price-alerts-pricing {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 11px;
  margin-top: 14px;
}

.price-alerts-pricing strong {
  color: #129256;
  font-size: 39px;
  line-height: 1;
}

.price-alerts-pricing em {
  color: #8191a5;
  font-size: 19px;
  font-style: normal;
  font-weight: 700;
  text-decoration: line-through;
}

.price-alerts-pricing span {
  color: #f04444;
  font-size: 15px;
  font-weight: 900;
}

.price-alerts-meta {
  color: #71839b;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 750;
  gap: 8px 18px;
  margin-top: 8px;
}

.price-alerts-meta b {
  color: #2a405a;
}

.price-alerts-hero-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 12px;
  min-height: 210px;
}

.price-alerts-hero-side {
  background: #f4fbf7;
  border: 1px solid #dfeee6;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.price-alerts-hero-side strong {
  color: #148c53;
  font-size: 14px;
}

.price-alerts-hero-side ul {
  color: #3d556d;
  display: grid;
  font-size: 12px;
  font-weight: 760;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.price-alerts-hero-side b {
  color: #1f354f;
}

.price-alerts-hero-side button {
  align-items: center;
  background: #17a762;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  height: 35px;
  justify-content: center;
}

.price-alerts-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.price-alerts-card {
  background: #ffffff;
  border: 1px solid #dfe8f1;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.price-alerts-card header h3 {
  color: #182a45;
  font-size: 18px;
  margin: 0;
}

.price-alerts-card header p {
  color: #6b7d93;
  font-size: 11px;
  font-weight: 800;
  margin: 5px 0 0;
}

.price-alerts-kpi {
  align-items: baseline;
  display: flex;
  gap: 12px;
}

.price-alerts-kpi strong {
  color: #162a44;
  font-size: 30px;
  line-height: 1;
}

.price-alerts-kpi span {
  color: #14a35f;
  font-size: 18px;
  font-weight: 900;
}

.price-alerts-chart {
  height: 132px;
  width: 100%;
}

.price-alerts-chart-line {
  fill: none;
  stroke: #26b36a;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
}

.price-alerts-districts {
  display: grid;
  gap: 9px;
}

.price-alerts-districts div {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 88px minmax(90px, 1fr) auto auto;
}

.price-alerts-districts strong {
  color: #233852;
  font-size: 12px;
}

.price-alerts-district-bar {
  background: #edf1f6;
  border-radius: 999px;
  display: block;
  height: 8px;
  overflow: hidden;
}

.price-alerts-district-bar i {
  background: linear-gradient(90deg, #25b269 0%, #5ac987 100%);
  border-radius: 999px;
  display: block;
  height: 100%;
}

.price-alerts-districts em {
  color: #2d435e;
  font-size: 12px;
  font-style: normal;
  font-weight: 820;
}

.price-alerts-districts b {
  color: #15a35f;
  font-size: 12px;
}

.price-alerts-link {
  background: transparent;
  border: 0;
  color: #18a661;
  font-size: 12px;
  font-weight: 900;
  justify-self: start;
  padding: 0;
}

.price-alerts-active-list {
  align-content: start;
}

.price-alerts-active-items {
  display: grid;
  gap: 8px;
}

.price-alerts-active-items button, .price-alerts-active-items a {
  align-items: center;
  background: #fbfcfe;
  border: 1px solid #e2eaf3;
  border-radius: 9px;
  color: #21364f;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 9px;
  text-align: left;
}

.price-alerts-active-items strong {
  color: #1d3049;
  display: block;
  font-size: 12px;
}

.price-alerts-active-items small {
  color: #6d7f96;
  display: block;
  font-size: 10px;
  font-weight: 750;
  margin-top: 2px;
}

.price-alerts-active-items span {
  background: #e9f8ef;
  border-radius: 999px;
  color: #119659;
  font-size: 10px;
  font-weight: 900;
  padding: 2px 8px;
}

.price-alerts-manage {
  background: #f5f8fc;
  border: 1px solid #dce6f1;
  border-radius: 8px;
  color: #334a64;
  font-size: 12px;
  font-weight: 900;
  height: 35px;
}

@media (max-width: 1300px) {
  .price-alerts-grid {
    grid-template-columns: 1fr;
  }

  .price-alerts-hero {
    grid-template-columns: 1fr;
  }

  .price-alerts-heading h1 {
    font-size: 31px;
  }

  .price-alerts-settings {
    justify-self: start;
  }
}

@media (max-width: 740px) {
  .price-alerts-pricing strong {
    font-size: 30px;
  }

  .price-alerts-pricing em {
    font-size: 15px;
  }

  .price-alerts-pricing span {
    font-size: 12px;
  }

  .price-alerts-districts div {
    grid-template-columns: 1fr;
  }
}

.settings-head h1 {
  color: #1a2c46;
  font-size: 43px;
  line-height: 1;
  margin: 0;
}

.settings-head p {
  color: #607084;
  font-size: 13px;
  font-weight: 750;
  margin: 8px 0 0;
}

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

.settings-card {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 10px;
  padding: 12px;
}

.settings-card-head {
  margin-bottom: 8px;
}

.settings-card-head h2 {
  color: #1a2c46;
  font-size: 19px;
  margin: 0;
}

.settings-card-head p {
  color: #6c7b8e;
  font-size: 11px;
  font-weight: 750;
  margin: 5px 0 0;
}

.settings-card-head.split {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.settings-card-head.split > button,
.settings-profile-row > button, .settings-profile-row > a {
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #30445d;
  font-size: 11px;
  font-weight: 900;
  min-height: 30px;
  padding: 0 10px;
}

.settings-profile-row {
  align-items: center;
  background: #fbfcfe;
  border: 1px solid #e5ebf2;
  border-radius: 9px;
  display: grid;
  gap: 10px;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  margin-bottom: 8px;
  padding: 10px;
}

.settings-profile-row > span {
  align-items: center;
  background: #edf3ff;
  border-radius: 999px;
  color: #3c79e8;
  display: grid;
  height: 38px;
  line-height: 0;
  place-items: center;
  width: 38px;
}

.settings-profile-row > span svg {
  height: 16px;
  width: 16px;
}

.settings-profile-row strong {
  color: #1f3047;
  display: block;
  font-size: 12px;
}

.settings-profile-row small {
  background: #e7f8ee;
  border-radius: 999px;
  color: #109253;
  display: inline-block;
  font-size: 10px;
  font-weight: 900;
  margin-top: 4px;
  padding: 2px 8px;
}

.settings-list {
  display: grid;
}

.settings-list article {
  align-items: center;
  border-bottom: 1px solid #edf1f5;
  display: grid;
  gap: 8px;
  grid-template-columns: 22px minmax(0, 170px) minmax(0, 1fr) auto;
  min-height: 50px;
  padding: 4px 0;
}

.settings-list article > * {
  min-width: 0;
}

.settings-list article:last-child {
  border-bottom: 0;
}

.settings-list article > span {
  align-items: center;
  color: #7e8ba0;
  display: grid;
  height: 22px;
  line-height: 0;
  place-items: center;
  width: 22px;
}

.settings-list article > span svg {
  height: 14px;
  width: 14px;
}

.settings-list em {
  color: #25374f;
  display: block;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-list strong {
  color: #6f7f92;
  display: block;
  font-size: 11px;
  font-weight: 750;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-list article > svg {
  color: #7f8da0;
  font-size: 12px;
  justify-self: end;
  transform: rotate(-90deg);
}

.settings-list .toggle-row {
  grid-template-columns: 22px 1fr auto;
}

.settings-list .toggle-row strong {
  display: none;
}

.settings-list .toggle-row > button {
  justify-self: end;
}

.settings-list .toggle-row > svg {
  display: none;
}

.settings-list.compact article {
  min-height: 46px;
}

.settings-list .danger em,
.settings-list .danger strong,
.settings-list .danger > span {
  color: #d04444;
}

.settings-list .mini-tag {
  background: #eef2f7;
  border: 0;
  border-radius: 999px;
  color: #6a7a8d;
  font-size: 10px;
  font-weight: 900;
  justify-self: end;
  padding: 2px 8px;
  white-space: nowrap;
}

.settings-list .cover-upload-tag {
  align-items: center;
  background: #edf5ff;
  border: 1px solid #d6e4f5;
  color: #2b4e74;
  cursor: pointer;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  min-height: 24px;
  padding: 0 10px;
}

.settings-list .cover-upload-tag input {
  display: none;
}

.settings-list .cover-photo-row strong {
  font-size: 10px;
}

.cover-photo-actions-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  justify-self: stretch;
  margin-top: 0;
  padding: 2px 0 6px;
  width: 100%;
}

.cover-preview-button {
  background: transparent;
  border: 0;
  color: #109253;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
  padding: 0;
  white-space: nowrap;
}

.cover-remove-button {
  background: transparent;
  border: 0;
  color: #cf4343;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
  padding: 0;
  white-space: nowrap;
}

.settings-list .mini-tag.profile-preview-cta {
  align-items: center;
  background: linear-gradient(90deg, #18b06d 0%, #109253 100%);
  border: 0;
  box-shadow: 0 6px 14px rgba(16, 146, 83, 0.24);
  color: #ffffff;
  display: inline-flex;
  font-size: 11px;
  gap: 5px;
  padding: 6px 10px;
}

.settings-list .mini-tag.profile-preview-cta svg {
  height: 12px;
  stroke-width: 2.5;
  width: 12px;
}

.settings-list .mini-tag.profile-preview-cta:hover {
  filter: brightness(1.05);
}

.profile-personalization-list {
  gap: 0;
}

.profile-personalization-list article {
  align-items: start;
  min-height: 54px;
  padding: 10px 0;
  row-gap: 6px;
}

.profile-personalization-list article > strong {
  line-height: 1.35;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-personalization-list .cover-photo-row {
  grid-template-columns: 22px minmax(0, 180px) minmax(0, 1fr) auto;
}

.profile-personalization-list .cover-photo-row > strong {
  max-width: 100%;
}

.profile-personalization-list .cover-photo-actions-row {
  border-bottom: 1px solid #edf1f5;
  justify-content: flex-end;
  justify-self: stretch;
  margin-top: 0;
  padding: 0 0 10px;
}

.profile-personalization-list .profile-visibility-card {
  margin-top: 0;
}

.profile-personalization-list .profile-visibility-card > strong {
  white-space: normal;
}

.profile-personalization-list .public-profile-row {
  grid-template-columns: 22px minmax(0, 170px) auto auto;
  margin-top: 10px;
  padding-top: 14px;
}

.profile-personalization-list .public-profile-row > strong {
  justify-self: end;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .profile-personalization-list .cover-photo-row {
    grid-template-columns: 22px 1fr;
  }

  .profile-personalization-list .cover-photo-row > em,
  .profile-personalization-list .cover-photo-row > strong,
  .profile-personalization-list .cover-photo-row > .cover-upload-tag {
    grid-column: 2;
  }

  .profile-personalization-list .cover-photo-actions-row {
    padding-left: 0;
  }

  .profile-personalization-list .public-profile-row {
    grid-template-columns: 22px minmax(0, 150px) minmax(0, 1fr) auto;
  }

  .profile-personalization-list .public-profile-row > strong {
    justify-self: start;
    text-align: left;
    white-space: nowrap;
  }
}

.settings-list article.profile-visibility-card {
  align-items: start;
  gap: 8px;
  grid-template-columns: 22px 1fr;
}

.settings-list article.profile-visibility-card > span {
  grid-column: 1;
  grid-row: 1 / span 3;
}

.settings-list article.profile-visibility-card > em,
.settings-list article.profile-visibility-card > .profile-visibility-options,
.settings-list article.profile-visibility-card > strong {
  grid-column: 2;
}

.profile-visibility-card .profile-visibility-options {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 4px;
  width: 100%;
}

.profile-visibility-card .profile-visibility-options button {
  background: #f4f8fc;
  border: 1px solid #d8e1ec;
  border-radius: 8px;
  color: #41566f;
  font-size: 9px;
  font-weight: 900;
  min-height: 28px;
  overflow: hidden;
  padding: 0 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.profile-visibility-card .profile-visibility-options button.active {
  background: linear-gradient(90deg, #18b06d 0%, #109253 100%);
  border-color: #109253;
  box-shadow: 0 6px 14px rgba(16, 146, 83, 0.2);
  color: #ffffff;
}

.settings-export {
  align-self: start;
}

.settings-export-box {
  align-items: start;
  background: linear-gradient(90deg, #f3fbf7 0%, #edf8f2 100%);
  border: 1px solid #dcefe4;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  grid-template-columns: 40px minmax(0, 1fr);
  margin-top: 8px;
  padding: 12px;
}

.settings-export-box > span {
  align-items: center;
  background: #dcf4e6;
  border-radius: 999px;
  color: #109253;
  display: grid;
  height: 40px;
  line-height: 0;
  place-items: center;
  width: 40px;
}

.settings-export-box strong {
  color: #1f3047;
  display: block;
  font-size: 13px;
}

.settings-export-box small {
  color: #6b7b8f;
  display: block;
  font-size: 11px;
  line-height: 1.4;
  margin-top: 5px;
}

.settings-export-box button {
  background: #16a464;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  margin-top: 10px;
  min-height: 34px;
  padding: 0 12px;
}

.settings-footer-note {
  align-items: center;
  color: #6f7f92;
  display: inline-flex;
  font-size: 11px;
  font-weight: 750;
  gap: 8px;
  margin-top: 14px;
}

.settings-footer-note svg {
  color: #8392a5;
  font-size: 13px;
}

.account-security-page {
  background: linear-gradient(180deg, #f4f7fa 0%, #eef4f9 100%);
}

.security-main {
  align-content: start;
  gap: 10px;
}

.security-head h1 {
  align-items: center;
  display: inline-flex;
  gap: 10px;
}

.security-head h1 svg {
  color: #17a261;
  height: 32px;
  width: 32px;
}

.security-overview-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.security-card {
  background: #ffffff;
  border: 1px solid #dde6ef;
  border-radius: 11px;
  padding: 11px;
}

.security-card h2,
.security-settings-block > h2 {
  color: #1a2c46;
  font-size: 17px;
  font-weight: 900;
  margin: 0;
}

.security-score-body {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: 144px minmax(0, 1fr);
  margin-top: 12px;
}

.security-score-ring {
  align-items: center;
  aspect-ratio: 1;
  background: conic-gradient(#17a261 calc(var(--score, 0) * 1%), #e7edf4 0);
  border-radius: 999px;
  display: grid;
  padding: 6px;
  height: 144px;
  width: 144px;
}

.security-score-ring > div {
  background: #ffffff;
  border-radius: 999px;
  display: grid;
  height: 100%;
  place-items: center;
  position: relative;
  width: 100%;
}

.security-score-ring strong {
  color: #1a2d47;
  font-size: 37px;
  font-weight: 700;
  line-height: 0.95;
  margin: 0;
  transform: translateY(-4px);
}

.security-score-ring small {
  color: #179a5c;
  font-size: 10px;
  font-weight: 800;
  left: 50%;
  line-height: 1;
  position: absolute;
  transform: translateX(-50%);
  white-space: nowrap;
  bottom: 28px;
}

.security-score-copy {
  max-width: 345px;
}

.security-score-copy > strong {
  color: #1a2d47;
  display: block;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.25;
}

.security-score-copy ul {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}

.security-score-copy li {
  align-items: center;
  color: #3f5a73;
  display: inline-flex;
  font-size: 11px;
  font-weight: 700;
  gap: 7px;
}

.security-score-copy li svg {
  background: #17a261;
  border-radius: 999px;
  color: #ffffff;
  height: 12px;
  padding: 2px;
  width: 12px;
}

.security-score-copy button {
  background: linear-gradient(90deg, #19b06c 0%, #0f9f5b 100%);
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  margin-top: 12px;
  min-height: 33px;
  min-width: 186px;
  padding: 0 16px;
}

.security-card-head.split {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.security-card-head.split > button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #159e5d;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  gap: 5px;
  padding: 0;
}

.security-card-head.split > button svg {
  height: 14px;
  transform: rotate(-45deg);
  width: 14px;
}

.security-activity-list {
  display: grid;
  margin-top: 6px;
}

.security-activity-list article {
  align-items: center;
  border-bottom: 1px solid #edf2f6;
  display: grid;
  gap: 10px;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  min-height: 56px;
  padding: 4px 0;
}

.security-activity-list article:last-child {
  border-bottom: 0;
}

.security-activity-list article > span {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  display: grid;
  height: 28px;
  place-items: center;
  width: 28px;
}

.security-activity-list article > span svg {
  height: 13px;
  width: 13px;
}

.security-activity-list .activity-icon.green {
  background: #e9f7ef;
  border-color: #dcefe3;
  color: #16a05f;
}

.security-activity-list .activity-icon.blue {
  background: #eef1ff;
  border-color: #dfe5ff;
  color: #5e6dd9;
}

.security-activity-list .activity-icon.orange {
  background: #fff4e7;
  border-color: #ffe7cc;
  color: #e49a36;
}

.security-activity-list strong {
  color: #1e324a;
  display: block;
  font-size: 12px;
  font-weight: 900;
}

.security-activity-list small {
  color: #6f8196;
  display: block;
  font-size: 10px;
  font-weight: 800;
  margin-top: 1px;
}

.security-activity-meta {
  display: grid;
  justify-items: end;
}

.security-activity-meta em {
  color: #6b7e93;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.security-activity-meta i {
  background: #e8f8ef;
  border-radius: 999px;
  color: #139658;
  display: inline-block;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  margin-top: 5px;
  padding: 1px 8px;
}

.security-settings-block {
  display: grid;
  gap: 8px;
}

.security-settings-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
}

.security-setting-card {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe8f0;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  min-height: 88px;
  padding: 10px;
}

.security-setting-card > span {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  display: grid;
  height: 30px;
  place-items: center;
  width: 30px;
}

.security-setting-card > span svg {
  height: 14px;
  width: 14px;
}

.security-setting-card.tone-green > span {
  background: #eaf8ef;
  border-color: #daefdf;
  color: #139d5b;
}

.security-setting-card.tone-blue > span {
  background: #eef0ff;
  border-color: #dfe5ff;
  color: #5e6ddb;
}

.security-setting-card.tone-yellow > span {
  background: #fff8e7;
  border-color: #ffebbe;
  color: #e4af24;
}

.security-setting-card.tone-purple > span {
  background: #f1eeff;
  border-color: #e2dafb;
  color: #7a61db;
}

.security-setting-card.tone-pink > span {
  background: #ffeef3;
  border-color: #ffd6e3;
  color: #d95a78;
}

.security-setting-card strong {
  color: #1c3048;
  display: block;
  font-size: 14px;
  font-weight: 900;
}

.security-setting-card p {
  color: #65788f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  margin: 1px 0 0;
}

.security-setting-card small {
  color: #0f8c50;
  display: block;
  font-size: 11px;
  font-weight: 900;
  margin-top: 3px;
}

.security-setting-card button {
  background: #ffffff;
  border: 1px solid #d5dfe9;
  border-radius: 7px;
  color: #2f445d;
  font-size: 10px;
  font-weight: 900;
  min-height: 34px;
  min-width: 96px;
  padding: 0 12px;
}

.security-setting-card.danger small {
  color: #6f8196;
}

.security-setting-card.danger button {
  border-color: #efc0ca;
  color: #ce4657;
}

.security-setting-card.ok small {
  color: #0f8c50;
}

.security-setting-card.neutral small {
  color: #2d7b57;
}

@media (max-width: 1280px) {
  .settings-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 1180px) {
  .security-overview-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .settings-grid {
    grid-template-columns: 1fr;
  }

  .settings-list article {
    grid-template-columns: 22px 1fr auto;
  }

  .settings-list strong {
    text-align: left;
  }

  .security-score-body {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .security-score-copy {
    width: 100%;
  }

  .security-score-copy > strong {
    font-size: 28px;
  }

  .security-settings-grid {
    grid-template-columns: 1fr;
  }

  .security-setting-card {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .security-setting-card button {
    grid-column: 2;
    justify-self: end;
  }
}

.settings-breadcrumb {
  align-items: center;
  color: #728197;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  margin-bottom: 10px;
}

.settings-breadcrumb strong {
  color: #1f3047;
}

.settings-breadcrumb svg {
  font-size: 12px;
  transform: rotate(-90deg);
}

.meetings-page {
  background: linear-gradient(180deg, #f5f8f6 0%, #eef5f2 100%);
}

.meetings-main {
  align-content: start;
}

.meetings-head h1 {
  font-size: 40px;
}

.meetings-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
  margin-top: 14px;
}

.meetings-calendar-card,
.meetings-list-card {
  background: #ffffff;
  border: 1px solid #e0e8e3;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(37, 67, 49, 0.08);
  padding: 14px;
}

.meetings-month-nav {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 30px minmax(0, 1fr) 30px;
}

.meetings-month-nav button {
  align-items: center;
  background: #f4faf6;
  border: 1px solid #d5e7da;
  border-radius: 8px;
  color: #2f6e4e;
  display: grid;
  height: 30px;
  place-items: center;
}

.meetings-month-nav button:last-child svg {
  transform: rotate(180deg);
}

.meetings-month-nav strong {
  color: #234634;
  font-size: 16px;
  font-weight: 900;
  text-align: center;
  text-transform: capitalize;
}

.meetings-today-button {
  background: transparent;
  border: 0;
  color: #169b5d;
  font-size: 11px;
  font-weight: 900;
  margin-top: 8px;
  padding: 0;
}

.meetings-weekdays {
  color: #698278;
  display: grid;
  font-size: 11px;
  font-weight: 900;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  margin-top: 12px;
  text-align: center;
}

.meetings-days-grid {
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  margin-top: 8px;
}

.meetings-days-grid button {
  align-items: center;
  background: #f7fbf8;
  border: 1px solid #e0ebe5;
  border-radius: 8px;
  color: #335847;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  justify-items: center;
  min-height: 40px;
  padding: 4px 0;
}

.meetings-days-grid button.outside {
  color: #9aa9a0;
  opacity: 0.7;
}

.meetings-days-grid button.past {
  background: #f1f3f1;
  border-color: #d7ddda;
  color: #8a9590;
}

.meetings-days-grid button.past i {
  background: #9ea7a1;
}

.meetings-days-grid button i {
  background: #169b5d;
  border-radius: 999px;
  display: block;
  height: 5px;
  width: 5px;
}

.meetings-days-grid button.active {
  background: linear-gradient(180deg, #18a765 0%, #119156 100%);
  border-color: #109253;
  color: #ffffff;
}

.meetings-days-grid button.past.active {
  background: linear-gradient(180deg, #d8ddda 0%, #c7ceca 100%);
  border-color: #b9c1bc;
  color: #46514c;
}

.meetings-days-grid button.active i {
  background: #ffffff;
}

.meetings-days-grid button.past.active i {
  background: #67736d;
}

.meetings-add-button {
  align-items: center;
  background: #169b5d;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
  min-height: 38px;
  width: 100%;
}

.meetings-add-button:disabled {
  background: #d3ddd7;
  color: #4f6057;
  cursor: not-allowed;
}

.meetings-filters-card {
  border-top: 1px solid #e8f0eb;
  margin-top: 14px;
  padding-top: 12px;
}

.meetings-filters-card h3 {
  color: #264937;
  font-size: 13px;
  margin: 0 0 8px;
}

.meetings-filters-card label {
  align-items: center;
  color: #486053;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  gap: 8px;
  margin-top: 6px;
}

.meetings-filters-card input {
  accent-color: #109253;
}

.meetings-list-card > header {
  border-bottom: 1px solid #e9efeb;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.meetings-list-card > header h2 {
  color: #1f3f2f;
  font-size: 19px;
  margin: 0;
  text-transform: capitalize;
}

.meetings-day-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.meetings-day-summary span {
  background: #eef8f3;
  border-radius: 999px;
  color: #2b5a43;
  font-size: 10px;
  font-weight: 900;
  padding: 4px 8px;
}

.meetings-history-note {
  color: #5a6861;
  font-size: 11px;
  font-weight: 800;
  margin: 8px 0 0;
}

.meetings-list {
  display: grid;
  gap: 10px;
}

.meetings-list article {
  align-items: center;
  background: #f8fcfa;
  border: 1px solid #deece5;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  grid-template-columns: 94px minmax(0, 1fr) auto;
  min-height: 74px;
  padding: 10px;
}

.meetings-list .time {
  color: #214634;
  font-size: 17px;
  font-weight: 900;
}

.meetings-list .time small {
  color: #708477;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
}

.meetings-list .info strong {
  align-items: center;
  color: #1f3848;
  display: inline-flex;
  font-size: 13px;
  gap: 8px;
}

.meetings-list .info p {
  color: #5e7488;
  font-size: 11px;
  font-weight: 700;
  margin: 3px 0 0;
}

.meetings-list .info small {
  color: #667f72;
  display: block;
  font-size: 11px;
  margin-top: 4px;
}

.meetings-list .info i {
  border-radius: 999px;
  display: inline-block;
  height: 9px;
  width: 9px;
}

.meetings-list .info i.buy {
  background: #169b5d;
}

.meetings-list .info i.rent {
  background: #356ce8;
}

.meetings-list .info i.own {
  background: #f5a524;
}

.meetings-list article em {
  background: #e9f7ef;
  border-radius: 999px;
  color: #169b5d;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  padding: 4px 8px;
}

.meetings-list article em.status-completed {
  background: #e6f2ff;
  color: #2e69db;
}

.meetings-list article em.status-cancelled {
  background: #fbe7e7;
  color: #c84343;
}

.meeting-side-actions {
  align-items: end;
  display: grid;
  gap: 8px;
  justify-items: end;
}

.meeting-row-actions {
  display: inline-flex;
  gap: 5px;
}

.meeting-row-actions button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d8e6de;
  border-radius: 7px;
  color: #4e6459;
  display: grid;
  height: 26px;
  place-items: center;
  width: 26px;
}

.meeting-row-actions button:last-child {
  color: #c74747;
}

.meeting-row-actions button svg {
  height: 13px;
  width: 13px;
}

.meetings-empty {
  color: #6f8378;
  font-size: 13px;
  font-weight: 700;
  margin: 8px 0;
}

.meetings-create-form {
  background: #f4faf6;
  border: 1px solid #deece5;
  border-radius: 10px;
  margin-top: 12px;
  padding: 12px;
}

.meetings-create-form h3 {
  color: #214634;
  font-size: 14px;
  margin: 0;
}

.meetings-create-form .fields {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr 1fr;
  margin-top: 10px;
}

.meetings-create-form label {
  color: #446052;
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 6px;
}

.meetings-create-form input,
.meetings-create-form select {
  background: #ffffff;
  border: 1px solid #d7e6dd;
  border-radius: 7px;
  color: #1f3047;
  font-size: 12px;
  min-height: 36px;
  padding: 0 10px;
}

.meetings-error {
  color: #b73a3a;
  font-size: 12px;
  font-weight: 800;
  margin: 8px 0 0;
}

.meetings-create-form .actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}

.meetings-create-form .actions button {
  border-radius: 7px;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
  padding: 0 12px;
}

.meetings-create-form .actions .secondary {
  background: #ffffff;
  border: 1px solid #cfddd5;
  color: #3e5c4d;
}

.meetings-create-form .actions .primary {
  background: #14995b;
  border: 0;
  color: #ffffff;
}

@media (max-width: 1180px) {
  .meetings-grid {
    grid-template-columns: 1fr;
  }

  .meetings-create-form .fields {
    grid-template-columns: 1fr;
  }

  .meetings-list article {
    grid-template-columns: 1fr;
  }

  .meeting-side-actions {
    justify-items: start;
  }
}

.profile-edit-head h1 {
  font-size: 36px;
}

.profile-edit-layout {
  display: grid;
  gap: 12px;
  grid-template-columns: 1.15fr 0.95fr;
}

.profile-edit-main-card {
  align-self: start;
}

.profile-photo-row {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: 74px minmax(0, 1fr);
}

.profile-photo-avatar {
  background: #eaf2ff;
  border: 2px solid #d7e2f2;
  border-radius: 999px;
  color: #2f6cd3;
  display: grid;
  font-size: 22px;
  font-weight: 900;
  height: 74px;
  place-items: center;
  width: 74px;
}

.profile-photo-avatar img {
  border-radius: 999px;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.profile-photo-row small {
  color: #77869a;
  display: block;
  font-size: 11px;
}

.profile-photo-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

.profile-photo-actions label,
.profile-photo-actions button {
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #344860;
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  min-height: 30px;
  padding: 0 12px;
}

.profile-photo-actions label input {
  display: none;
}

.profile-photo-actions button {
  border: 0;
  color: #d14646;
  padding: 0;
}

.settings-separator {
  border-top: 1px solid #edf1f5;
  margin: 14px 0;
}

.profile-form-grid {
  display: grid;
  gap: 10px;
}

.profile-form-grid.two-col {
  grid-template-columns: 1fr 1fr;
  margin-bottom: 10px;
}

.profile-extra-form {
  margin-bottom: 8px;
}

.profile-form-grid label {
  display: grid;
  gap: 6px;
}

.profile-form-grid label > span {
  color: #25374f;
  font-size: 11px;
  font-weight: 900;
}

.profile-form-grid input,
.profile-form-grid select,
.profile-form-grid textarea {
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #20314a;
  font-size: 12px;
  min-height: 40px;
  outline: none;
  padding: 0 12px;
}

.profile-form-grid textarea {
  min-height: 76px;
  padding: 10px 12px;
  resize: vertical;
}

.profile-form-grid small {
  color: #6f7f92;
  font-size: 10px;
  font-weight: 750;
}

.input-action-row {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 106px;
  width: 100%;
}

.input-action-row button,
.phone-row button {
  background: #f7fafc;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  box-sizing: border-box;
  color: #3a4d66;
  font-size: 11px;
  font-weight: 900;
  min-height: 40px;
  padding: 0 12px;
  width: 100%;
  text-align: center;
  white-space: nowrap;
}

.phone-row {
  display: grid;
  gap: 8px;
  grid-template-columns: 140px minmax(0, 1fr) auto;
  width: 100%;
}

.phone-row.verified-row .phone-country-trigger {
  border-color: #1aa766;
  box-shadow: 0 0 0 2px rgba(26, 167, 102, 0.12);
}

.input-action-row > input,
.phone-row > input,
.phone-row > select {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

.phone-prefix {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

.phone-prefix {
  text-align: center;
}

.phone-prefix-select {
  appearance: none;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #2e425b;
  font-size: 12px;
  font-weight: 800;
  min-height: 40px;
  padding: 0 8px;
  text-align: left;
}

.phone-number-input.invalid {
  border-color: #d14646;
  box-shadow: inset 0 0 0 1px rgba(209, 70, 70, 0.15);
}

.phone-number-input.verified {
  border-color: #1aa766;
  box-shadow: 0 0 0 3px rgba(26, 167, 102, 0.16), inset 0 0 0 1px rgba(26, 167, 102, 0.12);
}

.phone-error-message {
  color: #cf4343;
  display: block;
  font-size: 10px;
  font-weight: 900;
  margin-top: 5px;
}

.phone-verified-message {
  color: #109958;
  display: block;
  font-size: 10px;
  font-weight: 900;
  margin-top: 5px;
}

.phone-country-picker {
  position: relative;
}

.phone-country-trigger {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 6px;
  color: #2e425b;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  height: 40px;
  padding: 0 8px;
  width: 100%;
}

.phone-country-trigger img {
  border-radius: 2px;
  height: 14px;
  width: 20px;
}

.phone-country-trigger svg {
  height: 12px;
  margin-left: auto;
  transform: rotate(0deg);
  width: 12px;
}

.phone-country-menu {
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(22, 38, 58, 0.14);
  display: grid;
  left: 0;
  margin-top: 6px;
  max-height: 260px;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  top: 100%;
  width: 280px;
  z-index: 30;
}

.phone-country-menu button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  display: grid;
  gap: 8px;
  grid-template-columns: 20px 42px minmax(0, 1fr);
  min-height: 28px;
  padding: 4px 6px;
  text-align: left;
}

.phone-country-menu button:hover,
.phone-country-menu button.active {
  background: #eef4fb;
}

.phone-country-menu button img {
  border-radius: 2px;
  height: 14px;
  width: 20px;
}

.phone-country-menu button span {
  color: #1f324a;
  font-size: 11px;
  font-weight: 900;
}

.phone-country-menu button small {
  color: #607287;
  font-size: 11px;
  font-weight: 750;
}

.phone-action-buttons {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.phone-action-buttons button {
  min-width: 106px;
  width: auto;
}

.phone-action-buttons .phone-confirm-button {
  background: #edf5ff;
  border: 1px solid #d6e4f5;
  color: #2b4e74;
  font-size: 10px;
  min-width: 176px;
}

.phone-action-buttons .phone-confirm-button.phone-confirmed {
  background: #eaf8ef;
  border-color: #1aa766;
  color: #0f8f53;
}

.phone-verify-modal-overlay {
  align-items: center;
  background: rgba(11, 22, 38, 0.45);
  display: grid;
  inset: 0;
  padding: 16px;
  position: fixed;
  z-index: 120;
}

.phone-verify-modal {
  background: #ffffff;
  border-radius: 14px;
  margin: 0 auto;
  max-width: 420px;
  padding: 14px 18px 18px;
  position: relative;
  width: 100%;
}

.phone-verify-close {
  background: transparent;
  border: 0;
  color: #617388;
  font-size: 16px;
  font-weight: 900;
  position: absolute;
  right: 12px;
  top: 10px;
}

.phone-verify-progress {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-right: 34px;
}

.phone-verify-progress span {
  background: #dfe8f2;
  border-radius: 999px;
  height: 4px;
}

.phone-verify-progress span.active {
  background: #14a15f;
}

.phone-verify-illustration {
  align-items: center;
  display: flex;
  justify-content: center;
  margin: 16px 0 10px;
  min-height: 104px;
  position: relative;
}

.phone-verify-shield {
  align-items: center;
  color: #17a363;
  display: inline-flex;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.phone-verify-shield svg {
  height: 28px;
  width: 28px;
}

.phone-verify-phone {
  align-items: center;
  background: linear-gradient(180deg, #f4f9f7 0%, #edf4f1 100%);
  border-radius: 999px;
  color: #18a867;
  display: inline-flex;
  height: 104px;
  justify-content: center;
  width: 104px;
}

.phone-verify-phone svg {
  height: 34px;
  width: 34px;
}

.phone-verify-modal h2 {
  color: #13253d;
  font-size: 35px;
  font-weight: 900;
  margin-top: 2px;
  text-align: center;
}

.phone-verify-modal > p {
  color: #5f7085;
  font-size: 15px;
  line-height: 1.45;
  margin: 8px auto 12px;
  max-width: 320px;
  text-align: center;
}

.phone-verify-number-box {
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 9px;
  padding: 8px 10px;
}

.phone-verify-number-box small {
  color: #6e7e92;
  display: block;
  font-size: 11px;
  font-weight: 800;
}

.phone-verify-number-box div {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

.phone-verify-number-box strong {
  color: #1b2f47;
  font-size: 14px;
}

.phone-verify-number-box span {
  color: #25384f;
  font-size: 14px;
  font-weight: 800;
}

.phone-verify-note {
  align-items: flex-start;
  background: #eef8f3;
  border-radius: 9px;
  display: grid;
  gap: 10px;
  grid-template-columns: 24px minmax(0, 1fr);
  margin-top: 12px;
  padding: 10px 12px;
}

.phone-verify-note > span {
  color: #1da364;
}

.phone-verify-note > span svg {
  height: 20px;
  width: 20px;
}

.phone-verify-note strong {
  color: #1d6d4b;
  display: block;
  font-size: 13px;
}

.phone-verify-note small {
  color: #3f5b4a;
  display: block;
  font-size: 12px;
  line-height: 1.4;
  margin-top: 3px;
}

.phone-verify-send {
  align-items: center;
  background: #11a25f;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  display: inline-flex;
  font-size: 14px;
  font-weight: 900;
  gap: 7px;
  height: 42px;
  justify-content: center;
  margin-top: 12px;
  width: 100%;
}

.phone-verify-send:disabled {
  background: #9bc8b1;
  cursor: not-allowed;
}

.phone-verify-send svg {
  height: 14px;
  width: 14px;
}

.phone-verify-change {
  background: transparent;
  border: 0;
  color: #14995b;
  display: block;
  font-size: 13px;
  font-weight: 900;
  margin: 10px auto 0;
}

.phone-verify-modal footer {
  align-items: flex-start;
  color: #738398;
  display: flex;
  font-size: 11px;
  gap: 7px;
  line-height: 1.4;
  margin-top: 14px;
}

.phone-verify-modal footer svg {
  color: #5d748f;
  flex-shrink: 0;
  font-size: 13px;
}

.phone-code-hero {
  align-items: center;
  display: grid;
  margin: 14px auto 14px;
  min-height: 168px;
  place-items: center;
  position: relative;
  width: 230px;
}

.phone-code-hero::before {
  background: radial-gradient(circle, rgba(50, 177, 111, 0.18) 0%, rgba(50, 177, 111, 0) 70%);
  border-radius: 999px;
  content: '';
  height: 168px;
  position: absolute;
  width: 168px;
}

.phone-code-hero::after {
  border: 1px solid rgba(23, 173, 102, 0.24);
  border-radius: 999px;
  content: '';
  height: 138px;
  position: absolute;
  width: 138px;
}

.phone-code-device {
  background: linear-gradient(180deg, #ffffff 0%, #eef2f8 100%);
  border: 4px solid #111923;
  border-radius: 24px;
  box-shadow: 0 12px 26px rgba(19, 34, 54, 0.22);
  height: 132px;
  position: relative;
  width: 96px;
  z-index: 1;
}

.phone-code-notch {
  background: #111923;
  border-radius: 0 0 11px 11px;
  height: 12px;
  left: 50%;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: 40px;
}

.phone-code-badge {
  align-items: center;
  background: linear-gradient(145deg, #16b369 0%, #0f9c58 100%);
  border: 2px solid #ffffff;
  border-radius: 16px;
  bottom: 28px;
  box-shadow: 0 12px 20px rgba(20, 160, 96, 0.32);
  color: #ffffff;
  display: inline-flex;
  height: 36px;
  justify-content: center;
  left: 10px;
  position: absolute;
  width: 36px;
  z-index: 2;
}

.phone-code-badge svg {
  height: 16px;
  width: 16px;
}

.phone-code-bubble {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e6ebf2;
  border-radius: 14px;
  bottom: 54px;
  box-shadow: 0 14px 28px rgba(20, 36, 56, 0.2);
  color: #15a05f;
  display: inline-flex;
  font-size: 23px;
  font-weight: 900;
  height: 56px;
  justify-content: center;
  letter-spacing: 0.7px;
  min-width: 142px;
  padding: 0 18px;
  position: absolute;
  right: 4px;
  z-index: 2;
}

.phone-code-bubble::after {
  border-color: #f8fafc transparent transparent #f8fafc;
  border-style: solid;
  border-width: 12px 12px 0 0;
  bottom: -8px;
  content: '';
  left: 22px;
  position: absolute;
  transform: rotate(20deg);
}

.phone-code-number-line {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 2px;
}

.phone-code-number-line strong {
  color: #1f3046;
  font-size: 18px;
  font-weight: 900;
}

.phone-code-number-line button {
  background: transparent;
  border: 0;
  color: #17995c;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  padding: 0;
}

.phone-code-inputs {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 14px;
}

.phone-code-inputs input {
  background: #ffffff;
  border: 1px solid #d3dcea;
  border-radius: 10px;
  color: #1a2d46;
  font-size: 26px;
  font-weight: 800;
  height: 54px;
  text-align: center;
}

.phone-code-inputs input:focus {
  border-color: #16ab65;
  box-shadow: 0 0 0 3px rgba(22, 171, 101, 0.14);
  outline: none;
}

.phone-code-inputs.is-error input {
  border-color: #dc4f4f;
}

.phone-code-error {
  color: #cb3f3f;
  font-size: 12px;
  font-weight: 800;
  margin-top: 8px;
  text-align: center;
}

.phone-code-timer {
  color: #57697f;
  font-size: 12px;
  margin-top: 12px;
  text-align: center;
}

.phone-code-timer strong {
  color: #13a460;
}

.phone-code-note {
  margin-top: 10px;
}

.phone-code-note strong {
  color: #395461;
}

.phone-code-note small {
  color: #566f79;
}

.phone-code-question {
  color: #64778e;
  font-size: 12px;
  margin-top: 14px;
  text-align: center;
}

.phone-code-resend {
  background: transparent;
  border: 0;
  color: #169e5f;
  display: block;
  font-size: 16px;
  font-weight: 900;
  margin: 0 auto;
  padding: 0;
}

.phone-code-resend:disabled {
  color: #86a49a;
  cursor: default;
}

.phone-success-hero {
  align-items: center;
  display: grid;
  margin: 18px auto 12px;
  min-height: 148px;
  place-items: center;
  position: relative;
  width: 180px;
}

.phone-success-hero::before {
  background: radial-gradient(circle, rgba(26, 168, 101, 0.14) 0%, rgba(26, 168, 101, 0) 72%);
  border-radius: 999px;
  content: '';
  height: 148px;
  position: absolute;
  width: 148px;
}

.phone-success-badge {
  align-items: center;
  background: linear-gradient(150deg, #14b064 0%, #0f9958 100%);
  border-radius: 999px;
  box-shadow: 0 14px 28px rgba(18, 152, 92, 0.35);
  display: inline-flex;
  height: 82px;
  justify-content: center;
  position: relative;
  width: 82px;
  z-index: 2;
}

.phone-success-check {
  border-bottom: 8px solid #ffffff;
  border-right: 8px solid #ffffff;
  display: block;
  height: 26px;
  margin-top: -3px;
  transform: rotate(45deg);
  width: 14px;
}

.phone-success-decoration {
  background: #1cb068;
  border-radius: 999px;
  position: absolute;
  z-index: 1;
}

.phone-success-decoration-left-top {
  height: 8px;
  left: 18px;
  top: 22px;
  width: 8px;
}

.phone-success-decoration-left-bottom {
  height: 8px;
  left: 20px;
  top: 108px;
  width: 8px;
}

.phone-success-decoration-right-top {
  border-radius: 999px;
  height: 4px;
  right: 12px;
  top: 48px;
  width: 22px;
}

.phone-success-decoration-right-top::after {
  background: #1cb068;
  border-radius: 999px;
  content: '';
  height: 4px;
  left: 15px;
  position: absolute;
  top: 8px;
  width: 12px;
}

.phone-success-number-box {
  align-items: center;
  border: 1px solid #dde5ef;
  border-radius: 9px;
  display: grid;
  gap: 12px;
  grid-template-columns: 52px minmax(0, 1fr);
  margin-top: 12px;
  padding: 12px;
}

.phone-success-number-icon {
  align-items: center;
  background: #eef7f2;
  border-radius: 999px;
  color: #19a764;
  display: inline-flex;
  height: 52px;
  justify-content: center;
  width: 52px;
}

.phone-success-number-icon svg {
  height: 22px;
  width: 22px;
}

.phone-success-number-box small {
  color: #6f8092;
  display: block;
  font-size: 12px;
  font-weight: 800;
}

.phone-success-number-box strong {
  color: #1a2e47;
  display: block;
  font-size: 16px;
  font-weight: 900;
  margin-top: 2px;
}

.phone-success-note {
  align-items: flex-start;
  display: grid;
  gap: 10px;
  grid-template-columns: 28px minmax(0, 1fr);
  margin-top: 14px;
}

.phone-success-note > span {
  align-items: center;
  background: #eaf5ef;
  border-radius: 999px;
  color: #1b9f60;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.phone-success-note > span svg {
  height: 17px;
  width: 17px;
}

.phone-success-note strong {
  color: #33495f;
  display: block;
  font-size: 13px;
}

.phone-success-note small {
  color: #566f83;
  display: block;
  font-size: 12px;
  line-height: 1.45;
  margin-top: 3px;
}

.profile-form-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 14px;
}

.profile-form-actions button {
  background: #16a464;
  border: 0;
  border-radius: 6px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  min-height: 36px;
  padding: 0 14px;
}

.profile-form-actions .profile-message {
  font-size: 11px;
  font-weight: 900;
}

.profile-form-actions .profile-message.success {
  color: #109253;
}

.profile-form-actions .profile-message.error {
  color: #cf4343;
}

.profile-form-actions .profile-message.info {
  color: #2f6cd3;
}

.profile-edit-side {
  display: grid;
  gap: 12px;
}

.delete-account-button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #f0bcbc;
  border-radius: 6px;
  color: #cf4343;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 8px;
  justify-content: center;
  min-height: 36px;
  width: 100%;
}

@media (max-width: 1200px) {
  .profile-edit-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .profile-form-grid.two-col {
    grid-template-columns: 1fr;
  }

  .input-action-row {
    grid-template-columns: minmax(0, 1fr) 106px;
  }

  .phone-row {
    grid-template-columns: 132px minmax(0, 1fr) auto;
  }

  .profile-form-actions {
    align-items: stretch;
    flex-direction: column;
  }
}

.public-profile-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.public-profile-head > button, .public-profile-head > a {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 8px;
  color: #344860;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
}

.public-profile-head > button svg, .public-profile-head > a svg {
  height: 14px;
  width: 14px;
}

.public-profile-cover-card {
  background: #ffffff;
  border: 1px solid #dfe7f0;
  border-radius: 12px;
  margin-bottom: 12px;
  overflow: hidden;
}

.public-profile-cover {
  background-size: cover;
  height: 134px;
}

.public-profile-summary {
  align-items: center;
  display: grid;
  gap: 14px;
  grid-template-columns: 76px 1.2fr 1fr auto;
  padding: 12px 16px 16px;
}

.public-profile-avatar {
  align-items: center;
  background: #eaf2ff;
  border: 3px solid #ffffff;
  border-radius: 999px;
  box-shadow: 0 6px 14px rgba(29, 52, 82, 0.16);
  color: #2f6cd3;
  display: grid;
  font-size: 26px;
  font-weight: 900;
  height: 76px;
  margin-top: -30px;
  width: 76px;
}

.public-profile-user h2 {
  font-size: 31px;
  line-height: 1.05;
  margin-bottom: 6px;
}

.public-profile-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.public-profile-meta span {
  align-items: center;
  color: #607287;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  gap: 6px;
}

.public-profile-meta svg {
  height: 13px;
  width: 13px;
}

.public-profile-rating {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-top: 6px;
}

.public-profile-rating strong {
  color: #18293f;
  font-size: 16px;
}

.public-profile-rating span {
  color: #f2b51e;
  display: inline-flex;
  gap: 2px;
}

.public-profile-rating span svg {
  fill: currentColor;
  height: 13px;
  stroke: currentColor;
  width: 13px;
}

.public-profile-rating small {
  color: #6f7f92;
  font-size: 11px;
  font-weight: 750;
}

.public-profile-summary blockquote {
  color: #3a4d66;
  font-size: 12px;
  font-style: italic;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
}

.public-profile-stats {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(64px, 1fr));
}

.public-profile-stats div {
  text-align: center;
}

.public-profile-stats strong {
  color: #11243a;
  display: block;
  font-size: 20px;
  line-height: 1;
}

.public-profile-stats small {
  color: #6f7f92;
  font-size: 10px;
  font-weight: 750;
}

.public-profile-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: 1.35fr 0.95fr;
  margin-bottom: 12px;
}

.public-profile-listings {
  align-self: start;
}

.public-listing-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.public-listing-card {
  border: 1px solid #e4ebf3;
  border-radius: 10px;
  overflow: hidden;
}

.public-listing-photo {
  position: relative;
  background-size: cover;
  border-bottom: 1px solid #e4ebf3;
  height: 88px;
}

.public-listing-badge {
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  left: 8px;
  line-height: 1;
  padding: 4px 7px;
  position: absolute;
  top: 8px;
}

.public-listing-badge.sale {
  background: #ddf5e8;
  color: #109253;
}

.public-listing-badge.rent {
  background: #ece6ff;
  color: #7a59c4;
}

.public-listing-body {
  padding: 10px;
}

.public-listing-body strong {
  color: #11243a;
  display: block;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.1;
  white-space: nowrap;
}

.public-listing-body h3 {
  color: #1d3047;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
  margin-top: 5px;
}

.public-listing-body small {
  align-items: center;
  color: #6f7f92;
  display: flex;
  font-size: 9px;
  font-weight: 800;
  gap: 4px;
  margin-top: 3px;
}

.public-listing-body small svg {
  height: 12px;
  width: 12px;
}

.public-listing-meta {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 8px;
}

.public-listing-meta span {
  align-items: center;
  color: #617388;
  display: inline-flex;
  font-size: 9px;
  font-weight: 800;
  gap: 4px;
  min-width: 0;
}

.public-listing-meta span svg {
  height: 11px;
  width: 11px;
}

.public-listing-foot {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
}

.public-listing-foot em {
  color: #7d8b9c;
  font-size: 9px;
  font-style: normal;
  font-weight: 750;
}

.public-listing-foot button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #708094;
  display: inline-flex;
  justify-content: center;
  padding: 0;
}

.public-listing-foot button svg {
  height: 14px;
  width: 14px;
}

.public-profile-reviews .settings-card-head,
.public-profile-listings .settings-card-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.public-profile-reviews .settings-card-head .ghost,
.public-profile-listings .settings-card-head .ghost {
  border: 0;
  color: #109253;
  font-size: 11px;
  font-weight: 900;
  padding: 0;
}

.public-review-list {
  display: grid;
  gap: 10px;
}

.public-review-item {
  border-bottom: 1px solid #eef2f7;
  display: grid;
  gap: 10px;
  grid-template-columns: 34px minmax(0, 1fr);
  padding-bottom: 10px;
}

.public-review-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.public-review-avatar {
  align-items: center;
  background: #e7eef8;
  border: 1px solid #d6e0ee;
  border-radius: 999px;
  color: #2f557f;
  display: grid;
  font-size: 11px;
  font-weight: 900;
  height: 34px;
  overflow: hidden;
  width: 34px;
}

.public-review-avatar img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.public-review-content strong {
  color: #1a2c43;
  display: block;
  font-size: 12px;
  font-weight: 900;
}

.public-review-stars {
  color: #f2b51e;
  display: inline-flex;
  gap: 2px;
  margin: 2px 0 6px;
}

.public-review-stars svg {
  fill: currentColor;
  height: 12px;
  stroke: currentColor;
  width: 12px;
}

.public-review-content p {
  color: #53667c;
  font-size: 11px;
  line-height: 1.45;
}

.public-profile-about h2 {
  margin-bottom: 8px;
}

.public-profile-about p {
  color: #53667c;
  font-size: 12px;
  line-height: 1.5;
}

.public-profile-badges {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 12px;
}

.public-profile-badges span {
  align-items: center;
  background: #f5faf7;
  border: 1px solid #d8ebdf;
  border-radius: 8px;
  color: #2a4a37;
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  gap: 6px;
  min-height: 32px;
  padding: 0 10px;
}

.public-profile-badges span svg {
  height: 13px;
  width: 13px;
}

@media (max-width: 1240px) {
  .public-profile-summary {
    grid-template-columns: 76px 1fr;
  }

  .public-profile-summary blockquote,
  .public-profile-stats {
    grid-column: 1 / -1;
  }

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

@media (max-width: 900px) {
  .public-profile-head {
    align-items: flex-start;
    flex-direction: column;
  }

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

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

@media (max-width: 1380px) {
  .favorites-head h1 {
    font-size: 40px;
  }

  .favorites-tabs button {
    font-size: 14px;
  }

  .favorite-card {
    grid-template-columns: 260px minmax(0, 1fr) auto;
  }

  .favorite-content strong {
    font-size: 20px;
  }

  .favorite-content h3 {
    font-size: 16px;
  }
}

@media (max-width: 1100px) {
  .favorites-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .favorites-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .favorites-controls {
    width: 100%;
  }

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

  .favorites-sidebar {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .favorite-card {
    grid-template-columns: 220px minmax(0, 1fr) auto;
  }
}

@media (max-width: 760px) {
  .favorites-head h1 {
    font-size: 31px;
  }

  .favorites-tabs {
    width: 100%;
  }

  .favorites-tabs button {
    flex: 1;
    font-size: 15px;
    padding: 0 4px;
  }

  .favorites-controls {
    flex-wrap: wrap;
  }

  .favorites-sort-control,
  .favorites-filter-button {
    width: 100%;
  }

  .favorite-card {
    grid-template-columns: 1fr;
    padding: 8px;
  }

  .favorite-photo {
    min-height: 188px;
  }

  .favorite-content strong {
    font-size: 20px;
  }

  .favorite-content h3 {
    font-size: 16px;
  }

  .favorite-content ul {
    gap: 10px;
  }

  .favorite-actions {
    display: flex;
    justify-content: flex-end;
  }

  .favorites-sidebar {
    grid-template-columns: 1fr;
  }
}

/* ===== Auth / Panel admina (logowanie, rejestracja, moderacja) ===== */
.login-error {
  background: #fdecec;
  border: 1px solid #f5c2c2;
  border-radius: 8px;
  color: #b3261e;
  font-size: 13px;
  font-weight: 700;
  margin: 0;
  padding: 8px 12px;
}

.login-eye {
  background: transparent;
  border: none;
  color: #64748b;
  cursor: pointer;
  display: inline-flex;
  padding: 0;
}

.login-eye svg {
  height: 18px;
  width: 18px;
}

.publish-feedback {
  align-items: center;
  border-radius: 10px;
  display: flex;
  font-size: 14px;
  font-weight: 700;
  gap: 8px;
  margin: 12px 0 0;
  padding: 12px 14px;
}

.publish-feedback.success {
  background: #e8f8ef;
  border: 1px solid #b7e6cd;
  color: #0f7a48;
}

.publish-feedback.error {
  background: #fdecec;
  border: 1px solid #f5c2c2;
  color: #b3261e;
}

.publish-feedback svg {
  height: 18px;
  width: 18px;
}

.admin-page {
  background: #f5f7fa;
  min-height: calc(100vh - 82px);
  padding: 24px 18px;
}

.admin-shell {
  margin: 0 auto;
  max-width: 1280px;
}

.admin-shell-with-sidebar {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: 250px minmax(0, 1fr);
  max-width: 1480px;
}

.admin-sidebar {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 12px;
  display: grid;
  gap: 14px;
  padding: 14px;
  position: sticky;
  top: 94px;
}

.admin-sidebar-badge {
  justify-self: start;
}

.admin-nav {
  display: grid;
  gap: 3px;
}

.admin-nav button, .admin-nav a {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #33475f;
  cursor: pointer;
  display: grid;
  font-size: 13px;
  font-weight: 800;
  gap: 9px;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  min-height: 38px;
  padding: 0 10px;
  text-align: left;
}

.admin-nav button svg, .admin-nav a svg {
  color: #7186a0;
  height: 15px;
  width: 15px;
}

.admin-nav button.active, .admin-nav a.active {
  background: #ebf6f0;
  color: #109253;
}

.admin-nav button.active svg, .admin-nav a.active svg {
  color: #109253;
}

.admin-nav button b, .admin-nav a b {
  background: #129357;
  border-radius: 999px;
  color: #ffffff;
  font-size: 10px;
  min-width: 18px;
  padding: 1px 6px;
  text-align: center;
}

.admin-nav-group-label {
  color: #93a3b8;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.03em;
  margin: 2px 4px -6px;
  text-transform: uppercase;
}

.admin-sidebar-status {
  background: #f3fbf7;
  border: 1px solid #d8efe4;
  border-radius: 10px;
  display: grid;
  gap: 6px;
  padding: 12px;
}

.admin-sidebar-status strong {
  align-items: center;
  color: #109253;
  display: inline-flex;
  font-size: 12px;
  gap: 6px;
}

.admin-sidebar-status p {
  color: #5f748a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0;
}

.admin-sidebar-status button {
  background: transparent;
  border: 0;
  color: #109253;
  font-size: 11px;
  font-weight: 900;
  justify-self: start;
  padding: 0;
}

.admin-sidebar .admin-back {
  border-top: 1px solid #eef2f7;
  margin-top: 0;
  padding-top: 12px;
}

.admin-main {
  min-width: 0;
}

.admin-dashboard {
  display: grid;
  gap: 14px;
}

.admin-stats-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.admin-stat-card {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 11px;
  display: grid;
  gap: 10px;
  grid-template-columns: 36px minmax(0, 1fr);
  padding: 12px;
}

.admin-stat-icon {
  align-items: center;
  border-radius: 999px;
  display: grid;
  height: 36px;
  place-items: center;
  width: 36px;
}

.admin-stat-icon svg {
  height: 16px;
  width: 16px;
}

.admin-stat-icon.tone-green { background: #eaf8ef; color: #139d5b; }
.admin-stat-icon.tone-blue { background: #eef0ff; color: #5e6ddb; }
.admin-stat-icon.tone-yellow { background: #fff8e7; color: #e4af24; }
.admin-stat-icon.tone-purple { background: #f1eeff; color: #7a61db; }
.admin-stat-icon.tone-pink { background: #ffeef3; color: #d95a78; }

.admin-stat-card strong {
  color: #13243d;
  display: block;
  font-size: 20px;
  line-height: 1.1;
}

.admin-stat-card small {
  color: #7186a0;
  display: block;
  font-size: 11px;
  font-weight: 750;
  margin-top: 2px;
}

.admin-dashboard-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
}

.admin-card-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 14px 18px 0;
}

.admin-card-head h2 {
  color: #13243d;
  font-size: 16px;
  margin: 0;
}

.admin-card-head button, .admin-card-head a {
  background: transparent;
  border: 0;
  color: #159e5d;
  font-size: 11px;
  font-weight: 900;
}

.admin-table-compact .admin-row {
  grid-template-columns: 2fr 1fr 1.4fr 1fr;
  padding: 10px 18px;
}

.admin-activity-list {
  display: grid;
  gap: 2px;
  list-style: none;
  margin: 10px 0 0;
  padding: 0 18px 14px;
}

.admin-activity-list li {
  align-items: center;
  border-bottom: 1px solid #eef2f7;
  display: grid;
  gap: 10px;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  min-height: 56px;
  padding: 6px 0;
}

.admin-activity-list li:last-child {
  border-bottom: 0;
}

.admin-activity-avatar {
  align-items: center;
  background: #e8f4ff;
  border-radius: 999px;
  color: #20344f;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  height: 30px;
  place-items: center;
  width: 30px;
}

.admin-activity-list strong {
  color: #13243d;
  display: block;
  font-size: 12px;
}

.admin-activity-list small {
  color: #7186a0;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
}

.admin-activity-list em {
  color: #93a3b8;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.admin-quick-actions-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 12px 18px 18px;
}

.admin-quick-actions-grid button, .admin-quick-actions-grid a {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #e0e8f2;
  border-radius: 9px;
  color: #2f445d;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  min-height: 42px;
  padding: 0 12px;
}

.admin-quick-actions-grid button svg:first-child, .admin-quick-actions-grid a svg:first-child {
  color: #109253;
}

.admin-quick-actions-grid button svg:last-child, .admin-quick-actions-grid a svg:last-child {
  margin-left: auto;
  opacity: 0.6;
}

.admin-placeholder {
  align-items: center;
  display: grid;
  justify-items: center;
  min-height: 220px;
  padding: 32px;
  text-align: center;
}

.admin-placeholder span {
  align-items: center;
  background: #ebf6f0;
  border-radius: 999px;
  color: #109253;
  display: grid;
  height: 44px;
  margin-bottom: 12px;
  place-items: center;
  width: 44px;
}

.admin-placeholder strong {
  color: #13243d;
  font-size: 16px;
}

.admin-placeholder p {
  color: #7186a0;
  font-size: 12px;
  font-weight: 700;
  margin: 6px 0 0;
  max-width: 320px;
}

.admin-stats-live {
  display: grid;
  gap: 14px;
}

.admin-stats-top-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-stats-top-card {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 12px;
  display: grid;
  gap: 12px;
  grid-template-columns: 48px minmax(0, 1fr);
  min-height: 86px;
  padding: 14px 16px;
}

.admin-stats-top-card span {
  align-items: center;
  background: #edf3ff;
  border-radius: 999px;
  color: #1b63de;
  display: grid;
  font-size: 20px;
  height: 44px;
  place-items: center;
  width: 44px;
}

.admin-stats-top-card strong {
  color: #13243d;
  display: block;
  font-size: 38px;
  line-height: 1;
}

.admin-stats-top-card small {
  color: #5f748a;
  font-size: 13px;
  font-weight: 760;
}

.admin-stats-layout {
  display: grid;
  gap: 14px;
  grid-template-columns: 260px minmax(0, 1fr);
}

.admin-stats-sidebar,
.admin-stats-main {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 12px;
}

.admin-stats-sidebar {
  padding: 16px;
}

.admin-stats-sidebar h3 {
  color: #13243d;
  font-size: 15px;
  margin: 0 0 10px;
  text-transform: uppercase;
}

.admin-stats-period-buttons {
  display: grid;
  gap: 8px;
}

.admin-stats-period-buttons button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  color: #33475f;
  display: inline-flex;
  font-size: 14px;
  font-weight: 780;
  gap: 8px;
  min-height: 40px;
  padding: 0 12px;
}

.admin-stats-period-buttons button.active {
  background: #eef3fb;
  border-color: #c7d7ea;
  color: #1b63de;
}

.admin-stats-side-summary {
  border-top: 1px solid #e6ecf3;
  margin-top: 14px;
  padding-top: 12px;
}

.admin-stats-custom-range {
  background: #f8fbff;
  border: 1px solid #e1e9f3;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 10px;
}

.admin-stats-custom-range label {
  display: grid;
  gap: 5px;
}

.admin-stats-custom-range span {
  color: #4f6682;
  font-size: 12px;
  font-weight: 760;
}

.admin-stats-custom-range input {
  background: #ffffff;
  border: 1px solid #d9e3ef;
  border-radius: 8px;
  color: #13243d;
  font-family: inherit;
  font-size: 13px;
  font-weight: 760;
  min-height: 38px;
  padding: 0 10px;
}

.admin-stats-custom-range select {
  background: #ffffff;
  border: 1px solid #d9e3ef;
  border-radius: 8px;
  color: #13243d;
  font-family: inherit;
  font-size: 13px;
  font-weight: 760;
  min-height: 38px;
  padding: 0 10px;
}

.admin-stats-side-summary strong,
.admin-stats-side-summary p {
  color: #33475f;
  display: block;
  font-size: 13px;
  font-weight: 760;
  margin: 0 0 8px;
}

.admin-stats-main {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.admin-stats-main-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.admin-stats-main-head h2 {
  color: #13243d;
  font-size: 36px;
  margin: 0;
}

.admin-stats-cards-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-stats-card {
  background: #ffffff;
  border: 1px solid #e4eaf2;
  border-radius: 12px;
  min-height: 110px;
  padding: 14px;
}

.admin-stats-card h4 {
  align-items: center;
  color: #4f6682;
  display: inline-flex;
  font-size: 15px;
  font-weight: 780;
  gap: 8px;
  margin: 0;
}

.admin-stats-card h4 svg {
  color: #1b63de;
}

.admin-stats-card strong {
  color: #13243d;
  display: block;
  font-size: 44px;
  line-height: 1;
  margin-top: 10px;
}

.admin-stats-history {
  background: #ffffff;
  border: 1px solid #e4eaf2;
  border-radius: 12px;
  overflow: hidden;
}

.admin-stats-history header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 12px 14px 0;
}

.admin-stats-history h3 {
  color: #13243d;
  font-size: 18px;
  margin: 0;
}

.admin-stats-history small {
  color: #7186a0;
  font-size: 11px;
  font-weight: 760;
}

.admin-table-stats-history .admin-row {
  grid-template-columns: 1.1fr repeat(5, minmax(0, 1fr));
}

@media (max-width: 1180px) {
  .admin-stats-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .admin-stats-layout {
    grid-template-columns: 1fr;
  }

  .admin-stats-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .admin-shell-with-sidebar {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
  }

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

  .admin-quick-actions-grid {
    grid-template-columns: 1fr;
  }

  .admin-stats-top-grid,
  .admin-stats-cards-grid {
    grid-template-columns: 1fr;
  }
}

.admin-head {
  align-items: flex-start;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 18px;
}

.admin-head h1 {
  color: #13243d;
  font-size: 32px;
  margin: 8px 0 6px;
}

.admin-head p {
  color: #5f748a;
  font-size: 14px;
  margin: 0;
}

.admin-badge {
  align-items: center;
  background: #e8f8ef;
  border-radius: 999px;
  color: #0f7a48;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  padding: 5px 12px;
  text-transform: uppercase;
}

.admin-badge svg {
  height: 14px;
  width: 14px;
}

.admin-refresh {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d8e3ef;
  border-radius: 8px;
  color: #304760;
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
}

.admin-refresh:disabled {
  opacity: 0.6;
  cursor: default;
}

.admin-error {
  background: #fdecec;
  border: 1px solid #f5c2c2;
  border-radius: 8px;
  color: #b3261e;
  font-weight: 700;
  margin: 0 0 14px;
  padding: 10px 14px;
}

.admin-empty {
  color: #5f748a;
  font-weight: 700;
  padding: 24px;
  text-align: center;
}

.admin-card {
  background: #ffffff;
  border: 1px solid #e3e9f0;
  border-radius: 12px;
  overflow: hidden;
}

.admin-table {
  display: flex;
  flex-direction: column;
}

.admin-table-reports .admin-row-report {
  grid-template-columns: 2.15fr 1.25fr 1fr 1fr 0.95fr 1.05fr 1.25fr;
}

.admin-table-reports .admin-row-report > span:nth-child(5),
.admin-table-reports .admin-row-report > span:nth-child(6) {
  text-align: center;
}

.admin-table-reports .admin-row-report > span:nth-child(5) .admin-btn,
.admin-table-reports .admin-row-report > span:nth-child(6) .admin-btn {
  width: 100%;
}

.admin-row {
  align-items: center;
  border-bottom: 1px solid #eef2f7;
  display: grid;
  gap: 12px;
  grid-template-columns: 2.4fr 1.3fr 1fr 1.6fr 1fr 1.6fr;
  padding: 14px 18px;
}

.admin-table-users .admin-row {
  grid-template-columns: 1.7fr 0.8fr 1fr 0.9fr 1fr 1.1fr 0.9fr 0.95fr 1.15fr;
}

.admin-table-message-inbox .admin-row {
  grid-template-columns: 1.25fr 1.9fr 1.2fr 0.8fr;
}

.admin-message-inbox .admin-cell-main small {
  white-space: normal;
}

.admin-row:last-child {
  border-bottom: none;
}

.admin-row-head {
  background: #f7f9fc;
  color: #7186a0;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.admin-row span {
  color: #33475f;
  font-size: 14px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.admin-cell-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-cell-main strong,
.admin-cell-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-cell-main strong {
  color: #13243d;
  font-size: 14px;
}

.admin-cell-main small {
  color: #7186a0;
  font-size: 12px;
}

.admin-cell-owner {
  color: #5f748a;
  font-size: 13px;
}

.admin-status {
  border-radius: 999px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  padding: 4px 10px;
  white-space: nowrap;
}

.admin-status.pending {
  background: #fff5e5;
  color: #b8770a;
}

.admin-status.approved {
  background: #e8f8ef;
  color: #0f7a48;
}

.admin-status.rejected {
  background: #fdecec;
  color: #b3261e;
}

.admin-status.company {
  background: #f2e9fc;
  color: #7c3aed;
}

.admin-cell-verification {
  align-items: flex-start;
  display: grid;
  gap: 6px;
  justify-items: start;
}

.admin-cell-preview {
  align-items: flex-start;
  display: grid;
  justify-items: start;
}

.admin-verify-modal {
  background: #ffffff;
  border: 1px solid #e4e9f1;
  border-radius: 16px;
  max-width: 460px;
  padding: 22px;
  position: relative;
  width: min(100%, 460px);
}

.admin-message-modal {
  background: #ffffff;
  border: 1px solid #e4e9f1;
  border-radius: 16px;
  max-width: 480px;
  padding: 22px;
  position: relative;
  width: min(100%, 480px);
}

.admin-message-modal h2 {
  color: #13243d;
  font-size: 20px;
  margin: 0 28px 0 0;
}

.admin-message-refresh {
  background: transparent;
  border: 1px solid #dbe4ef;
  border-radius: 999px;
  color: #33475f;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  margin-top: 10px;
  padding: 5px 12px;
}

.admin-message-error {
  background: #fdecec;
  border-radius: 8px;
  color: #b3261e;
  font-size: 12px;
  font-weight: 700;
  margin: 10px 0 0;
  padding: 8px 10px;
}

.admin-message-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 16px 0;
  max-height: 320px;
  overflow-y: auto;
  padding-right: 4px;
}

.admin-message-bubble {
  background: #f7f9fc;
  border-radius: 12px;
  max-width: 85%;
  padding: 8px 12px;
}

.admin-message-bubble p {
  color: #13243d;
  font-size: 13px;
  margin: 0;
  overflow-wrap: anywhere;
}

.admin-message-bubble small {
  color: #7186a0;
  display: block;
  font-size: 11px;
  margin-top: 4px;
}

.admin-message-bubble.mine {
  align-self: flex-end;
  background: #e8f8ef;
}

.admin-message-composer {
  display: grid;
  gap: 10px;
}

.admin-message-composer textarea {
  border: 1px solid #dbe4ef;
  border-radius: 10px;
  font-family: inherit;
  font-size: 13px;
  padding: 10px 12px;
  resize: vertical;
}

.admin-message-composer button {
  justify-self: end;
}

.admin-verify-icon {
  align-items: center;
  background: #e8f8ef;
  border-radius: 999px;
  color: #109253;
  display: grid;
  height: 52px;
  margin: 6px auto 12px;
  place-items: center;
  width: 52px;
}

.admin-verify-icon svg {
  height: 24px;
  width: 24px;
}

.admin-verify-modal h2 {
  color: #13243d;
  font-size: 24px;
  margin: 0;
  text-align: center;
}

.admin-verify-subtitle {
  color: #5f748a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  margin: 8px 0 16px;
  text-align: center;
}

.admin-verify-details {
  display: grid;
  gap: 10px;
  margin-bottom: 6px;
}

.admin-verify-details article {
  align-items: center;
  background: #f7f9fc;
  border-radius: 9px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
}

.admin-verify-details span {
  color: #7186a0;
  font-size: 12px;
  font-weight: 800;
}

.admin-verify-details strong {
  color: #13243d;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
  text-align: right;
}

.admin-verify-reject-note {
  background: #fdecec;
  border-radius: 8px;
  color: #b3261e;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
  margin: 12px 0 0;
  padding: 8px 10px;
  text-align: center;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-account-actions-cell {
  align-items: center;
  display: flex;
}

.admin-account-actions-table {
  border: 1px solid #e3e9f0;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 5px;
  width: 100%;
}

.admin-account-actions-table .admin-btn {
  justify-content: center;
  width: 100%;
}

.admin-btn {
  background: #ffffff;
  border: 1px solid #d8e3ef;
  border-radius: 7px;
  color: #304760;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 12px;
}

.admin-btn-compact {
  font-size: 11px;
  padding: 5px 8px;
}

.admin-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

.admin-btn.approve {
  background: #129357;
  color: #ffffff;
}

.admin-btn.reject {
  background: #ffffff;
  border-color: #d8e3ef;
  color: #b8770a;
}

.admin-btn.danger {
  background: #ffffff;
  border-color: #f2c4c4;
  color: #b3261e;
}

.admin-forbidden-words {
  display: grid;
  gap: 14px;
  padding-bottom: 16px;
}

.admin-forbidden-add {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0 18px;
}

.admin-forbidden-add input {
  border: 1px solid #d8e3ef;
  border-radius: 8px;
  color: #22364e;
  font-size: 14px;
  font-weight: 700;
  min-height: 40px;
  outline: none;
  padding: 0 12px;
}

.admin-forbidden-add input:focus {
  border-color: #129357;
}

.admin-forbidden-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 18px;
}

.admin-forbidden-chip {
  align-items: center;
  background: #f3f7fc;
  border: 1px solid #dce5f0;
  border-radius: 999px;
  color: #33475f;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  padding: 5px 6px 5px 12px;
}

.admin-forbidden-remove {
  align-items: center;
  background: transparent;
  border: none;
  border-radius: 999px;
  color: #b0473b;
  cursor: pointer;
  display: inline-flex;
  height: 22px;
  justify-content: center;
  padding: 0;
  width: 22px;
}

.admin-forbidden-remove svg {
  height: 14px;
  width: 14px;
}

.admin-forbidden-remove:hover:not(:disabled) {
  background: #fbe4e1;
}

.admin-forbidden-remove:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.admin-forbidden-count {
  color: #6b7f96;
  font-size: 13px;
  font-weight: 700;
}

.admin-forbidden-search {
  align-items: center;
  border: 1px solid #d8e3ef;
  border-radius: 8px;
  display: flex;
  gap: 8px;
  margin: 0 18px;
  padding: 0 12px;
}

.admin-forbidden-search:focus-within {
  border-color: #129357;
}

.admin-forbidden-search svg {
  color: #8496ab;
  flex-shrink: 0;
  height: 18px;
  width: 18px;
}

.admin-forbidden-search input {
  background: transparent;
  border: none;
  color: #22364e;
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  min-height: 40px;
  outline: none;
  padding: 0;
}

.admin-forbidden-search-clear {
  background: transparent;
  border: none;
  color: #8496ab;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  padding: 0 2px;
}

.admin-users-search-bar {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin: 16px 18px 12px;
}

.admin-users-search {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d8e3ef;
  border-radius: 10px;
  display: flex;
  gap: 8px;
  min-height: 42px;
  padding: 0 12px;
  width: min(100%, 420px);
}

.admin-users-search:focus-within {
  border-color: #129357;
}

.admin-users-search svg {
  color: #8496ab;
  flex-shrink: 0;
  height: 18px;
  width: 18px;
}

.admin-users-search input {
  background: transparent;
  border: none;
  color: #22364e;
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  min-height: 38px;
  outline: none;
  padding: 0;
}

.admin-users-search-clear {
  background: transparent;
  border: none;
  color: #8496ab;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  padding: 0 2px;
}

.admin-users-search-count {
  color: #7186a0;
  font-size: 12px;
  font-weight: 800;
}

.admin-muted {
  color: #93a3b8;
  font-size: 12px;
  font-weight: 700;
}

.admin-back {
  align-items: center;
  background: transparent;
  border: none;
  color: #129357;
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  gap: 8px;
  margin-top: 18px;
  padding: 8px 0;
}

@media (max-width: 900px) {
  .admin-row,
  .admin-table-users .admin-row {
    grid-template-columns: 1fr 1fr;
  }
  .admin-row-head {
    display: none;
  }
  .admin-cell-main {
    grid-column: 1 / -1;
  }
  .admin-actions {
    grid-column: 1 / -1;
  }

  .admin-account-actions-cell {
    grid-column: 1 / -1;
  }

  .admin-forbidden-add {
    grid-template-columns: 1fr;
  }

  .admin-users-search-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-users-search {
    width: 100%;
  }
}

/* ===== Ogloszenia z API: paski na Kupuje/Wynajmuje i Moje oferty ===== */

.real-listings-band {
  background: #eef7f1;
  border: 1px solid #cfe8d8;
  border-radius: 14px;
  margin-bottom: 18px;
  padding: 16px;
}

.real-listings-band-head {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}

.real-listings-band-head h3 {
  color: #0f5132;
  font-size: 15px;
  margin: 0;
}

.real-listings-band-head span {
  background: #129357;
  border-radius: 999px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 2px 9px;
}

.real-listings-grid,
.listings-api-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}

.real-listing-card,
.listings-api-card {
  background: #fff;
  border: 1px solid #e2e9f1;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
  text-align: left;
  transition: box-shadow 0.15s, transform 0.15s;
}

.real-listing-card:hover,
.listings-api-card:hover {
  box-shadow: 0 10px 24px rgba(19, 36, 61, 0.12);
  transform: translateY(-2px);
}

.real-listing-photo,
.listings-api-thumb {
  background-color: #dce5f0;
  background-position: center;
  background-size: cover;
  height: 140px;
  position: relative;
}

.real-listing-photo .green-tag {
  background: #129357;
  border-radius: 999px;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  left: 10px;
  padding: 3px 9px;
  position: absolute;
  top: 10px;
}

.real-listing-info,
.listings-api-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px;
}

.real-listing-info h3,
.listings-api-body strong {
  color: #13243d;
  font-size: 14px;
  margin: 0;
}

.real-listing-info p,
.listings-api-body small {
  color: #64748b;
  font-size: 12px;
  margin: 0;
}

.real-listing-info small {
  color: #94a3b8;
  font-size: 12px;
}

.real-listing-info strong {
  color: #0f5132;
  font-size: 16px;
  margin-top: 4px;
}

.listings-api-body em {
  color: #0f5132;
  font-size: 15px;
  font-style: normal;
  font-weight: 800;
  margin-top: 2px;
}

.listings-api-band {
  margin-bottom: 20px;
}

.listings-api-band > header {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}

.listings-api-band > header h2 {
  color: #13243d;
  font-size: 17px;
  margin: 0;
}

.listings-api-band > header span {
  background: #129357;
  border-radius: 999px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 2px 9px;
}

.listings-api-note {
  color: #64748b;
  font-size: 14px;
}

.listings-api-thumb {
  border-radius: 0;
}

.ld-status {
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 9px;
}

.listings-api-thumb .ld-status {
  left: 10px;
  position: absolute;
  top: 10px;
}

.ld-status-pending { background: #fff4d6; color: #92600a; }
.ld-status-approved { background: #d6f3e2; color: #0f7a43; }
.ld-status-rejected { background: #fbe0dd; color: #b0473b; }

/* ===== Widok szczegolow ogloszenia ===== */

.listing-detail-page {
  margin: 0 auto;
  max-width: 1180px;
  padding: 24px 20px 60px;
}

.listing-detail-state {
  align-items: center;
  color: #47597a;
  display: flex;
  flex-direction: column;
  gap: 14px;
  justify-content: center;
  min-height: 320px;
}

.listing-detail-back,
.listing-detail-crumbs button, .listing-detail-crumbs a {
  align-items: center;
  background: none;
  border: none;
  color: #129357;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 700;
  gap: 6px;
}

.listing-detail-crumbs {
  align-items: center;
  color: #8496ab;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 8px;
  margin-bottom: 18px;
}

.listing-detail-crumbs strong {
  color: #13243d;
}

.listing-detail-layout {
  align-items: start;
  display: grid;
  gap: 24px;
  grid-template-columns: minmax(0, 1fr) 360px;
}

.listing-detail-main {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.listing-detail-gallery-main {
  border-radius: 16px;
  overflow: hidden;
  position: relative;
}

.listing-detail-gallery-main img {
  aspect-ratio: 16 / 10;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}

.listing-detail-badges {
  display: flex;
  gap: 8px;
  left: 14px;
  position: absolute;
  top: 14px;
}

.ld-badge {
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  color: #13243d;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 11px;
}

.ld-badge-green {
  background: #129357;
  color: #fff;
}

.listing-detail-gallery-count {
  background: rgba(15, 23, 42, 0.72);
  border-radius: 999px;
  bottom: 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  left: 14px;
  padding: 4px 10px;
  position: absolute;
}

.listing-detail-thumbs {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
  margin-top: 8px;
}

.listing-detail-thumbs button {
  border: 2px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  overflow: hidden;
  padding: 0;
}

.listing-detail-thumbs button.active {
  border-color: #129357;
}

.listing-detail-thumbs img {
  aspect-ratio: 1 / 1;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.listing-detail-card {
  background: #fff;
  border: 1px solid #e6ecf3;
  border-radius: 16px;
  padding: 20px 22px;
}

.listing-detail-card-head {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.listing-detail-card-head h2 {
  margin: 0;
}

.listing-detail-report-btn {
  align-items: center;
  background: #ffffff;
  border: 1px solid #f4b2a8;
  border-radius: 8px;
  color: #df2f17;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  padding: 6px 10px;
}

.listing-detail-report-btn:hover {
  background: #fff5f3;
}

.listing-detail-gallery-main-image {
  background: transparent;
  border: 0;
  cursor: zoom-in;
  display: block;
  padding: 0;
  width: 100%;
}

.listing-detail-gallery-main-image img {
  display: block;
}

.listing-detail-gallery-main-image:focus-visible {
  outline: none;
}

.listing-detail-meta-actions {
  align-items: center;
  border-top: 1px solid #d6e0ea;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 12px;
  padding-top: 12px;
}

.listing-detail-meta-actions .listing-detail-meta {
  flex: 1 1 auto;
  margin-right: auto;
}

.listing-detail-card h2 {
  color: #13243d;
  font-size: 18px;
  margin: 0 0 14px;
}

.listing-detail-meta {
  color: #8496ab;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 14px;
  margin-top: 14px;
  margin-bottom: 0;
}

.listing-detail-meta span {
  align-items: center;
  display: inline-flex;
  gap: 5px;
}

.listing-detail-meta svg {
  height: 15px;
  width: 15px;
}

.listing-detail-description {
  color: #37475d;
  line-height: 1.65;
  margin: 0;
  white-space: pre-line;
}

.listing-detail-tour-embed {
  aspect-ratio: 16 / 9;
  border: 1px solid #d9e4f0;
  border-radius: 12px;
  margin-bottom: 12px;
  overflow: hidden;
}

.listing-detail-tour-embed iframe {
  border: 0;
  display: block;
  height: 100%;
  width: 100%;
}

.listing-detail-tour-link {
  align-items: center;
  color: #0d7d47;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  text-decoration: none;
}

.listing-detail-tour-link svg {
  height: 14px;
  width: 14px;
}

.listing-detail-specs {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(2, 1fr);
}

.listing-detail-spec {
  align-items: center;
  background: #fff;
  display: flex;
  justify-content: space-between;
  padding: 11px 4px;
}

.listing-detail-spec span {
  color: #7688a0;
  font-size: 14px;
}

.listing-detail-spec strong {
  color: #13243d;
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

.listing-detail-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.listing-detail-chips span {
  align-items: center;
  background: #f1f6fb;
  border: 1px solid #e0e8f1;
  border-radius: 999px;
  color: #33475f;
  display: inline-flex;
  font-size: 13px;
  font-weight: 600;
  gap: 6px;
  padding: 6px 12px;
}

.listing-detail-chips svg {
  color: #129357;
  height: 15px;
  width: 15px;
}

.listing-detail-address {
  color: #37475d;
  font-weight: 600;
  margin: 0 0 12px;
}

.listing-detail-map {
  border-radius: 14px;
  overflow: hidden;
}

.listing-detail-map .satellite-map {
  height: 300px;
}

.listing-detail-map-hint {
  color: #5f7086;
  font-size: 12px;
  font-weight: 700;
  margin: 8px 2px 0;
}
.listing-lightbox-overlay {
  align-items: center;
  background: rgba(8, 14, 24, 0.82);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 16px;
  position: fixed;
  z-index: 70;
}
.listing-lightbox-modal {
  align-items: center;
  display: flex;
  justify-content: center;
  max-height: 75vh;
  max-width: 75vw;
  position: relative;
}
.listing-lightbox-image {
  border-radius: 12px;
  box-shadow: 0 30px 60px rgba(6, 12, 22, 0.45);
  display: block;
  max-height: 75vh;
  max-width: 75vw;
  object-fit: cover;
  width: auto;
}
.listing-lightbox-close {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font-size: 34px;
  font-weight: 300;
  height: 36px;
  line-height: 1;
  position: absolute;
  right: 8px;
  top: 8px;
  width: 36px;
  z-index: 3;
}
.listing-lightbox-arrow {
  align-items: center;
  background: rgba(16, 29, 49, 0.58);
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  z-index: 3;
}
.listing-lightbox-arrow svg {
  height: 18px;
  width: 18px;
}
.listing-lightbox-prev {
  left: 12px;
}
.listing-lightbox-prev svg {
  transform: rotate(90deg);
}
.listing-lightbox-next {
  right: 12px;
}
.listing-lightbox-next svg {
  transform: rotate(-90deg);
}
.listing-lightbox-counter {
  background: rgba(10, 18, 30, 0.78);
  border-radius: 999px;
  bottom: -44px;
  color: #f7fbff;
  font-size: 12px;
  font-weight: 800;
  left: 50%;
  padding: 7px 12px;
  position: absolute;
  transform: translateX(-50%);
}
@media (max-width: 960px) {
  .listing-lightbox-modal {
    max-height: 75vh;
    max-width: 92vw;
  }
  .listing-lightbox-image {
    max-height: 75vh;
    max-width: 92vw;
  }
  .listing-lightbox-prev {
    left: 8px;
  }
  .listing-lightbox-next {
    right: 8px;
  }
  .listing-lightbox-close {
    right: 8px;
    top: 8px;
  }
  .listing-lightbox-counter {
    bottom: 10px;
  }
}

.listing-report-overlay {
  align-items: center;
  background: rgba(12, 21, 36, 0.45);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 16px;
  position: fixed;
  z-index: 50;
}

.listing-report-modal {
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 22px 40px rgba(16, 28, 46, 0.25);
  max-width: 520px;
  padding: 22px;
  position: relative;
  width: 100%;
}

.listing-report-close {
  background: transparent;
  border: 0;
  color: #5f7086;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  position: absolute;
  right: 12px;
  top: 8px;
}

.listing-report-modal h3 {
  color: #13243d;
  font-size: 22px;
  margin: 0 0 8px;
}

.listing-report-modal p {
  color: #53647c;
  margin: 0 0 14px;
}

.listing-report-reasons {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.listing-report-reasons button {
  background: #ffffff;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  color: #1c2e46;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  padding: 10px 12px;
  text-align: left;
}

.listing-report-reasons button.active {
  border-color: #ee513a;
  box-shadow: inset 0 0 0 1px #ee513a;
}

.listing-report-field {
  color: #23374f;
  display: block;
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 6px;
}

.listing-report-textarea {
  border: 1px solid #d6e0ea;
  border-radius: 10px;
  font-family: inherit;
  font-size: 14px;
  min-height: 110px;
  padding: 10px 12px;
  resize: vertical;
  width: 100%;
}

.listing-report-textarea:focus {
  border-color: #2f78ff;
  box-shadow: 0 0 0 3px rgba(47, 120, 255, 0.12);
  outline: 0;
}

.listing-report-error {
  color: #cf2d17;
  font-size: 12px;
  font-weight: 800;
  margin: 8px 0 0;
}

.listing-report-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 14px;
}

.listing-report-actions button {
  border: 1px solid #d5dfeb;
  border-radius: 9px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 9px 12px;
}

.listing-report-actions button.primary {
  background: #df2f17;
  border-color: #df2f17;
  color: #fff;
}

.listing-report-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.listing-report-case {
  color: #13243d;
  font-size: 14px;
  font-weight: 900;
}

.listing-detail-side {
  position: sticky;
  top: 90px;
}

.listing-detail-price-card {
  background: #fff;
  border: 1px solid #e6ecf3;
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(19, 36, 61, 0.08);
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 22px;
}

.listing-detail-price-card h1 {
  color: #13243d;
  font-size: 20px;
  margin: 0;
}

.listing-detail-loc {
  color: #7688a0;
  font-size: 14px;
  margin: 0;
}

.listing-detail-price-row {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.listing-detail-price-row strong {
  color: #0f5132;
  font-size: 26px;
}

.listing-detail-price-row span {
  color: #7688a0;
  font-size: 14px;
  font-weight: 600;
}

.listing-detail-stats {
  border-block: 1px solid #eef2f7;
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(2, 1fr);
  padding: 14px 0;
}

.listing-detail-stats > div {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: center;
}

.listing-detail-stats svg {
  color: #129357;
  height: 20px;
  width: 20px;
}

.listing-detail-stats strong {
  color: #13243d;
  font-size: 15px;
}

.listing-detail-stats span {
  color: #94a3b8;
  font-size: 12px;
}

.listing-detail-primary {
  align-items: center;
  background: #129357;
  border: none;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font-size: 15px;
  font-weight: 700;
  gap: 8px;
  justify-content: center;
  padding: 13px;
}

.listing-detail-primary:hover {
  background: #0f7a48;
}

.listing-detail-secondary {
  align-items: center;
  background: #fff;
  border: 1px solid #cfe0d7;
  border-radius: 10px;
  color: #0f5132;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  gap: 8px;
  justify-content: center;
  padding: 11px;
}

.listing-detail-secondary svg {
  height: 17px;
  width: 17px;
}

.listing-detail-seller {
  align-items: center;
  background: #f7fafd;
  border-radius: 12px;
  display: flex;
  gap: 12px;
  padding: 12px;
}

.listing-detail-seller-avatar {
  align-items: center;
  background: #129357;
  border-radius: 50%;
  color: #fff;
  display: flex;
  flex-shrink: 0;
  font-weight: 800;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.listing-detail-seller div,
.listing-detail-seller-card div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.listing-detail-seller strong,
.listing-detail-seller-card strong {
  color: #13243d;
  font-size: 14px;
  line-height: 1.25;
}

.listing-detail-seller small,
.listing-detail-seller-card small {
  color: #7688a0;
  font-size: 12px;
  line-height: 1.35;
}

.listing-detail-seller a {
  align-items: center;
  color: #129357;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 5px;
  text-decoration: none;
}

.listing-detail-seller a svg {
  height: 14px;
  width: 14px;
}

.listing-detail-fav {
  align-items: center;
  background: none;
  border: 1px solid #e2e9f1;
  border-radius: 10px;
  color: #47597a;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  gap: 8px;
  justify-content: center;
  padding: 10px;
}

.listing-detail-fav svg {
  height: 17px;
  width: 17px;
}

.listing-detail-fav.active {
  border-color: #f3c4bd;
  color: #d5493c;
}

.listing-detail-alert {
  align-items: center;
  background: #f6fbf8;
  border: 1px solid #cfe8d8;
  border-radius: 10px;
  color: #17653e;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  gap: 8px;
  justify-content: center;
  padding: 10px;
}

.listing-detail-alert svg {
  height: 16px;
  width: 16px;
}

.listing-detail-alert.active {
  background: #129357;
  border-color: #129357;
  color: #fff;
}

.listing-detail-seller-card {
  align-items: center;
  background: #f7fafd;
  border-radius: 12px;
  display: flex;
  gap: 12px;
  padding: 12px;
}

.listing-detail-profile-btn {
  background: #fff;
  border: 1px solid #e2e9f1;
  border-radius: 10px;
  color: #47597a;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  padding: 10px;
}

.listing-detail-share {
  border: 1px solid #e8edf4;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  padding: 10px 12px;
}

.listing-detail-share strong {
  color: #13243d;
  font-size: 13px;
}

.listing-detail-share-actions {
  display: flex;
  gap: 8px;
}

.listing-detail-share-actions button {
  align-items: center;
  background: #f2f6fb;
  border: 1px solid #dde6f0;
  border-radius: 999px;
  color: #304760;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  height: 30px;
  justify-content: center;
  min-width: 30px;
  padding: 0 8px;
}

.listing-detail-share-actions button:hover {
  background: #e9f1f8;
}

.listing-detail-share-actions button svg {
  height: 14px;
  width: 14px;
}

.listing-detail-share-hint {
  color: #7588a0;
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 900px) {
  .listing-detail-layout {
    grid-template-columns: 1fr;
  }

  .listing-detail-side {
    position: static;
  }
}

/* ===== Ekran sukcesu po publikacji ogloszenia ===== */

.publish-success-panel {
  align-items: center;
  background: #eef7f1;
  border: 1px solid #cfe8d8;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 18px;
  padding: 26px 22px;
  text-align: center;
}

.final-virtual-tour-block {
  background: #eef5ff;
  border: 1px solid #d6e6fb;
  border-radius: 10px;
  padding: 12px;
}

.final-virtual-tour-block h3 {
  color: #13243d;
  font-size: 14px;
  margin: 0 0 6px;
}

.final-virtual-tour-block p {
  color: #4e647d;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.publish-success-icon {
  align-items: center;
  background: #129357;
  border-radius: 50%;
  color: #fff;
  display: flex;
  height: 48px;
  justify-content: center;
  width: 48px;
}

.publish-success-icon svg {
  height: 24px;
  width: 24px;
}

.publish-success-panel h3 {
  color: #0f5132;
  font-size: 19px;
  margin: 0;
}

.publish-success-panel p {
  color: #37475d;
  line-height: 1.6;
  margin: 0;
  max-width: 620px;
}

.publish-success-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 8px;
}

.publish-success-actions .next-step-button,
.publish-success-actions .back-step-button {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

/* ===== Panel admina: przycisk podgladu i modal ogloszenia ===== */

.admin-btn.view {
  background: #eef2f8;
  color: #33475f;
}

.admin-btn.view:hover {
  background: #e0e8f2;
}

.admin-preview-overlay {
  align-items: center;
  background: rgba(15, 23, 42, 0.55);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 24px;
  position: fixed;
  z-index: 1000;
}

.admin-preview-modal {
  background: #fff;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  max-width: 900px;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.admin-report-details-modal {
  background: #fff;
  border-radius: 16px;
  max-height: 90vh;
  max-width: 900px;
  overflow-y: auto;
  padding: 22px;
  position: relative;
  width: 100%;
}

.admin-report-details-head {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-right: 44px;
}

.admin-report-details-head h2 {
  color: #13243d;
  font-size: 22px;
  margin: 0;
}

.admin-report-details-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-report-details-grid article {
  background: #f7f9fc;
  border: 1px solid #e4ebf3;
  border-radius: 10px;
  display: grid;
  gap: 4px;
  padding: 12px;
}

.admin-report-details-grid span {
  color: #7186a0;
  font-size: 12px;
  font-weight: 800;
}

.admin-report-details-grid strong {
  color: #13243d;
  font-size: 14px;
}

.admin-report-details-grid small {
  color: #61758f;
  font-size: 12px;
}

.admin-report-details-section {
  margin-top: 18px;
}

.admin-report-details-section h3 {
  color: #13243d;
  font-size: 16px;
  margin: 0 0 8px;
}

.admin-report-details-section p {
  color: #37475d;
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
}

.admin-report-attachments {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
}

.admin-report-attachments article {
  background: #f7f9fc;
  border: 1px solid #e4ebf3;
  border-radius: 10px;
  display: grid;
  gap: 6px;
  overflow: hidden;
  padding: 8px;
}

.admin-report-attachments img,
.admin-report-attachment-placeholder {
  background: #e7edf5;
  border-radius: 8px;
  height: 120px;
  object-fit: cover;
  width: 100%;
}

.admin-report-attachment-preview {
  background: transparent;
  border: 0;
  cursor: zoom-in;
  display: block;
  padding: 0;
}

.admin-report-attachment-preview img {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.admin-report-attachment-preview:hover img {
  box-shadow: 0 8px 18px rgba(19, 36, 61, 0.18);
  transform: scale(1.01);
}

.admin-report-attachment-placeholder {
  align-items: center;
  color: #6a7f97;
  display: grid;
  justify-content: center;
}

.admin-report-attachments strong {
  color: #13243d;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-report-attachments small {
  color: #7186a0;
  font-size: 11px;
}

.admin-attachment-lightbox {
  align-items: center;
  background: rgba(10, 16, 28, 0.84);
  display: flex;
  inset: 0;
  justify-content: center;
  position: fixed;
  z-index: 1100;
}

.admin-attachment-lightbox-modal {
  max-height: 86vh;
  max-width: 86vw;
  position: relative;
}

.admin-attachment-lightbox-modal img {
  border-radius: 12px;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.35);
  display: block;
  max-height: 86vh;
  max-width: 86vw;
  object-fit: contain;
}

.admin-attachment-lightbox-close {
  align-items: center;
  background: rgba(255, 255, 255, 0.96);
  border: 0;
  border-radius: 999px;
  color: #1f324a;
  cursor: pointer;
  display: inline-flex;
  font-size: 24px;
  height: 34px;
  justify-content: center;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 34px;
}

.admin-preview-close {
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  color: #33475f;
  cursor: pointer;
  font-size: 22px;
  height: 34px;
  line-height: 1;
  position: absolute;
  right: 14px;
  top: 14px;
  width: 34px;
  z-index: 2;
}

.admin-preview-content {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  overflow-y: auto;
  padding: 22px;
}

.admin-preview-main {
  background-color: #dce5f0;
  background-position: center;
  background-size: cover;
  border-radius: 12px;
  height: 260px;
}

.admin-preview-thumbs {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
  margin-top: 8px;
}

.admin-preview-thumbs button {
  background-color: #dce5f0;
  background-position: center;
  background-size: cover;
  border: 2px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  height: 52px;
}

.admin-preview-thumbs button.active {
  border-color: #129357;
}

.admin-preview-info {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.admin-preview-head {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.admin-preview-head h2 {
  color: #13243d;
  font-size: 18px;
  margin: 0;
}

.admin-preview-loc {
  color: #7688a0;
  font-size: 13px;
  margin: 0;
}

.admin-preview-price strong {
  color: #0f5132;
  font-size: 22px;
}

.admin-preview-specs {
  display: grid;
  gap: 1px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-preview-specs > div {
  align-items: center;
  border-bottom: 1px solid #f0f3f8;
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
}

.admin-preview-specs span {
  color: #7688a0;
  font-size: 13px;
}

.admin-preview-specs strong {
  color: #13243d;
  font-size: 13px;
  text-align: right;
}

.admin-preview-desc h3 {
  color: #13243d;
  font-size: 15px;
  margin: 6px 0 4px;
}

.admin-preview-desc p {
  color: #37475d;
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
  white-space: pre-line;
}

.admin-preview-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-preview-chips span {
  background: #f1f6fb;
  border: 1px solid #e0e8f1;
  border-radius: 999px;
  color: #33475f;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
}

.admin-preview-contact {
  background: #f7fafd;
  border-radius: 10px;
  color: #47597a;
  font-size: 13px;
  line-height: 1.7;
  padding: 10px 12px;
}

.admin-preview-actions {
  border-top: 1px solid #eef2f7;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 14px 22px;
}

@media (max-width: 720px) {
  .admin-preview-content {
    grid-template-columns: 1fr;
  }

  .admin-report-details-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== Realne ogloszenia na Kupuje/Wynajmuje: karty jak makiety (pion) ===== */

.real-listings-section {
  margin-bottom: 18px;
}

.real-listings-heading {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}

.real-listings-heading h3 {
  color: #13243d;
  font-size: 16px;
  margin: 0;
}

.real-listings-heading span {
  background: #129357;
  border-radius: 999px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 2px 9px;
}

.real-result-card {
  cursor: pointer;
  transition: box-shadow 0.15s, transform 0.15s;
}

.real-result-card:hover {
  box-shadow: 0 12px 26px rgba(19, 36, 61, 0.12);
  transform: translateY(-2px);
}

.real-result-card .result-photo {
  position: relative;
}

.real-photo-badges {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 6px;
  left: 12px;
  position: absolute;
  top: 12px;
  z-index: 2;
}

.real-photo-badges .green-tag {
  align-items: center;
  background: #e8f8ef;
  border: 1px solid #cfeedd;
  border-radius: 999px;
  color: #0f7a48;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1;
  padding: 6px 12px;
}

.real-result-card .real-favorite-button {
  align-items: center;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(130, 146, 167, 0.32);
  border-radius: 50%;
  color: #607289;
  display: flex;
  height: 28px;
  justify-content: center;
  line-height: 0;
  padding: 0;
  position: absolute;
  right: 12px;
  top: 12px;
  transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
  width: 28px;
  z-index: 3;
}

.real-result-card .real-favorite-button:hover,
.real-result-card .real-favorite-button:focus-visible {
  background: #ffffff;
  border-color: rgba(95, 116, 141, 0.55);
  color: #3f536f;
  transform: translateY(-1px);
}

.real-result-card .real-favorite-button svg {
  color: inherit;
  display: block;
  height: 14px;
  stroke: currentColor;
  stroke-width: 2;
  width: 14px;
}

.real-result-card .real-favorite-button.saved {
  background: #10a15e;
  border-color: #10a15e;
  box-shadow: 0 5px 12px rgba(16, 161, 94, 0.3);
  color: #ffffff;
}

.real-result-card .real-favorite-button.saved svg {
  fill: currentColor;
  stroke: #ffffff;
  stroke-width: 1.75;
}

/* ===== Strzalki galerii w widoku szczegolow ===== */

.ld-gallery-arrow {
  align-items: center;
  background: rgba(19, 36, 61, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 50%;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.28);
  color: #ffffff;
  cursor: pointer;
  display: flex;
  height: 46px;
  justify-content: center;
  line-height: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  width: 46px;
  z-index: 3;
}

.ld-gallery-arrow:hover {
  background: rgba(19, 36, 61, 0.78);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.34);
  transform: translateY(-50%) scale(1.04);
}

.ld-gallery-arrow:active {
  transform: translateY(-50%) scale(0.98);
}

.ld-gallery-arrow-icon {
  height: 18px;
  width: 18px;
}

.ld-gallery-prev .ld-gallery-arrow-icon {
  transform: rotate(90deg);
}

.ld-gallery-next .ld-gallery-arrow-icon {
  transform: rotate(-90deg);
}

.ld-gallery-prev {
  left: 14px;
}

.ld-gallery-next {
  right: 14px;
}

@media (max-width: 900px) {
  .ld-gallery-arrow {
    height: 40px;
    width: 40px;
  }

  .ld-gallery-arrow-icon {
    height: 16px;
    width: 16px;
  }
}

.comparison-page {
  background: #f6f8fb;
  min-height: calc(100vh - 82px);
  padding: 22px 0;
}

.comparison-layout {
  display: grid;
  gap: 18px;
  grid-template-columns: 300px minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1900px;
  padding: 0 18px;
}

.comparison-main {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.comparison-breadcrumb {
  align-items: center;
  color: #708099;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
}

.comparison-breadcrumb button, .comparison-breadcrumb a {
  background: transparent;
  border: 0;
  color: inherit;
  font: inherit;
  padding: 0;
}

.comparison-breadcrumb button.active, .comparison-breadcrumb a.active {
  color: #152640;
}

.comparison-head {
  align-items: start;
  display: flex;
  justify-content: space-between;
}

.comparison-head h1 {
  color: #14223a;
  font-size: 34px;
  font-weight: 950;
  margin: 0;
}

.comparison-head p {
  color: #5c6d82;
  font-size: 15px;
  font-weight: 800;
  margin: 6px 0 0;
}

.comparison-head-actions {
  display: inline-flex;
  gap: 10px;
}

.comparison-head-actions > button {
  background: #ffffff;
  border: 1px solid #ced8e5;
  border-radius: 10px;
  color: #1d314f;
  font-size: 13px;
  font-weight: 850;
  min-height: 40px;
  padding: 0 14px;
}

.comparison-head-actions > button.ghost {
  border-color: #d3dee9;
}

.comparison-head-actions > button:disabled {
  opacity: 0.45;
}

.comparison-workspace {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: 330px minmax(0, 1fr);
  min-width: 0;
}

.comparison-workspace > * {
  min-width: 0;
}

.comparison-summary-column {
  display: grid;
  gap: 12px;
  position: static;
}

.comparison-controls {
  background: #ffffff;
  box-sizing: border-box;
  border: 1px solid #dbe4ef;
  border-radius: 12px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 16px;
}

.comparison-mode-switch {
  background: #edf2f8;
  border-radius: 12px;
  display: inline-grid;
  gap: 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 320px;
  padding: 5px;
}

.comparison-mode-switch button {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #4a5f79;
  font-size: 13px;
  font-weight: 850;
  min-height: 36px;
}

.comparison-mode-switch button.active {
  background: #ffffff;
  color: #0f9c5b;
}

.comparison-picker-row {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr;
}

.comparison-picker-row input,
.comparison-picker-row select {
  background: #ffffff;
  border: 1px solid #cfd9e6;
  border-radius: 10px;
  box-sizing: border-box;
  color: #183152;
  font-size: 13px;
  font-weight: 700;
  height: 42px;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 0 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.comparison-picker-row button {
  background: #0f9c5b;
  border: 0;
  border-radius: 10px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 850;
  height: 42px;
}

.comparison-picker-row button:disabled {
  opacity: 0.45;
}

.comparison-controls small {
  color: #6b7b91;
  font-size: 12px;
  font-weight: 800;
}

.comparison-controls h3 {
  color: #1b2f4f;
  font-size: 18px;
  font-weight: 900;
  margin: 4px 0 0;
}

.comparison-summary-card {
  background: #ffffff;
  box-sizing: border-box;
  border: 1px solid #dbe4ef;
  border-radius: 12px;
  min-width: 0;
  padding: 16px;
}

.comparison-summary-card h3 {
  color: #1b2f4f;
  font-size: 20px;
  font-weight: 950;
  line-height: 24px;
  margin: 0 0 14px;
}

.comparison-summary-card > div {
  display: grid;
  gap: 0;
}

.comparison-summary-card article {
  align-items: start;
  border-bottom: 1px solid #e4ebf2;
  display: grid;
  gap: 10px;
  grid-template-columns: 18px minmax(0, 1fr);
  min-height: 60px;
  padding: 14px 0;
}

.comparison-summary-card article:last-child {
  border-bottom: 0;
}

.comparison-summary-card span {
  align-self: start;
  color: #3e526d;
  display: grid;
  font-size: 14px;
  place-items: center;
}

.comparison-summary-card p {
  margin: 0;
}

.comparison-summary-card strong {
  color: #1f3555;
  display: block;
  font-size: 13px;
  font-weight: 900;
}

.comparison-summary-card small {
  color: #7a889a;
  display: block;
  font-size: 11px;
  font-weight: 700;
}

.comparison-content {
  background: #ffffff;
  box-sizing: border-box;
  border: 1px solid #dbe4ef;
  border-radius: 12px;
  min-width: 0;
  overflow-x: auto;
  padding: 10px;
  position: relative;
}

.comparison-cards-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(1, minmax(210px, 1fr));
  margin-bottom: 10px;
}

.comparison-empty-state {
  border: 1px dashed #cfd9e6;
  border-radius: 10px;
  color: #455a74;
  margin: 0;
  padding: 32px;
  text-align: center;
}

.comparison-empty-state h2 {
  color: #14223a;
  font-size: 21px;
  margin: 0 0 8px;
}

.comparison-empty-state p {
  margin: 0;
}

.comparison-values-grid {
  display: grid;
  gap: 0;
  min-width: 840px;
}

.comparison-cell {
  border-bottom: 1px solid #e4ebf2;
  border-left: 1px solid #edf2f7;
  color: #20344f;
  display: grid;
  gap: 4px;
  min-height: 60px;
  padding: 14px 12px;
}

.comparison-offer-head {
  background: #ffffff;
  border: 1px solid #e4ebf2;
  border-left: 1px solid #e4ebf2;
  border-radius: 10px;
  border-left: 1px solid #edf2f7;
  display: grid;
  gap: 8px;
  min-height: 232px;
  padding: 14px 14px 16px;
  position: relative;
}

.comparison-offer-photo {
  background-color: #e8eef5;
  background-position: center;
  background-size: cover;
  border-radius: 10px;
  height: 112px;
}

.comparison-offer-head strong {
  color: #172a45;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.3;
}

.comparison-offer-head small {
  color: #5f7289;
  font-size: 12px;
  font-weight: 750;
}

.comparison-offer-head > button {
  background: #f1f6ff;
  border: 1px solid #cfdaea;
  border-radius: 9px;
  color: #204067;
  font-size: 12px;
  font-weight: 850;
  justify-self: start;
  min-height: 34px;
  padding: 0 10px;
}

.comparison-offer-head em {
  color: #0f9c5b;
  font-size: 22px;
  font-style: normal;
  font-weight: 950;
}

.comparison-add-tile {
  align-content: center;
  align-items: center;
  border: 1px dashed #cfd9e6;
  border-radius: 10px;
  cursor: pointer;
  display: grid;
  justify-items: center;
  min-height: 232px;
  padding: 12px;
  text-align: center;
}

.comparison-add-tile span {
  align-items: center;
  border: 1px solid #cfe0d4;
  border-radius: 50%;
  color: #0f9c5b;
  display: grid;
  font-size: 20px;
  height: 34px;
  margin-bottom: 8px;
  place-items: center;
  width: 34px;
}

.comparison-add-tile strong {
  color: #20344f;
  font-size: 15px;
}

.comparison-add-tile small {
  color: #7a889a;
  font-size: 11px;
  font-weight: 700;
}

.comparison-card-empty {
  background: #f9fbfd;
  border: 1px solid #e4ebf2;
  border-radius: 10px;
  min-height: 232px;
}

.comparison-remove {
  align-items: center;
  background: rgba(20, 34, 58, 0.82) !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  display: inline-grid;
  font-size: 20px !important;
  height: 28px;
  justify-items: center;
  line-height: 1;
  min-height: 28px !important;
  padding: 0 !important;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 28px;
}

.comparison-cell span {
  font-size: 13px;
  font-weight: 850;
}

.comparison-cell em {
  color: #0f9c5b;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.comparison-rating {
  background: #f5fbf7;
}

.comparison-cell-empty {
  background: #f9fbfd;
}

.comparison-rating strong {
  color: #0f9c5b;
  font-size: 24px;
  font-weight: 950;
}

.comparison-rating small {
  color: #48667e;
  font-size: 11px;
  font-weight: 900;
}

@media (max-width: 1500px) {
  .comparison-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .comparison-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .comparison-summary-column {
    position: static;
  }
}

@media (max-width: 900px) {
  .comparison-layout {
    padding: 0 10px;
  }

  .comparison-head {
    align-items: start;
    flex-direction: column;
    gap: 10px;
  }

  .comparison-head-actions {
    width: 100%;
  }

  .comparison-head-actions > button {
    flex: 1;
  }

  .comparison-head h1 {
    font-size: 27px;
  }

  .comparison-cards-row {
    grid-template-columns: 1fr !important;
  }
}

/* ===== Poradnik: Kupno mieszkania ===== */
.guide-article {
  background: linear-gradient(180deg, #f8fafc 0%, #f3f7fb 100%);
  min-height: calc(100vh - 82px);
  padding-bottom: 56px;
}

.guide-hero {
  min-height: 340px;
  overflow: hidden;
  position: relative;
}

.guide-hero img {
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: right center;
  position: absolute;
  width: 100%;
}

.guide-hero-shade {
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0) 72%, #f8fafc 100%),
    linear-gradient(90deg, #f8fafc 0%, rgba(248, 250, 252, 0.97) 40%, rgba(248, 250, 252, 0.6) 62%, rgba(248, 250, 252, 0.06) 96%);
  inset: 0;
  position: absolute;
}

.guide-hero-inner {
  min-height: 340px;
  padding: 30px 48px 46px;
  position: relative;
  z-index: 1;
}

.guide-back {
  align-items: center;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid #dce4ec;
  border-radius: 999px;
  color: #14223a;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 850;
  gap: 6px;
  padding: 7px 14px 7px 10px;
}

.guide-back svg {
  height: 15px;
  transform: rotate(180deg);
  width: 15px;
}

.guide-hero-badge {
  align-items: center;
  background: #0b9f5c;
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  margin-top: 20px;
  padding: 7px 14px;
}

.guide-hero-badge svg {
  height: 15px;
  width: 15px;
}

.guide-hero h1 {
  color: #14223a;
  font-size: clamp(38px, 3.8vw, 60px);
  line-height: 1.02;
  margin: 16px 0 0;
  max-width: 720px;
}

.guide-hero-lead {
  color: #4a5766;
  font-size: 17px;
  font-weight: 650;
  line-height: 1.5;
  margin: 16px 0 0;
  max-width: 680px;
}

.guide-hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.guide-hero-chips span {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  color: #33465c;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  padding: 8px 12px;
}

.guide-hero-chips svg {
  color: #0b9f5c;
  height: 15px;
  width: 15px;
}

.guide-article-layout {
  align-items: start;
  display: grid;
  gap: 28px;
  grid-template-columns: 232px minmax(0, 1fr) 312px;
  margin-top: 26px;
}

/* Spis treści */
.guide-toc {
  position: sticky;
  top: 20px;
}

.guide-toc-inner {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 18px 16px;
}

.guide-toc-inner h2 {
  color: #14223a;
  font-size: 15px;
  margin: 0 0 12px;
}

.guide-toc-inner ol {
  counter-reset: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.guide-toc-inner li button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #46586c;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 700;
  gap: 10px;
  padding: 7px 8px;
  text-align: left;
  width: 100%;
}

.guide-toc-inner li button span {
  align-items: center;
  background: #eef3f8;
  border-radius: 6px;
  color: #0b9f5c;
  display: grid;
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 900;
  height: 22px;
  place-items: center;
  width: 22px;
}

.guide-toc-inner li button:hover {
  background: #f2f7fb;
  color: #14223a;
}

/* Blok główny */
.guide-body {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}

.guide-block-head h2 {
  color: #14223a;
  font-size: 22px;
  margin: 0;
}

.guide-block-head p {
  color: #607085;
  font-size: 14px;
  font-weight: 650;
  margin: 6px 0 0;
}

/* Proces 12 kroków */
.guide-process {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  padding: 22px;
}

.guide-process-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 18px;
}

.guide-process-card {
  background: #f8fafc;
  border: 1px solid #e6edf3;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 12px;
  position: relative;
}

.guide-process-num {
  align-items: center;
  background: #0b9f5c;
  border-radius: 6px;
  color: #ffffff;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  height: 24px;
  place-items: center;
  width: 24px;
}

.guide-process-icon {
  color: #13a360;
}

.guide-process-icon svg {
  height: 22px;
  width: 22px;
}

.guide-process-card strong {
  color: #14223a;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
}

.guide-process-card small {
  color: #64748b;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

/* Rozdziały */
.guide-chapter {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  padding: 26px 28px;
  position: relative;
  scroll-margin-top: 20px;
}

.guide-chapter-index {
  color: #d7e6dc;
  font-size: 40px;
  font-weight: 950;
  letter-spacing: -1px;
  line-height: 1;
}

.guide-chapter h2 {
  color: #14223a;
  font-size: 24px;
  margin: 8px 0 14px;
}

.guide-chapter p {
  color: #3f4d5e;
  font-size: 15px;
  font-weight: 550;
  line-height: 1.62;
  margin: 0 0 14px;
}

.guide-chapter p:last-child {
  margin-bottom: 0;
}

.guide-list {
  color: #3f4d5e;
  display: flex;
  flex-direction: column;
  gap: 9px;
  list-style: none;
  margin: 4px 0 14px;
  padding: 0;
}

.guide-list li {
  font-size: 15px;
  font-weight: 550;
  line-height: 1.5;
  padding-left: 22px;
  position: relative;
}

.guide-list li::before {
  background: #0b9f5c;
  border-radius: 50%;
  content: "";
  height: 7px;
  left: 4px;
  position: absolute;
  top: 9px;
  width: 7px;
}

.guide-list li strong {
  color: #14223a;
}

/* Callouty */
.guide-callout {
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 24px minmax(0, 1fr);
  margin-top: 6px;
  padding: 16px 18px;
}

.guide-callout svg {
  height: 22px;
  margin-top: 2px;
  width: 22px;
}

.guide-callout strong {
  display: block;
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 4px;
}

.guide-callout p {
  font-size: 14px !important;
  margin: 0 !important;
}

.guide-callout-tip {
  background: #edf8f1;
  border: 1px solid #c6e8d4;
}

.guide-callout-tip svg,
.guide-callout-tip strong {
  color: #0b7a47;
}

.guide-callout-warn {
  background: #fef6ec;
  border: 1px solid #f6dcb6;
}

.guide-callout-warn svg,
.guide-callout-warn strong {
  color: #b9791b;
}

.guide-callout-info {
  background: #eef4fd;
  border: 1px solid #cfe0f7;
}

.guide-callout-info svg,
.guide-callout-info strong {
  color: #2c62c6;
}

.guide-callout p,
.guide-callout-tip p,
.guide-callout-warn p,
.guide-callout-info p {
  color: #3f4d5e;
}

/* Tabela kosztów */
.guide-table-wrap {
  border: 1px solid #e2e9f0;
  border-radius: 8px;
  margin: 4px 0 16px;
  overflow-x: auto;
}

.guide-table {
  border-collapse: collapse;
  min-width: 560px;
  width: 100%;
}

.guide-table th {
  background: #f4f8fb;
  border-bottom: 1px solid #e2e9f0;
  color: #52627a;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.03em;
  padding: 11px 14px;
  text-align: left;
  text-transform: uppercase;
}

.guide-table td {
  border-bottom: 1px solid #eef2f6;
  color: #3f4d5e;
  font-size: 13px;
  font-weight: 600;
  padding: 12px 14px;
  vertical-align: top;
}

.guide-table tr:last-child td {
  border-bottom: 0;
}

.guide-table td strong {
  color: #14223a;
}

/* Dwie kolumny (za/przeciw, rynki) */
.guide-two-col {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr 1fr;
  margin-top: 4px;
}

.guide-pro,
.guide-con,
.guide-market {
  border: 1px solid #e2e9f0;
  border-radius: 8px;
  padding: 16px 18px;
}

.guide-pro {
  background: #edf8f1;
  border-color: #c6e8d4;
}

.guide-con {
  background: #fbfdff;
}

.guide-market {
  background: #f8fafc;
}

.guide-pro h4,
.guide-con h4,
.guide-market h4 {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 15px;
  gap: 8px;
  margin: 0 0 12px;
}

.guide-pro h4 svg,
.guide-market h4 svg {
  color: #0b9f5c;
  height: 17px;
  width: 17px;
}

.guide-con h4 svg {
  color: #2c62c6;
  height: 17px;
  width: 17px;
}

.guide-pro ul,
.guide-con ul,
.guide-market ul {
  color: #3f4d5e;
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.guide-pro li,
.guide-con li,
.guide-market li {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  padding-left: 18px;
  position: relative;
}

.guide-pro li::before,
.guide-con li::before,
.guide-market li::before {
  color: #0b9f5c;
  content: "›";
  font-weight: 900;
  left: 3px;
  position: absolute;
  top: 0;
}

/* Checklista */
.guide-checklist {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  padding: 24px 26px;
  scroll-margin-top: 20px;
}

.guide-checklist-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
  margin: 16px 0 18px;
}

.guide-checklist-item {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #e6edf3;
  border-radius: 8px;
  color: #33465c;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 650;
  gap: 10px;
  line-height: 1.4;
  padding: 12px 14px;
}

.guide-checklist-item input {
  display: none;
}

.guide-check-box {
  align-items: center;
  background: #ffffff;
  border: 1.5px solid #cdd7e1;
  border-radius: 5px;
  color: transparent;
  display: grid;
  flex-shrink: 0;
  height: 20px;
  place-items: center;
  width: 20px;
}

.guide-check-box svg {
  height: 13px;
  width: 13px;
}

.guide-checklist-item input:checked ~ .guide-check-box {
  background: #0b9f5c;
  border-color: #0b9f5c;
  color: #ffffff;
}

.guide-checklist-item input:checked ~ span:last-child {
  color: #8a97a6;
  text-decoration: line-through;
}

.guide-download-btn,
.guide-cta button {
  align-items: center;
  background: #0b9f5c;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 900;
  gap: 8px;
  padding: 12px 20px;
}

.guide-download-btn svg {
  height: 17px;
  width: 17px;
}

.guide-download-btn:hover,
.guide-cta button:hover {
  background: #0a8b50;
}

/* Najczęstsze błędy */
.guide-mistakes {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
  margin-top: 4px;
}

.guide-mistake {
  background: #fef6ec;
  border: 1px solid #f6dcb6;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: 34px minmax(0, 1fr);
  padding: 14px 16px;
}

.guide-mistake-icon {
  align-items: center;
  background: #fbe4c4;
  border-radius: 8px;
  color: #b9791b;
  display: grid;
  height: 34px;
  place-items: center;
  width: 34px;
}

.guide-mistake-icon svg {
  height: 18px;
  width: 18px;
}

.guide-mistake strong {
  color: #14223a;
  display: block;
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 4px;
}

.guide-mistake p {
  color: #4a5766 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}

/* FAQ */
.guide-faq {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

.guide-faq-item {
  background: #f8fafc;
  border: 1px solid #e6edf3;
  border-radius: 8px;
  padding: 0 16px;
}

.guide-faq-item summary {
  align-items: center;
  color: #14223a;
  cursor: pointer;
  display: flex;
  font-size: 15px;
  font-weight: 850;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
  padding: 15px 0;
}

.guide-faq-item summary::-webkit-details-marker {
  display: none;
}

.guide-faq-item summary svg {
  color: #0b9f5c;
  flex-shrink: 0;
  height: 18px;
  transition: transform 0.2s ease;
  width: 18px;
}

.guide-faq-item[open] summary svg {
  transform: rotate(180deg);
}

.guide-faq-item p {
  color: #4a5766 !important;
  font-size: 14px !important;
  font-weight: 550 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 0 16px !important;
}

/* Podsumowanie + CTA */
.guide-summary {
  background: #f5faf7;
  border-color: #cfe9da;
}

.guide-summary-note {
  align-items: flex-start;
  background: #ffffff;
  border: 1px solid #e2e9f0;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: 20px minmax(0, 1fr);
  margin-top: 8px;
  padding: 14px 16px;
}

.guide-summary-note svg {
  color: #8793a3;
  height: 18px;
  width: 18px;
}

.guide-summary-note p {
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

.guide-cta {
  align-items: center;
  background: linear-gradient(120deg, #0b9f5c 0%, #0c7f4c 100%);
  border-radius: 10px;
  color: #ffffff;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  justify-content: space-between;
  padding: 26px 30px;
}

.guide-cta h2 {
  color: #ffffff;
  font-size: 22px;
  margin: 0;
}

.guide-cta p {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 650;
  margin: 6px 0 0;
}

.guide-cta button {
  background: #ffffff;
  color: #0b7a47;
}

.guide-cta button:hover {
  background: #f0f5f2;
}

.guide-cta button svg {
  height: 16px;
  width: 16px;
}

/* Prawy sidebar */
.guide-aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: sticky;
  top: 20px;
}

.guide-aside-card {
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 8px;
  padding: 18px;
}

.guide-aside-card h3 {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 15px;
  gap: 8px;
  margin: 0 0 14px;
}

.guide-aside-card h3 svg {
  color: #0b9f5c;
  height: 17px;
  width: 17px;
}

.guide-aside-list,
.guide-aside-downloads {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.guide-aside-list button,
.guide-aside-downloads button {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e6edf3;
  border-radius: 8px;
  color: #14223a;
  cursor: pointer;
  display: flex;
  gap: 10px;
  padding: 11px 12px;
  text-align: left;
  width: 100%;
}

.guide-aside-list button:hover,
.guide-aside-downloads button:hover {
  background: #eef4f9;
  border-color: #d3e0ea;
}

.guide-aside-list button > span,
.guide-aside-downloads button > span {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 2px;
  min-width: 0;
}

.guide-aside-list strong,
.guide-aside-downloads strong {
  font-size: 13px;
  font-weight: 850;
}

.guide-aside-list small,
.guide-aside-downloads small {
  color: #64748b;
  font-size: 11px;
  font-weight: 650;
}

.guide-aside-list button > svg {
  color: #9aa5b4;
  flex-shrink: 0;
  height: 16px;
  transform: rotate(-90deg);
  width: 16px;
}

.guide-aside-downloads button > svg:first-child {
  color: #0b9f5c;
  flex-shrink: 0;
  height: 20px;
  width: 20px;
}

.guide-aside-downloads button > svg:last-child {
  color: #9aa5b4;
  flex-shrink: 0;
  height: 16px;
  width: 16px;
}

.guide-aside-mistakes ul {
  display: flex;
  flex-direction: column;
  gap: 9px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.guide-aside-mistakes li {
  align-items: center;
  color: #46586c;
  display: flex;
  font-size: 13px;
  font-weight: 700;
  gap: 9px;
  line-height: 1.35;
}

.guide-aside-mistakes li svg {
  color: #d99a3a;
  flex-shrink: 0;
  height: 15px;
  width: 15px;
}

@media (max-width: 1200px) {
  .guide-article-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }

  .guide-toc {
    display: none;
  }

  .guide-process-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .guide-hero-inner {
    padding: 24px 20px 34px;
  }

  .guide-article-layout {
    grid-template-columns: minmax(0, 1fr);
    padding: 0 20px;
  }

  .guide-aside {
    position: static;
  }

  .guide-process-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .guide-two-col,
  .guide-checklist-grid,
  .guide-mistakes {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .guide-chapter {
    padding: 20px 18px;
  }

  .guide-process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .guide-cta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ---- Kalkulator zdolności kredytowej ---- */
.credit-page {
  background: #f4f7fb;
  padding: 34px 20px 70px;
}

.credit-shell {
  margin: 0 auto;
  max-width: 1240px;
}

.credit-breadcrumb {
  margin-bottom: 18px;
}

.credit-title {
  align-items: center;
  display: flex;
  gap: 18px;
  margin-bottom: 26px;
}

.credit-title-icon {
  align-items: center;
  background: #e6f6ee;
  border-radius: 14px;
  color: #0b9f5c;
  display: flex;
  flex: 0 0 auto;
  font-size: 26px;
  height: 56px;
  justify-content: center;
  width: 56px;
}

.credit-title h1 {
  color: #14223a;
  font-size: 30px;
  font-weight: 950;
  margin: 0 0 6px;
}

.credit-title p {
  color: #526171;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55;
  margin: 0;
  max-width: 780px;
}

.credit-layout {
  align-items: start;
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(320px, 430px) minmax(0, 1fr);
}

.credit-form-column,
.credit-result-column {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.credit-card {
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(24, 35, 57, 0.05);
  padding: 22px 22px 20px;
}

.credit-card h2 {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 16px;
  font-weight: 950;
  gap: 12px;
  margin: 0 0 18px;
}

.credit-step-badge {
  align-items: center;
  background: #0b9f5c;
  border-radius: 50%;
  color: #ffffff;
  display: inline-flex;
  font-size: 13px;
  font-weight: 950;
  height: 26px;
  justify-content: center;
  width: 26px;
}

.credit-grid {
  display: grid;
  gap: 16px;
}

.credit-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.credit-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.credit-field-wide {
  grid-column: 1 / -1;
}

.credit-field > span {
  color: #27364d;
  font-size: 13px;
  font-weight: 900;
}

.credit-field small {
  color: #7a8798;
  font-size: 11.5px;
  font-weight: 800;
}

.credit-field input,
.credit-field select {
  background: #ffffff;
  border: 1px solid #d5dee8;
  border-radius: 8px;
  color: #14223a;
  font-size: 14px;
  font-weight: 800;
  min-height: 48px;
  padding: 0 13px;
  width: 100%;
}

.credit-field input:focus,
.credit-field select:focus {
  border-color: #0b9f5c;
  box-shadow: 0 0 0 3px rgba(11, 159, 92, 0.14);
  outline: none;
}

.credit-input-suffix {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d5dee8;
  border-radius: 8px;
  display: flex;
  min-height: 48px;
  overflow: hidden;
  padding-right: 12px;
}

.credit-input-suffix:focus-within {
  border-color: #0b9f5c;
  box-shadow: 0 0 0 3px rgba(11, 159, 92, 0.14);
}

.credit-input-suffix input {
  border: none;
  box-shadow: none;
  min-height: 46px;
}

.credit-input-suffix input:focus {
  border: none;
  box-shadow: none;
}

.credit-input-suffix em {
  color: #7a8798;
  font-size: 13px;
  font-style: normal;
  font-weight: 900;
}

.credit-stepper {
  align-items: center;
  border: 1px solid #d5dee8;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 48px;
  min-height: 48px;
  overflow: hidden;
}

.credit-stepper button {
  background: #f4f7fb;
  border: none;
  color: #0b9f5c;
  font-size: 22px;
  font-weight: 900;
  height: 100%;
}

.credit-stepper button:hover {
  background: #e6f6ee;
}

.credit-stepper strong {
  color: #14223a;
  font-size: 16px;
  font-weight: 950;
  text-align: center;
}

.credit-segmented {
  background: #eef2f7;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 4px;
}

.credit-segmented button {
  background: transparent;
  border: none;
  border-radius: 6px;
  color: #526171;
  font-size: 13px;
  font-weight: 900;
  padding: 11px 8px;
}

.credit-segmented button.active {
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(24, 35, 57, 0.12);
  color: #0b9f5c;
}

.credit-range-value {
  color: #0b9f5c;
  font-weight: 950;
}

.credit-range {
  -webkit-appearance: none;
  appearance: none;
  background: linear-gradient(#d5dee8, #d5dee8) no-repeat;
  background-size: 100% 6px;
  background-position: 0 center;
  border-radius: 6px;
  height: 24px;
  width: 100%;
}

.credit-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: #0b9f5c;
  border: 3px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(11, 159, 92, 0.4);
  height: 22px;
  width: 22px;
}

.credit-range::-moz-range-thumb {
  background: #0b9f5c;
  border: 3px solid #ffffff;
  border-radius: 50%;
  height: 22px;
  width: 22px;
}

.credit-range-scale {
  color: #97a3b2;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: space-between;
}

.credit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.credit-btn-primary,
.credit-btn-ghost {
  align-items: center;
  border-radius: 10px;
  display: inline-flex;
  font-size: 14px;
  font-weight: 900;
  gap: 9px;
  justify-content: center;
  min-height: 50px;
  padding: 0 22px;
}

.credit-btn-primary {
  background: #0b9f5c;
  border: none;
  color: #ffffff;
  flex: 1 1 auto;
}

.credit-btn-primary:hover {
  background: #0a8b50;
}

.credit-btn-ghost {
  background: #ffffff;
  border: 1px solid #d5dee8;
  color: #27364d;
}

.credit-btn-ghost:hover {
  border-color: #b7c2cf;
}

/* Wynik */
.credit-result-hero {
  border-radius: 14px;
  color: #ffffff;
  overflow: hidden;
  padding: 26px 28px 24px;
  position: relative;
}

.credit-tone-verysafe,
.credit-tone-safe {
  background: linear-gradient(135deg, #0b9f5c, #0a8b50);
}

.credit-tone-moderate {
  background: linear-gradient(135deg, #d98a13, #c2790a);
}

.credit-tone-high {
  background: linear-gradient(135deg, #e0592f, #c8461f);
}

.credit-tone-none,
.credit-tone-empty {
  background: linear-gradient(135deg, #4a5a70, #35435a);
}

.credit-result-hero.pulse {
  animation: creditPulse 0.9s ease;
}

@keyframes creditPulse {
  0% { transform: scale(1); }
  40% { transform: scale(1.014); }
  100% { transform: scale(1); }
}

.credit-hero-top {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.credit-hero-top > span:first-child {
  font-size: 14px;
  font-weight: 850;
  opacity: 0.92;
}

.credit-badge {
  background: rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  padding: 6px 12px;
  white-space: nowrap;
}

.credit-result-hero strong {
  display: block;
  font-size: 44px;
  font-weight: 950;
  letter-spacing: -0.5px;
  line-height: 1;
  margin: 18px 0 12px;
}

.credit-stars {
  display: flex;
  gap: 3px;
}

.credit-stars span {
  color: rgba(255, 255, 255, 0.4);
  font-size: 17px;
}

.credit-stars span.on {
  color: #ffd873;
}

.credit-stars span svg {
  fill: currentColor;
  stroke: none;
}

.credit-result-hero p {
  font-size: 13px;
  font-weight: 750;
  line-height: 1.5;
  margin: 14px 0 0;
  opacity: 0.94;
}

.credit-tiles {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.credit-tile {
  background: #ffffff;
  border: 1px solid #dfe7ef;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(24, 35, 57, 0.05);
  display: grid;
  gap: 6px;
  padding: 16px 16px 15px;
}

.credit-tile small {
  color: #7a8798;
  font-size: 12px;
  font-weight: 850;
}

.credit-tile strong {
  color: #14223a;
  font-size: 20px;
  font-weight: 950;
}

.credit-tile em {
  color: #0b9f5c;
  font-size: 11.5px;
  font-style: normal;
  font-weight: 850;
}

.credit-details-head {
  align-items: center;
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) 250px;
  margin-bottom: 18px;
}

.credit-details h3 {
  color: #14223a;
  font-size: 16px;
  font-weight: 950;
  margin: 0;
}

.credit-donut-wrap {
  align-items: center;
  display: grid;
  gap: 6px;
  justify-items: center;
}

.credit-donut {
  height: 128px;
  width: 128px;
}

.credit-donut circle {
  fill: none;
  stroke-width: 13;
}

.credit-donut-track {
  stroke: #eef2f7;
}

.credit-donut-you {
  stroke: #0b9f5c;
  stroke-linecap: round;
}

.credit-donut-partner {
  stroke: #3f8bff;
  stroke-linecap: round;
}

.credit-donut-value {
  dominant-baseline: middle;
  fill: #14223a;
  font-size: 20px;
  font-weight: 900;
  stroke: none;
  text-anchor: middle;
}

.credit-donut-label {
  dominant-baseline: middle;
  fill: #7a8798;
  font-size: 10px;
  font-weight: 800;
  stroke: none;
  text-anchor: middle;
}

.credit-donut-legend {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  width: 100%;
}

.credit-donut-legend li {
  align-items: center;
  color: #526171;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
}

.credit-donut-legend b {
  color: #14223a;
  margin-left: auto;
}

.credit-donut-legend i {
  border-radius: 3px;
  flex: 0 0 auto;
  height: 11px;
  width: 11px;
}

.credit-dot-you {
  background: #0b9f5c;
}

.credit-dot-partner {
  background: #3f8bff;
}

.credit-detail-rows {
  display: grid;
  gap: 0;
  margin: 0;
}

.credit-detail-row {
  align-items: center;
  border-top: 1px solid #eef2f7;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 11px 0;
}

.credit-detail-row dt {
  color: #526171;
  font-size: 13px;
  font-weight: 750;
}

.credit-detail-row dd {
  color: #14223a;
  font-size: 14px;
  font-weight: 950;
  margin: 0;
  text-align: right;
}

.credit-detail-positive dd {
  color: #0b9f5c;
}

.credit-detail-negative dd {
  color: #d64545;
}

.credit-cta-band {
  align-items: center;
  background: linear-gradient(135deg, #e6f6ee, #f0f9f4);
  border: 1px solid #bfe6d2;
  border-radius: 12px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 20px 22px;
}

.credit-cta-band strong {
  color: #14223a;
  display: block;
  font-size: 15px;
  font-weight: 950;
}

.credit-cta-band span {
  color: #4b6a58;
  display: block;
  font-size: 13px;
  font-weight: 750;
  margin-top: 4px;
}

.credit-cta-band button {
  align-items: center;
  background: #0b9f5c;
  border: none;
  border-radius: 10px;
  color: #ffffff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 900;
  gap: 8px;
  min-height: 48px;
  padding: 0 20px;
}

.credit-cta-band button:hover:not(:disabled) {
  background: #0a8b50;
}

.credit-cta-band button:disabled {
  background: #b7c2cf;
  cursor: not-allowed;
}

.credit-recos h3 {
  align-items: center;
  color: #14223a;
  display: flex;
  font-size: 16px;
  font-weight: 950;
  gap: 9px;
  margin: 0 0 16px;
}

.credit-reco-list {
  display: grid;
  gap: 10px;
}

.credit-reco {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e7edf3;
  border-radius: 10px;
  display: flex;
  gap: 13px;
  padding: 13px 15px;
}

.credit-reco-icon {
  align-items: center;
  background: #e6f6ee;
  border-radius: 9px;
  color: #0b9f5c;
  display: flex;
  flex: 0 0 auto;
  font-size: 17px;
  height: 40px;
  justify-content: center;
  width: 40px;
}

.credit-reco-body {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.credit-reco-body strong {
  color: #14223a;
  font-size: 13.5px;
  font-weight: 900;
}

.credit-reco-body small {
  color: #7a8798;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

.credit-reco-delta {
  color: #0b9f5c;
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 950;
  margin-left: auto;
  white-space: nowrap;
}

.credit-disclaimer {
  align-items: flex-start;
  color: #7a8798;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  gap: 9px;
  line-height: 1.55;
  margin: 4px 0 0;
}

.credit-disclaimer svg {
  color: #0b9f5c;
  flex: 0 0 auto;
  font-size: 16px;
  margin-top: 1px;
}

@media (max-width: 1080px) {
  .credit-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .credit-grid-2 {
    grid-template-columns: minmax(0, 1fr);
  }

  .credit-tiles {
    grid-template-columns: minmax(0, 1fr);
  }

  .credit-details-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .credit-cta-band {
    align-items: flex-start;
    flex-direction: column;
  }

  .credit-title h1 {
    font-size: 24px;
  }

  .credit-result-hero strong {
    font-size: 36px;
  }
}

/* Prawdziwe ogloszenie z serwisu w liscie "Moje oferty" */
.listing-photo.clickable {
  cursor: pointer;
}

.listing-status em.listing-live-tag {
  background: #e6f6ee;
  border-radius: 999px;
  color: #0b9f5c;
  font-size: 10.5px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.02em;
  padding: 2px 8px;
  text-transform: uppercase;
}

/* Kalkulator osadzony w panelu konta (z paskiem bocznym) */
.credit-account-main {
  min-width: 0;
}

.credit-account-main .credit-title {
  margin-top: 0;
}

@media (max-width: 1280px) {
  .credit-account-main .credit-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Powiadomienia - klikalnosc (logika, bez zmiany wygladu) */
.notification-row,
.notification-popover-item[role="button"] {
  cursor: pointer;
}

.notification-popover-empty {
  color: #7a8798;
  font-size: 13px;
  font-weight: 700;
  margin: 0;
  padding: 18px 4px;
  text-align: center;
}

/* ===================== Panel admina: moduł marketingowy (Leady / Kampanie / Konfiguracja) ===================== */
.mkt-wrap { display: grid; gap: 18px; }
.mkt-subnav { display: flex; gap: 8px; flex-wrap: wrap; }
.mkt-subnav button {
  display: inline-flex; align-items: center; gap: 6px;
  background: #fff; border: 1px solid #d8e3ef; border-radius: 9px;
  color: #304760; cursor: pointer; font-weight: 800; font-size: 13px; padding: 8px 14px;
}
.mkt-subnav button.active { background: #0f2f5b; border-color: #0f2f5b; color: #fff; }
.mkt-subnav button svg { width: 15px; height: 15px; }

.mkt-card { display: grid; gap: 14px; }
.mkt-count, .mkt-badge, .mkt-chip {
  font-size: 12px; font-weight: 800; color: #304760;
  background: #eef3f9; border-radius: 999px; padding: 3px 10px;
}
.mkt-badge { background: #e4f0ff; color: #1256a0; }
.mkt-chip { background: #f1f4f8; padding: 2px 8px; }

.mkt-toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.mkt-search { position: relative; flex: 1 1 260px; display: flex; align-items: center; }
.mkt-search svg { position: absolute; left: 10px; width: 15px; height: 15px; color: #8aa0b6; }
.mkt-search input { width: 100%; padding-left: 32px; }
.mkt-toolbar select, .mkt-toolbar input { padding: 9px 11px; border: 1px solid #d8e3ef; border-radius: 8px; font-size: 13px; }

.mkt-addrow { display: grid; grid-template-columns: repeat(5, 1fr) auto; gap: 8px; align-items: center; }
.mkt-addrow input { padding: 9px 11px; border: 1px solid #d8e3ef; border-radius: 8px; font-size: 13px; }
@media (max-width: 900px) { .mkt-addrow { grid-template-columns: 1fr 1fr; } }

.mkt-table-scroll { overflow-x: auto; }
.mkt-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mkt-table th { text-align: left; color: #6b7f96; font-weight: 800; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; padding: 8px 10px; border-bottom: 1px solid #e6edf4; }
.mkt-table td { padding: 10px; border-bottom: 1px solid #f0f4f8; color: #24374d; vertical-align: middle; }
.mkt-contact { display: grid; }
.mkt-muted { color: #8195a9; font-weight: 600; }
.mkt-consents { display: flex; gap: 6px; }
.mkt-dot { font-size: 10px; font-weight: 800; border-radius: 6px; padding: 2px 6px; }
.mkt-dot.on { background: #dff5e8; color: #12784a; }
.mkt-dot.off { background: #f3e2e2; color: #a53b31; }
.mkt-actions { display: flex; gap: 6px; justify-content: flex-end; }
.mkt-actions button, .mkt-icon-btn {
  background: #fff; border: 1px solid #d8e3ef; border-radius: 7px; cursor: pointer;
  color: #46617d; padding: 5px 7px; display: inline-flex; align-items: center;
}
.mkt-actions button svg, .mkt-icon-btn svg { width: 15px; height: 15px; }
.mkt-actions button:disabled, .mkt-icon-btn:disabled { opacity: .5; cursor: default; }

.mkt-import { border-top: 1px solid #eef2f6; padding-top: 14px; display: grid; gap: 8px; }
.mkt-import h3 { display: flex; align-items: center; gap: 7px; margin: 0; font-size: 14px; color: #24374d; }
.mkt-import h3 svg { width: 16px; height: 16px; }
.mkt-import textarea, .mkt-form textarea { width: 100%; border: 1px solid #d8e3ef; border-radius: 8px; padding: 10px; font-size: 13px; font-family: inherit; resize: vertical; }
.mkt-import-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.mkt-import-actions input { flex: 1 1 220px; padding: 9px 11px; border: 1px solid #d8e3ef; border-radius: 8px; }

.mkt-grid-2 { display: grid; grid-template-columns: minmax(300px, 420px) 1fr; gap: 18px; align-items: start; }
@media (max-width: 1000px) { .mkt-grid-2 { grid-template-columns: 1fr; } }

.mkt-form { display: grid; gap: 12px; }
.mkt-form label { display: grid; gap: 5px; font-size: 12px; font-weight: 800; color: #46617d; }
.mkt-form input, .mkt-form select { padding: 9px 11px; border: 1px solid #d8e3ef; border-radius: 8px; font-size: 13px; font-weight: 500; }
.mkt-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mkt-fieldset { border: 1px solid #e6edf4; border-radius: 8px; padding: 10px 12px; }
.mkt-fieldset legend { font-size: 11px; font-weight: 800; color: #6b7f96; padding: 0 6px; }
.mkt-checks { display: flex; gap: 12px; flex-wrap: wrap; }
.mkt-checks-col { flex-direction: column; gap: 8px; }
.mkt-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #33475c; }
.mkt-check input { width: auto; }

.mkt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mkt-list li { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1px solid #e9eff5; border-radius: 10px; padding: 12px 14px; }
.mkt-list li strong { color: #17293c; }
.mkt-group-meta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; font-size: 12px; align-items: center; }

.mkt-campaign { align-items: flex-start; }
.mkt-campaign-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.mkt-status { font-size: 11px; font-weight: 800; border-radius: 999px; padding: 2px 9px; margin-left: 8px; }
.mkt-status-draft { background: #eef2f6; color: #5b6b7d; }
.mkt-status-scheduled { background: #e4f0ff; color: #1256a0; }
.mkt-status-sending { background: #fff2d8; color: #a9720c; }
.mkt-status-paused { background: #f3e9df; color: #8a5a1f; }
.mkt-status-completed { background: #dff5e8; color: #12784a; }
.mkt-status-cancelled { background: #f3e2e2; color: #a53b31; }
.mkt-stats { margin-top: 8px; font-size: 12px; color: #46617d; background: #f6f9fc; border-radius: 8px; padding: 8px 10px; }

.mkt-config { max-width: 960px; }
.mkt-config-head { display: flex; align-items: center; gap: 10px; }
.mkt-config-icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: #eef3fb; color: #1256a0; }
.mkt-config-icon svg { width: 18px; height: 18px; }
.mkt-config-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
@media (max-width: 760px) { .mkt-config-grid { grid-template-columns: 1fr; } .mkt-form-row { grid-template-columns: 1fr; } }
.mkt-config-grid label { display: grid; gap: 6px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: #6b7f96; }
.mkt-config-grid input, .mkt-config-grid select { padding: 10px 12px; border: 1px solid #d8e3ef; border-radius: 8px; font-size: 13px; font-weight: 500; text-transform: none; letter-spacing: normal; color: #17293c; }
.mkt-badge-set { display: inline-flex; align-items: center; gap: 4px; text-transform: none; letter-spacing: normal; font-size: 11px; font-weight: 800; color: #1256a0; background: #e4f0ff; border-radius: 999px; padding: 2px 8px; }
.mkt-badge-set svg { width: 12px; height: 12px; }
.mkt-config-save { display: flex; justify-content: flex-end; }
.mkt-test { border-top: 1px solid #eef2f6; padding-top: 14px; display: grid; gap: 8px; }
.mkt-test h3 { margin: 0; font-size: 14px; color: #24374d; }
.mkt-test-row { display: flex; gap: 10px; flex-wrap: wrap; }
.mkt-test-row input { flex: 1 1 240px; padding: 10px 12px; border: 1px solid #d8e3ef; border-radius: 8px; }
.mkt-test-row .admin-btn { display: inline-flex; align-items: center; gap: 6px; }
.mkt-test-row .admin-btn svg { width: 14px; height: 14px; }

.mkt-error { color: #b3261e; font-size: 13px; font-weight: 600; margin: 0; }
.mkt-ok { color: #12784a; font-size: 13px; font-weight: 600; margin: 0; }

/* Routing: stan wczytywania profilu przy wejsciu na trase chroniona */
.route-loading { padding: 80px 24px; text-align: center; color: #5b6472; font-size: 15px; font-weight: 600; }

/* Routing: NavLink/Link renderuja <a> - zerujemy domyslne style linku,
   zeby menu wygladalo dokladnie tak jak wczesniejsze <button>. */
.nav a,
.account-menu a,
.brand,
.icon-text {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

.not-found-page { display: grid; padding: 90px 24px 120px; place-items: center; }
.not-found-shell { max-width: 520px; text-align: center; }
.not-found-shell h1 { color: #13a360; font-size: 88px; font-weight: 900; line-height: 1; margin: 0; }
.not-found-shell h2 { color: #111a2e; font-size: 24px; font-weight: 800; margin: 16px 0 8px; }
.not-found-shell p { color: #5b6472; font-size: 15px; margin: 0 0 28px; }
.not-found-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.not-found-actions a { border-radius: 10px; font-size: 14px; font-weight: 800; padding: 12px 22px; text-decoration: none; }
.not-found-primary { background: #13a360; color: #ffffff; }
.not-found-secondary { border: 1px solid #d5dde7; color: #27384f; }

/* Routing: pozycje menu admina to teraz <a> (NavLink) */
.admin-nav a { color: inherit; cursor: pointer; text-decoration: none; }

/* Routing: okruszki nawigacyjne to teraz <Link> */
.breadcrumb a,
.district-breadcrumb a,
.negotiation-breadcrumb a,
.comparison-breadcrumb a,
.messages-breadcrumb a,
.valuation-breadcrumb a,
.history-breadcrumb a,
.credit-breadcrumb a { color: inherit; cursor: pointer; text-decoration: none; }

/* Routing: naglowkowe CTA jako <Link> - zachowanie wygladu przyciskow */
.post-button { align-content: center; text-decoration: none; }

/* Lista firm i uslug (/firmy) - korzysta z istniejacych kart .directory-card */
.companies-frame {
  display: block;
  margin: 0 auto;
  max-width: 1420px;
  padding: 0 96px;
}

.companies-frame .services-main { padding-right: 0; }

.companies-head { margin: 18px 0 20px; }

.companies-head h1 {
  color: #111a2e;
  font-size: 30px;
  font-weight: 900;
  line-height: 1.15;
  margin: 0 0 8px;
}

.companies-head p {
  color: #5b6472;
  font-size: 15px;
  margin: 0 0 10px;
  max-width: 720px;
}

.companies-count {
  color: #109253;
  font-size: 13px;
  font-weight: 800;
}

.companies-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}

.companies-chip {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dce4ec;
  border-radius: 999px;
  color: #27384f;
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 7px;
  padding: 8px 14px;
}

.companies-chip svg { color: #7d8ca0; font-size: 14px; }

.companies-chip span {
  background: #eef3f8;
  border-radius: 999px;
  color: #5b6472;
  font-size: 11px;
  font-weight: 900;
  padding: 1px 7px;
}

.companies-chip:hover { border-color: #b9c6d4; }

.companies-chip.active {
  background: #ebf6f0;
  border-color: #13a360;
  color: #109253;
}

.companies-chip.active svg { color: #109253; }
.companies-chip.active span { background: #d7efe2; color: #0d7a45; }

.companies-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1280px) {
  .companies-frame { padding: 0 24px; }
  .companies-list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .companies-head h1 { font-size: 24px; }
  .companies-frame { padding: 0 14px; }
}

/* Routing: CTA nawigacyjne renderuja sie jako <a> (Link). :where() ma zerowa
   specyficznosc, wiec kazda istniejaca regula klasy nadal wygrywa - to tylko
   zdejmuje domyslne podkreslenie i niebieski kolor linku. */
:where(a) {
  color: inherit;
  text-decoration: none;
}

/* Routing: CTA o ukladzie blokowym odtwarzaja centrowanie tresci znane z <button> */
a.sell-primary,
a.account-new-search,
a.price-alerts-link,
a.price-alerts-manage,
a.cover-preview-button,
a.back-step-button,
a.listing-detail-back {
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
}

/* Kontenery, ktorych reguly nie ustawialy display - <button> centrowal tresc sam,
   <a> wymaga tego jawnie. Pudelko (padding, min-height, tlo) bez zmian. */
.search-tabs a,
.tool-card a,
.sell-valuation-card a,
.sell-bottom-cta a,
.settings-profile-row > a {
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
}

/* Karty prowadzace do osobnej strony: link rozciagniety na cala karte.
   Daje prawdziwy <a href> (kopiowanie, nowa karta, indeksowanie) bez
   zagniezdzania przyciskow w <a>. Kontrolki karty zostaja klikalne nad nakladka. */
.real-result-card { position: relative; }

.card-stretched-link::after {
  content: "";
  inset: 0;
  position: absolute;
  z-index: 1;
}

.real-result-card .real-favorite-button,
.real-result-card .real-card-cta {
  position: relative;
  z-index: 2;
}

.real-card-cta {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  text-align: center;
}
