/* Shared BRI & MI controls. Import this file for future game screens. */
:root {
  --ui-gold: #d3ab64;
  --ui-gold-light: #ffe4a5;
  --ui-navy: #182f45;
  --ui-ink: #091521;
  --ui-text: #fff0d1;
  --ui-radius: 9px;
  --ui-font: system-ui, -apple-system, "Segoe UI", sans-serif;
}
.game-button {
  --button-top: #253f57;
  --button-bottom: #112335;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 44px;
  padding: 10px 22px;
  border: 1px solid var(--ui-gold);
  border-radius: var(--ui-radius);
  background: linear-gradient(var(--button-top), var(--button-bottom));
  color: var(--ui-text);
  box-shadow: inset 0 0 0 3px #080f194d, inset 0 1px 0 #ffffff20, 0 3px 0 #070d16, 0 6px 14px #0005;
  font: 800 14px/1.2 var(--ui-font);
  text-decoration: none;
  cursor: pointer;
  transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}
.game-button:hover { filter: brightness(1.15); }
.game-button:active { transform: translateY(2px); box-shadow: inset 0 0 0 3px #080f194d, 0 1px 0 #070d16; }
.game-button:focus-visible { outline: 3px solid #ffe4a5; outline-offset: 4px; }
.game-button--primary { --button-top: #31435b; --button-bottom: #201e36; border-color: var(--ui-gold-light); color: #ffe6a5; }
.game-button--large { min-height: 58px; padding: 14px 38px; font-size: 21px; letter-spacing: .12em; }
.game-button--large::before, .game-button--large::after { content: ""; position: absolute; width: 5px; height: 5px; background: var(--ui-gold-light); transform: rotate(45deg); top: calc(50% - 2px); }
.game-button--large::before { left: 12px; }
.game-button--large::after { right: 12px; }
.game-button--ornate {
  --ui-accent: #ffb94e;
  --ui-aura: #eb951e40;
  --button-top: #252a49;
  --button-bottom: #0b1127;
  min-height: 56px;
  padding: 12px 32px;
  border: 2px solid #e3b663;
  border-top-color: var(--ui-accent);
  border-bottom-color: var(--ui-accent);
  border-radius: 10px;
  color: #ffe4a1;
  box-shadow: inset 0 0 0 2px #080c1a,inset 0 0 0 3px #d4a25870,inset 0 4px 0 #ffffff10,0 3px 0 #1b0d09,0 0 17px var(--ui-aura);
  font: 800 21px/1.15 Georgia,serif;
  text-transform: uppercase;
  letter-spacing: .015em;
  text-shadow: 0 2px 2px #000;
}
.game-button--amber { --ui-accent: #ffb743; --ui-aura: #e78a1a45; }
.game-button--violet { --ui-accent: #c578ff; --ui-aura: #9e38e545; }
.game-button--ornate::before,.game-button--ornate::after {
  content: "";
  position: absolute;
  top: calc(50% - 9px);
  width: 17px;
  height: 17px;
  transform: rotate(45deg);
  border: 2px solid #7a461a;
  border-radius: 3px;
  background: linear-gradient(135deg,#fff0b5,#c28731 45%,#f5ce75 55%,#9e5c16);
  box-shadow: inset 0 0 0 2px #ffe4a280,0 0 0 2px #1c100b,0 0 10px var(--ui-aura);
}
.game-button--ornate::before { left: -9px; }
.game-button--ornate::after { right: -9px; }
.game-button--ornate:active { box-shadow: inset 0 0 0 2px #080c1a,inset 0 0 0 3px #d4a25870,0 1px 0 #1b0d09; }
@media (prefers-reduced-motion: reduce) { .game-button { transition: none; } }