/* ============================================================================
   «Каса лояльності»: пошук гостя, розрахунок покупки, реєстрація, сертифікати й винагороди (префікс ld-).
   Окремий файл, щоб не змішувати з основною дизайн-системою; токени — з app.css.
   ========================================================================= */

@layer components {

  /* Обгортка ловить клавіші сторінки (F2, Esc, Ctrl+Enter); вікна лежать у ній, але поза .page. */
  .ld-root { min-height: 100%; outline: none; }

  /* Сітка каси перебудовується за шириною самої сторінки, а не екрана: бічне меню забирає 262px. */
  .ld { container-type: inline-size; container-name: ld; }

  /* ─────────────────────────── Шапка: заклад і зміна ─────────────────────────── */

  .ld-loc { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-3); }
  .ld-loc .select { width: auto; min-width: 180px; max-width: 260px; }

  .ld-today {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px 20px;
    padding: 10px 16px; margin-bottom: 14px;
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    font-size: var(--t-sm); color: var(--ink-3);
  }
  .ld-today__title { display: inline-flex; align-items: center; gap: 6px; font-weight: 560; color: var(--ink-2); }
  .ld-today__item b { margin-right: 3px; font-size: var(--t-md); font-weight: 680; color: var(--ink); }
  .ld-today__item b.ok { color: var(--ok); }

  /* ─────────────────────────── Пошук гостя ─────────────────────────── */

  .ld-search { padding: 16px; margin-bottom: 14px; }
  .ld-search__form { display: flex; align-items: stretch; gap: 10px; }
  .ld-search__box {
    position: relative; flex: 1; min-width: 0;
    display: flex; align-items: center; gap: 10px;
    height: 56px; padding: 0 16px;
    background: var(--surface-solid);
    border: 1.5px solid var(--line-strong);
    border-radius: var(--r-md);
    color: var(--ink-4);
    transition: border-color var(--d-fast) var(--e-out), box-shadow var(--d-fast) var(--e-out), color var(--d-fast) var(--e-out);
  }
  .ld-search__box:hover { border-color: var(--n-300); }
  .ld-search__box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); color: var(--accent); }
  .ld-search__box > svg { flex: none; }
  .ld-search__input {
    flex: 1; min-width: 0; height: 100%;
    border: 0; outline: none; background: transparent;
    font-size: 1.125rem; font-weight: 520; color: var(--ink);
  }
  .ld-search__input:focus-visible { outline: none; }
  .ld-search__input::placeholder { color: var(--ink-4); font-weight: 400; }
  .ld-search__go { height: 56px; padding: 0 24px; font-weight: 620; }
  .ld-search__hint { display: flex; align-items: center; gap: 6px; margin-top: 10px; color: var(--ink-3); }

  .ld-spinner {
    flex: none;
    width: 16px; height: 16px;
    border: 2px solid currentColor; border-right-color: transparent;
    border-radius: 50%;
    animation: spin .7s linear infinite;
  }

  .ld-results { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
  .ld-results__head { font-size: var(--t-xs); font-weight: 560; color: var(--ink-3); }
  .ld-result {
    display: flex; align-items: center; gap: 12px;
    width: 100%; min-height: 60px; padding: 9px 14px;
    text-align: left; color: inherit;
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    transition: border-color var(--d-fast) var(--e-out), background var(--d-fast) var(--e-out), transform var(--d-fast) var(--e-out);
  }
  .ld-result:hover, .ld-result:focus-visible { border-color: var(--accent-line); background: var(--accent-soft); }
  .ld-result:active { transform: scale(.995); }
  .ld-result > svg { flex: none; color: var(--ink-4); }
  .ld-result__main { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.35; }
  .ld-result__bal { font-weight: 640; white-space: nowrap; }
  .ld-result__seen { white-space: nowrap; }

  .ld-notfound {
    display: flex; align-items: center; flex-wrap: wrap; gap: 12px;
    margin-top: 12px; padding: 12px 14px;
    background: var(--bg-sunken);
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
  }
  .ld-notfound__icon {
    flex: none; display: grid; place-items: center;
    width: 38px; height: 38px; border-radius: 50%;
    background: var(--surface-solid); color: var(--ink-4);
  }
  .ld-notfound__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 220px; }

  /* Аватар і рівень гостя: колір рівня — лише крапкою, обідком і легким тлом, текст завжди читається. */
  .ld-avatar {
    --tier: var(--ink-4);
    flex: none; display: grid; place-items: center;
    width: 40px; height: 40px; border-radius: 50%;
    background: color-mix(in oklab, var(--tier) 16%, var(--surface-solid));
    color: var(--ink);
    font-size: var(--t-xs); font-weight: 680;
    box-shadow: 0 0 0 2px var(--surface-solid), 0 0 0 4px color-mix(in oklab, var(--tier) 70%, transparent);
    user-select: none;
  }
  .ld-avatar--lg { width: 58px; height: 58px; font-size: var(--t-lg); }

  .ld-tier {
    --tier: var(--ink-4);
    display: inline-flex; align-items: center; gap: 6px;
    height: 24px; padding: 0 10px;
    border-radius: var(--r-full);
    border: 1px solid color-mix(in oklab, var(--tier) 45%, var(--line));
    background: color-mix(in oklab, var(--tier) 12%, var(--surface-solid));
    font-size: var(--t-xs); font-weight: 620; color: var(--ink);
    white-space: nowrap;
  }
  .ld-tier i { width: 8px; height: 8px; border-radius: 50%; background: var(--tier); }

  /* ─────────────────────────── Дві колонки: гість і покупка ─────────────────────────── */

  .ld-grid {
    display: grid; align-items: start; gap: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
    margin-bottom: 14px;
  }

  .ld-placeholder {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    min-height: 260px; padding: 32px 24px;
    text-align: center; color: var(--ink-2);
  }
  .ld-placeholder > .t-sm { max-width: 360px; }
  .ld-placeholder__icon {
    display: grid; place-items: center;
    width: 58px; height: 58px; margin-bottom: 4px;
    border-radius: 50%;
    background: var(--bg-sunken); color: var(--ink-4);
  }

  /* ─────────────────────────── Картка гостя ─────────────────────────── */

  .ld-member { display: flex; flex-direction: column; gap: 14px; padding: 18px; min-width: 0; }
  .ld-member.is-blocked { border-color: color-mix(in oklab, var(--danger) 40%, var(--line)); }
  .ld-member__head { display: flex; align-items: flex-start; gap: 14px; }
  .ld-member__who { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
  .ld-member__name { font-size: var(--t-xl); font-weight: 660; line-height: 1.2; overflow-wrap: anywhere; }
  .ld-member__meta {
    display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px;
    font-size: var(--t-sm); color: var(--ink-3);
  }
  .ld-member__meta > span { display: inline-flex; align-items: center; gap: 5px; }
  .ld-member__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
  .ld-member__actions { display: flex; align-items: center; gap: 4px; flex: none; }
  .ld-member__blocked { align-items: flex-start; }
  .ld-member__blocked svg { margin-top: 2px; }
  .ld-code { font-family: var(--font-num); letter-spacing: .04em; }

  .ld-wallet {
    display: flex; align-items: stretch; justify-content: space-between; flex-wrap: wrap; gap: 12px;
    padding: 14px 16px;
    border-radius: var(--r-lg);
    border: 1px solid var(--accent-line);
    background: linear-gradient(135deg, var(--accent-soft), color-mix(in oklab, var(--brand-2) 10%, transparent));
  }
  .ld-wallet__main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .ld-wallet__label { font-size: var(--t-xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
  .ld-wallet__value { font-size: 2.25rem; font-weight: 720; line-height: 1.1; letter-spacing: -.03em; color: var(--ink); white-space: nowrap; }
  .ld-wallet__value small { margin-left: 2px; font-size: var(--t-md); font-weight: 550; letter-spacing: 0; color: var(--ink-3); }
  .ld-wallet__pending { display: inline-flex; align-items: center; gap: 5px; font-size: var(--t-sm); color: var(--ink-3); }
  .ld-wallet__rates { display: flex; align-items: stretch; gap: 8px; }
  .ld-wallet__rates > div {
    display: flex; flex-direction: column; justify-content: center; gap: 1px;
    min-width: 96px; padding: 8px 12px;
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
  }
  .ld-wallet__rates span { font-size: var(--t-xs); color: var(--ink-3); }
  .ld-wallet__rates b { font-size: var(--t-lg); font-weight: 680; }

  .ld-next { display: flex; flex-direction: column; gap: 7px; }
  .ld-next__line {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 10px;
    font-size: var(--t-sm); color: var(--ink-2);
  }
  .ld-next__line > span:first-child { display: inline-flex; align-items: center; gap: 6px; }

  .ld-note, .ld-fav { display: flex; align-items: flex-start; gap: 8px; font-size: var(--t-sm); line-height: 1.45; }
  .ld-note {
    padding: 9px 12px;
    border-radius: var(--r-md);
    background: var(--warn-soft);
    border: 1px solid color-mix(in oklab, var(--warn) 24%, transparent);
    color: var(--ink);
  }
  .ld-note > svg { flex: none; margin-top: 2px; color: var(--warn); }
  .ld-fav > svg { flex: none; margin-top: 2px; color: var(--danger); }

  .ld-block { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
  .ld-block__title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; font-size: var(--t-sm); font-weight: 620; color: var(--ink-2); }
  .ld-block__title .t-xs { font-weight: 450; }

  .ld-coupons { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
  .ld-coupon {
    display: flex; align-items: center; gap: 10px;
    min-height: 54px; padding: 8px 12px;
    text-align: left; color: inherit;
    background: var(--surface-solid);
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    transition: border-color var(--d-fast) var(--e-out), background var(--d-fast) var(--e-out), box-shadow var(--d-fast) var(--e-out);
  }
  .ld-coupon > svg { flex: none; color: var(--accent); }
  .ld-coupon:hover:not(:disabled) { border-color: var(--accent-line); background: var(--accent-soft); }
  .ld-coupon.is-on { border-style: solid; border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
  .ld-coupon:disabled { opacity: .55; cursor: not-allowed; }
  .ld-coupon__text { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.3; }
  .ld-coupon__text b { font-size: var(--t-sm); font-weight: 600; }

  .ld-stamp { --stamp: var(--accent); display: flex; flex-direction: column; gap: 6px; }
  .ld-stamp__line { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: var(--t-sm); }
  .ld-stamp__dots { display: flex; flex-wrap: wrap; gap: 6px; }
  .ld-stamp__dots i {
    width: 20px; height: 20px; border-radius: 50%;
    border: 2px dashed color-mix(in oklab, var(--stamp) 45%, var(--line-strong));
  }
  .ld-stamp__dots i.is-on { border: 0; background: var(--stamp); box-shadow: inset 0 0 0 3px color-mix(in oklab, #fff 28%, transparent); }

  .ld-rewards { display: flex; flex-direction: column; gap: 6px; }
  .ld-reward {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px;
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
  }
  .ld-reward.is-short .ld-reward__text, .ld-reward.is-short .ld-reward__cost { opacity: .6; }
  .ld-reward__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
  .ld-reward__text { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.3; }
  .ld-reward__text b { font-size: var(--t-sm); font-weight: 600; }
  .ld-reward__cost { font-weight: 680; white-space: nowrap; }

  /* ─────────────────────────── Покупка ─────────────────────────── */

  .ld-buy { min-width: 0; }
  .ld-buy__title { display: inline-flex; align-items: center; gap: 8px; }
  .ld-buy__form { display: flex; flex-direction: column; gap: 14px; }
  .ld-buy__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
  .ld-buy__submit { height: 58px; font-size: var(--t-lg); font-weight: 650; border-radius: var(--r-md); }
  .ld-buy__submit svg { width: 18px; height: 18px; }
  .ld-buy__why { margin-top: -6px; text-align: center; }

  .ld-amount {
    display: flex; align-items: center; gap: 8px;
    height: 66px; padding: 0 16px;
    background: var(--surface-solid);
    border: 1.5px solid var(--line-strong);
    border-radius: var(--r-md);
    transition: border-color var(--d-fast) var(--e-out), box-shadow var(--d-fast) var(--e-out);
  }
  .ld-amount:hover { border-color: var(--n-300); }
  .ld-amount:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
  .ld-amount.is-invalid { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
  .ld-amount__input {
    flex: 1; min-width: 0; height: 100%;
    border: 0; outline: none; background: transparent;
    font-size: 2rem; font-weight: 700; letter-spacing: -.02em; color: var(--ink);
  }
  .ld-amount__input:focus-visible { outline: none; }
  .ld-amount__input::placeholder { color: var(--ink-4); font-weight: 600; }
  .ld-amount__input:disabled { cursor: not-allowed; }
  .ld-amount__unit { font-size: var(--t-lg); font-weight: 600; color: var(--ink-3); }

  .ld-inline { display: flex; align-items: center; gap: 8px; }
  .ld-inline > .input { flex: 1; min-width: 0; }
  .ld-mono { font-family: var(--font-num); letter-spacing: .06em; text-transform: uppercase; }
  .ld-mono::placeholder { letter-spacing: 0; text-transform: none; }
  .ld-input-lg { height: 44px; font-size: var(--t-lg); }

  .ld-seg { display: flex; width: 100%; }
  .ld-seg .segmented__item { flex: 1; padding: 9px 12px; font-size: var(--t-sm); text-align: center; }
  .ld-seg .segmented__item:disabled { opacity: .5; cursor: not-allowed; }

  .ld-quote {
    display: flex; flex-direction: column; gap: 6px;
    padding: 14px 16px;
    background: var(--bg-sunken);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    transition: opacity var(--d-base) var(--e-out);
  }
  .ld-quote.is-stale { opacity: .6; }
  .ld-quote--empty { flex-direction: row; align-items: center; gap: 8px; font-size: var(--t-sm); color: var(--ink-3); }
  .ld-quote__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: var(--t-sm); color: var(--ink-2); }
  .ld-quote__row > span:first-child { min-width: 0; }
  .ld-quote__row > .num { white-space: nowrap; font-weight: 580; color: var(--ink); }
  .ld-quote__row--discount > .num, .ld-quote__row--coupon > .num, .ld-quote__row--redeem > .num { color: var(--ok); }
  .ld-quote__row--info { font-size: var(--t-xs); color: var(--ink-3); }
  .ld-quote__total {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    margin-top: 4px; padding-top: 10px;
    border-top: 1px dashed var(--line-strong);
    font-size: var(--t-md); font-weight: 620;
  }
  .ld-quote__total b { font-size: 1.875rem; font-weight: 760; line-height: 1.15; letter-spacing: -.02em; white-space: nowrap; }
  .ld-quote__accrual {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 9px 12px;
    border-radius: var(--r-md);
    background: var(--ok-soft);
    font-size: var(--t-sm); color: var(--ink);
  }
  .ld-quote__accrual > svg { flex: none; margin-top: 2px; color: var(--ok); }
  .ld-quote__accrual b { color: var(--ok); }
  .ld-quote__after { font-size: var(--t-xs); color: var(--ink-3); }
  .ld-quote__warn { display: flex; align-items: flex-start; gap: 7px; font-size: var(--t-xs); font-weight: 540; color: var(--warn); }
  .ld-quote__warn > svg { flex: none; margin-top: 1px; }

  .ld-done {
    display: flex; flex-direction: column; gap: 10px;
    margin: 14px 18px 0; padding: 14px 16px;
    background: var(--ok-soft);
    border: 1px solid color-mix(in oklab, var(--ok) 30%, transparent);
    border-radius: var(--r-lg);
    animation: pop-in var(--d-slow) var(--e-out) both;
  }
  .ld-done__head { display: flex; align-items: center; gap: 10px; }
  .ld-done__icon {
    flex: none; display: grid; place-items: center;
    width: 32px; height: 32px; border-radius: 50%;
    background: var(--ok); color: #fff;
  }
  .ld-done__title { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.3; }
  /* Кількість клітинок різна (знижки й списання може не бути) — гнучкий ряд без «сиріт» у сітці. */
  .ld-done__grid { display: flex; flex-wrap: wrap; gap: 8px; }
  .ld-done__grid > div {
    flex: 1 1 96px;
    display: flex; flex-direction: column;
    padding: 8px 10px;
    background: var(--surface-solid);
    border-radius: var(--r-md);
  }
  .ld-done__grid span { font-size: var(--t-xs); color: var(--ink-3); }
  .ld-done__grid b { font-size: var(--t-lg); font-weight: 700; white-space: nowrap; }
  .ld-done__grid b.ok { color: var(--ok); }
  .ld-done__grid small { font-size: var(--t-2xs); color: var(--ink-4); }
  .ld-done__reward { display: flex; align-items: center; gap: 7px; font-size: var(--t-sm); }
  .ld-done__reward > svg { flex: none; color: var(--accent); }

  /* ─────────────────────────── Останні операції ─────────────────────────── */

  .ld-recent__title { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .ld-recent__title h3 { display: inline-flex; align-items: center; gap: 8px; }
  .ld-ops { margin: 0; padding: 0; list-style: none; }
  .ld-op {
    display: grid; align-items: center; gap: 4px 14px;
    grid-template-columns: 52px minmax(0, 1fr) auto 104px 132px;
    min-height: 58px; padding: 10px 18px;
    border-bottom: 1px solid var(--line);
    transition: background var(--d-fast) var(--e-out);
  }
  .ld-op:last-child { border-bottom: 0; }
  .ld-op:hover { background: var(--surface-hover); }
  .ld-op__time { font-size: var(--t-sm); color: var(--ink-3); }
  .ld-op__who { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
  /* Гість у рядку — кнопка: відкриває його картку в касі. */
  button.ld-op__who { padding: 2px 0; text-align: left; color: inherit; border-radius: var(--r-xs); }
  button.ld-op__who:hover:not(:disabled) b { color: var(--accent); }
  button.ld-op__who:disabled { cursor: default; }
  .ld-op__sum { font-weight: 660; text-align: right; white-space: nowrap; }
  .ld-op__pts { display: flex; justify-content: flex-end; gap: 8px; font-size: var(--t-sm); white-space: nowrap; }
  .ld-op__act { display: flex; justify-content: flex-end; }
  .ld-op.is-cancelled .ld-op__who b,
  .ld-op.is-cancelled .ld-op__sum,
  .ld-op.is-cancelled .ld-op__pts { color: var(--ink-4); text-decoration: line-through; }

  /* ─────────────────────────── Вікна ─────────────────────────── */

  .ld-cancel { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--r-md); background: var(--bg-sunken); }
  .ld-reasons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }

  .ld-form2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
  .ld-consent { align-items: flex-start; font-size: var(--t-sm); line-height: 1.45; }
  .ld-consent input { margin-top: 2px; }
  .ld-consent .t-xs { display: block; margin-top: 2px; }

  .ld-welcome { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; }
  /* QR завжди на білому — інакше в темній темі його не прочитає камера. */
  .ld-welcome__qr { flex: none; padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); }
  .ld-welcome__qr img { width: 176px; height: 176px; }
  .ld-welcome__text { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 220px; }
  .ld-welcome__bonus {
    display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
    padding: 8px 12px;
    border-radius: var(--r-md);
    background: var(--ok-soft);
    font-size: var(--t-sm); color: var(--ink);
  }
  .ld-welcome__bonus svg { color: var(--ok); }
  .ld-link {
    display: flex; align-items: center; gap: 6px; min-width: 0;
    padding: 4px 4px 4px 10px;
    background: var(--bg-sunken);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
  }
  .ld-link code { flex: 1; min-width: 0; font-family: var(--font-num); font-size: var(--t-xs); color: var(--ink-2); }

  .ld-nominals { display: flex; flex-wrap: wrap; gap: 6px; }
  .ld-cert {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 22px 16px;
    text-align: center;
    border: 2px dashed var(--accent-line);
    border-radius: var(--r-lg);
    background: linear-gradient(135deg, var(--accent-soft), color-mix(in oklab, var(--brand-2) 12%, transparent));
  }
  .ld-cert__label { font-size: var(--t-xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
  .ld-cert__code {
    font-family: var(--font-num); font-size: 2rem; font-weight: 760; letter-spacing: .14em;
    color: var(--ink); overflow-wrap: anywhere; user-select: all;
  }
  .ld-cert__nominal { font-size: var(--t-xl); font-weight: 700; color: var(--accent); }
  .ld-cert__hint { margin-top: 12px; }

  .ld-found {
    display: flex; flex-direction: column; gap: 12px;
    padding: 14px;
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
  }
  .ld-found.is-off { background: var(--bg-sunken); }
  .ld-found__head { display: flex; align-items: flex-start; gap: 12px; }
  .ld-found__icon {
    flex: none; display: grid; place-items: center;
    width: 40px; height: 40px;
    border-radius: var(--r-md);
    background: var(--accent-soft); color: var(--accent);
  }
  .ld-found.is-off .ld-found__icon { background: var(--muted-soft); color: var(--ink-4); }
  .ld-found__title { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.35; }
  .ld-found__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px 14px; margin: 0; }
  .ld-found__facts dt { font-size: var(--t-xs); color: var(--ink-3); }
  .ld-found__facts dd { margin: 0; font-size: var(--t-sm); font-weight: 560; }

  /* ─────────────────────────── Планшет і телефон ─────────────────────────── */

  /* Пальцем: більші цілі для дрібних кнопок і перемикачів. */
  @media (pointer: coarse) {
    .ld-root .btn--sm { height: 38px; padding: 0 12px; }
    .ld-root .btn--sm.btn--icon { width: 38px; padding: 0; }
    .ld-root .chip { height: 36px; padding: 0 13px; }
    .ld-seg .segmented__item { padding: 11px 12px; }
    .ld-coupon { min-height: 60px; }
  }

  @container ld (max-width: 900px) {
    .ld-grid { grid-template-columns: minmax(0, 1fr); }
  }

  @container ld (max-width: 640px) {
    .ld-search { padding: 12px; }
    .ld-search__go { padding: 0 16px; }
    .ld-result { gap: 10px; padding: 8px 10px; }
    .ld-result__seen, .ld-result > .ld-tier { display: none; }
    .ld-result__bal { font-size: var(--t-sm); }
    .ld-member { padding: 14px; }
    .ld-member__head { gap: 12px; }
    .ld-avatar--lg { width: 48px; height: 48px; font-size: var(--t-md); }
    .ld-wallet__value { font-size: 1.875rem; }
    .ld-wallet__rates { width: 100%; }
    .ld-wallet__rates > div { flex: 1; }
    .ld-done { margin: 12px 14px 0; }
    .ld-op {
      grid-template-columns: 44px minmax(0, 1fr) auto;
      padding: 10px 14px;
    }
    .ld-op__pts { grid-column: 2; justify-content: flex-start; }
    .ld-op__act { grid-column: 3; }
  }

  @container ld (max-width: 420px) {
    .ld-search__form { flex-direction: column; }
    /* У стовпчику flex: 1 стискав поле до висоти тексту — повертаємо велику ціль для пальця. */
    .ld-search__box { flex: none; height: 54px; }
    .ld-search__go { height: 46px; }
    .ld-amount { height: 60px; }
    .ld-amount__input { font-size: 1.75rem; }
    .ld-today { gap: 4px 14px; }
  }
}