/**
 * Kraybazaar (a69) — global mobile / touch fixes (complements kb-bay + kb-suite).
 */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body.a69-body {
  overflow-x: clip;
}

body.a69-body.has-cv-bay .a69-main {
  scroll-padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px));
}

body.a69-body .a69-main {
  overflow-x: clip;
  min-width: 0;
}

@media (max-width: 760px) {
  body.a69-body .cv-bay-open {
    min-height: 44px;
    min-width: 8.5rem;
    padding: 0.65rem 1.35rem;
    font-size: 0.8125rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    color: #140600 !important;
    -webkit-text-fill-color: #140600 !important;
  }

  body.a69-body .cv-fader {
    min-height: 44px;
  }

  body.a69-body .kb-terminus-field {
    grid-template-columns: 1fr !important;
    gap: 0.65rem;
  }

  body.a69-body .kb-terminus-field input {
    width: 100%;
    min-width: 0;
  }

  body.a69-body .kb-terminus-field button {
    width: 100%;
    min-height: 44px;
  }

  body.a69-body .kb-terminus-legal-meta {
    flex-wrap: wrap;
    gap: 0.35rem 0.65rem;
    justify-content: center;
    text-align: center;
  }

  body.a69-body [class*="-topbar"],
  body.a69-body [class*="-mast"],
  body.a69-body [class*="-header"] {
    flex-wrap: wrap;
    gap: 0.65rem;
  }

  body.a69-body [class*="-nav"] {
    flex-wrap: wrap;
    max-width: 100%;
  }

  body.a69-body table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.a69-body img,
  body.a69-body video,
  body.a69-body iframe {
    max-width: 100%;
    height: auto;
  }

  /* Home hero packet — fill the media well (override global img height:auto) */
  body.cv-desk.a69-body .cv-hero-frame {
    min-height: min(46vh, 22rem);
  }
  body.cv-desk.a69-body .cv-hero-media img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  body.a69-body pre,
  body.a69-body code {
    max-width: 100%;
    overflow-x: auto;
    word-break: break-word;
  }

  body.a69-body.page-shop .bt-studio,
  body.a69-body.page-shop .bt-spread,
  body.a69-body.page-shop .bt-hand,
  body.a69-body.page-shop .bt-vellum {
    min-width: 0;
    max-width: 100%;
  }

  body.a69-body.page-shop .bt-loupe {
    width: 100%;
    max-width: 100%;
  }

  /* ——— Action buttons & link-buttons: readable labels on narrow screens ——— */
  body.a69-body .a69-main :where(
    button:not(.cv-fader):not(.mx-mode-btn):not(.mx-tab):not(.mx-notch):not(.nv-notch):not(.ox-hex):not(.kb-terminus-rise),
    input[type="submit"],
    input[type="button"],
    a.pagination-btn,
    a.cv-charge,
    a.cv-line,
    a.cv-ghost,
    a.sk-pay,
    a.sk-amend,
    a.sk-floor,
    a.al-go,
    a.ox-btn,
    a.qt-btn,
    a.rs-btn,
    a.tr-btn,
    a.nv-btn,
    a[class*="btn"],
    a[class*="-charge"],
    a[class*="-pay"],
    a[class*="-go"],
    a[class*="-buy"],
    .cv-seek button,
    .bt-loupe button,
    .kb-terminus-field button
  ) {
    box-sizing: border-box;
    min-height: 44px;
    padding-inline: 1rem;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-align: center !important;
    hyphens: manual !important;
    -webkit-text-fill-color: currentColor !important;
  }

  body.a69-body .a69-main :where(
    button[type="submit"]:not(.mx-mode-btn):not(.mx-tab):not(.mx-btn-ghost),
    input[type="submit"],
    a.cv-charge,
    a.sk-pay,
    a.al-go,
    a[class*="-charge"],
    a[class*="-pay"],
    a[class*="-go"],
    a[class*="-buy"],
    a.ox-btn-copper,
    a.qt-btn-signal,
    a.rs-btn-clay,
    a.tr-btn-ink,
    a.nv-btn-berry,
    button.ox-btn-copper,
    button.nv-btn-berry,
    button.mx-btn-cobalt,
    button.mx-btn-apricot,
    button.mx-btn:not(.mx-btn-ghost):not(.mx-mode-btn):not(.mx-tab),
    .bt-loupe button,
    .cv-seek button,
    .kb-terminus-field button,
    a[class*="btn-"]:not([class*="ghost"]):not(.mx-mode-btn):not(.mx-tab)
  ) {
    color: #140600 !important;
    -webkit-text-fill-color: #140600 !important;
  }

  body.a69-body .a69-main :where(
    button[type="submit"],
    input[type="submit"],
    a.cv-charge,
    a.sk-pay,
    a.al-go,
    a.ox-btn-copper,
    a.qt-btn-signal,
    a.rs-btn-clay,
    a.tr-btn-ink,
    a.nv-btn-berry,
    button.ox-btn-copper,
    button.nv-btn-berry,
    button.mx-btn-cobalt,
    button.mx-btn-apricot,
    .bt-loupe button,
    .cv-seek button,
    .kb-terminus-field button,
    a[class*="-charge"],
    a[class*="-pay"],
    a[class*="-go"],
    a[class*="-buy"],
    a[class*="btn-"]:not([class*="ghost"]):not(.mx-mode-btn):not(.mx-tab)
  ) :is(span, strong, small, em, i, b) {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
  }

  body.a69-body .a69-main :where(
    a.cv-line,
    a.cv-ghost,
    a.ox-btn-ghost,
    a.qt-btn-ghost,
    a.rs-btn-ghost,
    a.tr-btn-ghost,
    a.sk-amend,
    a.sk-floor,
    button.mx-btn-ghost,
    a[class*="btn-ghost"],
    a[class*="btn-line"],
    a.pagination-btn:not(.is-disabled)
  ) {
    color: var(--cv-chalk, #f3f0e7) !important;
    -webkit-text-fill-color: currentColor !important;
  }

  /* kb-suite sets all links to acid on hover — keep filled CTAs legible */
  body.a69-body .a69-main a:where(
    .cv-charge,
    .sk-pay,
    .al-go,
    .ox-btn-copper,
    .qt-btn-signal,
    .rs-btn-clay,
    .tr-btn-ink,
    .nv-btn-berry,
    [class*="-charge"],
    [class*="-pay"],
    [class*="-go"],
    [class*="-buy"]
  ):is(:hover, :focus-visible),
  body.a69-body .a69-main a[class*="btn-"]:not([class*="ghost"]):not(.mx-mode-btn):not(.mx-tab):is(:hover, :focus-visible),
  body.a69-body .a69-main button:where(.mx-btn-cobalt, .mx-btn-apricot, .ox-btn-copper, .nv-btn-berry):is(:hover, :focus-visible),
  body.a69-body .a69-main .cv-seek button:is(:hover, :focus-visible),
  body.a69-body .a69-main .bt-loupe button:is(:hover, :focus-visible),
  body.a69-body .kb-terminus-field button:is(:hover, :focus-visible) {
    color: #140600 !important;
    -webkit-text-fill-color: #140600 !important;
  }

  body.a69-body .a69-main .sk-counter button,
  body.a69-body .a69-main .nv-qty-win button,
  body.a69-body .a69-main [class*="counter"] button,
  body.a69-body .a69-main [class*="qty"] button {
    min-height: 44px;
    min-width: 44px;
    padding-inline: 0.5rem;
    font-size: 1.125rem !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  body.a69-body .ox-ledger-row,
  body.a69-body .qt-next,
  body.a69-body .tr-cta,
  body.a69-body .dn-actions,
  body.a69-body .sk-paths {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
  }

  body.a69-body .ox-ledger-row .ox-btn,
  body.a69-body .qt-next .qt-btn,
  body.a69-body .tr-cta .tr-btn,
  body.a69-body .dn-actions button,
  body.a69-body .dn-actions a,
  body.a69-body .sk-paths .sk-amend,
  body.a69-body .sk-paths .sk-floor,
  body.a69-body .sk-paths .sk-pay {
    width: 100%;
  }

  body.a69-body .dn-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    width: 100%;
    padding: 0.65rem 1rem;
    border: 1px solid var(--cv-line, rgba(243, 240, 231, 0.12));
    border-radius: 0.35rem;
    color: var(--cv-chalk, #f3f0e7) !important;
    -webkit-text-fill-color: currentColor !important;
    text-decoration: none !important;
  }

  body.a69-body .dn-actions button[type="submit"] {
    width: 100%;
  }

  body.al-almanac .al-legend button {
    flex: 1 1 auto;
    min-width: calc(50% - 0.35rem);
  }
  body.al-almanac .al-legend button.is-on {
    color: #140600 !important;
    -webkit-text-fill-color: #140600 !important;
    background: var(--cv-cadmium, #ff3b00) !important;
    border-color: var(--cv-cadmium, #ff3b00) !important;
  }
  body.al-almanac .al-legend button:not(.is-on) {
    color: var(--cv-chalk, #f3f0e7) !important;
    -webkit-text-fill-color: currentColor !important;
    background: #0c0c10 !important;
  }
}

@media (max-width: 380px) {
  body.a69-body .cv-bay {
    width: min(20rem, calc(100vw - 0.75rem));
  }
}

/* Home desk (index) — restore accents after suite chalk / CTA locks */
body.cv-desk.a69-body .a69-main .cv-kicker {
  color: var(--cv-acid, #d6ff3c) !important;
}
body.cv-desk.a69-body .a69-main .cv-hero-chip small {
  color: var(--cv-acid, #d6ff3c) !important;
}
body.cv-desk.a69-body .a69-main .cv-hero-chip em {
  color: var(--cv-cadmium, #ff3b00) !important;
}
body.cv-desk.a69-body .a69-main .cv-seek > span {
  color: var(--cv-cadmium, #ff3b00) !important;
}
body.cv-desk.a69-body .a69-main .cv-dial-copy span {
  color: var(--cv-dim, #9a968a) !important;
}
body.cv-desk.a69-body .a69-main .cv-blade-copy small {
  color: var(--cv-dim, #9a968a) !important;
}
body.cv-desk.a69-body .a69-main .cv-blade em {
  color: var(--cv-cadmium, #ff3b00) !important;
}
body.cv-desk.a69-body .a69-main a.cv-ghost {
  color: var(--cv-acid, #d6ff3c) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cv-acid, #d6ff3c) !important;
}
body.cv-desk.a69-body .a69-main .cv-node em {
  color: var(--cv-acid, #d6ff3c) !important;
}
body.cv-desk.a69-body .a69-main p.cv-lede {
  color: var(--cv-dim, #9a968a) !important;
}
body.cv-desk.a69-body .a69-main .cv-notes p {
  color: var(--cv-dim, #9a968a) !important;
}
body.cv-desk.a69-body .a69-main .cv-cta {
  background: transparent !important;
  border: none !important;
  color: inherit !important;
}
body.cv-desk.a69-body .a69-main a.cv-line {
  border: 0 !important;
  border-bottom: 1px solid var(--cv-chalk, #f3f0e7) !important;
  background: transparent !important;
  border-radius: 0 !important;
  min-height: 3rem;
  padding: 0.55rem 0.15rem !important;
}
body.cv-desk.a69-body .a69-main a.cv-line:hover {
  color: var(--cv-acid, #d6ff3c) !important;
  border-bottom-color: var(--cv-acid, #d6ff3c) !important;
  background: transparent !important;
}
body.cv-desk.a69-body .a69-main a.cv-charge:hover {
  color: #101004 !important;
}

body.cv-desk.a69-body .cv-stage {
  width: min(1160px, calc(100% - max(1.1rem, env(safe-area-inset-left)) - max(1.1rem, env(safe-area-inset-right))));
  margin-inline: auto;
  padding-inline: 0;
}

@media (max-width: 760px) {
  body.cv-desk.a69-body .cv-hero-copy h1 {
    overflow-wrap: anywhere;
  }
  body.cv-desk.a69-body .cv-cta {
    flex-direction: column;
    align-items: stretch;
  }
  body.cv-desk.a69-body .a69-main a.cv-charge,
  body.cv-desk.a69-body .a69-main a.cv-line {
    justify-content: center;
    width: 100%;
  }
}
