/* Shared interaction treatment, loaded after the page's visual system.
 * Keep existing component offsets and border/error states. Only focus feedback
 * is unified; blue artwork, selection and information surfaces keep their color. */
:root { --site-focus-ink: #746B60; }
:is(.profile-theme-simple .profile-cove, .profile-theme-simple .profile-treasure-strip,
    .chat-image-viewer, .event-photo-viewer) { --site-focus-ink: #FFF9EF; }
:where(button, a, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--site-focus-ink);
  outline-offset: 3px;
}
:focus-visible {
  outline-color: var(--site-focus-ink) !important;
  outline-width: 2px !important;
}
:where(button, a, input, textarea, select, summary, label, [tabindex]) {
  -webkit-tap-highlight-color: transparent;
}
/* Some controls draw the focus cue on a wrapper around a hidden input. */
:is(.auth-phone-number, .auth-phone-code-row, .avatar-upload, .student-file-control,
    .photo-setup-upload, .ambassador-language-control):focus-within,
.chat-compose-surface:has(textarea:focus-visible),
.photo-setup-panel:has(#photo-setup-file:focus-visible) .photo-print {
  outline-color: var(--site-focus-ink) !important;
  outline-width: 2px !important;
}
html[data-focus-input="pointer"] :focus,
html[data-focus-input="pointer"] :is(.auth-phone-number, .auth-phone-code-row,
    .avatar-upload, .student-file-control, .photo-setup-upload,
    .ambassador-language-control, .chat-compose-surface):focus-within,
html[data-focus-input="pointer"] .photo-setup-panel:focus-within .photo-print {
  outline: none !important;
}
/* Remove focus-only blue borders and ring shadows at their actual surfaces. */
.crab-h5 :is(.auth-phone-number, .auth-phone-code-row):focus-within:not(:has([aria-invalid="true"])) {
  border-color: #A79E91;
}
.crab-h5 .compose-writing:focus-within {
  border-color: var(--ink);
  box-shadow: 3px 4px 0 var(--ink);
}
.crab-h5 .scene-lookout .search-box:focus-within { box-shadow: 2px 3px 0 var(--ink); }
.crab-h5 .post-compose-row textarea:focus:not([aria-invalid="true"]),
.note-field :is(input, textarea, select):focus:not([aria-invalid="true"]),
.search-input:focus:not([aria-invalid="true"]) { border-color: #A79E91; }
.search-input:focus { box-shadow: none; }
html[data-focus-input="keyboard"] .crab-h5 :is(.compose-writing, .scene-lookout .search-box):focus-within {
  outline: 2px solid var(--site-focus-ink);
  outline-offset: 3px;
}
@media (min-width: 960px) {
  .crab-h5 .crab-compose .compose-writing:focus-within { border-color: #201C2238; box-shadow: none; }
}
@media (forced-colors: active) {
  html[data-focus-input="keyboard"] :focus-visible { outline-color: Highlight !important; }
}