.clarity-choice {
  position: fixed;
  z-index: 10000;
  left: max(12px, env(safe-area-inset-left));
  bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
  width: min(264px, calc(100% - 24px));
  color: #f3e6cc;
  font: 400 13px/1.45 "Libre Caslon Text", Georgia, serif;
  text-align: left;
  pointer-events: none;
}
.clarity-choice-in-rooms { bottom: calc(env(safe-area-inset-bottom, 0px) + 58px); }
.clarity-options, .clarity-choice button {
  color: inherit;
  background: #24191b;
  border: 1px solid #a78c63;
  border-radius: 4px;
  pointer-events: auto;
}
.clarity-options {
  padding: 10px 12px;
  box-shadow: 0 4px 14px #0b0a1080;
}
.clarity-options p { margin: 0 0 7px; }
.clarity-options .clarity-heading {
  margin-bottom: 4px;
  font: italic 400 17px/1.25 "Bodoni Moda", Georgia, serif;
}
.clarity-options a { color: #efd7a9; text-decoration: underline; text-underline-offset: 2px; }
.clarity-choice button {
  padding: 4px 8px;
  min-height: 32px;
  font: inherit;
  cursor: pointer;
}
.clarity-choice .clarity-settings { font-size: 11px; border-color: #8c715b; }
.clarity-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.clarity-actions button { flex: 1 0 auto; }
.clarity-choice button:focus-visible, .clarity-choice a:focus-visible {
  outline: 2px solid #f2cb87;
  outline-offset: 2px;
}
.clarity-choice [hidden], .clarity-status:empty { display: none; }
.clarity-options .clarity-status:not(:empty) { margin: 6px 0 0; }