.loyalty-site { background: #1e1d1a; color: #f8f3e8; font: 18px system-ui, sans-serif; margin: 0; min-height: 100vh; }
.loyalty-header { padding: 1rem; text-align: center; border-bottom: 1px solid #575148; }
.loyalty-header a { color: inherit; text-decoration: none; font-weight: 700; }
.loyalty-main { max-width: 54rem; margin: auto; padding: 2rem 1rem 4rem; }
.loyalty-main form { display: grid; gap: .6rem; max-width: 28rem; }
.loyalty-main input, .loyalty-main button { font: inherit; padding: .7rem; }
.loyalty-main input[type=submit], .loyalty-main button, .button-link { background: #e2aa4b; color: #1e1d1a; border: 0; border-radius: .3rem; cursor: pointer; display: inline-block; font-weight: 700; padding: .65rem .85rem; text-decoration: none; }
.notice, .alert { padding: .8rem; background: #413b30; border-left: .3rem solid #e2aa4b; }
.loyalty-actions { float: right; }
.loyalty-actions a, a { color: #f2c978; }
.page-heading { margin-bottom: 1.5rem; }
.dashboard-hero { margin-bottom: 1rem; }
.dashboard-nav { gap: .5rem .9rem; margin-top: .6rem; }
.dashboard-nav-more summary { color: #f2c978; cursor: pointer; }
.dashboard-nav-more .inline-nav { margin-top: .5rem; }
.page-heading h1, .page-heading p { margin-bottom: .35rem; }
.eyebrow { color: #d8a950; font-size: .78rem; font-weight: 700; letter-spacing: .12em; margin: 0 0 .35rem; text-transform: uppercase; }
.inline-nav, .admin-nav { display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; margin-top: 1.2rem; }
.stats-grid { display: grid; gap: .7rem; grid-template-columns: repeat(4, 1fr); margin: 1.5rem 0 2.5rem; }
.stat, .progress-card, .reward-card, .admin-card { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: 1rem; }
.stat strong { display: block; font-size: 1.8rem; }
.stat span { color: #c9c0b0; font-size: .85rem; }
.dashboard-section { margin: 2.5rem 0; }
.section-heading, .progress-card-heading { align-items: baseline; display: flex; justify-content: space-between; gap: 1rem; }
.section-heading h2, .progress-card h3, .reward-card h2, .reward-card h3, .admin-card h2 { margin-top: 0; }
.progress-list, .reward-list, .admin-grid { display: grid; gap: 1rem; }
.progress-card p, .reward-card p { color: #c9c0b0; margin-bottom: 0; }
.progress-card .progress-cycle { color: #f8f3e8; font-weight: 700; margin-top: .7rem; }
.progress-card .progress-earned { margin-top: .25rem; }
.progress-card-copy { min-width: 0; }
.progress-card-with-art { align-items: flex-start; display: flex; gap: 1rem; }
.progress-card-with-art .progress-card-artwork { flex: 0 0 6rem; height: 6rem; width: 6rem; }
.progress-track { background: #4a453d; border-radius: 1rem; height: .65rem; margin-top: .9rem; overflow: hidden; }
.progress-track span { background: #e2aa4b; display: block; height: 100%; }
.reward-card { align-items: center; display: flex; justify-content: space-between; gap: 1rem; }
.reward-card h2, .reward-card h3 { margin-bottom: .2rem; }
.reward-card small { color: #c9c0b0; }
.compact-list { list-style: none; margin: 0 0 1rem; padding: 0; }
.compact-list li { border-bottom: 1px solid #48433b; display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; }
.compact-list li:last-child { border-bottom: 0; }
.compact-list span { color: #c9c0b0; text-align: right; }
.nights-at-house { min-width: 0; }
.night-streak { color: #f2c978; font-size: .9rem; white-space: nowrap; }
.night-strip { display: grid; gap: .35rem; grid-template-columns: repeat(7, minmax(0, 1fr)); list-style: none; margin: 1rem 0 0; padding: 0; }
.night-mark { align-items: center; background: #2b2925; border: 1px solid #575148; border-radius: .45rem; display: flex; flex-direction: column; gap: .2rem; min-width: 0; padding: .45rem .15rem; }
.night-mark-filled { background: #413b30; border-color: #e2aa4b; }
.night-mark-dot { background: #2b2925; border: .18rem solid #8f897d; border-radius: 50%; height: 1.1rem; width: 1.1rem; }
.night-mark-filled .night-mark-dot { background: #e2aa4b; border-color: #f2c978; box-shadow: 0 0 .35rem rgba(226, 170, 75, .45); }
.night-mark-day { color: #c9c0b0; font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.night-mark-date { color: #f8f3e8; font-size: .9rem; font-weight: 800; }
.two-column, .admin-grid { grid-template-columns: repeat(2, 1fr); }
.admin-card { min-height: 10rem; }
.admin-nav { border-top: 1px solid #575148; padding-top: 1.2rem; }
.qr-display { min-height: 90vh; display: grid; place-items: center; text-align: center; gap: 1rem; }
.qr-display svg { width: min(70vw, 30rem); height: min(70vw, 30rem); background: #fff; padding: 1rem; }
.claim-url { overflow-wrap: anywhere; font-size: .75rem; max-width: 50rem; }
.skip-link { position: absolute; left: -9999px; top: auto; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 2; background: #fff; color: #1e1d1a; padding: .6rem; }
.qr-display > div[role="img"] { max-width: 100%; }
@media (max-width: 40rem) {
  .loyalty-main { padding: 1rem .75rem 3rem; }
  .loyalty-actions { float: none; margin-bottom: 1rem; }
  .qr-display svg { width: min(88vw, 25rem); height: min(88vw, 25rem); padding: .5rem; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .two-column, .admin-grid { grid-template-columns: 1fr; }
  .reward-card { align-items: flex-start; flex-direction: column; }
}

.avatar-summary, .avatar-setup { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: 1rem; }
.avatar-hero { border-color: #e2aa4b; }
.avatar-hero h2, .avatar-archetype, .avatar-identity-copy { text-align: center; }
.avatar-archetype { color: #c9c0b0; margin-top: -.25rem; }
.profile-character-name { color: #c9c0b0; text-align: center; }
.profile-page .profile-hero {
  align-items: start; background: #2b2925; border: 1px solid #e2aa4b; border-radius: .6rem;
  display: grid; gap: 1rem 1.25rem; grid-template-columns: minmax(16rem, .85fr) minmax(0, 1.35fr); padding: 1rem;
}
.profile-hero-art .profile-portrait, .profile-hero-art .character-empty-art { border: 1px solid #e2aa4b; border-radius: .45rem; box-shadow: 0 0 .8rem rgba(226, 170, 75, .28); margin: 0; max-width: 100%; width: 100%; }
.profile-hero-copy { min-width: 0; text-align: left; }
.profile-hero-copy h2 { margin: 0; }
.profile-username { color: #c9c0b0; margin: .15rem 0 .35rem; }
.profile-page .profile-character-name { text-align: left; }
.profile-hero-copy .avatar-archetype { margin: 0 0 .6rem; }
.profile-hero-board { grid-column: 1 / -1; min-width: 0; }
.profile-page .nights-at-house .eyebrow, .profile-page .nights-at-house h2,
.profile-page .table-records .eyebrow, .profile-page .table-records h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.profile-page .nights-at-house .section-heading, .profile-page .table-records .section-heading { margin: .4rem 0 .35rem; }
.profile-page .dashboard-stats { margin: .7rem 0 .5rem; }
.profile-trophies { margin-top: 1rem; }
.profile-page .challenge-badges { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0 0 .6rem; padding: 0; }
.profile-page .challenge-badges li {
  background: #413b30; border: 1px solid #e2aa4b; border-radius: 999px; color: #f2c978; margin: 0; padding: .2rem .65rem;
}
.profile-showcase { margin-top: 1rem; }
.profile-page .profile-showcase-grid { gap: .35rem; grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr)); }
.profile-page .profile-showcase-grid .item-grid-summary { gap: .12rem; min-height: 0; padding: .22rem; }
.profile-page .profile-showcase-grid .item-grid-name { font-size: .68rem; }
@media (max-width: 40rem) {
  .profile-page .profile-hero { grid-template-columns: 1fr; }
}
.avatar-identity-copy { color: #f2c978; font-weight: 700; }
.avatar-setup form { max-width: 100%; min-width: 0; }
.avatar-setup input, .avatar-setup select, .avatar-setup button { box-sizing: border-box; min-width: 0; max-width: 100%; width: 100%; }
.portrait-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); }
.portrait-card { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: .75rem; }
.portrait-card img, .profile-portrait { display: block; max-width: 100%; border-radius: .35rem; }
.dashboard-portrait { margin-bottom: 1rem; width: min(100%, 14rem); }
.avatar-hero .dashboard-portrait { margin-left: auto; margin-right: auto; width: min(100%, 22rem); }
.equipped-loadout {
  display: flex;
  gap: .6rem;
  margin-top: 1rem;
  overflow-x: auto;
  padding: .15rem;
  scrollbar-color: #8f897d transparent;
  scrollbar-width: thin;
}
.equipped-loadout::-webkit-scrollbar { height: .35rem; }
.equipped-loadout::-webkit-scrollbar-track { background: transparent; }
.equipped-loadout::-webkit-scrollbar-thumb { background: #8f897d; border-radius: 1rem; }
.equipped-item { align-items: center; background: #413b30; border: 1px solid #575148; border-radius: .5rem; display: flex; flex: 0 0 auto; gap: .45rem; max-width: 10rem; padding: .35rem; }
.equipped-item .equipped-item-artwork { flex: 0 0 2.75rem; height: 2.75rem; width: 2.75rem; }
.equipped-item-name { font-size: .8rem; font-weight: 700; line-height: 1.1; min-width: 0; overflow-wrap: normal; }
.avatar-hero .equipped-loadout { justify-content: center; }
.dashboard-stats { margin-top: 1rem; }
.portrait-placeholder { align-items: center; background: #413b30; display: grid; min-height: 12rem; place-items: center; text-transform: capitalize; }
.portrait-card form { margin-top: .5rem; }
@media (max-width: 40rem) {
  .portrait-grid { grid-template-columns: 1fr; }
  .equipped-loadout { gap: .4rem; }
  .equipped-item { max-width: 7.5rem; }
  .equipped-item-name { font-size: .7rem; }
  .avatar-hero .equipped-loadout { justify-content: flex-start; }
}

.loadout-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.form-help { color: #c9c0b0; font-size: .9rem; margin: 0; }


/* Phone-sized player screens and the dedicated venue display. */
*, *::before { box-sizing: border-box; }
.loyalty-site { overflow-x: hidden; }
.loyalty-main { width: 100%; }
.loyalty-main form { min-width: 0; width: 100%; }
.loyalty-main input, .loyalty-main select, .loyalty-main textarea, .loyalty-main button { box-sizing: border-box; max-width: 100%; }
.loyalty-main input:not([type="submit"]), .loyalty-main select, .loyalty-main textarea { width: 100%; }
.loyalty-main img { height: auto; }
.section-heading { align-items: flex-start; flex-wrap: wrap; }
.section-heading > *, .progress-card-heading > *, .reward-card > * { min-width: 0; }
.reward-card p { overflow-wrap: anywhere; }

.display-page .loyalty-header { display: none; }
.display-page .loyalty-main { max-width: none; min-height: 100svh; padding: 0; }
.display-page .qr-display {
  align-content: center;
  box-sizing: border-box;
  gap: clamp(.75rem, 2.5vh, 1.5rem);
  min-height: 100svh;
  padding: clamp(1rem, 4vw, 4rem);
}
.display-page .qr-display > p:first-child { font-size: clamp(1rem, 2.5vw, 1.5rem); font-weight: 800; letter-spacing: .12em; margin: 0; }
.display-page .qr-display h1 { font-size: clamp(1.4rem, 4vw, 3rem); margin: 0; }
.display-page .qr-display > div[role="img"] { display: grid; place-items: center; width: min(100%, 34rem); }
.display-page .qr-display > div[role="img"] svg {
  display: block;
  height: auto;
  padding: clamp(.35rem, 1.5vw, 1rem);
  width: min(78vw, 60svh, 34rem);
}
.display-page .claim-url { font-size: clamp(.6rem, 1.2vw, .8rem); margin: 0; max-width: min(100%, 48rem); }

@media (max-width: 40rem) {
  .loyalty-header { padding: .8rem .75rem; }
  .loyalty-main { padding-left: .75rem; padding-right: .75rem; }
  .page-heading h1 { font-size: clamp(1.7rem, 8vw, 2.25rem); overflow-wrap: anywhere; }
  .inline-nav { gap: .6rem 1rem; }
  .section-heading { gap: .6rem; }
  .stats-grid { gap: .5rem; }
  .stat { padding: .8rem; }
  .stat strong { font-size: clamp(1.35rem, 7vw, 1.8rem); }
  .reward-card { width: 100%; }
  .reward-card .button-link { text-align: center; width: 100%; }
  .compact-list li { align-items: flex-start; }
  .compact-list strong { min-width: 0; overflow-wrap: anywhere; }
  .compact-list span { min-width: 0; }
  .loadout-grid { grid-template-columns: 1fr; }
  .display-page .qr-display { padding: 1rem .75rem; }
  .display-page .qr-display > div[role="img"] svg { width: min(86vw, 58svh, 30rem); }
}

.qr-stamp { text-align: center; margin-bottom: 2rem; }
.qr-stamp svg { background: #fff; display: block; height: min(82vw, 32rem); margin: 1rem auto; padding: .75rem; width: min(82vw, 32rem); }
.qr-stamp > p { margin-left: auto; margin-right: auto; }
.stamp-mint-button { font-size: 1.25rem; min-height: 3.5rem; width: 100%; }
.staff-notice { background: #413b30; border: 1px solid #e2aa4b; border-radius: .6rem; padding: 1.25rem; }
.staff-notice .button-link { display: block; text-align: center; }


/* Catalog cards keep the full item list readable on a phone. */
.codex-list { display: grid; gap: 1rem; }
.codex-card { background: #2b2925; border: 1px solid #575148; border-left: .3rem solid #575148; border-radius: .5rem; padding: 1rem; }
.codex-card h3 { margin: 0 0 .2rem; }
.codex-card p { color: #c9c0b0; margin: .45rem 0 0; }
.codex-card .eyebrow { color: #d8a950; margin: 0 0 .35rem; }
.codex-unlock strong { color: #f8f3e8; }
.codex-card[data-owned="false"] { opacity: .82; }

/* Inventory stacks definitions for players while the ledger stays serialized. */
.reward-card { border-left: .3rem solid #575148; }
.reward-card-copy { flex: 1; min-width: 0; }
.item-artwork { background: #413b30; border: 1px solid #575148; border-radius: .35rem; flex: 0 0 6rem; height: 6rem; object-fit: cover; width: 6rem; }
.codex-card { align-items: center; display: flex; gap: 1rem; }
.codex-card > div { flex: 1; min-width: 0; }
.reward-card-action { align-items: flex-end; display: flex; flex-direction: column; gap: .45rem; }
.reward-card-action small { text-align: right; }
.item-rarity { color: #c9c0b0; }
.item-count { color: #f8f3e8; font-size: .9em; white-space: nowrap; }
.rarity-common { --rarity-color: #c9e4f2; --rarity-glow: rgba(201, 228, 242, .28); }
.rarity-uncommon { --rarity-color: #65ff9a; --rarity-glow: rgba(101, 255, 154, .34); }
.rarity-rare { --rarity-color: #32e7ff; --rarity-glow: rgba(50, 231, 255, .36); }
.rarity-epic { --rarity-color: #c978ff; --rarity-glow: rgba(201, 120, 255, .36); }
.rarity-legendary { --rarity-color: #ffd35a; --rarity-glow: rgba(255, 211, 90, .38); }
.rarity-special { --rarity-color: #ff62d2; --rarity-glow: rgba(255, 98, 210, .38); }
.rarity-common, .rarity-uncommon, .rarity-rare, .rarity-epic, .rarity-legendary, .rarity-special { border-left-color: var(--rarity-color); }
.rarity-common .item-rarity, .rarity-uncommon .item-rarity, .rarity-rare .item-rarity,
.rarity-epic .item-rarity, .rarity-legendary .item-rarity, .rarity-special .item-rarity { color: var(--rarity-color); }
@media (max-width: 40rem) {
  .reward-card-action { align-items: stretch; width: 100%; }
  .reward-card-action small { text-align: left; }
}

.game-corner { margin-top: 1.5rem; }
.game-corner-grid { display: grid; gap: .7rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tables-chalkboard { background: #241c14; border: 1px solid #e2aa4b; border-radius: .6rem; box-shadow: inset 0 0 0 1px #413b30; margin-top: 1.25rem; padding: 1rem; }
.tables-chalkboard .section-heading { margin-bottom: .35rem; }
.tables-board { list-style: none; margin: 0; padding: 0; }
.tables-board-row { align-items: center; border-bottom: 1px solid #48433b; display: grid; gap: .65rem; grid-template-columns: minmax(0, 1fr) auto auto; padding: .7rem 0; }
.tables-board-row:last-child { border-bottom: 0; }
.tables-board-player { min-width: 0; }
.tables-board-player > strong { display: block; overflow-wrap: anywhere; }
.tables-board-game, .tables-board-time { color: #c9c0b0; display: block; font-size: .78rem; margin-top: .2rem; }
.tables-board-result { align-items: center; display: flex; gap: .45rem; min-width: 0; }
.tables-board-result .dice-face { height: 2rem; width: 2rem; }
.tables-board-result-copy { color: #f2c978; font-size: .85rem; white-space: nowrap; }
.tables-board-time { margin-top: 0; white-space: nowrap; }
.table-records { margin-top: 1.5rem; }
.table-record-row { align-items: stretch; display: grid; gap: .7rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.table-record { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; display: flex; flex-direction: column; min-width: 0; padding: .8rem; }
.table-record-dice { border-left: .3rem solid #e2aa4b; }
.table-record-high-low { border-left: .3rem solid #e694b0; }
.table-record-lucky-number { border-left: .3rem solid #f2c978; }
.table-record-odd-even { border-left: .3rem solid #8fd3c7; }
.table-record-over-under { border-left: .3rem solid #b9a7e8; }
.table-record-doubles { border-left: .3rem solid #e2aa4b; }
.table-record-red-black { border-left: .3rem solid #d7789a; }
.table-record-slot { border-left: .3rem solid #c42a55; }
.table-record-name { color: #d8a950; font-size: .78rem; font-weight: 700; letter-spacing: .1em; line-height: 1.2; margin: 0; overflow-wrap: anywhere; text-transform: uppercase; }
.table-record-line { align-items: center; display: grid; gap: .35rem; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); margin: auto 0 0; padding-top: .65rem; }
.table-record-stat { align-items: baseline; display: flex; flex-wrap: wrap; gap: .25rem; min-width: 0; }
.table-record-stat:last-child { justify-content: flex-end; text-align: right; }
.table-record-line strong { color: #f2c978; font-size: 1.5rem; line-height: 1; overflow-wrap: anywhere; }
.table-record-line span { color: #c9c0b0; font-size: .8rem; }
.table-record-divider { color: #8f897d !important; }
.game-card { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; color: inherit; display: flex; flex-direction: column; gap: .4rem; min-width: 0; padding: .9rem; text-decoration: none; }
.game-card:hover, .game-card:focus-visible { border-color: #f2c978; box-shadow: 0 0 0 .15rem #413b30; }
.game-card-dice { border-left: .3rem solid #e2aa4b; }
.game-card-hot-dice { border-left: .3rem solid #c42a55; }
.game-card-high-low { border-left: .3rem solid #e694b0; }
.game-card-lucky-number { border-left: .3rem solid #f2c978; }
.game-card-odd-even { border-left: .3rem solid #8fd3c7; }
.game-card-over-under { border-left: .3rem solid #b9a7e8; }
.game-card-doubles { border-left: .3rem solid #e2aa4b; }
.game-card-red-black { border-left: .3rem solid #d7789a; }
.game-card > * { min-width: 0; overflow-wrap: anywhere; }
.game-card-name { font-size: clamp(1rem, 4.5vw, 1.35rem); line-height: 1.15; margin: 0; }
.game-card p { color: #c9c0b0; margin: 0; }
.game-card .eyebrow { color: #d8a950; }
.game-card-status { color: #f2c978; font-size: .85rem; font-weight: 700; margin-top: .25rem; }
.game-card-action { color: #f8f3e8; margin-top: auto; padding-top: .4rem; }
.dice-panel { align-items: center; background: #2b2925; border: 1px solid #e2aa4b; border-radius: .6rem; box-shadow: inset 0 0 0 1px #413b30; display: flex; gap: 1rem; justify-content: space-between; padding: 1.25rem; }

.dice-page-nav { margin: 1rem 0 0; }
.dice-result-hero { align-items: stretch; flex-direction: column; gap: .7rem; }
.dice-result-hero .dice-status { text-align: center; }
.dice-hero-result { align-items: center; display: grid; gap: .65rem 1rem; grid-template-columns: minmax(0, 1fr) auto; }
.dice-hero-result .dice-faces { gap: clamp(.35rem, 2vw, .75rem); justify-content: center; }
.dice-hero-result .dice-face { background-size: clamp(.75rem, 2.2vw, 1.1rem); border-width: .2rem; height: clamp(4.5rem, 15vw, 7rem); width: clamp(4.5rem, 15vw, 7rem); }
.dice-hero-total { align-items: center; display: flex; flex-direction: column; min-width: 4.7rem; }
.dice-hero-total .eyebrow { margin-bottom: 0; }
.dice-hero-total .dice-total { font-size: clamp(4rem, 15vw, 7rem); font-weight: 950; }
.dice-hero-total .dice-total::before { content: none; }
.dice-hero-outcome { color: #f8f3e8; font-size: clamp(1rem, 3vw, 1.35rem); font-weight: 800; grid-column: 1 / -1; margin: 0; text-align: center; }
.dice-hero-result .dice-roll-source { grid-column: 1 / -1; text-align: center; }
.dice-result-hero .dice-roll-button { align-self: center; }
.dice-result-hero[data-dice-animation="roll"] .dice-face { animation: dice-tumble .72s cubic-bezier(.2, .8, .25, 1) both; }
.dice-result-hero[data-dice-animation="roll"] .dice-face:nth-child(2) { animation-delay: .06s; }
.dice-result-hero[data-dice-animation="roll"] .dice-total { animation: dice-total-land .72s cubic-bezier(.2, .8, .25, 1) both; }
@keyframes dice-tumble {
  0% { filter: blur(2px); transform: translateY(-.7rem) rotate(-18deg) scale(.82); }
  55% { filter: blur(.4px); transform: translateY(.25rem) rotate(380deg) scale(1.08); }
  100% { filter: none; transform: none; }
}
@keyframes dice-total-land {
  0% { opacity: .35; transform: scale(.55); }
  70% { opacity: 1; transform: scale(1.12); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .dice-result-hero[data-dice-animation="roll"] .dice-face,
  .dice-result-hero[data-dice-animation="roll"] .dice-total { animation: none; }
}
.dice-panel-result { align-items: center; display: flex; gap: .7rem; }
.dice-panel-result-copy { display: flex; flex-direction: column; gap: .2rem; }
.dice-panel-result-copy strong { color: #f2c978; }
.dice-panel-result-copy span { color: #c9c0b0; font-size: .85rem; }
.red-black-panel-result { min-width: min(100%, 22rem); }
.dice-status h2 { font-size: clamp(1.6rem, 8vw, 2.5rem); margin: 0; }
.dice-roll-button { background: #e2aa4b; border: 0; border-radius: .5rem; color: #1e1d1a; cursor: pointer; font-size: clamp(1rem, 5vw, 1.4rem); font-weight: 900; min-height: 5rem; min-width: 9rem; padding: 1rem; }
.dice-roll-button:disabled { cursor: not-allowed; opacity: .45; }
.dice-passes { display: grid; gap: 1rem; }
.high-low-buttons { display: grid; gap: .65rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.high-low-button { border: 0; border-radius: .5rem; color: #1e1d1a; cursor: pointer; font-size: clamp(1.2rem, 7vw, 2rem); font-weight: 900; min-height: 5rem; min-width: 8rem; padding: 1rem 1.25rem; }
.high-button { background: #e694b0; }
.low-button { background: #78c9c3; }
.high-low-button:disabled { cursor: not-allowed; opacity: .45; }
.odd-button { background: #8fd3c7; }
.even-button { background: #b9a7e8; }
.red-button { background: #d7789a; }
.black-button { background: #241c14; border: 2px solid #f8f3e8; color: #f8f3e8; }
.red-black-color { border-radius: .35rem; display: inline-block; font-size: .8rem; font-weight: 900; letter-spacing: .08em; padding: .55rem .65rem; }
.red-black-color-red { background: #d7789a; color: #241c14; }
.red-black-color-black { background: #17130f; border: 1px solid #8f897d; color: #f8f3e8; }
.red-black-board-color { height: 2rem; padding: 0; width: 2rem; }
.high-low-call-guess { color: #f2c978; font-size: 1.5rem; }
.lucky-number-buttons { display: grid; gap: .45rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lucky-number-button { background: #f2c978; border: 0; border-radius: .5rem; color: #1e1d1a; cursor: pointer; font-size: clamp(1.4rem, 8vw, 2.2rem); font-weight: 900; min-height: 4rem; min-width: 4rem; padding: .6rem; }
.lucky-number-button:disabled { cursor: not-allowed; opacity: .45; }
.lucky-number-choice { color: #f2c978; font-size: 1.6rem; }
.dice-rolls { display: grid; gap: .7rem; list-style: none; margin: 0; padding: 0; }
.dice-roll-card { align-items: center; background: #241c14; border: 1px solid #575148; border-left: .3rem solid #e2aa4b; border-radius: .5rem; display: flex; gap: 1rem; justify-content: space-between; padding: .75rem .8rem; }
.dice-roll-result, .dice-board-result { align-items: center; display: flex; gap: .55rem; min-width: 0; }
.dice-faces { display: flex; flex-shrink: 0; gap: .35rem; }
.dice-face { align-items: center; background-color: #f8f3e8; background-repeat: no-repeat; border: .15rem solid #d8a950; border-radius: .3rem; box-shadow: inset 0 -.2rem 0 #d6c4a2, 0 .15rem 0 #17130f; color: transparent; display: grid; font-size: 0; font-weight: 900; height: 2.5rem; line-height: 1; place-items: center; width: 2.5rem; }
.dice-face[data-value] { background-size: .55rem .55rem; }
.dice-face[data-value="1"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 50% 50%; }
.dice-face[data-value="2"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 25% 25%, 75% 75%; }
.dice-face[data-value="3"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 25% 25%, 50% 50%, 75% 75%; }
.dice-face[data-value="4"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 25% 25%, 75% 25%, 25% 75%, 75% 75%; }
.dice-face[data-value="5"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 25% 25%, 75% 25%, 50% 50%, 25% 75%, 75% 75%; }
.dice-face[data-value="6"] { background-image: radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%), radial-gradient(circle, #241c14 0 45%, transparent 50%); background-position: 25% 25%, 75% 25%, 25% 50%, 75% 50%, 25% 75%, 75% 75%; }
.dice-total { color: #f2c978; font-size: 1.6rem; line-height: 1; white-space: nowrap; }
.dice-total::before { color: #8f897d; content: "="; font-size: 1rem; margin-right: .45rem; }
.dice-roll-source { color: #c9c0b0; font-size: .85rem; text-align: right; }
.dice-board { background: #241c14; border: 1px solid #e2aa4b; border-radius: .6rem; list-style: none; margin: 0; overflow: hidden; padding: 0; }
.dice-board-row { align-items: center; border-bottom: 1px solid #48433b; display: grid; gap: .65rem; grid-template-columns: 2rem minmax(0, 1fr) auto; padding: .7rem .8rem; }
.dice-board-row:last-child { border-bottom: 0; }
.dice-board-rank { color: #8f897d; font-size: .85rem; font-weight: 700; }
.dice-board-player { min-width: 0; }
.dice-board-player > strong { display: block; overflow-wrap: anywhere; }
.dice-board-result { margin-top: .4rem; }
.dice-board-meta { color: #c9c0b0; display: block; font-size: .82rem; margin-top: .35rem; }
.dice-board-score { align-items: flex-end; display: flex; flex-direction: column; min-width: 3.5rem; }
.dice-board-score strong { color: #f2c978; font-size: 1.45rem; line-height: 1; }
.dice-flavor { color: #e694b0; font-size: .62rem; font-weight: 800; letter-spacing: .05em; margin-top: .2rem; }
@media (max-width: 40rem) {
  .dice-panel { align-items: stretch; flex-direction: column; }
  .dice-panel-result { justify-content: center; width: 100%; }
  .dice-panel-result-copy { min-width: 0; }
  .dice-roll-button { width: 100%; }
  .high-low-buttons { width: 100%; }
  .high-low-button { min-width: 0; width: 100%; }
  .lucky-number-buttons { width: 100%; }
  .lucky-number-button { min-width: 0; width: 100%; }
  .dice-roll-card { align-items: flex-start; flex-direction: column; }
  .dice-roll-source { text-align: left; }
  .game-corner-grid { gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-record-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-record { padding: .7rem; }
  .table-record-name { font-size: .72rem; letter-spacing: .07em; }
  .table-record-line { gap: .25rem; }
  .table-record-line strong { font-size: clamp(1.15rem, 6vw, 1.5rem); }
  .table-record-line span { font-size: .75rem; }
  .tables-chalkboard { padding: .8rem; }
  .tables-board-row { grid-template-columns: minmax(0, 1fr) auto; }
  .tables-board-time { grid-column: 1 / -1; justify-self: end; }
  .game-card { gap: .25rem; min-height: 10.5rem; padding: .7rem; }
  .game-card-name { font-size: 1rem; }
  .game-card p { font-size: .85rem; }
  .game-card-status { font-size: .8rem; }
  .game-card-action { font-size: .9rem; }
}

.claim-hero {
  background: linear-gradient(145deg, #413b30, #2b2925 72%);
  border: 1px solid #e2aa4b;
  border-radius: .75rem;
  box-shadow: 0 .45rem 0 #17130f, inset 0 0 0 1px #5c4b31;
  overflow: hidden;
  padding: clamp(1.4rem, 7vw, 2.5rem);
  position: relative;
}
.claim-hero::after {
  border: 1px dashed rgba(226, 170, 75, .35);
  border-radius: 50%;
  content: "";
  height: 10rem;
  position: absolute;
  right: -4rem;
  top: -4rem;
  transform: rotate(-15deg);
  width: 10rem;
}
.claim-hero h1, .claim-hero-copy, .claim-hero form { position: relative; z-index: 1; }
.claim-hero h1 { font-size: clamp(2.2rem, 11vw, 4rem); line-height: .95; margin: 0; max-width: 14ch; overflow-wrap: anywhere; }
.claim-hero-copy { color: #f2c978; margin: 1rem 0 0; max-width: 30rem; }
.claim-hero form { margin-top: 1.75rem; max-width: none; }
.claim-cta { box-shadow: 0 .25rem 0 #9a6a24; font-size: 1.1rem; letter-spacing: .04em; min-height: 3.5rem; text-transform: uppercase; width: 100%; }
.claim-cta:active { box-shadow: 0 .1rem 0 #9a6a24; transform: translateY(.15rem); }
.claim-cta:focus-visible { outline: 3px solid #f8f3e8; outline-offset: 3px; }

.claim-result-hero { background: #413b30; border: 1px solid #e2aa4b; border-radius: .6rem; padding: 1.25rem; }
.claim-result-hero h1 { margin: 0 0 .4rem; }
.claim-result-hero p:last-child { color: #f2c978; margin-bottom: 0; }
.claim-next { border-top: 1px solid #575148; padding-top: 1.5rem; }
.next-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.secondary-action { background: #413b30; color: #f8f3e8; }
.redemption-qr-panel { text-align: center; }
.redemption-qr svg { background: #fff; display: block; height: min(82vw, 32rem); margin: 1rem auto; padding: .75rem; width: min(82vw, 32rem); }
.redemption-honor { font-size: 1.05rem; }
.redemption-next { border-top: 1px solid #575148; padding-top: 1.5rem; }
.redemption-backup { color: #c9c0b0; font-size: .85rem; margin: 1rem 0; text-align: left; }
.redemption-backup summary { color: #f2c978; cursor: pointer; }
.redemption-confirm-button { font-size: 1.2rem; min-height: 3.5rem; width: 100%; }
.redemption-used { border-color: #8f897d; }
@media (max-width: 40rem) {
  .next-actions, .next-actions .button-link { width: 100%; }
  .next-actions .button-link { text-align: center; }
  .redemption-qr svg { height: min(88vw, 28rem); width: min(88vw, 28rem); }
}


/* Inventory and Codex share a loot-grid language. */
.item-grid { display: grid; gap: .7rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.item-grid-cell { background: #2b2925; border: 2px solid #575148; border-radius: .5rem; display: block; min-width: 0; overflow: hidden; padding: 0; }
.item-grid-cell.rarity-common, .item-grid-cell.rarity-uncommon, .item-grid-cell.rarity-rare,
.item-grid-cell.rarity-epic, .item-grid-cell.rarity-legendary, .item-grid-cell.rarity-special { border-color: var(--rarity-color); }
.rarity-common .item-artwork, .rarity-uncommon .item-artwork, .rarity-rare .item-artwork,
.rarity-epic .item-artwork, .rarity-legendary .item-artwork, .rarity-special .item-artwork { border-color: var(--rarity-color); }
.item-grid-cell[data-owned="true"], .reward-card[class*="rarity-"] { box-shadow: 0 0 .55rem var(--rarity-glow); }
.item-grid-link { color: inherit; text-decoration: none; }
.item-grid-link:hover, .item-grid-link:focus-visible { border-color: var(--rarity-color); box-shadow: 0 0 .8rem var(--rarity-glow), 0 0 0 .15rem rgba(248, 243, 232, .16); outline: 0; }
.item-grid-summary { align-items: stretch; display: flex; flex-direction: column; gap: .35rem; min-height: 9rem; padding: .45rem; }
.item-grid-artwork { flex: 0 0 auto; height: auto; width: 100%; aspect-ratio: 1; }
.item-artwork-missing { display: block; }
.item-grid-name { font-size: .9rem; font-weight: 800; line-height: 1.15; overflow-wrap: anywhere; }
.item-grid-meta { align-items: center; color: #c9c0b0; display: flex; font-size: .72rem; gap: .35rem; justify-content: space-between; margin-top: auto; }
.item-grid-meta .item-rarity { font-weight: 700; }
.item-wearing { color: #d8a950; font-size: .9em; font-weight: 800; }
.item-grid-cell[data-owned="false"] .item-grid-artwork { filter: saturate(.55); opacity: .72; }
@media (min-width: 40.01rem) { .item-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 60rem) { .item-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.codex-page .codex-list { gap: .35rem; }
@media (min-width: 64rem) {
  .codex-page .item-grid { gap: .35rem; grid-template-columns: repeat(10, minmax(0, 1fr)); }
  .codex-page .item-grid-summary { gap: .12rem; min-height: 0; padding: .22rem; }
  .codex-page .item-grid-name { font-size: .68rem; }
  .codex-page .item-grid-meta { font-size: .52rem; }
  .codex-page .item-grid-cell { border-width: 1px; }
}
@media (max-width: 40rem) {
  .item-grid-meta { align-items: flex-start; flex-wrap: wrap; justify-content: flex-start; }
  .item-grid-meta > * { flex: 0 0 auto; white-space: nowrap; }
}

/* Keep the next playable table in reach after a result. */
.still-open-tables {
  background: #413b30;
  border: 1px solid #e2aa4b;
  border-radius: .6rem;
  margin: 1rem 0 1.5rem;
  padding: .8rem;
}
.still-open-tables .section-heading { margin-bottom: .55rem; }
.still-open-tables h2 { margin: 0; }
.still-open-table-list {
  display: flex;
  gap: .5rem;
  list-style: none;
  margin: 0;
  overflow-x: auto;
  padding: .1rem .1rem .35rem;
  scrollbar-color: #8f897d transparent;
  scrollbar-width: thin;
}
.still-open-table { flex: 0 0 auto; }
.still-open-table a {
  background: #2b2925;
  border: 1px solid #e2aa4b;
  border-radius: .45rem;
  color: #f8f3e8;
  display: block;
  min-width: 8.6rem;
  padding: .55rem .65rem;
  text-decoration: none;
}
.still-open-table a:hover, .still-open-table a:focus-visible {
  border-color: #f8f3e8;
  box-shadow: 0 0 0 .15rem #575148;
}
.still-open-table strong, .still-open-table span { display: block; overflow-wrap: anywhere; }
.still-open-table strong { font-size: .9rem; line-height: 1.15; }
.still-open-table span { color: #f2c978; font-size: .78rem; font-weight: 800; margin-top: .3rem; }
.still-open-table-needs-visit a { border-color: #e694b0; }
.still-open-table-needs-visit span { color: #e694b0; }
.still-open-table-extra-dice a { border-color: #8fd3c7; }
.still-open-table-extra-dice span { color: #8fd3c7; }
.game-card-open { border-color: #e2aa4b; box-shadow: inset 0 0 0 1px #5c4b31; }
.game-card-open .game-card-status, .game-card-needs-visit .game-card-status { color: #f2c978; }
.game-card-needs-visit { border-color: #8f5366; }
.game-card-needs-visit .game-card-status { color: #e694b0; }
.game-card-spent { border-color: #48433b; border-left-color: #575148; opacity: .62; }
.game-card-spent .game-card-status, .game-card-spent .game-card-action { color: #8f897d; }
@media (max-width: 40rem) {
  .still-open-tables { padding: .7rem; }
  .still-open-table a { min-width: 7.8rem; padding: .5rem; }
  .still-open-table strong { font-size: .8rem; }
  .still-open-table span { font-size: .7rem; }
}


/* Player-owned item inspection keeps actions out of the loot grid. */
.item-detail { background: #2b2925; border: 2px solid #575148; border-radius: .65rem; display: grid; gap: 1.25rem; grid-template-columns: minmax(12rem, 2fr) minmax(0, 3fr); margin-top: 1.5rem; overflow: hidden; padding: 1rem; }
.item-detail-artwork { aspect-ratio: 1; display: block; height: auto; width: 100%; }
.item-detail-copy { min-width: 0; }
.item-detail-copy h1 { margin: 0 0 .5rem; }
.item-detail-facts, .item-appearance dl { display: grid; gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1rem 0; }
.item-detail-facts div, .item-appearance dl div { background: #413b30; border-radius: .35rem; padding: .55rem .7rem; }
.item-detail-facts dt, .item-appearance dt { color: #c9c0b0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.item-detail-facts dd, .item-appearance dd { font-weight: 800; margin: .15rem 0 0; text-transform: capitalize; }
.item-appearance h2 { font-size: 1rem; margin-bottom: .5rem; }
.item-action-row { align-items: start; display: flex; flex-wrap: wrap; gap: .7rem; }
.item-action-row form { width: auto; }
.item-history .compact-list li { align-items: flex-start; }
@media (max-width: 40rem) {
  .item-detail { grid-template-columns: 1fr; }
  .item-detail-facts, .item-appearance dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .item-action-row, .item-action-row form, .item-action-row .button-link { width: 100%; }
  .item-action-row .button-link { text-align: center; }
}


/* Logged-in dashboard: one server-rendered panel at a time. */
.dashboard-page .loyalty-header { display: none; }
.player-dashboard { max-width: 100%; }
.player-game-header { border-bottom: 1px solid #575148; margin-bottom: 1rem; padding-bottom: .45rem; }
.player-shell-bar { align-items: center; background: #241c14; border: 1px solid #575148; border-radius: .5rem; display: flex; gap: .55rem; max-width: 100%; overflow-x: auto; padding: .3rem .4rem; scrollbar-color: #8f897d transparent; scrollbar-width: thin; white-space: nowrap; }
.player-shell-bar::-webkit-scrollbar { height: .35rem; }
.player-shell-bar::-webkit-scrollbar-thumb { background: #8f897d; border-radius: 1rem; }
.shell-primary-nav, .shell-utility-nav { align-items: center; display: flex; flex: 0 0 auto; gap: .25rem; }
.game-tab { align-items: center; background: #2b2925; border: 1px solid #575148; border-radius: .35rem; color: #c9c0b0; display: inline-flex; flex: 0 0 auto; font-size: .78rem; font-weight: 800; min-height: 2.5rem; padding: .35rem .7rem; text-decoration: none; }
.game-tab:hover, .game-tab:focus-visible { border-color: #f2c978; color: #f8f3e8; outline: 0; }
.game-tab-current { background: #e2aa4b; border-color: #f2c978; color: #1e1d1a; }
.game-tab-current:hover, .game-tab-current:focus-visible { background: #f2c978; color: #1e1d1a; }
.player-shell-username { align-items: center; background: #413b30; border: 1px solid #8f897d; border-radius: .35rem; color: #f2c978; display: inline-flex; flex: 0 0 auto; font-size: .78rem; font-weight: 800; min-height: 2.5rem; padding: 0 .7rem; }
.shell-utility-nav { border-left: 1px solid #575148; margin-left: auto; padding-left: .35rem; }
.shell-link { align-items: center; color: #c9c0b0; display: inline-flex; flex: 0 0 auto; font-size: .75rem; min-height: 2.5rem; padding: .35rem .55rem; text-decoration: none; }
.shell-link:hover, .shell-link:focus-visible { color: #f8f3e8; outline: 2px solid #32e7ff; outline-offset: 1px; }
.shell-signout { color: #e694b0; }
.dashboard-panel { min-width: 0; }
.dashboard-character-panel { padding: 0; text-align: left; }
.character-screen-layout { align-items: start; display: grid; gap: 1.25rem; grid-template-columns: minmax(19rem, .9fr) minmax(0, 2.1fr); }
.character-profile-panel, .character-inventory-panel { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; min-width: 0; padding: 1rem; }
.character-profile-panel { border-color: #e2aa4b; text-align: center; }
.character-inventory-panel { min-height: 100%; }
.character-archetype { color: #c9c0b0; display: block; font-size: .85rem; margin-top: .2rem; }
.dashboard-character-panel .dashboard-portrait { margin: 0 auto 1rem; max-height: 34rem; object-fit: cover; width: min(100%, 28rem); }
.dashboard-portrait-link { color: inherit; display: block; margin: 0 auto; max-width: 28rem; text-decoration: none; }
.dashboard-portrait-link:hover, .dashboard-portrait-link:focus-visible { outline: 3px solid #32e7ff; outline-offset: 3px; }
.character-empty-art { align-items: center; background: radial-gradient(circle, #413b30, #241c14); border: 1px solid #e2aa4b; border-radius: .5rem; display: grid; height: min(80vw, 22rem); margin: 0 auto 1rem; max-width: 28rem; place-items: center; }
.character-empty-art span { color: #e2aa4b; font-size: clamp(3rem, 12vw, 7rem); font-weight: 950; letter-spacing: .12em; }
.dashboard-subsection { border-top: 1px solid #575148; margin-top: 1.25rem; padding-top: 1rem; }
.dashboard-subsection h2 { margin-top: 0; }
.dashboard-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 1rem; }
.dashboard-stats .stat { padding: .45rem .25rem; text-align: center; }
.dashboard-stats .stat strong { font-size: 1.25rem; }
.dashboard-stats .stat span { font-size: .6rem; }
.dashboard-inventory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-inventory-grid .item-grid-cell { border-width: 1px; }
.dashboard-inventory-grid .item-grid-summary { gap: .15rem; min-height: 0; padding: .25rem; }
.dashboard-inventory-grid .item-grid-name { font-size: .7rem; }
.dashboard-inventory-grid .item-grid-meta { font-size: .58rem; }
.dashboard-inventory-grid .item-grid-artwork { aspect-ratio: 1; }
.inventory-panel-actions, .progress-panel-actions { margin-top: .7rem; text-align: right; }
.dashboard-progress-panel { margin: 0; }
.dashboard-progress-panel .progress-list { gap: .55rem; }
.dashboard-progress-panel .progress-card { padding: .65rem; }
.dashboard-progress-panel .progress-card p { font-size: .78rem; }
.dashboard-progress-panel .progress-card .progress-track { margin-top: .55rem; }
.dashboard-progress-panel .progress-card-with-art .progress-card-artwork { flex-basis: 3.5rem; height: 3.5rem; width: 3.5rem; }
.progress-supporting-data { border-top: 1px solid #575148; display: grid; gap: .8rem; margin-top: .9rem; padding-top: .8rem; }
.progress-supporting-data h2 { font-size: .95rem; margin: .15rem 0 .45rem; }
.progress-supporting-data .section-heading { margin-bottom: .35rem; }
.progress-supporting-data .night-strip { margin-bottom: 0; }
.progress-supporting-data .compact-list { margin: 0; }
.panel-link { color: #f2c978; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.house-panel { background: #241c14; border-color: #e2aa4b; }
.house-panel .tables-chalkboard { margin-bottom: 0; }

@media (min-width: 64rem) {
  .dashboard-page .loyalty-main { max-width: 90rem; padding-left: 2rem; padding-right: 2rem; }
  .character-profile-panel { position: sticky; top: 1rem; }
  .dashboard-inventory-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .dashboard-section { margin: 1.5rem 0; }
  .game-corner-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dashboard-progress-panel .progress-list { gap: .45rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-progress-panel .progress-card { padding: .45rem .55rem; }
  .dashboard-progress-panel .progress-card-heading strong { font-size: .88rem; }
  .dashboard-progress-panel .progress-card p { font-size: .7rem; }
  .dashboard-progress-panel .progress-card .progress-cycle { margin-top: .3rem; }
  .dashboard-progress-panel .progress-card .progress-track { height: .45rem; margin-top: .35rem; }
  .dashboard-progress-panel .progress-card-with-art { gap: .55rem; }
  .dashboard-progress-panel .progress-card-with-art .progress-card-artwork { flex-basis: 2.5rem; height: 2.5rem; width: 2.5rem; }
}

@media (min-width: 40.01rem) and (max-width: 63.99rem) {
  .dashboard-inventory-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 40rem) {
  .dashboard-page .loyalty-main { padding-left: .75rem; padding-right: .75rem; }
  .player-shell-bar { margin-right: -.75rem; padding-right: .75rem; }
  .shell-utility-nav { margin-left: 0; }
  .character-screen-layout { grid-template-columns: 1fr; }
  .character-profile-panel { position: static; }
  .dashboard-stats { gap: .3rem; }
  .dashboard-stats .stat { padding: .35rem .1rem; }
  .dashboard-stats .stat strong { font-size: 1rem; }
  .dashboard-stats .stat span { font-size: .5rem; }
  .dashboard-inventory-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.help-button { background: transparent; border: 1px solid #8f897d; border-radius: .35rem; color: #f2c978; cursor: pointer; font: inherit; font-size: .8rem; font-weight: 700; min-height: 2.75rem; padding: .45rem .7rem; }
.help-button:hover, .help-button:focus-visible { border-color: #f8f3e8; outline: 3px solid #32e7ff; outline-offset: 2px; }
.help-popover { background: #413b30; border: 1px solid #e2aa4b; border-radius: .4rem; color: #f8f3e8; max-width: min(22rem, calc(100vw - 2rem)); padding: .7rem; }
.equipped-item { color: inherit; min-height: 2.75rem; text-decoration: none; }
.equipped-item:hover, .equipped-item:focus-visible { border-color: #32e7ff; box-shadow: 0 0 0 .15rem #413b30; outline: 0; }

.character-identity h1 { font-size: 1.15rem; margin: .65rem 0 .1rem; overflow-wrap: anywhere; }
.equipped-loadout-icon-only { gap: .45rem; justify-content: center; }
.equipped-loadout-icon-only .equipped-item { align-items: center; justify-content: center; max-width: none; padding: .3rem; width: 3.5rem; }
.equipped-loadout-icon-only .equipped-item-artwork { flex: 0 0 2.75rem; }

/* Last Call Dice: the tray is the game, not a form card. */
.game-page .loyalty-header { display: none; }
.game-page .loyalty-main { max-width: 90rem; padding-left: 2rem; padding-right: 2rem; }
.game-page .player-shell-bar { margin-bottom: 1.25rem; }
.dice-game-page { --dice-wood: #241812; --dice-felt: #302118; --dice-amber: #e2aa4b; }
.dice-title-row { align-items: end; display: flex; gap: 1rem; justify-content: space-between; margin: 0 0 1rem; }
.dice-title-row h1 { font-size: clamp(2rem, 5vw, 3.3rem); line-height: .95; margin: 0; }
.dice-title-row p:last-child { color: #c9c0b0; margin: .45rem 0 0; }
.dice-status-pill { background: #413b30; border: 1px solid var(--dice-amber); border-radius: 2rem; color: #f2c978; font-size: .78rem; font-weight: 900; letter-spacing: .05em; margin: 0; padding: .55rem .8rem; white-space: nowrap; }
.dice-game-grid { align-items: stretch; display: grid; gap: 1rem; grid-template-columns: minmax(0, 2fr) minmax(18rem, 1fr); }
.dice-tray { background: radial-gradient(circle at 50% 0%, #4c3422, var(--dice-felt) 52%, var(--dice-wood)); border: 1px solid var(--dice-amber); border-radius: .8rem; box-shadow: inset 0 0 0 .3rem rgba(15, 10, 8, .45), inset 0 .2rem 1rem rgba(246, 203, 115, .13), 0 .35rem 0 #17100c; min-height: 25rem; overflow: hidden; padding: 1rem; position: relative; }
.dice-tray::before { border: 1px solid rgba(242, 201, 120, .18); border-radius: .55rem; content: ""; inset: .7rem; pointer-events: none; position: absolute; }
.dice-tray-well { align-items: center; display: flex; flex-direction: column; justify-content: center; min-height: 20rem; position: relative; z-index: 1; }
.dice-tray-faces { align-items: center; gap: clamp(1rem, 4vw, 2rem); min-height: 9rem; }
.dice-tray .dice-face { border: .16rem solid #d8a950; border-radius: 15%; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 .55rem .8rem rgba(0, 0, 0, .35); height: clamp(7rem, 13vw, 8rem); width: clamp(7rem, 13vw, 8rem); }
.dice-tray .dice-face[data-value] { background-size: 1.1rem 1.1rem; }
.dice-tray-copy { align-items: center; display: flex; flex-direction: column; gap: .3rem; margin-top: 1.1rem; text-align: center; }
.dice-message { color: #f8f3e8; font-size: 1rem; font-weight: 700; margin: 0; }
.dice-practice-tag { background: #413b30; border: 1px solid #c978ff; border-radius: 1rem; color: #f0c7ff; font-size: .68rem; font-weight: 900; letter-spacing: .1em; padding: .2rem .5rem; }
.dice-outcome { color: #f8f3e8; font-size: 1.2rem; letter-spacing: .08em; margin-top: .2rem; }
.dice-outcome-special { color: #ff62d2; text-shadow: 0 0 .7rem rgba(255, 98, 210, .4); }
.dice-total { color: #f2c978; font-size: clamp(3.5rem, 7vw, 5.5rem); font-weight: 950; line-height: .9; }
.dice-total::before { content: none; }
.dice-tray .dice-roll-source { font-size: .76rem; text-align: center; }
.dice-controls { align-items: stretch; display: grid; gap: .7rem; grid-template-columns: 1fr 1.6fr; margin: 0 auto; max-width: 34rem; position: relative; z-index: 1; }
.dice-real-form { display: contents; }
.dice-practice-button, .dice-roll-button { border-radius: .5rem; cursor: pointer; font-size: .95rem; font-weight: 900; letter-spacing: .04em; min-height: 3.5rem; padding: .7rem; }
.dice-practice-button { background: transparent; border: 1px solid #8f897d; color: #f8f3e8; }
.dice-practice-button:hover, .dice-practice-button:focus-visible { border-color: #32e7ff; outline: 2px solid #32e7ff; outline-offset: 2px; }
.dice-roll-button { background: var(--dice-amber); box-shadow: 0 .2rem 0 #9a6a24; min-width: 0; }
.dice-roll-button:hover, .dice-roll-button:focus-visible { background: #f2c978; outline: 3px solid #32e7ff; outline-offset: 2px; }
.dice-roll-button:disabled, .dice-practice-button:disabled { cursor: not-allowed; opacity: .48; }
.dice-right-rail { display: flex; flex-direction: column; gap: .7rem; max-height: 25rem; min-height: 0; }
.dice-rail-panel { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; min-height: 0; overflow: hidden; padding: .75rem; }
.dice-rail-panel:nth-child(2) { flex: 1 1 auto; overflow-y: auto; }
.dice-rail-heading { align-items: baseline; border-bottom: 1px solid #575148; display: flex; gap: .5rem; justify-content: space-between; margin-bottom: .25rem; padding-bottom: .4rem; }
.dice-rail-heading h2 { font-size: .9rem; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.dice-rail-heading strong, .dice-rail-heading span { color: #f2c978; font-size: .75rem; }
.dice-compact-list, .dice-leader-list, .dice-extra-list { list-style: none; margin: 0; padding: 0; }
.dice-compact-list { max-height: 6.8rem; overflow-y: auto; }
.dice-compact-list li { align-items: center; border-bottom: 1px solid #48433b; display: flex; gap: .45rem; min-height: 2rem; padding: .25rem 0; }
.dice-compact-list li:last-child, .dice-leader-list li:last-child { border-bottom: 0; }
.dice-mini-faces { display: flex; gap: .2rem; }
.dice-mini-faces .dice-face { height: 1.35rem; width: 1.35rem; }
.dice-mini-faces .dice-face[data-value] { background-size: .3rem .3rem; }
.dice-mini-total, .dice-leader-score { color: #f2c978; margin-left: auto; }
.dice-mini-source { color: #c9c0b0; font-size: .7rem; }
.dice-empty-copy { color: #c9c0b0; font-size: .8rem; margin: .45rem 0 0; }
.dice-leader-list li { align-items: center; border-bottom: 1px solid #48433b; display: flex; gap: .5rem; min-height: 2rem; padding: .2rem 0; }
.dice-leader-player { display: flex; flex: 1; gap: .45rem; justify-content: space-between; min-width: 0; }
.dice-leader-player strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dice-leader-player small { color: #c9c0b0; font-size: .68rem; white-space: nowrap; }
.dice-board-rank { color: #8f897d; font-size: .75rem; }
.dice-leader-score { align-items: flex-end; display: flex; flex-direction: column; }
.dice-leader-score small { color: #ff62d2; font-size: .52rem; letter-spacing: .04em; }
.dice-extra-list li { align-items: center; border-bottom: 1px solid #48433b; display: flex; gap: .5rem; justify-content: space-between; padding: .4rem 0; }
.dice-extra-list li:last-child { border-bottom: 0; }
.dice-extra-list div { display: grid; min-width: 0; }
.dice-extra-list strong { overflow-wrap: anywhere; }
.dice-extra-list span { color: #f2c978; font-size: .8rem; }
.dice-extra-list small { color: #c9c0b0; font-size: .68rem; }
.dice-use-button { background: #e2aa4b; border: 0; border-radius: .3rem; color: #1e1d1a; cursor: pointer; font-size: .75rem; font-weight: 900; padding: .5rem .65rem; }
.dice-use-button:disabled { cursor: not-allowed; opacity: .45; }
.dice-other-tables { margin-top: 1rem; }
.dice-other-tables h2 { font-size: .85rem; letter-spacing: .1em; margin: 0 0 .45rem; text-transform: uppercase; }
.dice-other-table-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.dice-other-table { align-items: center; background: #2b2925; border: 1px solid #575148; border-left: .22rem solid #e2aa4b; border-radius: .4rem; color: inherit; display: flex; gap: .55rem; justify-content: space-between; min-height: 2.5rem; padding: .35rem .6rem; text-decoration: none; }
.dice-other-table:hover, .dice-other-table:focus-visible { border-color: #32e7ff; outline: 2px solid #32e7ff; outline-offset: 1px; }
.dice-other-table span { color: #c9c0b0; font-size: .72rem; }
.dice-tray[data-dice-state="shaking"] .dice-face { animation: dice-shake-one .32s ease-in-out infinite alternate; }
.dice-tray[data-dice-state="shaking"] .dice-face:nth-child(2) { animation-delay: -.13s; }
.dice-tray[data-dice-state="committing"] .dice-face { animation: dice-throw .7s ease-in both; }
.dice-tray[data-dice-state="committing"] .dice-face:nth-child(2) { animation-delay: .08s; }
.dice-tray[data-dice-animation="roll"] .dice-face { animation: dice-land .82s cubic-bezier(.2, .8, .25, 1) both; }
.dice-tray[data-dice-animation="roll"] .dice-face:nth-child(2) { animation-delay: .08s; }
@keyframes dice-shake-one { from { transform: translate(-3px, 2px) rotate(-3deg); } to { transform: translate(4px, -2px) rotate(4deg); } }
@keyframes dice-throw { 0% { transform: translateY(.3rem) rotate(0); } 45% { transform: translateY(-1.6rem) rotate(150deg) scale(1.05); } 100% { transform: translateY(0) rotate(360deg); } }
@keyframes dice-land { 0% { filter: blur(1px); transform: translateY(-1rem) rotate(-25deg) scale(.86); } 75% { transform: translateY(.2rem) rotate(12deg) scale(1.03); } 100% { filter: none; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .dice-tray[data-dice-state="shaking"] .dice-face, .dice-tray[data-dice-state="committing"] .dice-face, .dice-tray[data-dice-animation="roll"] .dice-face { animation: none; }
}
@media (min-width: 40.01rem) and (max-width: 63.99rem) {
  .dice-game-grid { grid-template-columns: 1fr; }
  .dice-right-rail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
  .dice-extra-panel { grid-column: 1 / -1; }
}
@media (max-width: 40rem) {
  .game-page .loyalty-main { padding-left: .75rem; padding-right: .75rem; }
  .dice-title-row { align-items: start; flex-direction: column; gap: .6rem; }
  .dice-title-row h1 { font-size: 2.25rem; }
  .dice-status-pill { align-self: flex-start; }
  .dice-desktop-reset { display: none; }
  .dice-game-grid { display: block; }
  .dice-tray { min-height: 0; padding: .75rem; }
  .dice-tray-well { min-height: 18rem; }
  .dice-tray-faces { gap: .7rem; }
  .dice-tray .dice-face { height: clamp(5.25rem, 27vw, 6.5rem); width: clamp(5.25rem, 27vw, 6.5rem); }
  .dice-tray .dice-face[data-value] { background-size: .75rem .75rem; }
  .dice-controls { margin-top: .25rem; width: 100%; }
  .dice-right-rail { gap: .7rem; margin-top: .7rem; max-height: none; }
  .dice-rail-panel:nth-child(2) { overflow: visible; }
  .dice-other-tables { margin-top: .8rem; }
}
.hot-dice-tray .dice-tray-well { min-height: 24rem; }
.hot-dice-faces { display: grid; gap: clamp(.75rem, 4vw, 1.25rem); grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(100%, 20rem); }
.hot-dice-chain { color: #e2aa4b; display: block; font-size: clamp(1rem, 3vw, 1.35rem); font-weight: 950; letter-spacing: .18em; line-height: 1; margin: .7rem 0 0; min-height: 1.35rem; text-align: center; text-shadow: 0 0 .75rem rgba(226, 170, 75, .55); text-transform: uppercase; }
.hot-dice-faces > .dice-face { aspect-ratio: 1; height: var(--hot-die-size); transition: opacity .12s ease, border-color .12s ease, box-shadow .12s ease; width: var(--hot-die-size); }
.hot-dice-tray.is-blank .hot-die-cube-face { background-image: none; }
.hot-dice-faces > .dice-face.is-matching { border-color: #f2c978; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 1rem rgba(242, 201, 120, .55), 0 .55rem .8rem rgba(0, 0, 0, .35); }
.hot-dice-tray.is-quads .hot-die.is-matching .hot-die-cube-face { border-color: #ffd35a; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(255, 211, 90, .62), 0 .55rem .8rem rgba(0, 0, 0, .35); }
.hot-dice-tray.is-all-sixes .hot-die.is-matching .hot-die-cube-face { border-color: #ff62d2; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(255, 98, 210, .65), 0 .55rem .8rem rgba(0, 0, 0, .35); }
.hot-dice-tray.is-two-pair .hot-die.is-matching .hot-die-cube-face { border-color: #32e7ff; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(50, 231, 255, .62), 0 .55rem .8rem rgba(0, 0, 0, .35); }
.hot-dice-faces > .dice-face.is-single { opacity: .5; }
.hot-dice-faces > .hot-die { --hot-die-final-transform: translateY(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg); --hot-die-size: clamp(7rem, 13vw, 8rem); --hot-die-throw-mid-x: 0rem; --hot-die-throw-x: 0rem; background-color: transparent; border: 0; box-shadow: none; overflow: visible; position: relative; transform-style: preserve-3d; }
.hot-dice-faces > .hot-die::before, .hot-dice-faces > .hot-die::after { content: ""; left: 50%; opacity: 0; pointer-events: none; position: absolute; top: calc(100% - .2rem); transform: translate(-50%, -50%); z-index: 0; }
.hot-dice-faces > .hot-die::before { border: .12rem solid rgba(242, 201, 120, .7); border-radius: 50%; height: .75rem; width: 3rem; }
.hot-dice-faces > .hot-die::after { background: radial-gradient(circle at 15% 55%, rgba(201, 192, 176, .65) 0 .12rem, transparent .15rem), radial-gradient(circle at 38% 30%, rgba(226, 170, 75, .5) 0 .1rem, transparent .13rem), radial-gradient(circle at 67% 65%, rgba(201, 192, 176, .55) 0 .14rem, transparent .17rem), radial-gradient(circle at 88% 38%, rgba(226, 170, 75, .45) 0 .09rem, transparent .12rem); height: .9rem; width: 2.8rem; }
.hot-die-cube { z-index: 1; }
@media (max-width: 40rem) { .hot-dice-faces > .hot-die { --hot-die-size: clamp(5.25rem, 27vw, 6.5rem); } }
.hot-die-cube { height: 100%; position: relative; transform: var(--hot-die-final-transform); transform-style: preserve-3d; width: 100%; }
.hot-die-cube-face { backface-visibility: hidden; border: .16rem solid #d8a950; border-radius: 15%; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 .55rem .8rem rgba(0, 0, 0, .35); height: 100%; inset: 0; position: absolute; width: 100%; }
.hot-die-cube-face--front { transform: translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die-cube-face--back { transform: rotateY(180deg) translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die-cube-face--right { transform: rotateY(90deg) translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die-cube-face--left { transform: rotateY(-90deg) translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die-cube-face--top { transform: rotateX(90deg) translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die-cube-face--bottom { transform: rotateX(-90deg) translateZ(calc(var(--hot-die-size) / 2)); }
.hot-die[data-value="1"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg); }
.hot-die[data-value="2"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(-90deg) rotateY(0deg) rotateZ(0deg); }
.hot-die[data-value="3"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(0deg) rotateY(-90deg) rotateZ(0deg); }
.hot-die[data-value="4"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(0deg) rotateY(90deg) rotateZ(0deg); }
.hot-die[data-value="5"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(90deg) rotateY(0deg) rotateZ(0deg); }
.hot-die[data-value="6"] .hot-die-cube { --hot-die-final-transform: translateY(0) rotateX(0deg) rotateY(180deg) rotateZ(0deg); }
.hot-dice-rules { align-items: center; display: grid; inset: 1rem; justify-items: center; pointer-events: none; position: absolute; z-index: 2; }
.hot-dice-rules-card { background: #2b2925; border: 1px solid var(--dice-amber); border-radius: .6rem; box-shadow: 0 .4rem 1rem rgba(0, 0, 0, .45); color: #f8f3e8; margin: 0; max-width: 28rem; padding: 1.1rem; pointer-events: auto; width: 100%; }
.hot-dice-rules-card:not([open]) { display: none !important; }
.hot-dice-rules-card h2 { color: #f2c978; font-size: 1.25rem; margin: 0 0 .7rem; }
.hot-dice-rules-card p { color: #f8f3e8; margin: .45rem 0; }
.hot-dice-rules-card button, .hot-dice-rules-button { background: var(--dice-amber); border: 0; border-radius: .4rem; color: #1e1d1a; cursor: pointer; font-weight: 900; margin-top: .7rem; min-height: 2.75rem; padding: .55rem .8rem; }
.hot-dice-rules-button { align-self: end; justify-self: end; margin: 0; pointer-events: auto; }
.hot-dice-rules-button[hidden] { display: none !important; }
.hot-dice-rules-card button:hover, .hot-dice-rules-card button:focus-visible, .hot-dice-rules-button:hover, .hot-dice-rules-button:focus-visible { outline: 3px solid #32e7ff; outline-offset: 2px; }
.hot-dice-tray { --hot-dice-charge-blur: 0px; --hot-dice-throw-depth: .4rem; --hot-dice-throw-lift: -2.2rem; --hot-dice-throw-mid-depth: .2rem; --hot-dice-throw-mid-lift: -.55rem; --hot-dice-throw-mid-spin-x: 90deg; --hot-dice-throw-mid-spin-y: 140deg; --hot-dice-throw-mid-spin-z: 50deg; --hot-dice-throw-late-spin-x: 180deg; --hot-dice-throw-late-spin-y: 240deg; --hot-dice-throw-late-spin-z: 90deg; --hot-dice-throw-spin-x: 240deg; --hot-dice-throw-spin-y: 300deg; --hot-dice-throw-spin-z: 100deg; perspective: 40rem; touch-action: none; }
.hot-dice-hint { color: #c9c0b0; font-size: .8rem; letter-spacing: .08em; margin: 1rem 0 0; text-transform: lowercase; }
.hot-dice-total { display: block; margin-top: 1rem; }
.hot-dice-tray.is-dry .hot-die { filter: grayscale(.95) saturate(.3) brightness(.8); }
.hot-dice-pb-banner, .hot-dice-keep-it { font-size: clamp(1rem, 5vw, 1.45rem); left: 50%; letter-spacing: .08em; max-width: calc(100% - 1rem); overflow: hidden; pointer-events: none; position: absolute; text-align: center; text-overflow: ellipsis; transform: translate(-50%, -50%); white-space: nowrap; width: calc(100% - 1rem); }
.hot-dice-pb-banner { color: #ffd35a; top: 68%; }
.hot-dice-pb-banner.is-lit { animation: hot-dice-pb-banner .95s ease-out both; text-shadow: 0 0 .8rem rgba(255, 211, 90, .75); }
.hot-dice-recap { align-items: baseline; background: rgba(23, 16, 15, .9); border: 1px solid #8f897d; border-radius: .55rem; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: .3rem .6rem; justify-content: center; left: 50%; max-width: calc(100% - 1rem); padding: .45rem .7rem; pointer-events: none; position: absolute; text-align: center; top: 84%; transform: translate(-50%, -50%) scale(.96); width: min(calc(100% - 1rem), 18rem); }
.hot-dice-recap.is-lit { animation: hot-dice-recap .3s ease-out both; }
.hot-dice-recap-hand { color: #f2c978; letter-spacing: .06em; }
.hot-dice-recap-total { color: #f8f3e8; font-size: 1.05rem; font-weight: 900; }
.hot-dice-recap-note { color: #d7e5ea; font-size: .8rem; letter-spacing: .08em; }
.hot-dice-recap-dealer { flex-basis: 100%; color: #c9c0b0; font-size: .72rem; line-height: 1.1; }
.hot-dice-keep-it { color: #d7e5ea; top: 57%; }
.hot-dice-keep-it.is-lit { animation: hot-dice-keep-it .95s ease-out both; text-shadow: 0 0 .8rem rgba(215, 229, 234, .7); }
.hot-dice-hand-name { display: block; max-width: 100%; overflow-wrap: anywhere; text-align: center; white-space: normal; }
.hot-dice-turn-status { color: #c9c0b0; font-size: .8rem; margin: .35rem 0 0; }
.hot-dice-dealer-line { color: #e2aa4b; font-size: .75rem; font-style: italic; letter-spacing: .04em; line-height: 1.1; margin: .3rem 0 0; text-align: center; }
.hot-dice-board { background: #241812; border: 1px solid #575148; border-radius: .8rem; margin-top: 1rem; padding: 1rem; }
.hot-dice-board-heading { align-items: baseline; display: flex; justify-content: space-between; }
.hot-dice-board-heading h2 { font-size: 1rem; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.hot-dice-board-heading span { color: #c9c0b0; font-size: .72rem; }
.hot-dice-board-grid { display: grid; gap: .7rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: .7rem; }
.hot-dice-board-panel { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: .7rem; }
.hot-dice-board-panel h3 { color: #f2c978; font-size: .78rem; letter-spacing: .08em; margin: 0 0 .35rem; text-transform: uppercase; }
.hot-dice-board-entry { align-items: baseline; display: flex; justify-content: space-between; margin: 0; }
.hot-dice-board-entry.is-stolen { animation: hot-dice-board-theft .62s ease-out both; gap: .45rem; }
.hot-dice-board-entry.is-stolen strong { animation: hot-dice-board-name-theft .62s ease-out both; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hot-dice-board-old-total { color: #8f897d; font-size: .75rem; margin-left: auto; text-decoration: line-through; white-space: nowrap; }
.hot-dice-board-entry span, .hot-dice-board-list li > span:last-child { color: #f2c978; font-size: 1.4rem; font-weight: 900; }
.hot-dice-board-list { list-style: none; margin: 0; padding: 0; }
.hot-dice-board-list li { align-items: baseline; border-bottom: 1px solid #48433b; display: flex; gap: .5rem; padding: .2rem 0; }
.hot-dice-board-list li:last-child { border-bottom: 0; }
.hot-dice-board-list li strong { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hot-dice-board-rank { color: #8f897d; font-size: .75rem; }
.hot-dice-board-old-rank { color: #8f897d; font-size: .7rem; text-decoration: line-through; white-space: nowrap; }
.hot-dice-board-list li.is-climb { animation: hot-dice-board-climb .62s ease-out both; }
.hot-dice-board-list li.is-climb .hot-dice-board-rank { animation: hot-dice-board-climb-rank .62s ease-out both; }
.hot-dice-board-list li.is-climb strong { animation: hot-dice-board-climb-text .62s ease-out both; }
.hot-dice-board-empty { color: #c9c0b0; font-size: .8rem; margin: .3rem 0 0; }
@media (max-width: 40rem) { .hot-dice-board-grid { grid-template-columns: 1fr; } }
.hot-dice-prize { border-top: 1px solid #48433b; margin-top: .7rem; padding-top: .7rem; }
.hot-dice-prize h3 { color: #f2c978; font-size: .78rem; letter-spacing: .08em; margin: 0 0 .3rem; text-transform: uppercase; }
.hot-dice-prize-list { list-style: none; margin: 0; padding: 0; }
.hot-dice-prize-list li { align-items: baseline; display: flex; gap: .5rem; justify-content: space-between; }
.hot-dice-prize-list span, .hot-dice-prize-credit { color: #c9c0b0; font-size: .8rem; }
.hot-dice-prize-credit { margin: .6rem 0 0; }
.hot-dice-tray.is-shaking .hot-die-cube { animation: hot-dice-cube-tumble .8s linear infinite; filter: blur(var(--hot-dice-charge-blur)); transition: filter .08s linear; }
.hot-dice-tray.is-tumbling .hot-die-cube { animation: hot-dice-cube-throw .58s cubic-bezier(.2, .8, .25, 1) both; }
.hot-dice-tray.is-tumbling .hot-dice-faces > .hot-die:nth-child(1) { --hot-die-throw-mid-x: -1.25rem; --hot-die-throw-x: -2.5rem; }
.hot-dice-tray.is-tumbling .hot-dice-faces > .hot-die:nth-child(2) { --hot-die-throw-mid-x: -.4rem; --hot-die-throw-x: -.8rem; }
.hot-dice-tray.is-tumbling .hot-dice-faces > .hot-die:nth-child(3) { --hot-die-throw-mid-x: .5rem; --hot-die-throw-x: 1rem; }
.hot-dice-tray.is-tumbling .hot-dice-faces > .hot-die:nth-child(4) { --hot-die-throw-mid-x: 1.25rem; --hot-die-throw-x: 2.5rem; }
.hot-dice-tray.is-landed .hot-die-cube { animation: hot-dice-cube-land .72s cubic-bezier(.2, .8, .25, 1) both; }
.hot-dice-tray.is-landed .hot-die.is-near-miss .hot-die-cube-face { animation: hot-dice-near-miss-glow .34s ease-out both; }
.hot-dice-tray.is-landed .hot-die::before { animation: hot-dice-contact-ring .42s cubic-bezier(.2, .8, .25, 1) both; }
.hot-dice-tray.is-landed .hot-die::after { animation: hot-dice-dust-puff .28s ease-out both; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(1) .hot-die-cube { animation-delay: 0ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(2) .hot-die-cube { animation-delay: 55ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(3) .hot-die-cube { animation-delay: 110ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(4) .hot-die-cube { animation-delay: 165ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(1)::before, .hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(1)::after { animation-delay: 0ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(2)::before, .hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(2)::after { animation-delay: 55ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(3)::before, .hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(3)::after { animation-delay: 110ms; }
.hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(4)::before, .hot-dice-tray.is-landed .hot-dice-faces > .hot-die:nth-child(4)::after { animation-delay: 165ms; }
@keyframes hot-dice-board-theft { 0%, 100% { background-color: transparent; box-shadow: none; } 28% { background-color: rgba(226, 170, 75, .28); box-shadow: 0 0 .8rem rgba(226, 170, 75, .38); } 55% { background-color: rgba(255, 98, 210, .14); box-shadow: 0 0 .45rem rgba(255, 98, 210, .28); } }
@keyframes hot-dice-keep-it { 0%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.9); } 22% { opacity: 1; transform: translate(-50%, -50%) scale(1); } 58% { opacity: 1; transform: translate(-50%, -50%) scale(1.03); } }
@keyframes hot-dice-pb-banner { 0%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.9); } 22% { opacity: 1; transform: translate(-50%, -50%) scale(1); } 58% { opacity: 1; transform: translate(-50%, -50%) scale(1.03); } }
@keyframes hot-dice-recap { from { opacity: 0; transform: translate(-50%, -50%) scale(.9); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes hot-dice-board-climb { 0%, 100% { background-color: transparent; box-shadow: none; } 28% { background-color: rgba(242, 201, 120, .3); box-shadow: 0 0 .8rem rgba(242, 201, 120, .42); } 55% { background-color: rgba(255, 98, 210, .16); box-shadow: 0 0 .45rem rgba(255, 98, 210, .3); } }
@keyframes hot-dice-board-climb-rank { 0%, 100% { color: #8f897d; text-shadow: none; } 28% { color: #ffd35a; text-shadow: 0 0 .6rem rgba(255, 211, 90, .8); } 55% { color: #ffb0e7; text-shadow: 0 0 .45rem rgba(255, 98, 210, .55); } }
@keyframes hot-dice-board-climb-text { 0%, 100% { color: inherit; text-shadow: none; } 28% { color: #ffd35a; text-shadow: 0 0 .6rem rgba(255, 211, 90, .8); } 55% { color: #ffb0e7; text-shadow: 0 0 .45rem rgba(255, 98, 210, .55); } }
@keyframes hot-dice-board-name-theft { 0%, 100% { color: inherit; text-shadow: none; } 28% { color: #ffd35a; text-shadow: 0 0 .6rem rgba(255, 211, 90, .75); } 55% { color: #ffb0e7; text-shadow: 0 0 .45rem rgba(255, 98, 210, .5); } }
@keyframes hot-dice-cube-tumble { from { transform: translateY(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg); } to { transform: translateY(-.5rem) rotateX(360deg) rotateY(420deg) rotateZ(180deg); } }
@keyframes hot-dice-cube-throw {
  0% { transform: translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg); }
  42% { transform: translate3d(var(--hot-die-throw-mid-x), var(--hot-dice-throw-lift), var(--hot-dice-throw-depth)) rotateX(var(--hot-dice-throw-mid-spin-x)) rotateY(var(--hot-dice-throw-mid-spin-y)) rotateZ(var(--hot-dice-throw-mid-spin-z)); }
  78% { transform: translate3d(var(--hot-die-throw-x), var(--hot-dice-throw-mid-lift), var(--hot-dice-throw-mid-depth)) rotateX(var(--hot-dice-throw-late-spin-x)) rotateY(var(--hot-dice-throw-late-spin-y)) rotateZ(var(--hot-dice-throw-late-spin-z)); }
  100% { transform: translate3d(var(--hot-die-throw-x), 0, 0) rotateX(var(--hot-dice-throw-spin-x)) rotateY(var(--hot-dice-throw-spin-y)) rotateZ(var(--hot-dice-throw-spin-z)); }
}
@keyframes hot-dice-cube-land { from { transform: translateY(-.8rem) rotateX(-35deg) rotateY(140deg) rotateZ(-18deg); } to { transform: var(--hot-die-final-transform); } }
@keyframes hot-dice-near-miss-glow { 0%, 100% { filter: none; } 38% { filter: brightness(1.18) drop-shadow(0 0 .35rem rgba(226, 170, 75, .65)); } 65% { filter: brightness(1.08) drop-shadow(0 0 .2rem rgba(226, 170, 75, .35)); } }
@keyframes hot-dice-contact-ring { from { opacity: .7; transform: translate(-50%, -50%) rotateX(68deg) scale(.25); } to { opacity: 0; transform: translate(-50%, -50%) rotateX(68deg) scale(1.55); } }
@keyframes hot-dice-dust-puff { 0%, 10% { opacity: 0; transform: translate(-50%, -50%) scale(.35); } 28% { opacity: .65; transform: translate(-50%, -62%) scale(.8); } 100% { opacity: 0; transform: translate(-50%, -72%) scale(1.05); } }
@supports not (transform-style: preserve-3d) {
  .hot-dice-faces > .hot-die .hot-die-cube { display: none; }
  .hot-dice-faces > .hot-die { background-color: #f8f3e8; border: .16rem solid #d8a950; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 .55rem .8rem rgba(0, 0, 0, .35); }
  .hot-dice-faces > .hot-die.is-matching { border-color: #f2c978; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 1rem rgba(242, 201, 120, .55), 0 .55rem .8rem rgba(0, 0, 0, .35); }
  .hot-dice-tray.is-quads .hot-die.is-matching { border-color: #ffd35a; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(255, 211, 90, .62), 0 .55rem .8rem rgba(0, 0, 0, .35); }
  .hot-dice-tray.is-all-sixes .hot-die.is-matching { border-color: #ff62d2; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(255, 98, 210, .65), 0 .55rem .8rem rgba(0, 0, 0, .35); }
  .hot-dice-tray.is-two-pair .hot-die.is-matching { border-color: #32e7ff; box-shadow: inset 0 -.45rem 0 #d6c4a2, .15rem .4rem 0 #17100f, 0 0 .9rem rgba(50, 231, 255, .62), 0 .55rem .8rem rgba(0, 0, 0, .35); }
}
@media (prefers-reduced-motion: reduce) {
  .hot-dice-tray.is-shaking .hot-die-cube, .hot-dice-tray.is-tumbling .hot-die-cube, .hot-dice-tray.is-landed .hot-die-cube { animation: none; filter: none; transform: var(--hot-die-final-transform); }
  .hot-dice-pb-banner.is-lit, .hot-dice-keep-it.is-lit { animation: none; text-shadow: none; }
  .hot-dice-recap.is-lit { animation: none; }
  .hot-dice-board-entry.is-stolen, .hot-dice-board-entry.is-stolen strong { animation: none; }
  .hot-dice-board-list li.is-climb { animation: none; background-color: rgba(242, 201, 120, .16); box-shadow: 0 0 .5rem rgba(242, 201, 120, .2); }
  .hot-dice-board-list li.is-climb .hot-dice-board-rank, .hot-dice-board-list li.is-climb strong { animation: none; color: #ffd35a; text-shadow: none; }
  .hot-dice-tray.is-landed .hot-die.is-near-miss .hot-die-cube-face { animation: none; filter: none; }
  .hot-dice-tray.is-landed .hot-die::before, .hot-dice-tray.is-landed .hot-die::after { animation: none; opacity: 0; }
}

@media (max-width: 22rem) {
  .dice-controls { grid-template-columns: 1fr; }
}

.visually-hidden { border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
@media (prefers-reduced-motion: reduce) { .dice-tray[data-dice-state="shaking"] .dice-face { transform: translateY(-.35rem) rotate(-3deg); } }

.loyalty-main .dice-practice-button { background: transparent; }

.dice-other-table-status.open { color: #65ff9a; }
.dice-other-table-status.played { color: #ff7b8a; }

/* Games lobby: a compact bar-table selection screen. */
.games-lobby-heading { align-items: end; background: linear-gradient(120deg, #241812, #302118 60%, #241c14); border: 1px solid #575148; border-bottom-color: #e2aa4b; border-radius: .7rem; box-shadow: inset 0 0 0 1px rgba(226, 170, 75, .12); display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1rem; overflow: hidden; padding: 1rem 1.1rem; position: relative; }
.games-lobby-heading::after { border: 1px solid rgba(226, 170, 75, .18); border-radius: 50%; content: ""; height: 11rem; position: absolute; right: -4rem; top: -7rem; width: 11rem; }
.games-lobby-heading > * { position: relative; z-index: 1; }
.games-lobby-heading h1 { font-size: clamp(1.7rem, 4vw, 2.7rem); line-height: 1; margin: 0; }
.games-lobby-heading p:last-child { color: #c9c0b0; margin: .35rem 0 0; }
.games-lobby-meta { align-items: flex-end; color: #c9c0b0; display: flex; flex-wrap: wrap; font-size: .72rem; gap: .6rem 1rem; justify-content: flex-end; text-transform: uppercase; }
.games-lobby-meta .panel-link { text-transform: none; }
.games-live-mark { align-items: center; color: #65ff9a; display: inline-flex; font-weight: 900; letter-spacing: .06em; }
.games-live-mark i, .game-card-status i { background: currentColor; border-radius: 50%; display: inline-block; height: .45rem; margin-right: .35rem; width: .45rem; }
.game-corner-grid { gap: .9rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.game-card { border-left-width: .28rem; border-radius: .65rem; box-shadow: 0 .25rem 0 #17130f; min-height: 20rem; overflow: hidden; padding: 0; transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.game-card:hover, .game-card:focus-visible { box-shadow: 0 .35rem 0 #17130f, 0 0 1rem rgba(242, 201, 120, .18); transform: translateY(-.15rem); }
.game-card:focus-visible { outline: 3px solid #32e7ff; outline-offset: 2px; }
.game-card-art { align-items: center; background: #241c14; border-bottom: 1px solid #575148; display: flex; gap: .8rem; height: 9rem; justify-content: center; overflow: hidden; position: relative; }
.game-card-art::before { background: radial-gradient(circle, var(--game-glow, rgba(226, 170, 75, .22)), transparent 68%); content: ""; inset: -35%; position: absolute; }
.game-card-art::after { border: 1px solid rgba(248, 243, 232, .14); border-radius: 50%; content: ""; height: 13rem; position: absolute; right: -5rem; top: -8rem; width: 13rem; }
.game-card-art > * { position: relative; z-index: 1; }
.game-card-body { display: flex; flex: 1; flex-direction: column; gap: .3rem; padding: .8rem .85rem .9rem; }
.game-card-kicker { color: #d8a950 !important; font-size: .65rem; font-weight: 900; letter-spacing: .12em; margin: 0 !important; text-transform: uppercase; }
.game-card-name { font-size: clamp(1rem, 2vw, 1.3rem); }
.game-card-body > p:not(.game-card-kicker) { font-size: .82rem; }
.game-card-status { align-items: center; color: #f2c978; display: flex; font-size: .72rem; font-weight: 900; margin-top: .35rem; text-transform: uppercase; }
.game-card-open .game-card-status { color: #65ff9a; }
.game-card-spent .game-card-status { color: #ff7b8a; }
.game-card-needs-visit .game-card-status { color: #f2c978; }
.game-card-action { align-items: center; border-top: 1px solid #575148; color: #f8f3e8; display: flex; font-size: .8rem; justify-content: space-between; margin-top: auto; padding-top: .65rem; }
.game-card-action span { color: #f2c978; font-size: 1.1rem; }
.game-art-label { bottom: .55rem; color: rgba(248, 243, 232, .52); font-size: .55rem; font-weight: 900; letter-spacing: .16em; position: absolute !important; }
.game-art-die { border-radius: 16% !important; box-shadow: inset 0 -.25rem 0 #d6c4a2, .15rem .25rem 0 #17130f !important; height: 4.6rem !important; width: 4.6rem !important; }
.game-art-die[data-value] { background-size: .7rem .7rem !important; }
.game-card-dice .game-card-art, .game-card-doubles .game-card-art { --game-glow: rgba(226, 170, 75, .3); }
.game-card-hot-dice .game-card-art { --game-glow: rgba(196, 42, 85, .32); gap: .35rem; }
.game-card-hot-dice .game-art-die { height: 2.55rem !important; width: 2.55rem !important; }
.game-card-hot-dice .game-art-die[data-value] { background-size: .4rem .4rem !important; }
.game-card-high-low .game-card-art { --game-glow: rgba(201, 120, 255, .28); }
.game-card-lucky-number .game-card-art { --game-glow: rgba(255, 211, 90, .3); }
.game-card-odd-even .game-card-art { --game-glow: rgba(50, 231, 255, .25); }
.game-card-over-under .game-card-art { --game-glow: rgba(120, 201, 195, .26); }
.game-card-red-black .game-card-art { --game-glow: rgba(255, 98, 210, .28); }
.game-art-chip { background: #c978ff; border: 2px solid #f0c7ff; border-radius: 50%; box-shadow: 0 .25rem 0 #17130f, 0 0 .8rem rgba(201, 120, 255, .4); color: #241c14; display: grid; font-size: .7rem; font-weight: 950; height: 4.6rem; letter-spacing: .06em; place-items: center; transform: rotate(-10deg); width: 4.6rem; }
.game-art-chip-muted { background: #413b30; border-color: #8f897d; color: #f8f3e8; transform: rotate(10deg) translate(-.4rem, .55rem); }
.game-art-spark, .game-art-star { color: #f2c978; font-size: 1.5rem; position: absolute !important; right: 24%; top: 20%; }
.game-art-neon-number { color: #ffd35a; font-size: 6rem; font-weight: 950; line-height: 1; text-shadow: .15rem .15rem 0 #9a6a24, 0 0 1.2rem rgba(255, 211, 90, .55); transform: rotate(-8deg); }
.game-art-star { color: #fff0a8; font-size: 2rem; right: 30%; top: 27%; }
.game-art-round-letter { align-items: center; background: #32e7ff; border: .25rem solid #b8f7ff; border-radius: 50%; box-shadow: 0 .25rem 0 #17130f, 0 0 .8rem rgba(50, 231, 255, .4); color: #17262b; display: flex; font-size: 2.2rem; font-weight: 950; height: 4.6rem; justify-content: center; transform: rotate(-8deg); width: 4.6rem; }
.game-art-round-letter-alt { background: #65ff9a; border-color: #c7ffd9; transform: rotate(8deg) translate(-.5rem, .55rem); }
.game-art-slash { color: #f8f3e8; font-size: 2.5rem; font-weight: 300; position: absolute !important; z-index: 2 !important; }
.game-art-arrow { color: #65ff9a; font-size: 5rem; font-weight: 950; line-height: .8; text-shadow: 0 0 .8rem rgba(101, 255, 154, .35); transform: translateY(-.5rem); }
.game-art-arrow-alt { color: #ff62d2; transform: translateY(.65rem); }
.game-art-line { background: #f2c978; height: 1px; position: absolute !important; transform: rotate(-28deg); width: 8rem; }
.game-art-color { border: .35rem solid #ffb0e7; border-radius: 50%; box-shadow: 0 .25rem 0 #17130f, 0 0 .8rem rgba(255, 98, 210, .45); height: 4.8rem; width: 4.8rem; }
.game-art-color-red { background: #d7789a; transform: rotate(-8deg); }
.game-art-color-black { background: #17130f; border-color: #8f897d; transform: rotate(8deg) translate(-.5rem, .55rem); }
@media (min-width: 64rem) { .game-corner-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 40rem) {
  .games-lobby-heading { align-items: flex-start; flex-direction: column; }
  .games-lobby-meta { align-items: center; justify-content: flex-start; }
  .game-corner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .game-card { min-height: 17rem; }
  .game-card-art { height: 6rem; }
  .game-card-body { padding: .6rem; }
  .game-card-name { font-size: .95rem; }
  .game-card-body > p:not(.game-card-kicker) { font-size: .7rem; }
  .game-card-status { font-size: .62rem; }
  .game-card-action { font-size: .67rem; }
  .game-art-die { height: 3rem !important; width: 3rem !important; }
  .game-art-die[data-value] { background-size: .45rem .45rem !important; }
  .game-card-hot-dice .game-art-die { height: 2.1rem !important; width: 2.1rem !important; }
  .game-card-hot-dice .game-art-die[data-value] { background-size: .32rem .32rem !important; }
  .game-art-chip, .game-art-round-letter, .game-art-color { height: 3.1rem; width: 3.1rem; }
  .game-art-chip { font-size: .5rem; }
  .game-art-neon-number { font-size: 4rem; }
  .game-art-arrow { font-size: 3.5rem; }
}

/* Shared play surface for the non-Dice tables. Each game supplies its own art and controls. */
.last-call-layout .dice-tray { align-items: stretch; display: flex; flex-direction: column; justify-content: space-between; min-height: 25rem; }
.game-play-stage { align-items: center; display: flex; flex: 1; flex-direction: column; gap: 1rem; justify-content: center; min-height: 18rem; min-width: 0; padding: 1rem; text-align: center; }
.game-play-art { align-items: center; display: flex; flex-shrink: 0; gap: 1rem; justify-content: center; min-height: 8rem; position: relative; width: 100%; }
.game-play-art::before { background: radial-gradient(circle, rgba(226, 170, 75, .2), transparent 68%); content: ""; inset: -3rem; pointer-events: none; position: absolute; }
.game-play-art > * { flex-shrink: 0; position: relative; z-index: 1; }
.game-play-art .dice-face { border-radius: 15%; box-shadow: inset 0 -.4rem 0 #d6c4a2, .15rem .35rem 0 #17130f, 0 .5rem .8rem rgba(0, 0, 0, .32); height: 6rem; width: 6rem; }
.game-play-art .dice-face[data-value] { background-size: .9rem .9rem; }
.game-play-art-high-low { --game-glow: rgba(201, 120, 255, .3); }
.game-play-art-lucky { --game-glow: rgba(255, 211, 90, .3); }
.game-play-art-odd-even { --game-glow: rgba(50, 231, 255, .25); }
.game-play-art-over-under { --game-glow: rgba(101, 255, 154, .24); }
.game-play-art-doubles { --game-glow: rgba(226, 170, 75, .28); }
.game-play-art-red-black { --game-glow: rgba(255, 98, 210, .28); }
.game-play-art::before { background: radial-gradient(circle, var(--game-glow, rgba(226, 170, 75, .2)), transparent 68%); }
.game-play-art .game-art-chip { height: 4.2rem; width: 4.2rem; }
.game-play-art .game-art-neon-number { font-size: 6rem; }
.game-play-art .game-art-color { height: 5rem; width: 5rem; }
.game-play-art .game-art-round-letter { height: 5rem; width: 5rem; }
.game-play-art .game-art-arrow { font-size: 5rem; }
.game-play-stage .dice-status h2 { font-size: clamp(1.6rem, 4vw, 2.5rem); margin: 0; }
.game-play-stage .dice-panel-result { align-items: center; flex-direction: column; gap: .7rem; text-align: center; }
.game-play-stage .dice-panel-result-copy { align-items: center; }
.game-play-controls { margin: 0 auto; max-width: 34rem; padding: 0 1rem 1rem; width: 100%; }
.game-play-controls form { max-width: none; }
.last-call-layout .dice-right-rail { max-height: 25rem; }
@media (max-width: 40rem) {
  .last-call-layout .dice-tray { min-height: 25rem; }
  .game-play-stage { min-height: 18rem; padding: .5rem; }
  .game-play-art .dice-face { height: 5.25rem; width: 5.25rem; }
  .game-play-art .dice-face[data-value] { background-size: .75rem .75rem; }
  .game-play-art .game-art-chip, .game-play-art .game-art-color, .game-play-art .game-art-round-letter { height: 4rem; width: 4rem; }
  .game-play-art .game-art-neon-number { font-size: 5rem; }
  .game-play-art .game-art-arrow { font-size: 4rem; }
}

/* Choice controls are table objects, not generic yellow form buttons. */
.last-call-game-page .game-play-controls .high-low-button { align-items: center; background: #302118; border: 1px solid #8f897d; border-radius: .65rem; box-shadow: 0 .25rem 0 #17130f; color: #f8f3e8; display: flex; flex-direction: column; font-size: clamp(1rem, 2vw, 1.35rem); gap: .35rem; justify-content: center; min-height: 8rem; padding: .7rem; transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.last-call-game-page .game-play-controls .high-low-button:hover:not(:disabled), .last-call-game-page .game-play-controls .high-low-button:focus-visible { border-color: #32e7ff; box-shadow: 0 .25rem 0 #17130f, 0 0 .9rem rgba(50, 231, 255, .25); outline: 2px solid #32e7ff; outline-offset: 2px; transform: translateY(-.1rem); }
.last-call-game-page .game-play-controls .high-low-button:disabled { filter: saturate(.55); opacity: .52; }
.last-call-game-page .game-play-controls .high-button { border-color: #c978ff; }
.last-call-game-page .game-play-controls .low-button { border-color: #65ff9a; }
.last-call-game-page .game-play-controls .odd-button { border-color: #32e7ff; }
.last-call-game-page .game-play-controls .even-button { border-color: #c978ff; }
.last-call-game-page .game-play-controls .over-button { border-color: #65ff9a; }
.last-call-game-page .game-play-controls .under-button { border-color: #ff62d2; }
.last-call-game-page .game-play-controls .red-button { border-color: #ff62d2; }
.last-call-game-page .game-play-controls .black-button { border-color: #8f897d; }
.choice-chip { border: .18rem solid #f0c7ff; border-radius: 50%; box-shadow: 0 .2rem 0 #17130f, 0 0 .65rem rgba(201, 120, 255, .42); height: 4.1rem; width: 4.1rem; }
.choice-chip-high { background: #c978ff; }
.choice-chip-low { background: #413b30; border-color: #8f897d; }
.choice-chip-red { background: #d7789a; border-color: #ffb0e7; box-shadow: 0 .2rem 0 #17130f, 0 0 .65rem rgba(255, 98, 210, .42); }
.choice-chip-black { background: #17130f; border-color: #c9c0b0; }
.choice-die { border-radius: 15%; height: 3.4rem; width: 3.4rem; }
.choice-die[data-value] { background-size: .55rem .55rem; }
.choice-dice-set { align-items: center; display: flex; gap: .35rem; justify-content: center; }
.choice-dice-set .dice-face { border-radius: 15%; height: 2.65rem; width: 2.65rem; }
.choice-dice-set .dice-face[data-value] { background-size: .42rem .42rem; }
.choice-dice-set-small .dice-face { height: 2.05rem; width: 2.05rem; }
.choice-dice-set-small .dice-face[data-value] { background-size: .34rem .34rem; }
.game-play-controls .high-low-button small { color: #c9c0b0; font-size: .68rem; font-weight: 800; letter-spacing: .08em; }
.last-call-game-page .lucky-number-buttons { gap: .55rem; }
.last-call-game-page .lucky-number-button { align-items: center; background: #302118; border: 1px solid #ffd35a; border-radius: .55rem; box-shadow: 0 .2rem 0 #17130f; color: #f8f3e8; display: flex; flex-direction: column; font-size: 1.1rem; gap: .2rem; justify-content: center; min-height: 5.5rem; padding: .45rem; }
.last-call-game-page .lucky-number-button:hover:not(:disabled), .last-call-game-page .lucky-number-button:focus-visible { background: #413b30; border-color: #32e7ff; outline: 2px solid #32e7ff; outline-offset: 2px; }
.last-call-game-page .lucky-number-button:disabled { filter: saturate(.55); opacity: .52; }
.last-call-game-page .lucky-number-button .choice-die { height: 2.25rem; width: 2.25rem; }
.last-call-game-page .lucky-number-button .choice-die[data-value] { background-size: .36rem .36rem; }
@media (max-width: 40rem) {
  .last-call-game-page .game-play-controls .high-low-button { min-height: 7rem; }
  .choice-chip { height: 3.25rem; width: 3.25rem; }
  .choice-die { height: 2.75rem; width: 2.75rem; }
  .choice-dice-set .dice-face { height: 2.2rem; width: 2.2rem; }
  .choice-dice-set-small .dice-face { height: 1.8rem; width: 1.8rem; }
}

.game-card-slot { border-left: .3rem solid #e2aa4b; border-left-color: #c42a55; }
.game-card-slot .game-card-art { --game-glow: rgba(226, 170, 75, .28); gap: .45rem; background: linear-gradient(180deg, #241812, #17130f); }
.game-art-slot-reel { align-items: center; background: #1a1612; border: 2px solid #f2c978; border-radius: .35rem; box-shadow: inset 0 0 .6rem rgba(226, 170, 75, .25), 0 .2rem 0 #17130f; color: #f2c978; display: flex; font-size: 1.05rem; font-weight: 950; height: 3.4rem; justify-content: center; width: 2.4rem; }
.slot-game-page .slot-spin-form { display: grid; justify-items: center; margin: 1rem auto 0; max-width: none; }
.slot-cabinet { background: linear-gradient(180deg, #3a2a1c, #241812 55%, #17130f); border: 1px solid #8a6230; border-radius: .8rem; box-shadow: inset 0 0 0 2px #17130f, 0 .45rem 0 #100c09; padding: 1rem 1rem 1.2rem; position: relative; }
.slot-cabinet[data-reel-theme="neon_night"] { background: linear-gradient(180deg, #1a1030, #10172c 55%, #0b0d18); border-color: #32e7ff; box-shadow: inset 0 0 0 2px #0b0d18, 0 0 1.2rem rgba(50, 231, 255, .28), 0 .45rem 0 #07080f; }
.slot-cabinet[data-reel-theme="neon_night"] .slot-window { border-color: #ff62d2; box-shadow: inset 0 0 1.2rem rgba(255, 98, 210, .25); }
.slot-cabinet[data-reel-theme="neon_night"] .slot-jackpot, .slot-cabinet[data-reel-theme="neon_night"] .slot-symbol-payline { color: #32e7ff; }
.slot-jackpot { color: #f2c978; font-size: .82rem; font-weight: 900; letter-spacing: .16em; margin: 0 0 .7rem; text-align: center; }
.slot-jackpot strong { color: #fff3c4; font-size: 1.6rem; letter-spacing: .04em; }
.slot-credits { align-items: baseline; color: #f2c978; display: flex; flex-wrap: wrap; font-size: .78rem; font-weight: 900; gap: .35rem 1rem; justify-content: center; letter-spacing: .12em; margin: 0 0 .7rem; text-transform: uppercase; }
.slot-credits strong { color: #fff3c4; font-size: 1.25rem; letter-spacing: .04em; }
.slot-credits strong.is-down { color: #ff7b8a; }
.slot-credits strong.is-up { color: #9dffb0; }
[data-slot-last-win] { color: #c9c0b0; letter-spacing: .08em; }
.slot-lamps { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-bottom: .8rem; }
.slot-lamp { background: #17130f; border: 1px solid #575148; border-radius: 2rem; color: #8f897d; font-size: .62rem; font-weight: 900; letter-spacing: .1em; padding: .3rem .6rem; }
.slot-lamp.is-dim { opacity: .55; }
.slot-window { background: #100c09; border: 2px solid #e2aa4b; border-radius: .5rem; box-shadow: inset 0 0 1.2rem rgba(0, 0, 0, .65); margin-inline: auto; max-width: 100%; overflow: hidden; padding: .55rem; width: max-content; }
.slot-reels { display: grid; gap: .45rem; grid-template-columns: repeat(3, 5.6rem); justify-content: center; }
.slot-reel { background: #1e1a14; border: 1px solid #575148; border-radius: .35rem; overflow: hidden; }
.slot-reel-strip { --slot-symbol-height: 5.2rem; display: grid; }
.slot-symbol { align-items: center; box-sizing: border-box; color: #c9c0b0; display: flex; font-size: 1.15rem; font-weight: 950; height: var(--slot-symbol-height); justify-content: center; letter-spacing: .04em; overflow: hidden; padding: .28rem; }
.slot-symbol-art { border-radius: .28rem; display: block; height: 100%; max-height: 100%; max-width: 100%; object-fit: contain; object-position: center; width: 100%; }
.slot-symbol-payline { background: #2a2118; color: #f2c978; box-shadow: inset 0 0 0 1px rgba(242, 201, 120, .35); }
.slot-symbol[data-symbol="house"] { color: #ffd35a; }
.slot-symbol[data-symbol="seven"] { color: #ff7b8a; }
.slot-symbol[data-symbol="burger"] { color: #e2aa4b; }
.slot-symbol[data-symbol="wing"] { color: #ff8a4a; }
.slot-symbol[data-symbol="pitcher"] { color: #f2c978; }
.slot-symbol[data-symbol="cat"] { color: #c978ff; }
.slot-symbol[data-symbol="whammy"] { color: #ff7b8a; box-shadow: inset 0 0 0 1px rgba(196, 42, 85, .55); }
.slot-payout { color: #f8f3e8; font-weight: 800; margin: .8rem 0 0; text-align: center; }
.slot-charm { color: #f2c978; font-size: .85rem; text-align: center; }
.slot-handle { background: linear-gradient(180deg, #ffd35a, #e2aa4b); border: 0; border-radius: 999px; box-shadow: 0 .3rem 0 #9a6a24; color: #17130f; font-size: 1.05rem; font-weight: 950; letter-spacing: .14em; min-height: 3.2rem; min-width: 8rem; }
.slot-handle:disabled { cursor: not-allowed; filter: saturate(.4); opacity: .6; }
.slot-shell { display: grid; gap: 1rem; }
.slot-board { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; padding: 1rem; }
.slot-board-progressive { color: #f2c978; font-weight: 900; letter-spacing: .08em; margin: 0 0 .8rem; text-transform: uppercase; }
.slot-board-progressive strong { color: #fff3c4; font-size: 1.4rem; }
.slot-board-panel h3 { color: #d8a950; font-size: .78rem; letter-spacing: .1em; margin: 0 0 .5rem; text-transform: uppercase; }
.slot-board-entry, .slot-board-list li { display: flex; gap: .6rem; justify-content: space-between; }
.slot-board-list { list-style: none; margin: 0; padding: 0; }
.slot-board-list li { border-bottom: 1px solid #413b30; padding: .4rem 0; }
.slot-board-empty { color: #8f897d; }
.slot-paytable { background: #2b2925; border: 1px solid #575148; border-radius: .6rem; margin: 1.2rem 0 0; padding: .8rem 1rem; }
.slot-paytable summary { color: #f2c978; cursor: pointer; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.slot-paytable table { border-collapse: collapse; margin-top: .7rem; width: 100%; }
.slot-paytable td, .slot-paytable th { border-bottom: 1px solid #413b30; padding: .35rem 0; text-align: left; }
.slot-paytable tr.is-dim { color: #8f897d; }
.slot-rules { align-items: center; display: grid; inset: 1rem; justify-items: center; pointer-events: none; position: absolute; z-index: 2; }
.slot-rules .hot-dice-rules-button { pointer-events: auto; }
.slot-cabinet.is-spinning .slot-reel:not(.is-stopped) .slot-reel-strip { animation: slot-reel-spin .12s linear infinite; filter: blur(1.6px); }
.slot-cabinet.is-win { box-shadow: inset 0 0 0 2px #17130f, 0 0 1.4rem rgba(226, 170, 75, .55); }
.slot-cabinet.is-big-win, .slot-cabinet.is-jackpot { animation: slot-cabinet-flash .18s linear 6; }
.slot-banner { background: #17130f; border: 1px solid #f2c978; border-radius: .4rem; color: #ffd35a; display: block; font-size: 1.4rem; font-weight: 950; letter-spacing: .12em; margin: 0 auto .6rem; padding: .35rem .8rem; text-align: center; width: fit-content; }
.slot-banner[hidden] { display: none !important; }
.slot-banner[data-slot-banner="jackpot"] { border-color: #ff62d2; color: #ffd35a; }
.slot-banner[data-slot-banner="catnap"] { border-color: #c978ff; color: #e2c4ff; }
.slot-confetti { inset: 0; overflow: hidden; pointer-events: none; position: absolute; }
.slot-confetti i { background: #f2c978; border-radius: 1px; height: .55rem; opacity: 0; position: absolute; width: .22rem; }
.slot-cabinet.is-confetti .slot-confetti i { animation: slot-confetti-burst .9s ease-out forwards; }
.slot-confetti i:nth-child(odd) { background: #ff62d2; }
.slot-confetti i:nth-child(3n) { background: #32e7ff; }
.slot-confetti i:nth-child(1) { left: 8%; }
.slot-confetti i:nth-child(2) { left: 18%; }
.slot-confetti i:nth-child(3) { left: 28%; }
.slot-confetti i:nth-child(4) { left: 38%; }
.slot-confetti i:nth-child(5) { left: 48%; }
.slot-confetti i:nth-child(6) { left: 58%; }
.slot-confetti i:nth-child(7) { left: 68%; }
.slot-confetti i:nth-child(8) { left: 78%; }
.slot-confetti i:nth-child(9) { left: 88%; }
.slot-confetti i:nth-child(10) { left: 22%; }
.slot-confetti i:nth-child(11) { left: 62%; }
.slot-confetti i:nth-child(12) { left: 84%; }
@keyframes slot-reel-spin { from { transform: translateY(0); } to { transform: translateY(calc(-1 * var(--slot-symbol-height, 3.4rem))); } }
@keyframes slot-cabinet-flash { 50% { filter: brightness(1.35); } }
@keyframes slot-confetti-burst {
  0% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0deg); }
  100% { opacity: 0; transform: translate3d(0, 6rem, 0) rotate(140deg); }
}
@media (prefers-reduced-motion: reduce) {
  .slot-cabinet.is-spinning .slot-reel-strip, .slot-cabinet.is-confetti .slot-confetti i, .slot-cabinet.is-big-win, .slot-cabinet.is-jackpot { animation: none !important; filter: none !important; }
}
@media (max-width: 40rem) {
  .slot-reels { grid-template-columns: repeat(3, 4.8rem); }
  .slot-reel-strip { --slot-symbol-height: 4.4rem; }
  .slot-symbol { font-size: .95rem; padding: .22rem; }
}

/* Trophy shelf: darkwood + amber, responsive, clear art. */
.trophy-shelf { background: linear-gradient(180deg, #2a1c10, #1c120a); border: 1px solid #8a5a24; border-radius: .8rem; display: grid; gap: .9rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); padding: .9rem; width: 100%; }
.trophy-card { background: #f7ead0; border: 1px solid #e2aa4b; border-radius: .6rem; overflow: hidden; position: relative; }
.trophy-art { aspect-ratio: 1; display: block; object-fit: cover; width: 100%; }
.trophy-art-missing { background: #3a2a16; min-height: 11rem; }
.trophy-copy { padding: .55rem .7rem; }
.trophy-copy h3 { color: #2a1c10; font-size: 1rem; margin: .1rem 0; }
.trophy-mint-form { margin-top: .6rem; }
.trophy-thumb { height: 2.4rem; object-fit: cover; vertical-align: middle; width: 2.4rem; }
.trophy-portrait-preview { border: 1px solid #e2aa4b; border-radius: .5rem; max-width: 12rem; width: 100%; }
/* Trophy fallback legibility on cream card (scoped). */
.trophy-copy .eyebrow { color: #7a4a12; }
.trophy-copy .item-count { color: #5a3c14; }
.trophy-card > .form-help { color: #5a3c14; padding: 0 .7rem .55rem; }
/* Admin recent + owner manage rows wrap on narrow screens (scoped). */
.trophy-recent li, .trophy-manage li { flex-wrap: wrap; }
.trophy-recent li strong, .trophy-manage li strong { flex: 1 1 9rem; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 40rem) {
  .trophy-recent li, .trophy-manage li { row-gap: .4rem; }
}
.trophy-page form { max-width: none; }
.trophy-page .trophy-pick form, .trophy-page .trophy-card form { display: block; gap: 0; margin: 0; padding: 0; width: 100%; }
.trophy-stage { margin: 0 0 .85rem; }
.trophy-shelf-empty { align-items: center; color: #c9c0b0; display: grid; min-height: 14rem; place-items: center; }
.trophy-shelf-empty p { margin: 0; }
.trophy-flavor { color: #c9c0b0; margin: 0 0 .45rem; }
.trophy-nav { margin: 0 0 1.4rem; }
.trophy-stale { margin-bottom: 1.4rem; }
.trophy-card-hide {
  background: #1c120a; border: 1px solid #8a5a24; border-radius: 999px; color: #f8f3e8; font-size: .72rem;
  font-weight: 800; min-height: 1.7rem; padding: .15rem .55rem; position: absolute; right: .4rem; top: .4rem;
}
.trophy-page .trophy-card-hide { background: #1c120a; color: #f8f3e8; }
.trophy-bench .eyebrow { margin-bottom: .2rem; }
.trophy-bench .form-help { margin: 0 0 .8rem; }
.trophy-bench-grid { display: grid; gap: .55rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr)); width: 100%; }
.trophy-pick { background: #1c120a; border: 1px solid #575148; border-radius: .45rem; min-width: 0; overflow: hidden; }
.trophy-pick.is-showing { border-color: #f2c978; box-shadow: 0 0 .7rem rgba(226, 170, 75, .45); }
.trophy-page .trophy-pick-action {
  background: transparent; border: 0; border-radius: 0; color: #f8f3e8; display: grid; font: inherit; font-weight: 800;
  gap: .25rem; min-height: 0; padding: .3rem; text-align: left; width: 100%;
}
.trophy-pick-action img, .trophy-pick-missing { aspect-ratio: 1; border-radius: .3rem; display: block; object-fit: cover; width: 100%; }
.trophy-pick-missing { background: #3a2a16; }
.trophy-pick-name { color: #f8f3e8; font-size: .78rem; line-height: 1.15; overflow-wrap: anywhere; }
.trophy-pick-meta { color: #c9c0b0; font-size: .68rem; line-height: 1.2; }
.trophy-pick-state { color: #f2c978; font-size: .62rem; letter-spacing: .06em; text-transform: uppercase; }
.trophy-bench-empty { color: #c9c0b0; }
.challenge-badges li { display: inline-block; margin-right: .6rem; }

.challenge-page .loyalty-main { padding-top: 1rem; padding-bottom: 1.5rem; }
.challenge-page .challenge-hud {
  align-items: center; background: #241c14; border: 1px solid #e2aa4b; border-radius: .5rem;
  display: flex; flex-wrap: wrap; gap: .45rem .8rem; margin: 0 0 .7rem; padding: .45rem .7rem;
}
.challenge-hud-record { display: flex; align-items: baseline; gap: .35rem; line-height: 1; }
.challenge-hud-record strong { color: #f2c978; font-size: 1.25rem; font-weight: 950; letter-spacing: .04em; }
.challenge-hud-record span { color: #c9c0b0; font-size: .62rem; font-weight: 800; letter-spacing: .12em; }
.challenge-hud-stake { color: #c9c0b0; flex: 1 1 8rem; font-size: .82rem; margin: 0; }
.challenge-cta {
  background: #e2aa4b; border-radius: .35rem; color: #1e1d1a; font-size: .78rem; font-weight: 950;
  letter-spacing: .08em; margin-left: auto; padding: .45rem .8rem; text-decoration: none; text-transform: uppercase;
}
.challenge-cta:hover, .challenge-cta:focus-visible { background: #f2c978; outline: 3px solid #32e7ff; outline-offset: 2px; }
.challenge-stakes { margin: 0 0 .7rem; }
.challenge-stakes .eyebrow { margin: 0 0 .3rem; }
.challenge-stakes-grid { display: grid; gap: .4rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.challenge-stake { align-items: center; background: #2b2925; border: 1px solid #575148; border-radius: .4rem; display: flex; gap: .4rem; min-width: 0; padding: .3rem .45rem; }
.challenge-stake-art { border-radius: .3rem; flex: 0 0 2.1rem; height: 2.1rem; object-fit: cover; width: 2.1rem; }
.challenge-stake-missing { background: #3a2a16; display: block; }
.challenge-stake-name { color: #f8f3e8; font-size: .78rem; font-weight: 800; margin: 0; overflow-wrap: anywhere; }
.challenge-match-grid { display: grid; gap: .45rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.challenge-match {
  background: #2b2925; border: 1px solid #575148; border-radius: .5rem; color: inherit; display: grid;
  gap: .35rem; min-width: 0; overflow: hidden; padding: .7rem .6rem .6rem; position: relative; text-decoration: none;
}
.challenge-match:hover, .challenge-match:focus-visible { border-color: #f2c978; outline: 3px solid #32e7ff; outline-offset: 2px; }
.challenge-ribbon {
  background: #d8a950; color: #1e1d1a; font-size: .58rem; font-weight: 950; letter-spacing: .1em; padding: .22rem 0;
  position: absolute; right: -.9rem; text-align: center; text-transform: uppercase; top: .7rem; transform: rotate(32deg); width: 6.6rem;
}
.challenge-match-incoming .challenge-ribbon { background: #ff62d2; }
.challenge-match-waiting .challenge-ribbon { background: #32e7ff; }
.challenge-match-your-move .challenge-ribbon { background: #65ff9a; }
.challenge-match-win .challenge-ribbon { background: #e2aa4b; }
.challenge-match-loss .challenge-ribbon { background: #ff7b8a; }
.challenge-match-chicken .challenge-ribbon { background: #c978ff; }
.challenge-match-expired .challenge-ribbon { background: #8f897d; }
.challenge-match-faces { align-items: start; display: grid; gap: .35rem; grid-template-columns: 1fr auto 1fr; }
.challenge-duelist { min-width: 0; text-align: center; }
.challenge-face { background: #1c120a; border: .18rem solid #e2aa4b; border-radius: 50%; display: block; height: 5.5rem; margin: 0 auto; object-fit: cover; width: 5.5rem; }
.challenge-face.is-winner { border-color: #65ff9a; box-shadow: 0 0 .55rem rgba(101, 255, 154, .45); }
.challenge-face.is-loser { border-color: #ff7b8a; box-shadow: 0 0 .55rem rgba(255, 123, 138, .4); }
.challenge-face-fallback { align-items: center; color: #f2c978; display: grid; font-size: 1.8rem; font-weight: 950; place-items: center; }
.challenge-duelist-name { font-size: .9rem; font-weight: 800; margin: .3rem 0 0; overflow-wrap: anywhere; }
.challenge-duelist-handle { color: #c9c0b0; font-size: .75rem; margin: .05rem 0 0; overflow-wrap: anywhere; }
.challenge-vs { align-self: center; color: #f2c978; font-size: .7rem; font-weight: 950; letter-spacing: .14em; padding-top: 1.6rem; }
.challenge-empty { color: #c9c0b0; }
@media (max-width: 40rem) {
  .challenge-stakes-grid { grid-template-columns: 1fr; }
  .challenge-cta { margin-left: 0; width: 100%; text-align: center; }
  .challenge-face { height: 4.4rem; width: 4.4rem; }
}

/* Avatar wardrobe screen */
.avatar-page turbo-frame#avatar_wardrobe { display: flex; flex-direction: column; gap: .75rem; }
.avatar-page .avatar-identity { align-items: flex-start; display: flex; gap: .75rem 1rem; justify-content: space-between; }
.avatar-page .avatar-identity h1 { margin: 0; }
.avatar-page .avatar-identity .avatar-archetype { color: #c9c0b0; margin: .15rem 0 0; text-align: left; }
.avatar-page .avatar-setup { background: transparent; border: 0; flex: 0 0 auto; padding: 0; }
.avatar-page .avatar-setup summary { color: #f2c978; cursor: pointer; font-size: .85rem; font-weight: 800; list-style: none; }
.avatar-page .avatar-setup summary::-webkit-details-marker { display: none; }
.avatar-page .avatar-setup[open] { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: .75rem 1rem; }
.avatar-page turbo-frame#avatar_wardrobe:not(:has(.avatar-wardrobe-layout)) .avatar-setup { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: 1rem; }
.avatar-page .avatar-wardrobe-layout { display: flex; flex-direction: column; gap: .85rem; min-width: 0; }
.avatar-page .avatar-stage, .avatar-page .avatar-paperdoll { min-width: 0; overflow: visible; width: 100%; }
.avatar-page .avatar-paperdoll { align-items: center; display: flex; flex-direction: column; gap: .55rem; margin: 0 auto; width: min(100%, 22rem); }
.avatar-page .avatar-hero { background: transparent; border: 0; padding: 0; width: 100%; }
.avatar-page .avatar-hero .eyebrow { text-align: center; }
.avatar-page .avatar-hero img { border: 1px solid #e2aa4b; border-radius: .45rem; box-shadow: 0 0 .8rem rgba(226, 170, 75, .28); display: block; margin: 0 auto; max-width: 100%; object-fit: cover; width: 100%; }
.avatar-page .avatar-hero-empty { align-items: center; background: #1c120a; border: .12rem dashed #8a5a24; border-radius: .45rem; color: #8f897d; display: grid; min-height: 16rem; place-items: center; width: 100%; }
.avatar-page .avatar-equip { position: relative; width: 100%; }
.avatar-page .avatar-loadout-board { display: flex; flex-wrap: nowrap; gap: .4rem; justify-content: center; }
.avatar-page .avatar-slot {
  align-items: center; background: #1c120a; border: .12rem dashed #8a5a24; border-radius: .45rem; box-sizing: border-box;
  color: #d8a950; cursor: pointer; display: grid; flex: 1 1 0; font: inherit; height: 3.6rem; justify-items: center; max-width: 4.5rem;
  min-height: 44px; min-width: 0; padding: .15rem;
}
.avatar-page .avatar-slot.is-equipped, .avatar-page .avatar-slot.is-open { border-color: #e2aa4b; border-style: solid; }
.avatar-page .avatar-slot.is-open { box-shadow: 0 0 .7rem rgba(226, 170, 75, .5); }
.avatar-page .avatar-slot { overflow: hidden; }
.avatar-page .avatar-slot img { border-radius: .3rem; display: block; height: 100%; max-height: 100%; max-width: 100%; object-fit: cover; object-position: center; width: 100%; }
.avatar-page .avatar-slot-label { font-size: .58rem; font-weight: 800; letter-spacing: .02em; line-height: 1.05; text-align: center; }
.avatar-page .avatar-pickers { bottom: calc(100% + .45rem); left: 0; pointer-events: none; position: absolute; right: 0; z-index: 8; }
.avatar-page .avatar-picker {
  background: #1c120a; border: 1px solid #e2aa4b; border-radius: .55rem; box-shadow: 0 .6rem 1.6rem rgba(0, 0, 0, .55);
  display: none; gap: .45rem; grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); left: 0; max-height: min(16.5rem, 58vw);
  overflow: auto; padding: .7rem; pointer-events: auto; position: relative; right: 0; width: 100%;
}
.avatar-page .avatar-picker.is-open:not([hidden]) { display: grid; }
.avatar-page .avatar-picker:not(.is-open), .avatar-page .avatar-picker[hidden] { display: none !important; }
.avatar-page .avatar-picker.is-open::after {
  border: .45rem solid transparent; border-top-color: #e2aa4b; bottom: -.85rem; content: ""; left: var(--caret, 50%);
  position: absolute; transform: translateX(-50%);
}
.avatar-page .avatar-picker .eyebrow { grid-column: 1 / -1; }
.avatar-page .avatar-picker form, .avatar-page .avatar-looks form { display: block; gap: 0; margin: 0; max-width: 100%; min-width: 0; padding: 0; width: 100%; }
.avatar-page .avatar-picker-item, .avatar-page .avatar-picker-empty {
  align-items: stretch; background: #2b2925; border: 2px solid #575148; border-radius: .45rem; box-sizing: border-box; color: #f8f3e8;
  display: flex; flex-direction: column; font-size: .72rem; font-weight: 800; gap: .25rem; max-width: 100%; min-height: 5.2rem; min-width: 0; overflow: hidden; padding: .35rem; text-align: left; width: 100%;
}
.avatar-page .avatar-picker-empty { align-items: center; color: #c9c0b0; justify-content: center; }
.avatar-page .avatar-picker-item[class*="rarity-"] { border-color: var(--rarity-color); box-shadow: 0 0 .4rem var(--rarity-glow); }
.avatar-page .avatar-picker-item img { aspect-ratio: 1; border-radius: .3rem; display: block; flex: 0 0 auto; height: auto; max-height: 100%; max-width: 100%; object-fit: cover; object-position: center; width: 100%; }
.avatar-page .avatar-picker-name { line-height: 1.15; overflow-wrap: anywhere; }
.avatar-page .avatar-wearing { color: #f2c978; font-size: .62rem; letter-spacing: .06em; text-transform: uppercase; }
.avatar-page .avatar-picker-item.is-wearing { box-shadow: 0 0 .7rem rgba(226, 170, 75, .45); }
.avatar-page .avatar-rail { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.avatar-page .avatar-looks-strip { display: flex; gap: .45rem; overflow-x: auto; padding: .15rem .1rem .35rem; scrollbar-color: #8f897d transparent; scrollbar-width: thin; }
.avatar-page .avatar-look { background: #1c120a; border: 1px solid #575148; border-radius: .4rem; flex: 0 0 4.8rem; min-width: 4.8rem; padding: .2rem; position: relative; }
.avatar-page .avatar-look-current { border-color: #f2c978; box-shadow: 0 0 .7rem rgba(226, 170, 75, .45); }
.avatar-page .avatar-look-wear { background: transparent; border: 0; display: block; padding: 0; width: 100%; }
.avatar-page .avatar-look { overflow: hidden; }
.avatar-page .avatar-look-wear img { aspect-ratio: 1; border-radius: .3rem; display: block; height: auto; max-width: 100%; object-fit: cover; object-position: center; width: 100%; }
.avatar-page .avatar-look-placeholder { align-items: center; aspect-ratio: 1; background: #413b30; color: #c9c0b0; display: grid; font-size: .68rem; place-items: center; text-transform: capitalize; }
.avatar-page .avatar-look-hide { background: #1c120a; border: 1px solid #575148; border-radius: 999px; color: #c9c0b0; font-size: .85rem; font-weight: 700; line-height: 1; min-height: 1.4rem; padding: 0; position: absolute; right: .15rem; top: .15rem; width: 1.4rem; }
.avatar-page .avatar-generate { background: #2b2925; border: 1px solid #575148; border-radius: .5rem; padding: .8rem; }
.avatar-page .avatar-generate-heading { align-items: baseline; display: flex; gap: .7rem; justify-content: space-between; }
.avatar-page .avatar-generate-heading span { color: #f2c978; font-size: .85rem; font-weight: 800; }
.avatar-page .avatar-generate form { display: grid; gap: .55rem; max-width: none; width: 100%; }
.avatar-page .avatar-generate p { color: #c9c0b0; margin: 0; }
.avatar-page .avatar-chip-row { display: flex; flex-wrap: wrap; gap: .35rem; }
.avatar-page .avatar-chip { background: #1c120a; border: 1px solid #575148; border-radius: 999px; color: #f8f3e8; cursor: pointer; display: inline-flex; font-size: .78rem; font-weight: 800; padding: .28rem .7rem; }
.avatar-page .avatar-chip input { height: 1px; margin: 0; opacity: 0; position: absolute; width: 1px; }
.avatar-page .avatar-chip:has(input:checked) { background: #413b30; border-color: #e2aa4b; color: #f2c978; }
.avatar-page .avatar-generate input[type="submit"] { font-size: 1rem; font-weight: 950; letter-spacing: .12em; }
.avatar-page .avatar-slot:focus-visible, .avatar-page .avatar-picker-item:focus-visible, .avatar-page .avatar-picker-empty:focus-visible, .avatar-page .avatar-look-wear:focus-visible, .avatar-page .avatar-chip:focus-within, .avatar-page .avatar-look-hide:focus-visible, .avatar-page .avatar-setup summary:focus-visible, .avatar-page .avatar-generate input[type="submit"]:focus-visible { outline: 3px solid #32e7ff; outline-offset: 2px; }
@media (min-width: 40.01rem) {
  .avatar-page .avatar-paperdoll { width: min(100%, 26rem); }
  .avatar-page .avatar-slot { height: 4.2rem; max-width: 4.8rem; }
  .avatar-page .avatar-picker { max-height: min(18rem, 42vh); }
}
@media (min-width: 64rem) {
  .avatar-page .loyalty-main { max-width: 90rem; }
  .avatar-page .avatar-wardrobe-layout { align-items: start; display: grid; gap: 1rem 1.25rem; grid-template-columns: minmax(20rem, 1.05fr) minmax(16rem, .95fr); }
  .avatar-page .avatar-paperdoll { width: min(100%, 28rem); }
  .avatar-page .avatar-slot { height: 4.5rem; max-width: 5rem; }
  .avatar-page .avatar-picker { max-height: min(20rem, 48vh); }
}
@media (max-width: 40rem) {
  .avatar-page .avatar-identity { align-items: center; }
  .avatar-page .avatar-identity h1 { font-size: clamp(1.5rem, 7vw, 2rem); overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .avatar-page .avatar-slot, .avatar-page .avatar-picker, .avatar-page .avatar-look { transition: none; }
}