/* Load last: a single drawn icon must win over later scene typography. */
:is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
    .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
    .bh-public-close, .toast.council-notice .council-notice-close,
    .boss-toast .boss-toast-close) {
  box-sizing: border-box;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 0;
  border: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  border-radius: 11px;
  font-size: 0 !important;
  line-height: 1;
  text-indent: 0;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .16s, border-color .16s;
}
:is(.bh-public-close, .toast.council-notice .council-notice-close,
    .boss-toast .boss-toast-close) { position: relative; }
:is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
    .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
    .bh-public-close, .toast.council-notice .council-notice-close,
    .boss-toast .boss-toast-close)::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
  background: currentColor;
  pointer-events: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Brotherhood already carries an SVG: leave its accessible label, draw once. */
.bh-public-close > svg { display: none; }
.boss-toast { grid-template-columns: 65px minmax(0, 1fr) 36px; }
.caravan-event .caravan-close {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
:is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
    .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
    .bh-public-close, .toast.council-notice .council-notice-close,
    .boss-toast .boss-toast-close):focus-visible {
  outline: 3px solid var(--accent-bright, #74b3ff);
  outline-offset: 3px;
}
@media (hover: hover) {
  :is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
      .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
      .bh-public-close, .toast.council-notice .council-notice-close,
      .boss-toast .boss-toast-close):hover {
    background-color: color-mix(in srgb, currentColor 10%, transparent);
    border-color: currentColor;
  }
}
@media (max-width: 600px), (pointer: coarse) {
  :is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
      .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
      .bh-public-close, .toast.council-notice .council-notice-close,
      .boss-toast .boss-toast-close) {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }
  .council-notice-head { grid-template-columns: 56px minmax(0, 1fr) 44px; }
  .boss-toast { grid-template-columns: 38px minmax(0, 1fr) 44px; }
}
:is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
    .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
    .bh-public-close, .toast.council-notice .council-notice-close,
    .boss-toast .boss-toast-close)[hidden],
.class-boss :is(progress, .boss-numbers, details)[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  :is(.chest-detail-close, .profile-modal-close, .student-close, .secret-close,
      .caravan-close, .desktop-hint .close-hint, .infernal-close, .universe-close,
      .bh-public-close, .toast.council-notice .council-notice-close,
      .boss-toast .boss-toast-close) { transition: none; }
}
