/* Compact HUD hints stay above menus and dialogs, without catching input. */
.button-hint{
  position:fixed;inset:auto;margin:0;z-index:10000;display:grid;gap:6px;
  width:max-content;max-width:min(290px,calc(100vw - 24px));
  padding:13px 15px;border:1px solid #80b2ff55;border-radius:8px;
  color:#edf3ff;background:#101a2bf5;
  box-shadow:0 10px 32px #0005,0 0 0 1px #07101e66;
  font-family:inherit;text-align:left;line-height:1.45;
  pointer-events:none!important;user-select:none;overflow-wrap:anywhere;
  contain:layout style;animation:button-hint-in .12s ease-out both;
}
.button-hint[hidden]{display:none!important}
.button-hint::before{content:'';position:absolute;top:-1px;left:14px;width:34px;height:2px;background:var(--lightblue,#80b2ff);border-radius:1px}
.button-hint__eyebrow{display:flex;align-items:center;gap:6px;font-size:8px;font-weight:750;letter-spacing:1.6px;color:var(--lightblue,#80b2ff)}
.button-hint__eyebrow::before{content:'';width:4px;height:4px;background:currentColor;transform:rotate(45deg)}
.button-hint__title{font-size:12px;font-weight:700;line-height:1.35;letter-spacing:0}
.button-hint__copy{font-size:11px;color:#afbdd2;line-height:1.55}
.button-hint__state{font-size:10px;line-height:1.45;color:#efd4a2;border-top:1px solid #b9ccec1c;margin-top:2px;padding-top:7px}
.button-hint__state[hidden]{display:none}
:root[data-theme="light"] .button-hint{color:#15243c;background:#f9fcfffa;border-color:#547bb66b;box-shadow:0 10px 30px #1b386322,0 0 0 1px #ffffffa8}
:root[data-theme="light"] .button-hint__copy{color:#536680}
:root[data-theme="light"] .button-hint__state{color:#81551b;border-color:#486b9c26}
@supports(backdrop-filter:blur(12px)){
  :root:not([data-effects="off"]) .button-hint{background:#101a2be8;backdrop-filter:blur(12px)}
  :root[data-theme="light"]:not([data-effects="off"]) .button-hint{background:#f9fcfff0}
}
@keyframes button-hint-in{from{opacity:0}to{opacity:1}}
:root[data-effects="off"] .button-hint{animation:none;backdrop-filter:none;-webkit-backdrop-filter:none}
@media(prefers-reduced-motion:reduce){.button-hint{animation:none;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(pointer:coarse){.button-hint{max-width:min(280px,calc(100vw - 24px));padding:12px 14px;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}