/* Firoozeh · public finder, phone layer (≤ 56rem). Loaded after finder.css on /stores, /store-locator/{id}, /account/profile.
   /stores: the map owns the screen; search + chips float over it, a bottom sheet peeks with a swipeable reel of store cards.
   The card in the middle of the reel is the one lit on the map. Drag or tap the grip for the full list + filters.
   /account/profile: the glaze pass (stub with live counts), nearby strip, frosted bottom dock, map-patch place cards. Desktop is untouched. */

@media (max-width: 56rem) {
  /* ======================================================== /stores
     map owns the screen · search + chips float on top · results live in a bottom sheet (peek ⇄ full) */
  .k-finder-page { --sl-top: 7.5rem; --sl-peek: calc(15.5rem + env(safe-area-inset-bottom)); }
  .k-finder-page .k-pubfoot { display: none; }
  .k-finder { position: relative; overflow: hidden; height: calc(100dvh - var(--sl-bar) - 4px); min-height: 0; }
  .k-finder .sl { display: block; height: 100%; }

  /* the map, framed by the floating bar and the sheet */
  .k-finder .sl-map, [data-view="list"] .k-finder .sl-map { position: absolute; inset: 0 0 calc(var(--sl-peek) - 1.5rem) 0; visibility: visible; }
  .k-finder .kmap__ctl { inset-block-start: calc(var(--sl-top) + 0.25rem); border: 0; border-radius: 0.875rem; box-shadow: var(--k-shadow-2); overflow: hidden; }
  .k-finder .kmap__ctl button { width: 2.75rem; height: 2.75rem; }
  .k-finder .kmap__note, .k-finder .sl-map__badge { inset-block-start: calc(var(--sl-top) + 0.25rem); max-width: calc(100% - 8rem); white-space: normal; text-align: center; }
  .k-finder .kmap__layer, .k-finder .kmap__scale { inset-block-end: 2.5rem; }
  .k-finder .kmap__layer { border: 0; border-radius: var(--k-radius-pill); box-shadow: var(--k-shadow-2); }
  .k-finder .kmap__attr { inset-block-end: 1.5rem; }
  .k-finder .sl-switch { display: none; }

  /* phones zoom with a pinch and locate from the chip row, so the map's own +/−/locate stack steps aside */
  .k-finder .kmap__ctl { display: none; }
  .k-finder .sl-map { transition: inset 380ms var(--k-ease-out); }
  .k-finder .kmap__layer, .k-finder .kmap__scale, .k-finder .kmap__attr { transition: inset-block-end 380ms var(--k-ease-out); }

  /* hidden: the sheet slides away, the map takes the whole screen */
  [data-sheet="hidden"] .k-finder .sl-map { inset: 0; }
  [data-sheet="hidden"] .k-finder .sl-panel { transform: translateY(calc(100% + 2rem)); box-shadow: none; }
  [data-sheet="hidden"] .k-finder .kmap__layer, [data-sheet="hidden"] .k-finder .kmap__scale { inset-block-end: calc(5.25rem + env(safe-area-inset-bottom)); }
  [data-sheet="hidden"] .k-finder .kmap__attr { inset-block-end: 0; }

  /* the glass «فهرست» pill that brings the sheet back */
  .sl-reveal { position: absolute; z-index: 7; inset-block-end: calc(1.25rem + env(safe-area-inset-bottom)); inset-inline-start: 50%; transform: translateX(50%);
    display: inline-flex; align-items: center; gap: 0.5rem; height: 3.25rem; padding: 0 1.25rem 0 1rem; border-radius: var(--k-radius-pill); cursor: pointer;
    font: 700 var(--k-text-md) / 1 var(--k-font-display); color: var(--k-ink);
    background: color-mix(in srgb, var(--k-surface) 58%, transparent);
    -webkit-backdrop-filter: blur(18px) saturate(1.7); backdrop-filter: blur(18px) saturate(1.7);
    border: 1px solid color-mix(in srgb, var(--k-surface) 70%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 55%, transparent), 0 14px 32px -12px rgb(9 30 31 / 0.45), 0 0 0 1px color-mix(in srgb, var(--k-ink) 6%, transparent);
    animation: sl-pop 420ms var(--k-ease-out) backwards; -webkit-tap-highlight-color: transparent; }
  .sl-reveal[hidden] { display: none; }
  .sl-reveal .k-icon { width: 1.25rem; height: 1.25rem; color: var(--k-accent-ink); }
  .sl-reveal b { display: inline-grid; place-items: center; min-width: 1.625rem; height: 1.625rem; padding: 0 0.375rem; border-radius: var(--k-radius-pill); background: var(--k-accent); color: var(--k-on-accent); font-size: var(--k-text-sm); }
  .sl-reveal b:empty { display: none; }
  .sl-reveal:active { transform: translateX(50%) scale(0.96); }
  .sl-reveal:focus-visible { outline: none; box-shadow: var(--k-ring), 0 14px 32px -12px rgb(9 30 31 / 0.45); }
  :root[data-theme="dark"] .sl-reveal { box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.08), 0 14px 32px -12px rgb(0 0 0 / 0.7), 0 0 0 1px rgb(255 255 255 / 0.06); }

  /* floating bar */
  .k-finder .sl-bar { position: absolute; inset-inline: 0; inset-block-start: 0; z-index: 8; gap: var(--k-2); padding: var(--k-3) var(--k-4) var(--k-2);
    background: transparent; border: 0; pointer-events: none; transition: background var(--k-dur-3) var(--k-ease-out), box-shadow var(--k-dur-3); }
  .k-finder .sl-bar > * { pointer-events: auto; }
  [data-sheet="full"] .k-finder .sl-bar { background: var(--k-surface); box-shadow: 0 1px 0 var(--k-line); }
  .sl-panel__head { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .sl-loc__state { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  .sl-search { flex: none; gap: var(--k-2); align-items: center; }
  .sl-search .k-input-wrap { flex: 1; filter: drop-shadow(0 10px 18px rgb(9 30 31 / 0.16)); }
  .sl-search .k-input { height: 3rem; border-radius: 1rem; background: var(--k-surface); border-color: transparent; padding-inline-start: 2.75rem; box-shadow: 0 0 0 1px var(--k-line); }
  .sl-search .k-input:focus { border-color: var(--k-accent); box-shadow: var(--k-ring); }
  .sl-search .k-input-wrap > .k-icon { inset-inline-start: 1rem; color: var(--k-accent-ink); }
  [data-sheet="full"] .sl-search .k-input-wrap { filter: none; }
  [data-sheet="full"] .sl-search .k-input { background: var(--k-surface-2); box-shadow: none; }

  .sl-loc { flex: none; gap: 0; }
  .sl-loc__row { overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--k-4)); padding: 2px var(--k-4) 6px; }
  .sl-loc__row::-webkit-scrollbar { display: none; }
  .sl-chip, .sl-loc__pick { box-shadow: 0 4px 12px -6px rgb(9 30 31 / 0.35); border-color: transparent; }
  [data-sheet="full"] .sl-chip, [data-sheet="full"] .sl-loc__pick { box-shadow: none; }
  [data-sheet="full"] .sl-chip { border-color: var(--k-line); }
  .sl-chip--filters { display: inline-flex; }
  .sl-loc__pick { flex: none; }
  .sl-loc__text { max-width: 9.5rem; }
  .sl-filters { order: 0; margin-top: 0; }

  /* the sheet */
  .k-finder .sl-panel, [data-view="map"] .k-finder .sl-panel {
    visibility: visible; position: absolute; inset-inline: 0; inset-block-end: 0; z-index: 6; height: var(--sl-peek);
    display: flex; flex-direction: column; gap: var(--k-2); padding: 0 var(--k-4) calc(var(--k-3) + env(safe-area-inset-bottom));
    background: var(--k-surface); border: 0; border-radius: 1.5rem 1.5rem 0 0; overflow: hidden; overscroll-behavior: contain;
    box-shadow: 0 -1px 0 var(--k-line), 0 -18px 40px -18px rgb(9 30 31 / 0.45);
    transition: height 380ms var(--k-ease-out), border-radius 380ms var(--k-ease-out), transform 380ms var(--k-ease-out), box-shadow 380ms; animation: sl-rise 520ms var(--k-ease-out) backwards; }
  [data-sheet="full"] .k-finder .sl-panel { height: calc(100% - var(--sl-top)); overflow-y: auto; border-radius: 0; box-shadow: none; background: var(--k-bg); }

  .sl-grip { position: sticky; top: 0; z-index: 4; display: grid; place-items: center; flex: none; height: 1.5rem; margin: 0 calc(-1 * var(--k-4)) calc(-1 * var(--k-2));
    border: 0; background: inherit; cursor: grab; touch-action: none; border-radius: inherit; }
  [data-sheet="full"] .sl-grip { background: var(--k-bg); }
  .sl-grip:active { cursor: grabbing; }
  .sl-grip:focus-visible { outline: none; box-shadow: inset var(--k-ring); }
  .sl-grip__bar { width: 2.5rem; height: 5px; border-radius: var(--k-radius-pill); background: var(--k-line-strong); transition: width var(--k-dur-2) var(--k-ease-out), background var(--k-dur-2); }
  .sl-grip:hover .sl-grip__bar, .sl-grip:active .sl-grip__bar { width: 3.5rem; background: var(--k-muted); }

  .sl-results__head { position: static; flex: none; padding: 0; background: none; min-height: 2.25rem; touch-action: none; }
  [data-sheet="full"] .sl-results__head { touch-action: auto; }
  [data-sheet="full"] .sl-results__head { position: sticky; top: 1.5rem; z-index: 3; background: var(--k-bg); padding-block: var(--k-1) var(--k-2); }
  .sl-count { font-size: var(--k-text-lg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-more { display: inline-flex; align-items: center; gap: 0.25rem; flex: none; height: 2.25rem; padding: 0 0.875rem; border: 0; border-radius: var(--k-radius-pill);
    background: var(--k-accent-soft); color: var(--k-accent-ink); font: 700 var(--k-text-sm) / 1 var(--k-font-display); cursor: pointer; }
  .sl-more .k-icon { width: 1rem; height: 1rem; transition: transform var(--k-dur-3) var(--k-ease-out); }
  [data-sheet="full"] .sl-more { background: var(--k-deep); color: var(--k-on-deep); }
  [data-sheet="full"] .sl-more .k-icon { transform: rotate(180deg); }
  .sl-more:focus-visible { outline: none; box-shadow: var(--k-ring); }

  /* filters: only in the full sheet, opened from the chip */
  .sl-filters, [data-sheet="full"] .sl-filters:not([open]) { display: none; }
  [data-sheet="full"] .sl-filters[open] { display: block; scroll-margin-top: 4rem; animation: sl-in 280ms var(--k-ease-out) both; }
  .sl-filters > summary { display: none; }
  .sl-filters__body { padding: var(--k-4); }
  .sl-filters__top { justify-content: space-between; }
  .sl-filters__top b { display: block; }
  .sl-filters__grid { grid-template-columns: 1fr 1fr; }
  .sl-filters .k-select { height: 2.75rem; }

  /* peek: a swipeable reel; the card in the middle is the one lit on the map */
  .sl-list { flex: none; flex-direction: row; gap: var(--k-3); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--k-4)); padding: 2px var(--k-4) 4px; scroll-padding-inline: var(--k-4); overscroll-behavior-x: contain; touch-action: pan-x; }
  .sl-list::-webkit-scrollbar { display: none; }
  .sl-list > li { flex: 0 0 min(84%, 21rem); scroll-snap-align: center; }
  .sl-list > .sl-empty, .sl-list > .k-alert { flex-basis: 100%; }
  .sl-list > .sl-empty { padding: var(--k-3) var(--k-4); gap: var(--k-1); }
  .sl-list > .sl-empty .k-empty__mark { width: 1.75rem; height: 1.75rem; }

  .sl-card { grid-template-columns: 4.5rem minmax(0, 1fr); gap: var(--k-3); padding: var(--k-3); border-radius: 1.25rem; box-shadow: var(--k-shadow-1); -webkit-tap-highlight-color: transparent; }
  .sl-card:active { transform: scale(0.985); }
  .sl-card a, .sl-card img { -webkit-user-drag: none; user-drag: none; }
  .sl-card__media { width: 4.5rem; height: 4.5rem; border-radius: 0.875rem; }
  .sl-card__body { gap: 0.25rem; }
  .sl-card__name a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; } /* whole card opens details */
  .sl-card__enter { border-radius: 0.875rem; min-height: 2.5rem; }
  .sl-card__icon { border-radius: 0.875rem; }
  [data-sheet="peek"] .sl-card { grid-template-areas: "media body" "actions actions"; }
  [data-sheet="peek"] .sl-card__addr, [data-sheet="peek"] .sl-card [data-focus] { display: none; }
  [data-sheet="peek"] .sl-card__meta { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  [data-sheet="peek"] .sl-card__meta > span:nth-child(n+3) { display: none; }
  .sl-list > .sl-skel { grid-template-columns: 4.5rem 1fr; border-radius: 1.25rem; padding: var(--k-3); }
  .sl-skel__media { width: 4.5rem; height: 4.5rem; border-radius: 0.875rem; }

  /* full: the whole list, vertical */
  [data-sheet="full"] .sl-list { touch-action: auto; flex-direction: column; overflow: visible; scroll-snap-type: none; margin: 0; padding: 0 0 var(--k-7); }
  [data-sheet="full"] .sl-list > li { flex: none; }

  /* AI dialog */
  .sl-ai .sl-ai__form { flex-wrap: nowrap; }
  .sl-ai .sl-ai__form .k-input { flex: 1; min-width: 0; height: 3rem; border-radius: 1rem; }
  .sl-ai .sl-ai__form .k-btn { height: 3rem; border-radius: 1rem; }
  .sl-ai__chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--k-4)); padding-inline: var(--k-4); }
  .sl-ai__chips .k-tag { flex: none; padding: 0.5rem 0.875rem; border-radius: var(--k-radius-pill); }

  /* /store-locator/{id}: see store-detail.css */

  /* ======================================================== /account/profile · "the glaze pass"
     A boarding-pass card in deep lajvard: khatam-star avatar, name, contact, then a perforated stub whose three
     figures (places · stores · orders) open their section. A "nearby" strip sends the default place to /stores.
     Sections dock to the bottom as a frosted tab bar under the thumb (same glass as the /stores «فهرست» pill).
     Cards sit straight on the page (no card-in-card); every saved place gets its own patch of street grid. */
  .k-gp-page .k-pubfoot { padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
  .k-gp-page .k-toasts { inset-block-end: calc(5.75rem + env(safe-area-inset-bottom)); }
  .gp { gap: var(--k-4); padding-block: var(--k-3) var(--k-6); max-width: 34rem; margin-inline: auto; }

  /* --- the pass */
  .gp-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "av who out" "av ok out" "st st st";
    align-items: center; gap: var(--k-1) var(--k-3); padding: var(--k-5) var(--k-4) 0; border-radius: 1.5rem; isolation: isolate;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--k-accent) 22%, transparent), 0 22px 40px -26px rgb(0 64 66 / 0.9); }
  .gp-head::after { display: none; }
  .gp-head::before {
    content: ""; position: absolute; inset: -64px; z-index: -1; opacity: 0.55;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%2335b6ba' stroke-opacity='.32' stroke-width='1.25'%3E%3Crect x='17' y='17' width='30' height='30'/%3E%3Crect x='17' y='17' width='30' height='30' transform='rotate(45 32 32)'/%3E%3Cpath d='M0 32h6M58 32h6M32 0v6M32 58v6'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 64px 64px;
    -webkit-mask: linear-gradient(200deg, #000 10%, transparent 70%); mask: linear-gradient(200deg, #000 10%, transparent 70%);
    animation: gp-drift 52s linear infinite;
  }
  .gp-head .k-avatar { grid-area: av; align-self: start; width: 4.25rem; height: 4.25rem; border-radius: 0; clip-path: polygon(50.0% 0.0%, 64.6% 14.6%, 85.4% 14.6%, 85.4% 35.4%, 100.0% 50.0%, 85.4% 64.6%, 85.4% 85.4%, 64.6% 85.4%, 50.0% 100.0%, 35.4% 85.4%, 14.6% 85.4%, 14.6% 64.6%, 0.0% 50.0%, 14.6% 35.4%, 14.6% 14.6%, 35.4% 14.6%);
    background: linear-gradient(150deg, #35b6ba, var(--tile-firoozeh) 60%); color: #fff; font: 700 var(--k-text-xl) / 1 var(--k-font-display); }
  .gp-head__who { grid-area: who; min-width: 0; gap: 2px; }
  .gp-head h1 { font-size: 1.375rem; line-height: 1.45; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gp-head__meta { flex-direction: column; align-items: flex-start; gap: 0; opacity: 1; }
  .gp-head__meta span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; color: color-mix(in srgb, var(--k-on-deep) 78%, transparent); font-size: var(--k-text-sm); line-height: 1.6; }
  .gp-head__ok { grid-area: ok; justify-self: start; display: inline-flex; align-items: center; gap: 0.375rem; margin-top: var(--k-1); padding: 0.1875rem 0.625rem 0.1875rem 0.75rem;
    border-radius: var(--k-radius-pill); background: color-mix(in srgb, var(--tile-pesteh) 34%, transparent); color: var(--k-on-deep); font-size: var(--k-text-sm); font-weight: 700; }
  .gp-head__ok .k-icon { width: 1rem; height: 1rem; }
  .gp-head__ok[hidden] { display: none; }
  .gp-head [data-logout] { grid-area: out; align-self: start; width: 2.5rem; height: 2.5rem; min-height: 0; padding: 0; justify-content: center; border-radius: 50%;
    --b-bg: color-mix(in srgb, var(--k-on-deep) 12%, transparent); --b-fg: var(--k-on-deep); --b-line: color-mix(in srgb, var(--k-on-deep) 24%, transparent); --b-hover: color-mix(in srgb, var(--k-on-deep) 22%, transparent); }
  .gp-head [data-logout] span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .gp-head [data-logout] .k-icon { display: block; width: 1.125rem; height: 1.125rem; }

  /* the stub: perforation + notches cut out of the pass */
  .gp-stats { grid-area: st; position: relative; display: grid; grid-template-columns: repeat(3, 1fr); margin: var(--k-4) calc(-1 * var(--k-4)) 0;
    border-top: 2px dashed color-mix(in srgb, var(--k-on-deep) 26%, transparent); }
  .gp-stats::before, .gp-stats::after { content: ""; position: absolute; top: -0.8125rem; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--k-bg); }
  .gp-stats::before { left: -0.75rem; } .gp-stats::after { right: -0.75rem; }
  .gp-stats button { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: var(--k-3) var(--k-1) var(--k-4); border: 0; background: none; color: var(--k-on-deep);
    cursor: pointer; transition: background var(--k-dur-2) var(--k-ease); -webkit-tap-highlight-color: transparent; }
  .gp-stats button + button { box-shadow: inset -1px 0 0 color-mix(in srgb, var(--k-on-deep) 16%, transparent); }
  .gp-stats button:active { background: color-mix(in srgb, var(--k-on-deep) 8%, transparent); }
  .gp-stats button:focus-visible { outline: 2px solid var(--k-on-deep); outline-offset: -4px; border-radius: var(--k-radius-md); }
  .gp-stats b { font: 700 1.75rem / 1.25 var(--k-font-body); font-variant-numeric: tabular-nums; }
  .gp-stats span { font-size: var(--k-text-sm); color: color-mix(in srgb, var(--k-on-deep) 76%, transparent); white-space: nowrap; }

  /* --- nearby strip */
  .gp-near { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--k-3); padding: var(--k-2); padding-inline-end: var(--k-3);
    border: 1px solid var(--k-line); border-radius: 1.25rem; background: var(--k-surface); color: var(--k-ink); text-decoration: none; box-shadow: var(--k-shadow-1);
    transition: transform var(--k-dur-2) var(--k-ease), border-color var(--k-dur-2) var(--k-ease); -webkit-tap-highlight-color: transparent; }
  .gp-near:active { transform: scale(0.985); }
  .gp-near:hover { border-color: color-mix(in srgb, var(--k-accent) 45%, var(--k-line)); }
  .gp-near__map { position: relative; width: 3.75rem; height: 3.75rem; border-radius: 0.875rem; overflow: hidden; display: grid; place-items: center;
    background:
      linear-gradient(118deg, transparent 46%, color-mix(in srgb, var(--k-accent) 55%, transparent) 46% 54%, transparent 54%),
      repeating-linear-gradient(0deg, transparent 0 13px, var(--k-map-line) 13px 15px),
      repeating-linear-gradient(90deg, transparent 0 17px, var(--k-map-line) 17px 19px), var(--k-map-bg); }
  .gp-near__map i { position: relative; display: grid; place-items: center; width: 1.875rem; height: 1.875rem; border-radius: 50%; background: var(--k-accent); color: var(--k-on-accent); }
  .gp-near__map i::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--k-accent); animation: gp-ping 2.4s var(--k-ease-out) infinite; }
  .gp-near__map .k-icon { width: 1rem; height: 1rem; }
  .gp-near__txt { min-width: 0; display: flex; flex-direction: column; }
  .gp-near__txt b { font: 700 var(--k-text-md) / 1.6 var(--k-font-display); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gp-near__txt small { font-size: var(--k-text-sm); color: var(--k-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gp-near__go { color: var(--k-accent-ink); }

  /* --- the dock */
  .gp-tabs { position: fixed; z-index: var(--k-z-nav); top: auto; inset-inline: 0; bottom: calc(0.75rem + env(safe-area-inset-bottom)); width: min(100% - 1.5rem, 30rem); margin: 0 auto;
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 0.375rem; border: 1px solid color-mix(in srgb, var(--k-line) 80%, transparent); border-radius: 1.5rem;
    background: color-mix(in srgb, var(--k-surface) 88%, transparent); -webkit-backdrop-filter: blur(18px) saturate(1.6); backdrop-filter: blur(18px) saturate(1.6);
    box-shadow: var(--k-shadow-3); overflow: visible; }
  .gp-tabs .k-tab { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.1875rem; min-height: 3.5rem; padding: 0.25rem 0;
    border: 0; border-radius: 1.125rem; background: transparent; color: var(--k-ink-2); font: 400 var(--k-text-sm) / 1.3 var(--k-font-display); white-space: nowrap; box-shadow: none;
    -webkit-tap-highlight-color: transparent; }
  .gp-tabs .k-tab .gp-tab__i { display: block; box-sizing: content-box; width: 1.25rem; height: 1.25rem; padding: 0.3125rem 1.125rem; border-radius: var(--k-radius-pill);
    transition: background var(--k-dur-3) var(--k-ease-out), color var(--k-dur-2) var(--k-ease); }
  .gp-tabs .k-tab.is-active, .gp-tabs .k-tab[aria-selected="true"] { background: transparent; color: var(--k-accent-ink); font-weight: 700; box-shadow: none; }
  .gp-tabs .k-tab[aria-selected="true"] .gp-tab__i { background: var(--k-accent); color: var(--k-on-accent); }
  .gp-tabs .k-tab:focus-visible { outline: 2px solid var(--k-focus); outline-offset: -2px; }
  .gp-tab__l { display: none; }
  .gp-tab__s { display: inline; }

  /* --- panels */
  .gp > .k-card { padding: var(--k-4); border-radius: 1.25rem; }
  .gp > [data-panel="locations"], .gp > [data-panel="stores"] { padding: 0; border: 0; background: none; }
  .gp > [data-panel].is-in { animation: gp-in 360ms var(--k-ease-out) both; }
  .gp-section-head { flex-wrap: nowrap; margin-bottom: var(--k-3); }
  .gp-section-head h2 { font-size: var(--k-text-lg); white-space: nowrap; }
  /* the labelled add action lives in the dashed tile at the end of the list; up here it is a round "+" */
  .gp-section-head .k-btn { flex: none; width: 2.75rem; height: 2.75rem; min-height: 0; padding: 0; justify-content: center; border-radius: 50%; font-size: 0; box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--k-accent) 80%, transparent); }
  .gp-section-head .k-btn .k-icon { width: 1.25rem; height: 1.25rem; }

  /* account form: icon-led fields, locked email */
  .gp-form { gap: var(--k-4); }
  .gp-in { position: relative; display: block; }
  .gp-in .k-icon { display: block; position: absolute; top: 50%; transform: translateY(-50%); width: 1.125rem; height: 1.125rem; color: var(--k-faint); pointer-events: none; }
  .gp-in .gp-in__i { right: 0.9375rem; }
  .gp-in .gp-in__lock { left: 0.9375rem; }
  .gp-form .gp-in .k-input { height: 3.25rem; padding-right: 2.75rem; padding-left: var(--k-4); border-radius: 0.875rem; font-size: var(--k-text-md); }
  .gp-form .gp-in .k-input:disabled { padding-left: 2.75rem; background: var(--k-surface-2); color: var(--k-muted); opacity: 1; }
  .gp-form .gp-in:focus-within .gp-in__i { color: var(--k-accent); }
  .gp-form__foot .k-btn { width: 100%; min-height: 3.25rem; border-radius: var(--k-radius-pill); font-size: var(--k-text-md); }
  .gp-form__foot [data-feedback]:empty { display: none; }

  .gp-cards { grid-template-columns: minmax(0, 1fr); gap: var(--k-3); }
  .gp-card { position: relative; min-width: 0; padding: var(--k-3); border-radius: 1.25rem; gap: var(--k-1); background: var(--k-surface); box-shadow: var(--k-shadow-1); }
  .gp-card__actions { margin-top: var(--k-3); flex-wrap: wrap; }
  .gp-card__actions .k-btn { min-height: 2.75rem; border-radius: var(--k-radius-pill); }
  .gp-card__actions > a.k-btn { flex: 1 1 auto; justify-content: center; --b-bg: var(--k-accent-soft); --b-fg: var(--k-accent-ink); --b-line: transparent; }
  .gp-card__actions [data-loc-del], .gp-card__actions [data-unlink] { flex: none; width: 2.75rem; padding: 0; font-size: 0; justify-content: center; }
  .gp-card__actions [data-loc-del] .k-icon, .gp-card__actions [data-unlink] .k-icon { display: block; width: 1.125rem; height: 1.125rem; }

  /* saved place: its own patch of street grid, pin in the middle */
  .gp-place { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); grid-template-areas: "map body" "act act"; column-gap: var(--k-3); }
  .gp-place.is-default { border-color: color-mix(in srgb, var(--k-accent) 55%, transparent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--k-accent) 30%, transparent), var(--k-shadow-1); }
  .gp-place__map { grid-area: map; position: relative; display: grid; place-items: center; height: 5.5rem; border-radius: 0.875rem; overflow: hidden;
    background:
      linear-gradient(var(--gp-av, 62deg), transparent 44%, var(--k-map-line-strong) 44% 51%, transparent 51%),
      repeating-linear-gradient(0deg, transparent 0 21px, var(--k-map-line) 21px 24px),
      repeating-linear-gradient(90deg, transparent 0 29px, var(--k-map-line) 29px 32px), var(--k-map-bg);
    background-position: 0 0, 0 var(--my, 0), var(--mx, 0) 0, 0 0; }
  .gp-place:nth-child(2n) .gp-place__map { --gp-av: 128deg; }
  .gp-place__pin { position: relative; display: grid; place-items: center; color: var(--k-map-ink); }
  .gp-place__pin .k-icon { width: 1.875rem; height: 1.875rem; fill: var(--k-map-bg); filter: drop-shadow(0 3px 3px rgb(0 0 0 / 0.2)); transform: translateY(-0.5rem); }
  .gp-place.is-default .gp-place__pin { color: var(--k-accent); }
  .gp-place.is-default .gp-place__pin::after { content: ""; position: absolute; top: calc(50% + 0.25rem); width: 0.75rem; height: 0.375rem; border-radius: 50%;
    background: color-mix(in srgb, var(--k-accent) 45%, transparent); animation: gp-ping 2.4s var(--k-ease-out) infinite; }
  .gp-place__body { grid-area: body; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 2px; }
  .gp-place h3 { font-size: var(--k-text-md); line-height: 1.5; gap: var(--k-2); }
  .gp-place h3 > .k-icon { display: none; }
  .gp-place h3 .k-badge { margin-inline-start: auto; flex: none; }
  .gp-place .gp-card__meta { line-height: 1.6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gp-card__meta--none { display: block; color: var(--k-faint); }
  .gp-place .gp-card__coords { direction: rtl; text-align: start; font: 400 var(--k-text-sm) / 1.5 var(--k-font-body); color: var(--k-faint); }
  .gp-place .gp-card__actions { grid-area: act; }
  /* make-default = the ★ the finder already uses for the default place; it sits where the default badge would */
  .gp-card__actions [data-loc-default] { position: absolute; top: var(--k-2); inset-inline-end: var(--k-2); width: 2.5rem; min-height: 2.5rem; height: 2.5rem; padding: 0;
    justify-content: center; border-radius: 50%; font-size: 0; --b-bg: transparent; --b-line: transparent; --b-fg: var(--k-faint); }
  .gp-card__actions [data-loc-default]:hover { --b-fg: var(--tile-khormalu); }
  .gp-card__actions [data-loc-default] .k-icon { display: block; width: 1.25rem; height: 1.25rem; }
  .gp-place:not(.is-default) h3 { padding-inline-end: 2.25rem; }

  /* linked store: cover photo, tile stripe on top */
  .gp-store { flex-direction: column; align-items: stretch; gap: 0; padding: 0; overflow: hidden; }
  .gp-store::before { content: ""; position: absolute; z-index: 1; inset: 0 0 auto; height: 4px; background: var(--gp-tone, var(--tile-firoozeh)); }
  .gp-store[data-tone="1"] { --gp-tone: var(--tile-khormalu); } .gp-store[data-tone="2"] { --gp-tone: var(--tile-khesht); } .gp-store[data-tone="3"] { --gp-tone: var(--tile-pesteh); }
  .gp-store__img { width: 100%; height: 8.5rem; border-radius: 0; }
  .gp-store__img > .k-icon { width: 2.5rem; height: 2.5rem; }
  .gp-store__body { padding: var(--k-3) var(--k-4) var(--k-4); gap: 2px; }
  .gp-store h3 { font-size: var(--k-text-lg); }
  .gp-store h3 a { color: var(--k-ink); text-decoration: none; }
  .gp-store .gp-card__meta { padding-inline-start: 0; }
  .gp-store__seen { display: flex; align-items: center; gap: 0.375rem; font-size: var(--k-text-sm); color: var(--k-faint); }
  .gp-store__seen .k-icon { width: 0.9375rem; height: 0.9375rem; }
  .gp-store .gp-card__actions { margin-top: var(--k-3); flex-wrap: nowrap; }
  .gp-store .gp-card__actions .k-btn--primary { flex: 1; --b-bg: var(--k-accent); --b-fg: var(--k-on-accent); --b-line: var(--k-accent); }

  /* "add another" tile + empty state */
  .gp-add { display: block; }
  .gp-add button { width: 100%; display: flex; align-items: center; gap: var(--k-3); min-height: 4.5rem; padding: var(--k-3) var(--k-4); text-align: start;
    border: 1.5px dashed var(--k-line-strong); border-radius: 1.25rem; background: transparent; color: var(--k-ink); font: inherit; cursor: pointer;
    transition: border-color var(--k-dur-2) var(--k-ease), background var(--k-dur-2) var(--k-ease); -webkit-tap-highlight-color: transparent; }
  .gp-add button:hover, .gp-add button:active { border-color: var(--k-accent); background: color-mix(in srgb, var(--k-accent-soft) 40%, transparent); }
  .gp-add button > .k-icon { flex: none; box-sizing: content-box; width: 1.25rem; height: 1.25rem; padding: 0.625rem; border-radius: 50%; background: var(--k-accent-soft); color: var(--k-accent-ink); }
  .gp-add span { display: flex; flex-direction: column; min-width: 0; }
  .gp-add b { font: 700 var(--k-text-md) / 1.5 var(--k-font-display); }
  .gp-add small { font-size: var(--k-text-sm); color: var(--k-muted); }
  .gp-cards > li.gp-empty { display: flex; flex-direction: column; align-items: center; gap: var(--k-3); padding: var(--k-6) var(--k-5); border: 1.5px dashed var(--k-line-strong);
    border-radius: 1.25rem; text-align: center; line-height: 1.9; }
  .gp-empty__mark { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; clip-path: polygon(50.0% 0.0%, 64.6% 14.6%, 85.4% 14.6%, 85.4% 35.4%, 100.0% 50.0%, 85.4% 64.6%, 85.4% 85.4%, 64.6% 85.4%, 50.0% 100.0%, 35.4% 85.4%, 14.6% 85.4%, 14.6% 64.6%, 0.0% 50.0%, 14.6% 35.4%, 14.6% 14.6%, 35.4% 14.6%); background: var(--k-accent-soft); color: var(--k-accent-ink); }
  .gp-empty__mark .k-icon { width: 1.5rem; height: 1.5rem; }

  /* add-location sheet: map on top, fields under it */
  #gp-loc-dlg { height: 94vh; max-height: 94vh; }
  .gp-loc { gap: var(--k-3); }
  .gp-loc__map, .gp-loc__map.kmap { min-height: 42vh; border-radius: 1rem; }
  #gp-loc-dlg .k-modal__foot { display: grid; grid-template-columns: auto 1fr; padding-bottom: calc(var(--k-3) + env(safe-area-inset-bottom)); }
  #gp-loc-dlg .k-modal__foot .k-btn { min-height: 3rem; }
  .gp-connect__list { max-height: 60vh; }
  .gp-connect__list li { min-height: 3.5rem; border-radius: var(--k-radius-md); }
}

@media (max-width: 56rem) and (max-height: 680px) { .k-finder-page { --sl-peek: calc(14.75rem + env(safe-area-inset-bottom)); } }

@keyframes sl-rise { from { transform: translateY(100%); } }
@keyframes sl-pop { from { opacity: 0; transform: translateX(50%) translateY(1.5rem) scale(0.9); } }
@keyframes gp-drift { to { transform: translate(-64px, 64px); } }
@keyframes gp-in { from { opacity: 0; transform: translateY(8px); } }
@keyframes gp-ping { from { transform: scale(1); opacity: 0.9; } 70%, to { transform: scale(2.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .sl-search__ai::after, .k-finder .sl-panel, .sl-reveal, .gp-head::before, .gp > [data-panel].is-in, .gp-near__map i::before, .gp-place.is-default .gp-place__pin::after { animation: none; }
  .k-finder .sl-panel, .sl-card, .sl-more .k-icon { transition: none; }
}
