/* wave-ux 2026-10-24: mobile UX / a11y fixes for MSK · EKB · SPb (audit F16–F19 + P2).
   Plain CSS, safe to load twice. Desktop (>1024px) changes only: [hidden], contrast, reduced motion. */

/* F16 — calculator: tracks/fields/select may shrink instead of overflowing the card */
section.calc .calc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:600px){section.calc .calc-grid{grid-template-columns:minmax(0,1fr)}}
section.calc .calc-field{min-width:0}
section.calc .calc-field select{width:100%;max-width:100%;min-width:0}
section.calc .calc-out-row>span{min-width:0;overflow-wrap:anywhere}
section.calc .calc-out-row>strong,section.calc .calc-out-total>strong{white-space:nowrap}

/* P2 — component display rules must not defeat the hidden attribute */
#calc-proc-row[hidden],.site-search-clear[hidden],.site-search-results[hidden],.site-search-filters[hidden],.toc-fab[hidden]{display:none!important}

/* Contrast ≥4.5:1 for small informational text (muted token alone is 2.9–4.1:1) */
.site-header .header-phone-pill .phone-pill-note,#main .breadcrumbs,#main .article-byline-meta,#main .article-byline-label,#main .article-byline-readtime{color:var(--color-text-secondary);color:color-mix(in srgb,var(--color-muted) 30%,var(--color-text-secondary))}

/* F19 — reviewer avatar: the link is the flex item, keep it square */
#main .article-byline-photo-link{flex:0 0 44px;width:44px;height:44px}
#main .article-byline-photo{width:100%;height:100%}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.sticky-call-wrap{transition:none!important}}

/* F18 — search lives inside the open mobile menu (moved there by wave-ux.js) */
.mobile-nav [data-site-search]{display:block!important;position:relative;max-width:none;margin:var(--spacing-2,.5rem) 0 var(--spacing-3,.75rem)}
.mobile-nav .site-search-input{display:block!important;width:100%;max-width:none;font-size:16px}
.mobile-nav .site-search-results:not([hidden]){display:block!important;left:0;right:0;width:auto;min-width:0;max-width:none;max-height:60vh}
.mobile-nav .site-search-input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
/* results are injected via innerHTML, so the component's scoped styles never reach them */
.mobile-nav .site-search-result{display:block;padding:10px 12px;border-bottom:1px solid var(--color-border-subtle);color:var(--color-text);text-decoration:none;line-height:1.4}
.mobile-nav .site-search-result-type{display:block;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-accent)}
.mobile-nav .site-search-result-title{display:block;font-weight:600}
.mobile-nav .site-search-result-summary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.8125rem;color:var(--color-text-secondary)}

/* F17 — floating phone: safe area, reserved space, shown only when no other call link is on screen */
@media(max-width:768px){
  .sticky-call-wrap{bottom:calc(var(--spacing-4,1rem) + env(safe-area-inset-bottom,0px))}
  .toc-fab.toc-fab{bottom:calc(var(--spacing-6,1.5rem) + 56px + env(safe-area-inset-bottom,0px))}
  html{scroll-padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}
  .site-footer .footer-bottom{padding-bottom:calc(var(--spacing-8,2rem) + 72px + env(safe-area-inset-bottom,0px))}
  html.wave-ux .sticky-call-wrap:not(.wave-show){transform:translate(-50%) translateY(140%);opacity:0;visibility:hidden;pointer-events:none}
  /* no flash before the deferred script runs; if it never runs, the pill appears after 2.5s as before */
  html:not(.wave-ux) .sticky-call-wrap{animation:wave-ux-late 0s 2.5s both}
}
@keyframes wave-ux-late{from{visibility:hidden;opacity:0}}

/* F19 — compact article first screen so the answer starts sooner */
@media(max-width:480px){
  #main .content-article{padding-top:var(--spacing-4,1rem)}
  #main .breadcrumbs{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;gap:6px;margin-bottom:var(--spacing-3,.75rem);font-size:.8125rem}
  #main .breadcrumbs>*{flex:none}
  #main .breadcrumbs>[aria-current]{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
  #main .article-badges{gap:4px;margin-bottom:var(--spacing-2,.5rem)}
  #main .article-badges .badge{padding:1px 8px;font-size:.6875rem;letter-spacing:.02em}
  #main .content-article:has(.trust-strip) .badge-trust{display:none}
  #main .article-head{margin-bottom:var(--spacing-4,1rem)}
  #main .article-byline{margin:var(--spacing-3,.75rem) 0 var(--spacing-2,.5rem);padding:8px 10px;font-size:.875rem}
  /* compact but never truncated: the strip may carry the "не заменяет осмотр" safety note */
  #main .trust-strip{gap:8px;margin:0 0 var(--spacing-4,1rem);padding:8px 12px;font-size:.8125rem;line-height:1.4}
}