:root {
  --ink: #17212b;
  --muted: #647386;
  --line: #dde7f2;
  --canvas: #f5f7fa;
  --surface: #ffffff;
  --blue: #1565c0;
  --blue-soft: #eaf3ff;
  --green: #138a4e;
  --green-soft: #e9f7ef;
  --amber: #b26a00;
  --radius: 8px;
}

@font-face {
  font-family: "MaterialIcons";
  src: url("/fonts/MaterialIcons-Regular.otf?v=full-20260702") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  min-height: 100%;
  background: var(--canvas);
}

body {
  min-height: 100%;
  margin: 0;
  color: var(--ink);
  background: linear-gradient(#eaf4ff 0, #f5f7fa 32%, #f5f7fa 100%);
  font-family: Roboto, Arial, Helvetica, sans-serif;
  letter-spacing: 0;
}

button,
input,
select {
  font: inherit;
  letter-spacing: 0;
}

button,
a,
select {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
  text-decoration: none;
}

.app-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.topbar {
  height: 60px;
  color: #fff;
  background: var(--blue);
  flex: 0 0 auto;
}

.topbar__inner {
  width: min(1476px, 100%);
  height: 60px;
  margin: 0 auto;
  padding: 0 12px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.topbar__title {
  flex: 1;
  min-width: 0;
  text-align: center;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.icon-button {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--radius);
  display: grid;
  place-items: center;
  color: #fff;
  background: transparent;
  cursor: pointer;
}

.icon-button:hover {
  background: rgba(255, 255, 255, 0.12);
}

.menu-mark {
  width: 24px;
  height: 17px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.menu-mark span {
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.phone-mark {
  width: 17px;
  height: 26px;
  border: 2px solid currentColor;
  border-radius: 5px;
  position: relative;
}

.phone-mark::after {
  content: "";
  position: absolute;
  left: 5px;
  right: 5px;
  bottom: 3px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.main-scroll {
  flex: 1;
  overflow: auto;
  padding: 0 4px 16px;
}

.content-shell {
  width: min(1476px, 100%);
  margin: 0 auto;
  padding-top: 0;
}

.hero-card,
.popular-card,
.results-card,
.about-card {
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid #cfe1f4;
  border-radius: var(--radius);
  box-shadow: 0 8px 18px rgba(13, 71, 161, 0.08);
  overflow: hidden;
}

.popular-card[hidden] {
  display: none;
}

.hero-card {
  margin-top: 0;
}

.language-bar {
  padding: 0 10px 5px;
  background: #eaf4ff;
  border-bottom: 1px solid #cfe1f4;
}

.language-select {
  height: 46px;
  display: grid;
  grid-template-columns: 42px auto minmax(0, 1fr);
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  margin-top: 0;
}

.language-select .icon {
  justify-self: center;
}

.language-label {
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
}

.language-select select {
  width: 100%;
  min-width: 0;
  height: 44px;
  padding-left: 8px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
}

.hero-card__body {
  padding: 8px 10px 10px;
}

h1 {
  margin: 0 0 6px 4px;
  color: var(--ink);
  font-size: 26px;
  line-height: 1.08;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.add-profile-row {
  margin: 0 0 8px 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.add-profile-row p {
  flex: 1;
  min-width: 0;
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.18;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.download-button {
  width: 156px;
  height: 38px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: var(--green);
  color: #fff;
  box-shadow: 0 3px 8px rgba(19, 138, 78, 0.35);
  font-size: 13.5px;
  font-weight: 900;
  white-space: nowrap;
}

.search-panel {
  padding: 6px 4px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.form-label {
  display: block;
  margin: 0 0 3px;
  color: #1976d2;
  font-size: 16px;
  font-weight: 900;
}

.work-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  gap: 6px;
  margin-bottom: 6px;
}

.location-input-row {
  margin-bottom: 6px;
}

.suggestion-list {
  margin: -1px 0 6px;
  overflow: hidden;
  background: #fafcff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.suggestion-tile {
  width: 100%;
  min-height: 44px;
  border: 0;
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  background: #fafcff;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.suggestion-tile:last-child {
  border-bottom: 0;
}

.suggestion-tile:hover {
  background: var(--blue-soft);
}

.suggestion-tile__icon {
  width: 30px;
  height: 30px;
  border-radius: var(--radius);
  display: grid;
  place-items: center;
  background: var(--blue-soft);
  color: var(--blue);
}

.suggestion-tile__title,
.suggestion-tile__subtitle {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.suggestion-tile__title {
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
}

.suggestion-tile__subtitle {
  margin-top: 1px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.search-field {
  height: 46px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 34px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.search-field:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 1px rgba(21, 101, 192, 0.1);
}

.search-field input {
  width: 100%;
  min-width: 0;
  height: 44px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
}

.search-field input::placeholder {
  color: #7a8797;
  opacity: 1;
}

#work-input::placeholder {
  color: #374657;
  font-size: 17px;
  font-weight: 850;
}

.clear-button {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}

.small-tonal-button {
  height: 46px;
  border: 0;
  border-radius: var(--radius);
  background: var(--blue-soft);
  color: var(--blue);
  display: grid;
  place-items: center;
  cursor: pointer;
}

.small-tonal-button:disabled {
  cursor: default;
  background: #e0e0e0;
  color: #8b8f94;
}

.chevron-down {
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 8px solid currentColor;
}

.location-action-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 6px;
}

.mini-action {
  height: 42px;
  min-width: 0;
  border: 1px solid #b9e2c9;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #dff3e8;
  color: #135f3b;
  cursor: pointer;
  font-size: 13.5px;
  font-weight: 800;
  white-space: nowrap;
}

.mini-action .icon {
  width: 22px;
  height: 22px;
}

.mini-action.is-active {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue);
}

.mini-action:disabled {
  cursor: default;
  border-color: #d9dee4;
  background: #eef1f4;
  color: #8b8f94;
  opacity: 1;
}

.search-button {
  width: 100%;
  height: 46px;
  border: 0;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--blue);
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  font-weight: 800;
}

.search-button:disabled {
  cursor: default;
  background: #e0e0e0;
  color: #8b8f94;
  opacity: 1;
}

.saved-card,
.popular-card,
.results-card,
.about-card {
  margin-top: 8px;
  padding: 6px;
  background: #fff;
  border-color: var(--line);
  box-shadow: none;
}

.saved-card {
  margin-top: 8px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.saved-card__header {
  min-height: 28px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--ink);
  font-weight: 900;
}

.saved-card__header .icon {
  color: var(--green);
}

.saved-count {
  margin-left: auto;
  min-width: 28px;
  min-height: 26px;
  border-radius: var(--radius);
  border: 1px solid #b9e2c9;
  display: inline-grid;
  place-items: center;
  background: var(--green-soft);
  color: var(--green);
  font-weight: 900;
}

.saved-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-top: 7px;
}

.saved-profile {
  width: 230px;
  min-width: 230px;
  min-height: 76px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 8px;
  padding: 8px;
  background: #fafcff;
}

.saved-profile button {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 18px;
}

.saved-profile__main {
  min-width: 0;
  display: grid;
  justify-items: start;
  text-align: left;
  font-size: inherit;
}

.saved-profile__avatar {
  width: 36px;
  height: 36px;
  border-radius: var(--radius);
  display: grid;
  place-items: center;
  background: var(--green-soft);
  color: var(--green);
  font-weight: 900;
}

.saved-profile__name,
.saved-profile__meta {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.saved-profile__name {
  color: var(--ink);
  font-weight: 900;
}

.saved-profile__meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.popular-card h2 {
  margin: 0 0 6px;
  text-align: center;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.2;
  font-weight: 900;
}

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

.popular-tile {
  height: 78px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px;
  background: #fafcff;
  color: var(--ink);
  cursor: pointer;
}

.popular-tile span:last-child {
  width: 100%;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13.5px;
  line-height: 1.08;
  font-weight: 800;
}

.popular-tile:hover,
.popular-tile:focus-visible {
  border-color: var(--blue);
  background: var(--blue-soft);
}

.popular-tile.is-selected {
  border-color: var(--blue);
  background: var(--blue-soft);
}

.popular-tile.is-selected .tile-icon {
  background: #fff;
}

.popular-tile.is-extra {
  display: none;
}

.popular-card.is-expanded .popular-tile.is-extra {
  display: flex;
}

.popular-actions {
  display: flex;
  justify-content: center;
  margin-top: 6px;
}

.popular-detail {
  margin-top: 8px;
}

.catalog-section {
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fafcff;
}

.catalog-section + .catalog-section {
  margin-top: 8px;
}

.catalog-section__header {
  display: grid;
  gap: 1px;
  margin-bottom: 8px;
}

.catalog-section__header strong {
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
}

.catalog-section__header span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.catalog-chip-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.catalog-chip {
  width: 176px;
  min-height: 54px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 7px;
  align-items: start;
  padding: 8px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.catalog-chip:hover,
.catalog-chip:focus-visible {
  border-color: var(--blue);
  background: var(--blue-soft);
}

.catalog-chip .icon {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

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

.catalog-chip strong {
  font-size: 12px;
  line-height: 1.2;
  font-weight: 900;
}

.catalog-chip small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
}

.outline-button {
  min-height: 38px;
  border: 1px solid #b7cbe2;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  background: #fff;
  color: var(--blue);
  cursor: pointer;
  font-weight: 800;
}

.chevron-more {
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}

.popular-card.is-expanded .chevron-more {
  transform: rotate(225deg) translateY(-2px);
}

.results-card {
  min-height: 240px;
  padding: 12px;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.035);
}

.results-card__header {
  min-height: 24px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.results-card h2,
.about-card h2 {
  flex: 1;
  margin: 0;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 800;
}

.small-badge {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0 9px;
  background: #f2f7fc;
  color: #38516a;
  font-size: 12px;
  font-weight: 800;
}

.notice {
  margin: 0 0 10px;
  padding: 9px 10px;
  border-radius: var(--radius);
  border: 1px solid #f0d49b;
  background: #fff7e6;
  color: var(--amber);
  font-size: 13px;
  font-weight: 800;
}

.loading-spinner {
  width: 26px;
  height: 26px;
  border: 3px solid rgba(21, 101, 192, 0.22);
  border-top-color: var(--blue);
  border-radius: 50%;
  display: inline-block;
  animation: loading-spin 760ms linear infinite;
}

.search-button .loading-spinner {
  width: 18px;
  height: 18px;
  border-width: 2px;
  border-color: rgba(255, 255, 255, 0.38);
  border-top-color: #fff;
}

.suggestion-tile__icon .loading-spinner {
  width: 20px;
  height: 20px;
  border-width: 2px;
}

@keyframes loading-spin {
  to {
    transform: rotate(360deg);
  }
}

.empty-state {
  min-height: 168px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  color: var(--muted);
  text-align: center;
}

.empty-state strong {
  color: var(--muted);
  font-size: 15px;
  font-weight: 800;
}

.results-list {
  display: grid;
  gap: 10px;
}

.worker-card {
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(33, 150, 243, 0.2);
  border-radius: 10px;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  background: #e3f2fd;
  cursor: pointer;
}

.avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #2196f3;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
}

.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.worker-card__body {
  min-width: 0;
}

.worker-card h3 {
  margin: 0;
  color: #000;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 700;
}

.worker-card__work,
.worker-card__rating,
.worker-card__review,
.worker-card__distance {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.worker-card__work {
  color: rgba(0, 0, 0, 0.87);
  font-size: 14px;
  font-weight: 500;
}

.worker-card__rating {
  color: #f57c00;
  font-size: 14px;
  font-weight: 700;
}

.worker-card__review {
  color: rgba(0, 0, 0, 0.54);
  font-size: 12px;
  font-weight: 700;
}

.worker-card__distance {
  color: #777;
  font-size: 12px;
  font-weight: 400;
}

.worker-card__view {
  min-width: 58px;
  height: 38px;
  border: 0;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2196f3;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
}

.load-row {
  display: flex;
  justify-content: center;
  padding-top: 8px;
}

.show-more-button {
  min-height: 38px;
  border: 0;
  border-radius: var(--radius);
  padding: 0 14px;
  background: #2196f3;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
}

.about-card {
  padding: 12px;
  margin-bottom: 16px;
}

.about-card p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
  font-weight: 700;
}

.about-card__subtitle {
  color: var(--muted);
}

.about-section {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.about-section h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 800;
}

.about-section p {
  margin-top: 5px;
  font-weight: 600;
}

.seo-links-card {
  margin-bottom: 16px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.seo-links-card h2 {
  margin: 0 0 12px;
  text-align: center;
  font-size: 18px;
}

.seo-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.seo-links-grid a {
  min-height: 40px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fbff;
  color: var(--blue);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.modal-scrim {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: rgba(0, 0, 0, 0.48);
}

.worker-sheet {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 70;
  width: 100%;
  max-height: min(92vh, 760px);
  overflow: auto;
  border-radius: 34px 34px 0 0;
  background: #fff;
  transform: translate(-50%, 105%);
  transition: transform 180ms ease;
  box-shadow: 0 -14px 34px rgba(0, 0, 0, 0.22);
}

.worker-sheet.is-open {
  transform: translate(-50%, 0);
}

.sheet-handle {
  width: 40px;
  height: 5px;
  margin: 28px auto 26px;
  border-radius: 999px;
  background: #444852;
}

.sheet-close {
  display: none;
}

.sheet-content {
  padding: 0 15px 22px;
}

.sheet-title {
  margin: 0 42px 22px;
  text-align: center;
  color: #000;
  font-size: 22px;
  line-height: 1.18;
  font-weight: 700;
}

.profile-info-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 224px;
  gap: 12px;
}

.profile-info-row--single {
  grid-template-columns: 1fr;
}

.profile-info-box {
  min-height: 56px;
  border: 1px solid rgba(33, 150, 243, 0.45);
  border-radius: 10px;
  display: grid;
  justify-content: center;
  align-items: center;
  padding: 7px 12px;
  background: rgba(33, 150, 243, 0.12);
  color: #2196f3;
  text-align: center;
  font-weight: 800;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.profile-info-box--work {
  border-color: rgba(76, 175, 80, 0.45);
  background: rgba(76, 175, 80, 0.12);
  color: #1b5e20;
  justify-content: start;
  text-align: left;
}

.profile-media-row {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-top: 10px;
}

.sheet-photo {
  width: 90px;
  height: 60px;
  border: 1px solid #b7bec8;
  border-radius: 10px;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 0;
  background: #d8dce2;
  color: rgba(0, 0, 0, 0.54);
  cursor: pointer;
}

.sheet-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sheet-photo--empty {
  cursor: default;
}

.profile-note-box {
  min-height: 84px;
  border: 1px solid rgba(33, 150, 243, 0.25);
  border-radius: 10px;
  padding: 10px;
  display: flex;
  align-items: center;
  background: #e3f2fd;
  color: rgba(0, 0, 0, 0.82);
  font-size: 14px;
  font-style: italic;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.profile-note-label {
  color: rgba(0, 0, 0, 0.54);
  font-style: normal;
  font-weight: 800;
}

.profile-note-box span:last-child {
  min-width: 0;
}

.sheet-section-title {
  margin: 14px 0 6px;
  color: rgba(0, 0, 0, 0.54);
  font-size: 16px;
  font-weight: 700;
}

.profile-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.profile-contact-box {
  height: 58px;
  border: 1px solid rgba(33, 150, 243, 0.45);
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 10px;
  background: rgba(33, 150, 243, 0.12);
  color: var(--blue);
  cursor: pointer;
  font-weight: 800;
  text-align: left;
  min-width: 0;
}

.profile-contact-box span:last-child {
  min-width: 0;
  color: rgba(0, 0, 0, 0.86);
  font-size: 13px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-contact-box strong {
  color: var(--blue);
  font-size: 12px;
}

.profile-contact-box .icon {
  width: 26px;
  height: 26px;
}

.profile-contact-box .icon::before {
  font-size: 26px;
}

.profile-contact-box--whatsapp {
  border-color: rgba(76, 175, 80, 0.45);
  background: rgba(76, 175, 80, 0.12);
  color: #43a047;
}

.profile-contact-box--whatsapp strong {
  color: #43a047;
}

.profile-wide-action,
.profile-save-action,
.profile-open-app {
  width: 100%;
  min-height: 38px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
  text-decoration: none;
  cursor: pointer;
  font-weight: 900;
  font-size: 15px;
}

.profile-wide-action {
  border-radius: 10px;
  background: #bbdefb;
  color: #0d47a1;
}

.profile-wide-action .icon {
  color: #f44336;
}

.profile-wide-action .icon::before {
  font-size: 30px;
}

.profile-save-action {
  min-height: 40px;
  margin-top: 10px;
  border-color: rgba(0, 0, 0, 0.45);
  border-radius: 24px;
  background: #fff;
  color: #0d65d9;
}

.profile-save-action--danger {
  color: #c62828;
}

.profile-rating-panel {
  width: 100%;
  border: 1px solid rgba(33, 150, 243, 0.45);
  border-radius: 10px;
  padding: 8px 12px;
  background: rgba(33, 150, 243, 0.12);
}

.profile-rating-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.profile-current-rating {
  flex: 1 1 auto;
  color: #7b1fa2;
  font-weight: 800;
}

.profile-rate-button {
  min-height: 36px;
  border: 1px solid rgba(126, 87, 194, 0.25);
  border-radius: 8px;
  padding: 4px 10px;
  background: #ede7f6;
  color: #7e57c2;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.profile-user-rating {
  margin-top: 4px;
  color: #9575cd;
  font-weight: 800;
}

.profile-review-comment {
  margin-top: 4px;
  color: rgba(0, 0, 0, 0.54);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 800;
}

.profile-open-app {
  min-height: 40px;
  margin-top: 12px;
  border-color: rgba(0, 0, 0, 0.45);
  border-radius: 8px;
  background: #fff;
  color: #0d65d9;
}

.rating-row {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-top: 10px;
}

.star-button {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #f57c00;
  cursor: pointer;
  font-size: 26px;
}

.photo-preview-scrim {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(0, 0, 0, 0.72);
}

.photo-preview {
  position: fixed;
  inset: 16px;
  z-index: 100;
  display: grid;
  place-items: center;
  background: #000;
  border-radius: 4px;
}

.photo-preview img {
  max-width: 100%;
  max-height: 72vh;
  object-fit: contain;
}

.photo-preview__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.54);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  font-weight: 800;
}

.drawer-scrim {
  position: fixed;
  inset: 0;
  z-index: 40;
  background: rgba(0, 0, 0, 0.34);
}

.drawer {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 50;
  width: min(320px, 86vw);
  display: flex;
  flex-direction: column;
  background: #fff;
  transform: translateX(-105%);
  transition: transform 180ms ease;
  box-shadow: 8px 0 24px rgba(0, 0, 0, 0.18);
}

.drawer.is-open {
  transform: translateX(0);
}

.drawer__header {
  width: 100%;
  padding: 16px;
  background: var(--blue);
  color: #fff;
  font-size: 20px;
  font-weight: 700;
}

.drawer__item {
  width: 100%;
  min-height: 52px;
  border: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  padding: 0 16px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
  font-size: 16px;
  font-weight: 400;
}

.drawer__item:hover {
  background: #f5f7fa;
}

.drawer__item--bottom {
  margin-top: auto;
  border-top: 1px solid var(--line);
}

.support-scrim {
  position: fixed;
  inset: 0;
  z-index: 72;
  background: rgba(0, 0, 0, 0.42);
}

.support-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 82;
  width: min(440px, calc(100vw - 28px));
  max-height: calc(100vh - 42px);
  overflow: auto;
  transform: translate(-50%, -50%);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24);
}

.support-panel__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #f3f6fb;
  color: var(--ink);
  cursor: pointer;
}

.support-panel h2 {
  margin: 2px 44px 14px;
  text-align: center;
  font-size: 22px;
  color: var(--ink);
}

.support-intro {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px 14px;
  background: #fff;
}

.support-intro h3 {
  margin: 0 0 7px;
  font-size: 18px;
}

.support-intro p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.support-tile {
  min-height: 64px;
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  color: var(--ink);
  text-decoration: none;
  background: #fff;
}

.support-tile:hover {
  background: #f5f9ff;
  border-color: #b9d7f8;
}

.support-tile__icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--blue);
  background: #e8f3ff;
}

.support-tile strong,
.support-tile small {
  display: block;
  min-width: 0;
}

.support-tile strong {
  font-size: 16px;
}

.support-tile small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  overflow-wrap: anywhere;
}

.admin-scrim {
  position: fixed;
  inset: 0;
  z-index: 86;
  background: rgba(0, 0, 0, 0.44);
}

.admin-panel {
  position: fixed;
  inset: 0;
  z-index: 92;
  display: grid;
  grid-template-rows: 60px minmax(0, 1fr);
  background: #f3f6fa;
  color: var(--ink);
}

.admin-panel__bar {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 48px;
  align-items: center;
  height: 60px;
  padding: 0 12px;
  background: var(--blue);
  color: #fff;
}

.admin-panel__bar h2 {
  grid-column: 2;
  margin: 0;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
}

.admin-panel__close {
  grid-column: 3;
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.admin-panel__body {
  overflow: auto;
  padding: 16px;
}

.admin-shell {
  width: min(1180px, 100%);
  margin: 0 auto;
}

.admin-login-card,
.admin-card,
.admin-metric-card {
  border: 1px solid #dde7f2;
  border-radius: 8px;
  background: #fff;
}

.admin-login-card {
  width: min(420px, 100%);
  margin: 30px auto;
  padding: 18px;
}

.admin-login-card h3,
.admin-card h3 {
  margin: 0;
  color: var(--ink);
  font-weight: 900;
}

.admin-login-card h3 {
  text-align: center;
  font-size: 22px;
}

.admin-login-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0 auto 10px;
  border-radius: 8px;
  background: #e8f3ff;
  color: var(--blue);
}

.admin-login-card p,
.admin-card p {
  margin: 6px 0 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.45;
}

.admin-field {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.admin-field input {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0 12px;
  font: inherit;
  font-weight: 700;
  color: var(--ink);
}

.admin-password-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  gap: 8px;
}

.admin-password-toggle {
  display: inline-grid;
  place-items: center;
  min-height: 46px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fbff;
  color: var(--blue);
  cursor: pointer;
}

.admin-login-button,
.admin-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  border-radius: 8px;
  padding: 0 14px;
  cursor: pointer;
  font-weight: 900;
}

.admin-login-button {
  width: 100%;
  margin-top: 16px;
  border: 0;
  background: var(--blue);
  color: #fff;
}

.admin-login-button:disabled,
.admin-action-button:disabled {
  opacity: 0.62;
  cursor: wait;
}

.admin-error {
  margin-top: 10px;
  color: #b42318;
  text-align: center;
  font-weight: 800;
}

.admin-loading,
.admin-empty {
  display: grid;
  place-items: center;
  gap: 10px;
  min-height: 220px;
  color: var(--muted);
  font-weight: 800;
}

.admin-spinner {
  width: 34px;
  height: 34px;
  border: 4px solid #d9e8f9;
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: loading-spin 850ms linear infinite;
}

.admin-login-button .admin-spinner {
  width: 18px;
  height: 18px;
  border-width: 2px;
  border-top-color: #fff;
}

.admin-card {
  margin-bottom: 12px;
  padding: 14px;
}

.admin-header-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-action-button {
  border: 1px solid #b9d7f8;
  background: #fff;
  color: var(--blue);
  text-decoration: none;
}

.admin-action-button--filled {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

.admin-metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.admin-metric-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 98px;
  padding: 14px;
}

.admin-metric-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: #e8f3ff;
  color: var(--blue);
}

.admin-metric-value {
  color: var(--ink);
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
}

.admin-metric-label {
  margin-top: 5px;
  color: var(--muted);
  font-weight: 800;
}

.admin-workers-head {
  display: flex;
  align-items: center;
  gap: 14px;
}

.admin-workers-head > div:first-child {
  flex: 1;
  min-width: 0;
}

.admin-filter {
  width: min(340px, 100%);
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0 12px;
  font: inherit;
  font-weight: 700;
}

.admin-worker-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) minmax(220px, 360px);
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid #dde7f2;
}

.admin-worker-row:first-child {
  border-top: 0;
}

.admin-worker-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #e8f3ff;
  color: var(--blue);
}

.admin-worker-name,
.admin-worker-work,
.admin-worker-location {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-worker-name {
  color: var(--ink);
  font-size: 15.5px;
  font-weight: 900;
}

.admin-worker-work {
  margin-top: 3px;
  font-weight: 800;
}

.admin-worker-location {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.admin-worker-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.admin-chip {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid currentColor;
  border-radius: 8px;
  padding: 5px 8px;
  color: var(--blue);
  background: #eef6ff;
  font-size: 12px;
  font-weight: 900;
}

.admin-chip--green {
  color: #138a4e;
  background: #e9f7ee;
}

.admin-chip--amber {
  color: #a15d00;
  background: #fff4df;
}

.admin-chip--muted {
  color: var(--muted);
  background: #f5f7fa;
}

@media (max-width: 900px) {
  .admin-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-worker-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .admin-worker-meta {
    grid-column: 2;
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .admin-panel__body {
    padding: 10px;
  }

  .admin-metrics-grid {
    grid-template-columns: 1fr;
  }

  .admin-header-card,
  .admin-workers-head {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-filter {
    width: 100%;
  }
}

.icon,
.tile-icon,
.empty-icon {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  color: currentColor;
}

.search-field .icon,
.language-select .icon {
  color: var(--muted);
}

.tile-icon {
  width: 36px;
  height: 30px;
  border: 1px solid #cfe2f7;
  border-radius: 6px;
  background: var(--blue-soft);
  color: var(--blue);
}

.tile-icon::before,
.icon::before,
.empty-icon::before {
  content: "";
  position: absolute;
  inset: 1px;
  background: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.empty-icon {
  width: 58px;
  height: 58px;
}

.empty-icon::before {
  inset: 3px;
  color: var(--muted);
}

.icon-language,
.icon-info {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20a10 10 0 0 0 0-20Zm0 2c2 2.2 3 4.8 3 8s-1 5.8-3 8c-2-2.2-3-4.8-3-8s1-5.8 3-8Zm-7 7h14v2H5v-2Z'/%3E%3C/svg%3E");
}

.icon-download {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3a9 9 0 1 0 0 18a9 9 0 0 0 0-18Zm1 5v5l2-2l1.4 1.4L12 16.8l-4.4-4.4L9 11l2 2V8h2Z'/%3E%3C/svg%3E");
}

.icon-work,
.icon-tools,
.icon-repair {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m21 19l-6.5-6.5l1.6-1.6l1.4 1.4l3.5-3.5l-5.7-5.7l-3.5 3.5l1.4 1.4l-1.6 1.6L5 3H3v2l6.6 6.6L3 18.2V21h2.8l6.6-6.6L19 21l2-2Z'/%3E%3C/svg%3E");
}

.icon-location {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E");
}

.icon-near {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v3.1A7 7 0 0 1 18.9 11H22v2h-3.1A7 7 0 0 1 13 18.9V22h-2v-3.1A7 7 0 0 1 5.1 13H2v-2h3.1A7 7 0 0 1 11 5.1V2Zm1 5a5 5 0 1 0 0 10a5 5 0 0 0 0-10Zm0 3a2 2 0 1 1 0 4a2 2 0 0 1 0-4Z'/%3E%3C/svg%3E");
}

.icon-city {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 21V9h5V3h10v18H4Zm2-2h3v-2H6v2Zm0-4h3v-2H6v2Zm5 4h2v-2h-2v2Zm0-4h2v-2h-2v2Zm0-4h2V9h-2v2Zm0-4h2V5h-2v2Zm4 12h2v-2h-2v2Zm0-4h2v-2h-2v2Zm0-4h2V9h-2v2Zm0-4h2V5h-2v2Z'/%3E%3C/svg%3E");
}

.icon-map {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m15 5l-6-2l-6 2v16l6-2l6 2l6-2V3l-6 2Zm-1 13.6l-4-1.3V5.4l4 1.3v11.9Zm-9 .9V6.4l3-1v11.9l-3 1.2Zm14-1.9l-3 1V6.7l3-1v11.9Z'/%3E%3C/svg%3E");
}

.icon-search,
.icon-search-off {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 3a7 7 0 0 0 0 14c1.6 0 3-.5 4.2-1.4L20 21l1-1l-5.7-5.7A7 7 0 0 0 10 3Zm0 2a5 5 0 1 1 0 10a5 5 0 0 1 0-10Z'/%3E%3C/svg%3E");
}

.icon-feedback { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16v12H7l-3 3V4Zm7 10h2v-2h-2v2Zm1-9c-2 0-3.4 1.1-3.5 2.8h2c.1-.7.6-1.1 1.4-1.1c.9 0 1.4.5 1.4 1.2c0 .6-.3.9-1.1 1.4c-1.2.7-1.7 1.4-1.6 2.6h1.9c0-.7.3-1.1 1.2-1.6c1-.6 1.7-1.3 1.7-2.6C15.5 6 14.1 5 12 5Z'/%3E%3C/svg%3E"); }
.icon-share { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 16.1c-.8 0-1.5.3-2 .9L8.9 13c.1-.3.1-.6.1-1s0-.7-.1-1L16 7c.5.5 1.2.9 2 .9a3 3 0 1 0-3-3c0 .3 0 .6.1.9L8 9.9A3 3 0 1 0 8 14l7.1 4.2c-.1.2-.1.5-.1.8a3 3 0 1 0 3-2.9Z'/%3E%3C/svg%3E"); }
.icon-privacy { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l8 4v6c0 5-3.4 8.8-8 10c-4.6-1.2-8-5-8-10V6l8-4Zm-1 6v5h2V8h-2Zm0 7v2h2v-2h-2Z'/%3E%3C/svg%3E"); }
.icon-doc { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h9l5 5v15H6V2Zm8 1.5V8h4.5L14 3.5ZM8 12h8v2H8v-2Zm0 4h8v2H8v-2Z'/%3E%3C/svg%3E"); }
.icon-admin { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l8 4v6c0 5-3.4 8.8-8 10c-4.6-1.2-8-5-8-10V6l8-4Zm0 5a3 3 0 1 0 0 6a3 3 0 0 0 0-6Zm-5 10.2c1.3 1.3 3 2.2 5 2.8c2-.6 3.7-1.5 5-2.8c-.6-1.6-2.5-2.7-5-2.7s-4.4 1.1-5 2.7Z'/%3E%3C/svg%3E"); }
.icon-save { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12v18l-6-3l-6 3V3Z'/%3E%3C/svg%3E"); }

.icon-electric { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10v7h3l-8 13v-8H8l2-5H7V2Zm2 2v3h4l-2 5h3v3l3-5h-2V4H9Z'/%3E%3C/svg%3E"); }
.icon-plumb { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3h6v4h4a4 4 0 0 1 4 4v3h-4v-3H7v10H3V3h4Zm0 2H5v14h2V5Zm2 0v4h4V5H9Z'/%3E%3C/svg%3E"); }
.icon-carpenter { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 17L17 4l3 3L7 20H4v-3Zm12-9l-9 9v1h1l9-9l-1-1ZM3 5l2-2l4 4l-2 2L3 5Zm12 12l2-2l4 4l-2 2l-4-4Z'/%3E%3C/svg%3E"); }
.icon-agri { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18a3 3 0 1 0 0 .1V18Zm10 0a3 3 0 1 0 0 .1V18ZM5 14h3l2-5h4l2 5h3l-2-7h-3V4h-4v3H8l-3 7Z'/%3E%3C/svg%3E"); }
.icon-home { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21V9l9-7l9 7v12h-6v-7H9v7H3Z'/%3E%3C/svg%3E"); }
.icon-delivery { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h12v4h3l3 4v5h-2a3 3 0 0 1-6 0H9a3 3 0 0 1-6 0H1v-4h2V5Zm14 6v2h2.3L18 11h-1Z'/%3E%3C/svg%3E"); }
.icon-computer { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4h18v12H3V4Zm2 2v8h14V6H5Zm4 12h6l1 2H8l1-2Z'/%3E%3C/svg%3E"); }
.icon-car { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12l3 8v9h-3v-2H6v2H3v-9l3-8Zm1.4 2l-1.5 4h12.2l-1.5-4H7.4ZM7 14a2 2 0 1 0 0 .1V14Zm10 0a2 2 0 1 0 0 .1V14Z'/%3E%3C/svg%3E"); }
.icon-ac { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v7.2l4.8-4.8l1.4 1.4L14.4 10H22v2h-7.6l4.8 4.2l-1.4 1.4L13 12.8V22h-2v-9.2l-4.8 4.8l-1.4-1.4L9.6 12H2v-2h7.6L4.8 5.8l1.4-1.4L11 9.2V2Z'/%3E%3C/svg%3E"); }
.icon-kitchen { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10a2 2 0 0 1 2 2v18H5V4a2 2 0 0 1 2-2Zm0 2v6h10V4H7Zm0 8v8h10v-8H7Zm2 2h2v2H9v-2Z'/%3E%3C/svg%3E"); }
.icon-laundry { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h12a2 2 0 0 1 2 2v18H4V4a2 2 0 0 1 2-2Zm0 2v4h12V4H6Zm6 6a5 5 0 1 0 0 10a5 5 0 0 0 0-10Zm0 2a3 3 0 0 1 2.8 2c-1.8-.5-2.8.5-4.6.1A3 3 0 0 1 12 12Z'/%3E%3C/svg%3E"); }
.icon-tv { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v11H4V5Zm2 2v7h12V7H6Zm3 11h6l1 2H8l1-2Z'/%3E%3C/svg%3E"); }
.icon-paint { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3h12v6H3V3Zm2 2v2h8V5H5Zm6 6h3v3h-2v7H8v-7H6v-3h3V9h2v2Zm7-8h3v8a3 3 0 0 1-3 3h-2v-2h2a1 1 0 0 0 1-1V5h-1V3Z'/%3E%3C/svg%3E"); }
.icon-cleaning { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2l2 2l-8 8l-2-2l8-8Zm-9 9l8 8l-2 2l-8-8l2-2Zm12 1l4 4l-5 5l-4-4l5-5Z'/%3E%3C/svg%3E"); }
.icon-grass { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 21c1-6 3-10 7-15c0 6-1 10-3 15H4Zm8 0c1-8 4-13 8-18c0 8-2 13-5 18h-3Zm-5 0c3-5 7-8 13-10c-3 5-7 8-13 10Z'/%3E%3C/svg%3E"); }
.icon-bike { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 17a3 3 0 1 0 0 .1V17Zm14 0a3 3 0 1 0 0 .1V17ZM7 8h4l2 4h3l-2-5h3V5h-5l-1 2H7v1Zm3 4H7l-2 3h4l1-3Zm5 3h4l-3-3h-2l1 3Z'/%3E%3C/svg%3E"); }
.icon-bus { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h12a3 3 0 0 1 3 3v13h-2v3h-3v-3H8v3H5v-3H3V5a3 3 0 0 1 3-3Zm0 2v5h12V4H6Zm1 9a2 2 0 1 0 0 .1V13Zm10 0a2 2 0 1 0 0 .1V13Z'/%3E%3C/svg%3E"); }
.icon-hospital { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 21V5h6V3h4v2h6v16h-6v-5h-4v5H4Zm7-13v3H8v2h3v3h2v-3h3v-2h-3V8h-2Z'/%3E%3C/svg%3E"); }
.icon-construction { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21l7-7l-4-4l-2 2l-2-2l6-6l2 2l-2 2l4 4l7-7l2 2l-7 7l6 6l-2 2l-6-6l-7 7l-2-2Z'/%3E%3C/svg%3E"); }
.icon-fitness { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 9H3v6h2v3h3V6H5v3Zm14 0V6h-3v12h3v-3h2V9h-2Zm-9 2h4v2h-4v-2Z'/%3E%3C/svg%3E"); }
.icon-hotel { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21V4h7v6h11v11h-2v-3H5v3H3Zm2-5h14v-4H5v4Zm2-6a3 3 0 1 1 0-6a3 3 0 0 1 0 6Z'/%3E%3C/svg%3E"); }
.icon-school { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l10 5l-10 5L2 8l10-5Zm-6 8l6 3l6-3v5c-2 3-10 3-12 0v-5Z'/%3E%3C/svg%3E"); }
.icon-beauty { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3a4 4 0 1 1 0 8a4 4 0 0 1 0-8Zm10 0a4 4 0 1 1 0 8a4 4 0 0 1 0-8ZM7 13l10 8h-4l-8-6l2-2Zm10 0l-5 4l2 2l5-4l-2-2Z'/%3E%3C/svg%3E"); }
.icon-camera { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4h6l2 3h4v13H3V7h4l2-3Zm3 5a4 4 0 1 0 0 8a4 4 0 0 0 0-8Zm0 2a2 2 0 1 1 0 4a2 2 0 0 1 0-4Z'/%3E%3C/svg%3E"); }
.icon-event { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h2v3h6V2h2v3h3v17H4V5h3V2Zm-1 8v10h12V10H6Zm2 2h3v3H8v-3Z'/%3E%3C/svg%3E"); }
.icon-restaurant { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h2v8a3 3 0 0 1-2 2.8V22H5v-9.2A3 3 0 0 1 3 10V2h2v7h1V2h1Zm8 0h2v20h-2v-8h-2V6a4 4 0 0 1 2-4Z'/%3E%3C/svg%3E"); }
.icon-music { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 4v12a3 3 0 1 1-2-2.8V4h12v9a3 3 0 1 1-2-2.8V6h-8Z'/%3E%3C/svg%3E"); }
.icon-business { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3h6l1 3h5v15H3V6h5l1-3Zm2 2l-.3 1h2.6L13 5h-2Zm-6 6v8h14v-8h-5v2h-4v-2H5Z'/%3E%3C/svg%3E"); }
.icon-security { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l8 4v6c0 5-3.4 8.8-8 10c-4.6-1.2-8-5-8-10V6l8-4Zm0 5a3 3 0 1 0 0 6a3 3 0 0 0 0-6Zm-5 10c1.2 1.3 2.9 2.3 5 3c2.1-.7 3.8-1.7 5-3c-.7-1.4-2.4-2.2-5-2.2S7.7 15.6 7 17Z'/%3E%3C/svg%3E"); }
.icon-inventory { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 7l9-4l9 4v10l-9 4l-9-4V7Zm9-2.2L6.5 7L12 9.2L17.5 7L12 4.8ZM5 9v6.7l6 2.7v-6.7L5 9Zm14 0l-6 2.7v6.7l6-2.7V9Z'/%3E%3C/svg%3E"); }
.icon-store { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16l1 6a4 4 0 0 1-3 3.9V21H6v-7.1A4 4 0 0 1 3 10l1-6Zm4 10v5h8v-5H8Z'/%3E%3C/svg%3E"); }

@media (min-width: 760px) {
  .search-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    column-gap: 6px;
    align-items: start;
  }

  .search-panel .form-label,
  .search-panel .work-row,
  .search-panel .location-input-row,
  .search-panel .suggestion-list,
  .search-panel .location-action-row {
    grid-column: 1;
  }

  .search-button {
    grid-column: 2;
    grid-row: 5;
  }

  .location-input-row:not([hidden]) + .location-action-row {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .topbar__title {
    font-size: 18px;
  }

  .content-shell {
    width: 100%;
  }

  .hero-card__body {
    padding: 6px 6px 10px;
  }

  h1 {
    font-size: 17px;
  }

  .download-button {
    width: 144px;
  }

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

  .worker-card {
    grid-template-columns: 50px minmax(0, 1fr) 58px;
  }

}

@media (max-width: 420px) {
  .main-scroll {
    padding-left: 4px;
    padding-right: 4px;
  }

  .mini-action {
    gap: 4px;
    font-size: 12px;
  }

  .mini-action .icon {
    width: 18px;
    height: 18px;
  }

  .worker-card {
    grid-template-columns: 44px minmax(0, 1fr) 54px;
    gap: 8px;
  }

  .avatar {
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 560px) {
  .worker-sheet {
    width: 100%;
    max-height: 92vh;
    border-radius: 34px 34px 0 0;
  }

  .sheet-handle {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .sheet-content {
    padding: 0 12px 18px;
  }

  .sheet-title {
    margin-bottom: 16px;
    font-size: 21px;
  }

  .profile-info-row {
    grid-template-columns: minmax(0, 1fr) 136px;
  }

  .profile-info-row--single {
    grid-template-columns: 1fr;
  }

  .profile-media-row {
    grid-template-columns: 78px minmax(0, 1fr);
  }

  .sheet-photo {
    width: 78px;
    justify-self: stretch;
  }

  .profile-rating-row {
    align-items: center;
    flex-direction: row;
  }

  .profile-contact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-contact-box {
    padding: 0 7px;
    gap: 6px;
  }

  .profile-contact-box .icon {
    width: 24px;
    height: 24px;
  }

  .profile-contact-box .icon::before {
    font-size: 24px;
  }

  .profile-rate-button {
    padding-inline: 8px;
  }
}

/* Material Icons parity with the current Flutter web app. */
.menu-mark,
.phone-mark,
.chevron-down,
.chevron-more {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  color: currentColor;
  font-family: "MaterialIcons";
  font-size: 28px;
  font-weight: normal;
  line-height: 1;
}

.menu-mark span,
.phone-mark::after {
  display: none;
}

.menu-mark::before { content: "\e3dc"; }
.phone-mark::before { content: "\e4a3"; }
.chevron-down::before { content: "\e098"; }
.chevron-more::before { content: "\e246"; }
.popular-card.is-expanded .chevron-more::before { content: "\e245"; }

.icon::before,
.tile-icon::before,
.empty-icon::before {
  content: var(--mi, "\f0df");
  inset: 0;
  display: grid;
  place-items: center;
  background: none;
  color: currentColor;
  font-family: "MaterialIcons";
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-mask: none;
  mask: none;
}

.tile-icon::before {
  font-size: 23px;
}

.empty-icon::before {
  font-size: 58px;
}

.icon-language { --mi: "\e366"; }
.icon-info { --mi: "\e33d"; }
.icon-download { --mi: "\eff1"; }
.icon-work { --mi: "\f0df"; }
.icon-tools { --mi: "\ef05"; }
.icon-repair,
.icon-home-repair { --mi: "\f108"; }
.icon-build-circle { --mi: "\ef05"; }
.icon-location { --mi: "\f193"; }
.icon-near { --mi: "\f206"; }
.icon-city { --mi: "\f190"; }
.icon-map { --mi: "\f1ae"; }
.icon-search { --mi: "\e567"; }
.icon-search-off { --mi: "\e568"; }
.icon-feedback { --mi: "\f04f"; }
.icon-share { --mi: "\f378"; }
.icon-privacy { --mi: "\f2d0"; }
.icon-doc { --mi: "\efae"; }
.icon-admin { --mi: "\ee53"; }
.icon-save { --mi: "\e0f1"; }
.icon-person { --mi: "\e491"; }
.icon-person-outline { --mi: "\e497"; }
.icon-chat { --mi: "\ef44"; }
.icon-call { --mi: "\e126"; }
.icon-phone-app { --mi: "\e4a3"; }
.icon-delete { --mi: "\e1bb"; }
.icon-notes { --mi: "\f231"; }
.icon-star { --mi: "\e5f9"; }
.icon-star-border { --mi: "\e5fa"; }
.icon-star-outline { --mi: "\e5fd"; }
.icon-group { --mi: "\f0d9"; }
.icon-error { --mi: "\e238"; }
.icon-manage-search { --mi: "\e3c7"; }
.icon-work-outline { --mi: "\e6f4"; }
.icon-category { --mi: "\ef37"; }
.icon-close { --mi: "\e16a"; }
.icon-image { --mi: "\e332"; }
.icon-bookmark-add { --mi: "\eee0"; }
.icon-check-circle { --mi: "\e159"; }
.icon-link { --mi: "\e380"; }
.icon-telegram { --mi: "\f0586"; }
.icon-facebook { --mi: "\f044"; }
.icon-sms { --mi: "\f3ad"; }
.icon-email { --mi: "\f018"; }
.icon-more { --mi: "\e402"; }
.icon-my-location { --mi: "\e418"; }
.icon-north-west { --mi: "\e444"; }
.icon-login { --mi: "\ea77"; }
.icon-logout { --mi: "\e9ba"; }
.icon-visibility { --mi: "\e8f4"; }
.icon-visibility-off { --mi: "\e8f5"; }
.icon-bolt { --mi: "\eedd"; }
.icon-electric { --mi: "\f016"; }
.icon-plumb { --mi: "\f2b8"; }
.icon-carpenter { --mi: "\ef30"; }
.icon-agri { --mi: "\ee54"; }
.icon-ac { --mi: "\ee29"; }
.icon-kitchen { --mi: "\f149"; }
.icon-laundry { --mi: "\f180"; }
.icon-tv { --mi: "\f46b"; }
.icon-paint { --mi: "\f0a8"; }
.icon-cleaning { --mi: "\ef56"; }
.icon-grass { --mi: "\f0d1"; }
.icon-car { --mi: "\efc6"; }
.icon-bike { --mi: "\f46c"; }
.icon-bus { --mi: "\efc4"; }
.icon-hospital { --mi: "\f17e"; }
.icon-delivery { --mi: "\f18e"; }
.icon-construction { --mi: "\ef78"; }
.icon-fitness { --mi: "\f07a"; }
.icon-hotel { --mi: "\f10e"; }
.icon-school { --mi: "\f33c"; }
.icon-beauty { --mi: "\ef80"; }
.icon-camera { --mi: "\ef1e"; }
.icon-event { --mi: "\f02f"; }
.icon-restaurant { --mi: "\f316"; }
.icon-music { --mi: "\f1fb"; }
.icon-computer { --mi: "\ef74"; }
.icon-business { --mi: "\ef0a"; }
.icon-security { --mi: "\f34c"; }
.icon-home { --mi: "\f107"; }
.icon-inventory { --mi: "\f134"; }
.icon-store { --mi: "\f3ef"; }