/* Accessibility improvements layered over the brand design. */
:root { --accessible-focus: #164b72; }
html { scroll-padding-bottom: calc(160px + env(safe-area-inset-bottom)); }
body { overflow-wrap: break-word; }
[hidden] { display: none !important; }
main, .panel, .field, .profile-cols > *, .row > * { min-width: 0; }
:focus-visible, .search input:focus-visible, .search select:focus-visible {
  outline: 3px solid var(--accessible-focus) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 2px #fffdf9;
}
:target, input, select, textarea, button, a { scroll-margin-block: 24px 160px; }
.skip { position: fixed; z-index: 1000; }
.skip:focus { left: 12px; }
main:focus { outline: none; }
.flash[tabindex]:focus { outline: 3px solid var(--accessible-focus); outline-offset: 3px; }
button, .btn, .pill, .langs a, .quick-search button, .favorite-toggle,
.mobile-page-header a, .subnav a, .profile-nav a, .linklike { min-height: 44px; }
.langs a, .quick-search button, .favorite-toggle, .mobile-page-header a { min-width: 44px; }
.top .langs a, .page-home .top .langs a { min-width: 44px; min-height: 44px; font-size: .8125rem; }
.form .field > input, .form .field > select, .form .field > textarea,
.search input, .search select, .quick-search input { font-size: 1rem; max-width: 100%; }
input::placeholder, textarea::placeholder, .quick-search input::placeholder { color: #655d53; opacity: 1; }
.form .field > input, .form .field > select, .form .field > textarea { border-color: #8b7a67; }
.hint, .muted, .near-status, .card-city, .card-tags, .card-foot { color: #59534b; }
.field > span, .hint, .near-status, .card-city, .card-tags, .card-foot,
.beauty-how ol, .welcome-copy p, .welcome-start p { font-size: .875rem; }
.beauty-categories > a { font-size: .8125rem; }
.beauty-bottom-nav > a { font-size: .75rem; }
.beauty-inspiration span { background: #342419ed; padding: 10px 12px; font-size: .875rem; }
.day:has(input:checked) .day-dow, .day:has(input:checked) .day-month { color: #fffdf9; }
.day:has(input:checked), .slot:has(input:checked) { border-width: 2px; }
.day:has(input:focus-visible), .slot:has(input:focus-visible) { outline: 3px solid var(--accessible-focus); outline-offset: 3px; }
.field-error input, .field-error select, .field-error textarea { border: 2px solid #a22926 !important; }
.field-error-message { color: #8f2523; font-size: .875rem; margin: 6px 0 0; }
.subnav, .profile-nav, .pills { padding-block: 6px; }
@media (max-width: 599px) {
  body { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
  .beauty-bottom-nav { padding-inline: 4px; }
  .beauty-bottom-nav > a { overflow-wrap: anywhere; text-align: center; padding: 4px 2px; }
  .sticky-book { bottom: calc(100px + env(safe-area-inset-bottom)); }
  .beauty-categories { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .app-section-title { flex-wrap: wrap; }
  .app-section-title > a { font-size: .875rem; }
  .foot { display: block; }
  .foot-links { flex-wrap: wrap; }
}
@media (max-width: 359px) {
  .brand-logo { max-width: 44vw; }
  .row { flex-wrap: wrap; }
  .row > * { flex-basis: 100%; }
  .beauty-inspiration { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  :focus-visible { outline-color: Highlight !important; box-shadow: none; }
  .btn, .pill, .day, .slot, input, select, textarea { border: 1px solid ButtonText; }
  .day:has(input:checked), .slot:has(input:checked), [aria-current="page"] { outline: 2px solid Highlight; }
  .beauty-inspiration span { background: Canvas; color: CanvasText; }
  .day, .slot { forced-color-adjust: auto; }
}

.foot-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; }
.section p a:not(.btn), .narrow p a:not(.btn), .hint a { text-decoration: underline; text-underline-offset: .18em; }
