/* Hannibal Odyssey — composants Fusion.
   Consommer les jetons de tokens.css. Aucune couleur en dur hors
   rehauts de métal (blanc à très faible opacité) et du monogramme.
   Préfixe go-. Les états se posent avec is-selected, is-correct,
   is-wrong, is-used. data-world sur un ancêtre change l'accent. */

.go-scene,
.go-scene *,
.go-modal,
.go-modal *,
.go-panel,
.go-panel * {
  box-sizing: border-box;
}

.go-btn,
.go-iconbtn,
.go-back,
.go-answer,
.go-joker,
.go-currency {
  font-family: var(--go-font-body);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.go-btn:focus-visible,
.go-iconbtn:focus-visible,
.go-back:focus-visible,
.go-answer:focus-visible,
.go-joker:focus-visible,
.go-currency:focus-visible,
.gd-chip:focus-visible {
  outline: 2px solid var(--go-gold-light);
  outline-offset: 3px;
}

.go-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.go-title {
  font-family: var(--go-font-display);
  font-weight: 500;
  letter-spacing: var(--go-tracking-title);
  line-height: var(--go-leading-tight);
  color: var(--go-gold-light);
  margin: 0;
}

.go-body {
  font-family: var(--go-font-body);
  font-weight: 500;
  font-size: var(--go-text-md);
  line-height: var(--go-leading-body);
  color: var(--go-text-soft);
  margin: 0;
}

.go-num,
.go-currency {
  font-variant-numeric: var(--go-nums);
  font-feature-settings: "lnum" 1, "tnum" 1;
}

.go-num {
  font-family: var(--go-font-body);
  font-weight: 700;
}

/* ---------- scène ---------- */
.go-scene {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: var(--go-space-3);
  min-height: calc(100dvh - 78px);
  padding: var(--go-space-3) var(--go-space-3) calc(var(--go-space-4) + env(safe-area-inset-bottom));
  color: var(--go-text);
  font-family: var(--go-font-body);
  font-weight: 500;
  background: var(--go-ink-2);
}

.go-scene__art,
.go-scene__hero,
.go-scene__shade,
.go-scene__petals {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.go-scene__art {
  z-index: var(--go-z-base);
  background:
    var(--go-scene-bg) center top / cover no-repeat,
    var(--go-bg);
}

.go-scene__hero {
  z-index: var(--go-z-decor);
  background: var(--go-scene-hero) center 34% / auto 118% no-repeat;
  filter: drop-shadow(0 22px 28px rgba(0, 0, 0, .45));
}

.go-scene__shade {
  z-index: var(--go-z-decor);
  background:
    linear-gradient(180deg, rgba(8, 9, 15, .62) 0%, rgba(8, 9, 15, .18) 14%, rgba(8, 9, 15, .08) 46%, rgba(8, 9, 15, .22) 72%, rgba(8, 9, 15, .62) 100%),
    radial-gradient(ellipse at 50% 46%, transparent 36%, rgba(8, 9, 15, .28) 100%);
}

.go-scene__petals { z-index: var(--go-z-decor); overflow: hidden; }

.go-scene__petals i {
  position: absolute;
  width: 5px;
  height: 3.5px;
  border-radius: 70% 30% 70% 40%;
  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .95), rgba(244, 176, 190, .45) 58%, transparent 74%);
  filter: blur(.45px);
  opacity: .0;
  animation: go-petal 12s ease-in-out infinite;
}

.go-scene__petals i:nth-child(3n) {
  width: 2.5px;
  height: 2.5px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 248, 220, .95), rgba(242, 207, 122, .15) 62%, transparent 74%);
  filter: blur(.9px);
}

.go-scene__petals i:nth-child(1) { left: 8%; top: 18%; animation-duration: 11s; }
.go-scene__petals i:nth-child(2) { left: 22%; top: 8%; animation-duration: 14s; animation-delay: -3s; }
.go-scene__petals i:nth-child(3) { left: 70%; top: 12%; animation-duration: 13s; animation-delay: -6s; }
.go-scene__petals i:nth-child(4) { left: 86%; top: 22%; animation-duration: 10s; animation-delay: -2s; }
.go-scene__petals i:nth-child(5) { left: 14%; top: 48%; animation-duration: 15s; animation-delay: -8s; }
.go-scene__petals i:nth-child(6) { left: 78%; top: 56%; animation-duration: 12s; animation-delay: -4s; }
.go-scene__petals i:nth-child(7) { left: 40%; top: 62%; animation-duration: 16s; animation-delay: -9s; }
.go-scene__petals i:nth-child(8) { left: 58%; top: 34%; animation-duration: 13s; animation-delay: -1s; }
.go-scene__petals i:nth-child(9) { left: 6%; top: 72%; animation-duration: 14s; animation-delay: -5s; }
.go-scene__petals i:nth-child(10) { left: 90%; top: 68%; animation-duration: 11s; animation-delay: -7s; }
.go-scene__petals i:nth-child(11) { left: 33%; top: 26%; animation-duration: 15s; animation-delay: -11s; }
.go-scene__petals i:nth-child(12) { left: 64%; top: 78%; animation-duration: 12s; animation-delay: -3.5s; }

@keyframes go-petal {
  0% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: 0; }
  14% { opacity: .72; }
  100% { transform: translate3d(-14px, 64px, 0) rotate(48deg); opacity: 0; }
}

.go-hud,
.go-banner,
.go-board,
.go-jokers {
  position: relative;
  z-index: var(--go-z-content);
}

.go-scene--mini {
  min-height: 0;
  height: auto;
  padding: var(--go-space-3);
  gap: var(--go-space-2);
  border-radius: var(--go-radius-xl);
  border: 1px solid var(--go-glass-line);
  box-shadow: var(--go-shadow-md);
}

/* ---------- HUD ---------- */
.go-hud {
  display: flex;
  align-items: center;
  gap: var(--go-space-2);
  z-index: var(--go-z-hud);
}

.go-back,
.go-iconbtn {
  width: var(--go-tap);
  height: var(--go-tap);
  flex: none;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: var(--go-radius-pill);
  color: var(--go-gold);
  background:
    radial-gradient(circle at 50% 28%, rgba(255, 255, 255, .1), transparent 58%),
    linear-gradient(180deg, rgba(26, 30, 52, .94), rgba(8, 10, 18, .94));
  border: 1px solid rgba(242, 207, 122, .72);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 212, .28),
    inset 0 -2px 4px rgba(0, 0, 0, .4),
    var(--go-shadow-xs),
    0 0 12px rgba(242, 207, 122, .22);
}

.go-back:active,
.go-iconbtn:active,
.go-btn:active,
.go-answer:active,
.go-joker:active,
.go-currency:active {
  transform: translateY(1px) scale(.97);
}

.go-currency {
  margin-inline: auto;
  display: inline-flex;
  align-items: center;
  gap: var(--go-space-2);
  min-height: 40px;
  padding: var(--go-space-1) var(--go-space-4) var(--go-space-1) var(--go-space-1);
  border-radius: var(--go-radius-pill);
  color: var(--go-text);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .06), transparent 46%),
    linear-gradient(180deg, rgba(24, 28, 50, .9), rgba(8, 10, 20, .92));
  border: 1px solid rgba(242, 207, 122, .75);
  box-shadow:
    var(--go-shadow-inset),
    0 0 0 1px rgba(0, 0, 0, .4),
    var(--go-glow-gold);
  font-weight: 700;
  font-size: var(--go-text-lg);
}

.go-coin {
  width: 28px;
  height: 28px;
  flex: none;
  border-radius: var(--go-radius-pill);
  background:
    radial-gradient(circle at 35% 30%, #FFF8E6 0%, #F2CF7A 36%, #C4923E 68%, #6E4816 100%);
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, .85),
    inset 0 -2px 3px rgba(62, 40, 12, .45),
    0 0 0 1px #5C3A10,
    0 1px 2px rgba(0, 0, 0, .45);
  position: relative;
}

.go-coin::before,
.go-coin::after {
  content: "";
  position: absolute;
  border-radius: inherit;
}

.go-coin::before {
  inset: 4px;
  border: 1px solid rgba(62, 40, 12, .45);
  box-shadow: inset 0 0 0 1px rgba(255, 246, 212, .35);
}

.go-coin::after {
  width: 6px;
  height: 6px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: linear-gradient(135deg, #FFF6D4, #8C5A1C);
  box-shadow: 0 0 4px rgba(62, 40, 12, .4);
}

/* ---------- bannière de monde ---------- */
.go-banner {
  display: flex;
  align-items: center;
  width: 100%;
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .4));
}

.go-banner__plate {
  flex: 1;
  min-height: 48px;
  display: grid;
  place-items: center;
  padding: var(--go-space-2) var(--go-space-8);
  border-radius: var(--go-radius-xs);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .22), transparent 42%),
    linear-gradient(180deg, var(--go-banner-top) 0%, var(--go-banner-bottom) 100%);
  box-shadow:
    inset 0 0 0 1.5px rgba(255, 246, 212, .9),
    inset 0 0 0 4px rgba(40, 16, 8, .4),
    inset 0 1px 0 rgba(255, 255, 255, .35),
    var(--go-glow-accent);
}

.go-banner__title {
  font-family: var(--go-font-display);
  font-weight: 500;
  font-size: clamp(16px, 4.6vw, 22px);
  letter-spacing: var(--go-tracking-wide);
  line-height: 1;
  text-transform: uppercase;
  color: var(--go-gold-light);
  text-shadow: 0 1px 0 rgba(42, 16, 8, .85), 0 0 12px rgba(242, 207, 122, .35);
  margin: 0;
  white-space: nowrap;
}

.go-banner__wing {
  width: 72px;
  height: 42px;
  flex: none;
  margin-inline: -14px;
  background: var(--go-wing) center / contain no-repeat;
  position: relative;
  z-index: var(--go-z-raised);
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .45));
}

.go-banner__wing--mirror {
  transform: scaleX(-1);
}

[dir="rtl"] .go-banner__wing { transform: scaleX(-1); }
[dir="rtl"] .go-banner__wing--mirror { transform: none; }

/* ---------- panneau doré ---------- */
.go-panel {
  position: relative;
  border-radius: var(--go-radius-xl);
  padding: var(--go-space-6) var(--go-space-4) var(--go-space-4);
  color: var(--go-text);
  background:
    linear-gradient(180deg, rgba(255, 248, 230, .07), transparent 28%) padding-box,
    linear-gradient(180deg, rgba(16, 20, 40, .94), rgba(7, 9, 16, .96)) padding-box,
    var(--go-gold-rim) border-box;
  border: 1.5px solid transparent;
  box-shadow:
    inset 0 0 0 1px rgba(255, 246, 212, .22),
    inset 0 1px 0 rgba(255, 255, 255, .14),
    inset 0 -16px 28px rgba(0, 0, 0, .38),
    0 0 0 1px rgba(80, 48, 12, .65),
    var(--go-shadow-lg),
    0 0 26px rgba(242, 207, 122, .16);
  backdrop-filter: blur(var(--go-blur)) saturate(1.2);
  -webkit-backdrop-filter: blur(var(--go-blur)) saturate(1.2);
}

.go-panel::before {
  content: "";
  position: absolute;
  inset: 9px;
  pointer-events: none;
  z-index: var(--go-z-decor);
  background:
    linear-gradient(#FFF6D4, #FFF6D4) left top / 16px 1.5px no-repeat,
    linear-gradient(#FFF6D4, #FFF6D4) left top / 1.5px 16px no-repeat,
    linear-gradient(#F2CF7A, #F2CF7A) right top / 16px 1.5px no-repeat,
    linear-gradient(#F2CF7A, #F2CF7A) right top / 1.5px 16px no-repeat,
    linear-gradient(#C4923E, #C4923E) left bottom / 16px 1.5px no-repeat,
    linear-gradient(#C4923E, #C4923E) left bottom / 1.5px 16px no-repeat,
    linear-gradient(#F2CF7A, #F2CF7A) right bottom / 16px 1.5px no-repeat,
    linear-gradient(#F2CF7A, #F2CF7A) right bottom / 1.5px 16px no-repeat;
}

.go-rule {
  display: flex;
  align-items: center;
  gap: var(--go-space-2);
  margin: var(--go-space-1) var(--go-space-2) var(--go-space-2);
}

.go-rule i {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--go-gold), transparent);
}

.go-rule b {
  width: 6px;
  height: 6px;
  flex: none;
  transform: rotate(45deg);
  background: var(--go-gold-metal);
  box-shadow: var(--go-glow-gold);
}

/* ---------- carte question ---------- */
.go-board {
  display: flex;
  align-items: stretch;
  gap: var(--go-space-2);
  margin-top: 28px;
  padding-top: 30px;
}

.go-qcard {
  flex: 1;
  min-width: 0;
  margin: 0;
  padding: 34px var(--go-space-3) var(--go-space-3);
  text-align: center;
}

.go-qcard__crest {
  position: absolute;
  inset-inline: 8px;
  top: -2px;
  height: 26px;
  pointer-events: none;
  z-index: var(--go-z-raised);
}

.go-qcard__crest::before,
.go-qcard__crest::after {
  content: "";
  position: absolute;
  top: 0;
  width: 52px;
  height: 26px;
  background: var(--go-wing) center / contain no-repeat;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .45));
}

.go-qcard__crest::before { inset-inline-start: 0; }
.go-qcard__crest::after { inset-inline-end: 0; transform: scaleX(-1); }

[dir="rtl"] .go-qcard__crest::before { transform: scaleX(-1); }
[dir="rtl"] .go-qcard__crest::after { transform: none; }

.go-medal {
  position: absolute;
  z-index: var(--go-z-raised);
  left: 50%;
  top: 0;
  transform: translate(-50%, -54%);
  width: 58px;
  height: 58px;
  margin: 0;
  display: grid;
  place-items: center;
  border-radius: var(--go-radius-pill);
  font-family: var(--go-font-body);
  font-weight: 700;
  font-size: var(--go-text-xl);
  color: var(--go-text-on-accent);
  background:
    radial-gradient(circle at 50% 42%, var(--go-accent-deep) 0%, var(--go-accent) 58%, var(--go-accent-ink) 100%);
  box-shadow:
    0 0 0 3px #1A0C0A,
    0 0 0 5px var(--go-gold),
    inset 0 2px 3px rgba(255, 255, 255, .4),
    var(--go-glow-accent);
}

.go-qcard__text {
  position: relative;
  z-index: var(--go-z-content);
  margin: 0 var(--go-space-2) var(--go-space-2);
  font-family: var(--go-font-body);
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--go-text);
  text-wrap: balance;
}

/* ---------- réponses ---------- */
.go-answers {
  position: relative;
  z-index: var(--go-z-content);
  display: flex;
  flex-direction: column;
  gap: var(--go-space-2);
}

.go-answer {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--go-space-3);
  width: 100%;
  min-height: 52px;
  padding: var(--go-space-2) var(--go-space-3) var(--go-space-2) var(--go-space-2);
  border-radius: 13px;
  text-align: start;
  color: var(--go-text);
  background:
    linear-gradient(180deg, rgba(255, 248, 230, .08), rgba(255, 255, 255, 0) 42%) padding-box,
    linear-gradient(180deg, #1C223C 0%, #10131F 100%) padding-box,
    linear-gradient(180deg, #FFF6D4, #C4923E 55%, #8C5A1C) border-box;
  border: 1px solid transparent;
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 212, .28),
    inset 0 -8px 12px rgba(0, 0, 0, .35),
    0 6px 14px rgba(0, 0, 0, .32);
}

.go-answer__badge {
  width: 36px;
  height: 36px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: var(--go-radius-pill);
  font-family: var(--go-font-body);
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--go-gold-light);
  background:
    radial-gradient(circle at 35% 30%, rgba(255, 246, 212, .18), transparent 46%),
    linear-gradient(180deg, #1C2038, #0C0E18);
  box-shadow:
    inset 0 0 0 1.5px var(--go-gold),
    inset 0 1px 0 rgba(255, 246, 212, .35),
    0 2px 4px rgba(0, 0, 0, .45);
}

.go-answer__label {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 1.25;
}

.go-answer__mark {
  width: 0;
  overflow: hidden;
  flex: none;
  font-weight: 700;
  font-size: var(--go-text-md);
}

.go-answer.is-selected {
  background:
    linear-gradient(180deg, rgba(242, 207, 122, .28), rgba(242, 207, 122, .08)) padding-box,
    linear-gradient(180deg, #3A3018, #16130C) padding-box,
    linear-gradient(180deg, #FFF8E6, #F2CF7A 40%, #A8742A) border-box;
  box-shadow:
    inset 0 0 0 1px rgba(255, 246, 212, .55),
    inset 0 0 22px rgba(242, 207, 122, .28),
    inset 0 1px 0 rgba(255, 255, 255, .35),
    0 0 0 1px rgba(255, 236, 180, .9),
    0 0 28px 3px rgba(242, 207, 122, .85),
    0 8px 18px rgba(0, 0, 0, .4);
}

.go-answer.is-selected .go-answer__badge {
  background: var(--go-gold-metal);
  color: var(--go-text-on-gold);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), var(--go-glow-gold);
}

.go-answer.is-selected .go-answer__mark {
  width: 22px;
  color: var(--go-gold);
}
.go-answer.is-selected .go-answer__mark::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-radius: var(--go-radius-pill);
  background: var(--go-gold-metal);
  box-shadow: 0 0 0 2px rgba(62, 40, 12, .45), var(--go-glow-gold);
}

.go-answer.is-correct {
  background:
    linear-gradient(180deg, var(--go-correct-soft), rgba(14, 107, 69, .28)) padding-box,
    linear-gradient(180deg, #14352A, #0C1614) padding-box,
    linear-gradient(180deg, #E9FFF6, var(--go-correct)) border-box;
  box-shadow:
    inset 0 0 0 1px rgba(61, 220, 151, .45),
    var(--go-glow-correct),
    var(--go-shadow-sm);
}

.go-answer.is-correct .go-answer__badge {
  background: linear-gradient(180deg, #E9FFF6, var(--go-correct));
  color: var(--go-correct-deep);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), var(--go-glow-correct);
}

.go-answer.is-correct .go-answer__mark {
  width: 22px;
  color: var(--go-correct-ink);
}
.go-answer.is-correct .go-answer__mark::before { content: "✓"; }

.go-answer.is-wrong {
  background:
    linear-gradient(180deg, var(--go-wrong-soft), rgba(142, 29, 42, .32)) padding-box,
    linear-gradient(180deg, #3A1418, #140C0E) padding-box,
    linear-gradient(180deg, #FFECEE, var(--go-wrong)) border-box;
  box-shadow:
    inset 0 0 0 1px rgba(255, 107, 120, .4),
    var(--go-glow-wrong),
    var(--go-shadow-sm);
}

.go-answer.is-wrong .go-answer__badge {
  background: linear-gradient(180deg, #FFECEE, var(--go-wrong));
  color: var(--go-wrong-deep);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), var(--go-glow-wrong);
}

.go-answer.is-wrong .go-answer__mark {
  width: 22px;
  color: var(--go-wrong-ink);
}
.go-answer.is-wrong .go-answer__mark::before { content: "×"; }

.go-answer:disabled,
.go-answer.is-used {
  opacity: .45;
  filter: grayscale(.65);
}

/* ---------- chrono segmenté ---------- */
.go-timer {
  list-style: none;
  margin: 0;
  width: 22px;
  flex: none;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 3px;
  padding: 8px 5px;
  border-radius: var(--go-radius-pill);
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .45), rgba(255, 246, 212, .08) 48%, rgba(0, 0, 0, .5)) padding-box,
    var(--go-gold-metal) border-box;
  border: 1.5px solid transparent;
  box-shadow:
    inset 0 0 10px rgba(0, 0, 0, .72),
    inset 0 0 0 1px rgba(0, 0, 0, .55),
    0 0 14px rgba(242, 207, 122, .38);
}

.go-timer li {
  height: 7px;
  flex: none;
  border-radius: 2px;
  background: linear-gradient(180deg, #3A2E1C, #1A120C);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .65);
}

.go-timer li.is-on {
  background: linear-gradient(180deg, #FFF8E6 0%, #F2CF7A 42%, #A8742A 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 0 5px rgba(242, 207, 122, .85);
}

.go-timer li.is-current {
  height: 11px;
  background: linear-gradient(180deg, #FFF6E4, var(--go-accent-light) 40%, var(--go-accent));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .9),
    0 0 8px #fff,
    0 0 14px var(--go-accent-glow);
}

/* ---------- jokers ---------- */
.go-jokers {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--go-space-2);
  margin-top: auto;
  padding-top: var(--go-space-2);
}

.go-joker {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--go-gold-light);
}

.go-joker__gem {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  background: var(--go-gold-metal);
  clip-path: var(--go-oct);
  filter: drop-shadow(0 8px 8px rgba(0, 0, 0, .5)) drop-shadow(0 0 10px rgba(242, 207, 122, .4));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65);
}

.go-joker__face {
  width: 64px;
  height: 64px;
  display: block;
  background-color: #100e14;
  background-image: var(--go-jk);
  background-position: center 46%;
  background-size: 168%;
  background-repeat: no-repeat;
  clip-path: var(--go-oct);
}

.go-joker[data-jk="sage"] { --go-jk: var(--go-jk-sage); }
.go-joker[data-jk="village"] { --go-jk: var(--go-jk-village); }
.go-joker[data-jk="yy"] { --go-jk: var(--go-jk-yy); }

.go-joker__label {
  font-size: var(--go-text-xs);
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--go-gold-light);
  text-align: center;
  line-height: 1.2;
}

.go-joker.is-used {
  filter: grayscale(.8) brightness(.62);
}

.go-joker.is-used .go-joker__label {
  text-decoration: line-through;
  color: var(--go-text-muted);
}

.go-joker:disabled {
  cursor: not-allowed;
}

/* ---------- boutons ---------- */
.go-btn {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--go-space-2);
  min-height: 48px;
  padding: var(--go-space-3) var(--go-space-5);
  border-radius: var(--go-radius-pill);
  border: 0;
  font-weight: 600;
  font-size: 1.125rem;
  letter-spacing: .01em;
  line-height: 1.1;
}

.go-btn--block { width: 100%; }

.go-btn--primary,
.go-btn--gold {
  font-weight: 700;
  color: var(--go-text-on-gold);
  background: var(--go-gold-metal);
  text-shadow: 0 1px 0 rgba(255, 255, 255, .45);
  box-shadow: var(--go-emboss), var(--go-glow-gold), var(--go-shadow-sm);
}

.go-btn--primary::before,
.go-btn--gold::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 10%;
  right: 10%;
  top: 1px;
  height: 46%;
  border-radius: var(--go-radius-pill);
  background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.go-btn--secondary {
  color: var(--go-gold-light);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02));
  border: 1px solid rgba(242, 207, 122, .6);
  box-shadow: inset 0 1px 0 rgba(255, 246, 212, .22), var(--go-shadow-sm);
  backdrop-filter: blur(var(--go-blur));
  -webkit-backdrop-filter: blur(var(--go-blur));
}

.go-btn:disabled,
.go-btn.is-disabled {
  filter: saturate(.35) brightness(.72);
  cursor: not-allowed;
  box-shadow: none;
}

.go-btn:disabled::before { display: none; }

/* ---------- boutons or de la PR #42 (rendu identique, noms génériques) ----------
   .go-btn--gold      = .b04-btn.pri   (dégradé clair → or → foncé, relief --go-emboss-gold)
   .go-btn--gold-deep = .b07-btn.b07-gold (dégradé or → --go-gold-dark, relief court)
   .go-btn--glass     = .b04-btn        (verre 12 %, encre, filet --go-line)
   .go-btn--ghost     = .b04-btn.ghost
   .go-btn--line      = .b07-sec-btn    (verre, texte or, filet or 60 %)
   Le socle .go-btn (48 px, 1.125 rem, sheen de --primary) est annulé ici :
   #42 mesure 44 px, police héritée, sans pseudo-élément. */

.go-btn.go-btn--gold,
.go-btn.go-btn--gold-deep,
.go-btn.go-btn--glass,
.go-btn.go-btn--bronze,
.go-btn.go-btn--ghost,
.go-btn.go-btn--line {
  gap: 6px;
  min-height: var(--go-tap);
  min-block-size: var(--go-tap);
  min-inline-size: var(--go-tap);
  padding: 0;
  padding-inline: 14px;
  border-radius: var(--go-radius-pill);
  font: inherit;
  font-weight: 600;
  font-size: inherit;
  letter-spacing: normal;
  line-height: inherit;
  text-shadow: none;
}

.go-btn.go-btn--gold::before,
.go-btn.go-btn--gold-deep::before,
.go-btn.go-btn--glass::before,
.go-btn.go-btn--bronze::before,
.go-btn.go-btn--ghost::before,
.go-btn.go-btn--line::before { content: none; display: none; }

.go-btn.go-btn--gold {
  border: 1px solid var(--go-gold);
  color: var(--go-text-on-gold);
  background: var(--go-btn-gold-bg);
  box-shadow: var(--go-emboss-gold);
}

.go-btn.go-btn--gold-deep {
  flex: none;
  min-inline-size: 84px;
  border: 1px solid var(--go-gold);
  color: var(--go-gold-ink);
  background: var(--go-btn-gold-deep-bg);
  box-shadow: var(--go-btn-gold-deep-shadow);
  font: 700 13px/1 var(--go-font-body);
}

.go-btn.go-btn--glass {
  border: 1px solid var(--go-line);
  background: var(--go-glass-2);
  color: var(--go-text);
  box-shadow: none;
}

.go-btn.go-btn--bronze {
  border: 2px solid var(--go-gold);
  color: var(--go-gold-light);
  background: linear-gradient(180deg, #e4c48a 0%, #a67c45 16%, #6e4e2c 40%, #3a2818 68%, #1a120c 100%);
  box-shadow:
    inset 0 1px 0 #fff6d4,
    inset 0 -5px 0 rgba(42, 24, 10, .72),
    0 6px 0 #2a1a0c,
    0 12px 22px rgba(0, 0, 0, .5);
}

.go-btn.go-btn--glass.is-on,
.go-btn.go-btn--glass[aria-pressed="true"] {
  background: color-mix(in srgb, var(--go-gold) 22%, transparent);
  border-color: var(--go-gold-line);
  color: var(--go-gold);
}

.go-btn.go-btn--ghost {
  border: 1px solid var(--go-line);
  background: transparent;
  color: var(--go-text);
  box-shadow: none;
}

.go-btn.go-btn--line {
  flex: none;
  min-inline-size: 84px;
  border: 1px solid color-mix(in srgb, var(--go-gold) 60%, transparent);
  color: var(--go-gold);
  background: var(--go-glass-2);
  box-shadow: none;
  font: 700 13px/1 var(--go-font-body);
}

.go-btn.go-btn--gold:active,
.go-btn.go-btn--glass:active,
.go-btn.go-btn--ghost:active { transform: none; }

.go-btn.go-btn--gold-deep:active,
.go-btn.go-btn--line:active { transform: translateY(1px); }

.go-btn.go-btn--gold:disabled,
.go-btn.go-btn--gold[aria-disabled="true"],
.go-btn.go-btn--glass:disabled,
.go-btn.go-btn--glass[aria-disabled="true"],
.go-btn.go-btn--ghost:disabled,
.go-btn.go-btn--ghost[aria-disabled="true"] {
  opacity: .5;
  filter: none;
  box-shadow: var(--go-emboss-gold);
}

.go-btn.go-btn--glass:disabled,
.go-btn.go-btn--glass[aria-disabled="true"],
.go-btn.go-btn--ghost:disabled,
.go-btn.go-btn--ghost[aria-disabled="true"] { box-shadow: none; }

.go-btn.go-btn--gold[aria-busy="true"] { opacity: .6; pointer-events: none; }

.go-btn.go-btn--gold-deep:disabled,
.go-btn.go-btn--gold-deep[aria-disabled="true"],
.go-btn.go-btn--line:disabled,
.go-btn.go-btn--line[aria-disabled="true"] {
  opacity: .5;
  filter: saturate(.4);
  cursor: not-allowed;
  box-shadow: none;
}

/* Contrôle segmenté.
   .go-seg       = .b04-tabs + état choisi Fusion (verre, texte or, filet, halo)
   .go-seg--fill = .b07-tabs (piste identique, choisi = bouton or events) */
.go-seg:empty,
.go-seg[hidden] { display: none !important; }

.go-seg {
  display: flex;
  gap: 4px;
  padding: 4px;
  border-radius: var(--go-radius-pill);
  background: var(--go-glass-highlight);
  border: 1px solid var(--go-line);
}

.go-seg__btn,
.go-seg > button {
  flex: 1;
  min-block-size: var(--go-tap);
  min-height: var(--go-tap);
  padding-inline: 6px;
  border: 0;
  border-radius: var(--go-radius-pill);
  background: transparent;
  color: var(--go-text-muted);
  font: inherit;
  font-weight: 600;
  font-family: var(--go-font-body);
  cursor: pointer;
}

.go-seg__btn[aria-selected="true"],
.go-seg__btn[aria-checked="true"],
.go-seg > button[aria-selected="true"],
.go-seg > button[aria-checked="true"] {
  background: var(--go-glass-2);
  color: var(--go-gold);
  box-shadow: inset 0 0 0 1px var(--go-gold-line), 0 0 10px var(--go-gold-halo);
}

.go-seg--fill { gap: 6px; }

.go-seg--fill > button,
.go-seg--fill .go-seg__btn {
  font: 600 14px/1 var(--go-font-body);
}

.go-seg--fill > button[aria-selected="true"],
.go-seg--fill > button[aria-checked="true"],
.go-seg--fill .go-seg__btn[aria-selected="true"],
.go-seg--fill .go-seg__btn[aria-checked="true"] {
  color: var(--go-gold-ink);
  background: var(--go-btn-gold-deep-bg);
  box-shadow: 0 2px 10px color-mix(in srgb, var(--go-gold) 35%, transparent);
}

.go-seg--wrap { flex-wrap: wrap; border-radius: var(--go-radius-lg); }
.go-seg--wrap > button,
.go-seg--wrap .go-seg__btn {
  flex: 1 1 30%;
  min-inline-size: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  white-space: nowrap;
  overflow: hidden;
}

/* ---------- modale ---------- */
.go-modal {
  position: fixed;
  inset: 0;
  z-index: var(--go-z-modal);
  display: grid;
  padding: var(--go-space-5);
}

.go-modal[hidden] { display: none !important; }

.go-modal__scrim,
.go-modal__dialog {
  grid-area: 1 / 1;
}

.go-modal__scrim {
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background: rgba(8, 9, 15, .72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.go-modal__dialog {
  position: relative;
  z-index: var(--go-z-raised);
  align-self: center;
  justify-self: center;
  width: min(100%, 360px);
  padding-top: 56px;
}

.go-modal__close {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
}

.go-modal__dialog .go-title {
  font-size: var(--go-text-xl);
  text-align: center;
  padding-inline: var(--go-space-8);
}

.go-modal__dialog .go-body {
  margin-top: var(--go-space-3);
  text-align: center;
}

.go-modal__actions {
  display: flex;
  gap: var(--go-space-2);
  margin-top: var(--go-space-5);
}

.go-modal__actions .go-btn { flex: 1; }

.go-modal--inline {
  position: relative;
  z-index: auto;
  min-height: 280px;
  border-radius: var(--go-radius-xl);
  overflow: hidden;
  border: 1px solid var(--go-glass-line);
}

.go-modal--inline .go-modal__scrim { cursor: default; }
.go-modal--inline .go-modal__dialog { padding-top: var(--go-space-6); }

@media (hover: hover) {
  .go-answer:hover {
    border-color: var(--go-gold-light);
    box-shadow: var(--go-glow-gold), var(--go-shadow-sm);
  }
  .go-btn--primary:hover,
  .go-btn--gold:hover { filter: brightness(1.05); }
  .go-btn--secondary:hover { border-color: var(--go-gold-light); }
}

@media (prefers-reduced-motion: reduce) {
  .go-scene__petals i { animation: none; opacity: .4; }
  .go-btn,
  .go-iconbtn,
  .go-back,
  .go-answer,
  .go-joker,
  .go-currency {
    transition: none;
  }
  .go-btn:active,
  .go-iconbtn:active,
  .go-back:active,
  .go-answer:active,
  .go-joker:active,
  .go-currency:active,
  .go-btn.go-btn--gold-deep:active,
  .go-btn.go-btn--line:active {
    transform: none;
  }
}
