/* ════════════════════════════════════════════════════════════════════
   flagship-v3-glory.css · craps/flagship-pass/v3 · DH #280 — GLORY LAYER
   ────────────────────────────────────────────────────────────────────
   The contest & glory frame layered OVER the complete v2 felt. Ambient,
   never crowding the bet surface:
     · GC coin               — §3 currency canon (glory economy, never "$")
     · TonightsTable rail     — contest identity · countdown · champion chip
     · Survival ladder        — rank · named neighbors · the single MINT slot
     · Drawer mint-line       — champion-only ticket in the Full-Game board
     · Winner banner          — one-shot settle moment (or "house held it")
   Inherits --fp-* aliases from flagship-v2-shell.css. Gold, weighty.
   ════════════════════════════════════════════════════════════════════ */

/* ── GC coin · the glory chip symbol (replaces "$") ──────────────────
   Sizes in em so it tracks whatever number it precedes. */
.gc {
  display: inline-block; width: 0.92em; height: 0.92em; border-radius: 50%;
  vertical-align: -0.07em; margin-right: 0.3em; position: relative; flex-shrink: 0;
  background: radial-gradient(circle at 36% 30%, #f6e0a0 0%, #e8c875 38%, #d4a843 64%, #a87f2c 100%);
  box-shadow: inset 0 0 0 0.5px rgba(255,255,255,0.45), inset 0 -1px 1.5px rgba(80,55,10,0.5), 0 0 4px rgba(212,168,67,0.4);
}
.gc::after {
  content: ''; position: absolute; inset: 21%; border-radius: 50%;
  border: 1px solid rgba(120,88,20,0.55);
}
/* on dark gold CTA the coin needs a darker ring to read */
.fp2-cta .gc { background: radial-gradient(circle at 36% 30%, #6b5212 0%, #3a2c08 70%); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,0.25); }
.fp2-cta .gc::after { border-color: rgba(255,255,255,0.3); }

/* ════════════════════════════════════════════════════════════════════
   TONIGHT'S TABLE — contest identity rail (top band of the card)
   Two layouts, chosen by [data-rail] on .fp2-screen: "band" | "collapse"
   ════════════════════════════════════════════════════════════════════ */
.fp2-card .ttable {
  position: relative; border: 0; border-bottom: 1px solid var(--fp-edge);
  background: linear-gradient(180deg, rgba(212,168,67,0.07), rgba(212,168,67,0.015));
  padding: 7px 10px 8px; display: flex; flex-direction: column; gap: 6px;
}

/* header line: glyph · identity · countdown */
.tt-head { display: flex; align-items: center; gap: 7px; min-width: 0; }
.tt-glyph { font-size: 11px; line-height: 1; color: var(--fp-gold-soft); flex-shrink: 0; }
.tt-kicker { font-size: 8.5px; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--fp-gold-soft); flex-shrink: 0; }
.tt-match { font-size: 11.5px; font-weight: 700; letter-spacing: 0.02em; color: var(--fp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.tt-match b { color: var(--fp-ink); font-weight: 700; }
.tt-count {
  margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--fp-mono); font-size: 8.5px; font-weight: 700; letter-spacing: 0.04em; color: var(--fp-dim);
  background: rgba(0,0,0,0.3); border: 1px solid var(--fp-edge2); border-radius: 999px; padding: 3px 7px; line-height: 1;
}
.tt-count i { width: 4px; height: 4px; border-radius: 50%; background: var(--fp-neg); box-shadow: 0 0 5px var(--fp-neg); animation: fp2-blink 1.6s ease-in-out infinite; }
.tt-count b { color: var(--fp-gold-soft); font-weight: 700; }

/* collapse-only chevron + condensed summary (hidden in band layout) */
.tt-toggle {
  margin-left: 6px; flex-shrink: 0; width: 22px; height: 22px; border-radius: 6px; cursor: pointer;
  background: rgba(255,255,255,0.04); border: 1px solid var(--fp-edge2); color: var(--fp-gold-soft);
  display: none; place-items: center; font-size: 11px; line-height: 1; transition: transform var(--fp-std);
}
.tt-summary { display: none; }

/* reigning champion chip */
.tt-champ {
  display: flex; align-items: center; gap: 7px; padding: 4px 8px; border-radius: 7px;
  background: rgba(0,0,0,0.22); border: 1px solid rgba(232,200,117,0.28);
}
.tt-champ-crown { color: var(--fp-gold-soft); font-size: 12px; line-height: 1; flex-shrink: 0; filter: drop-shadow(0 0 5px rgba(232,200,117,0.5)); }
.tt-champ-name { font-size: 12px; font-weight: 800; letter-spacing: 0.02em; color: var(--fp-gold-soft); }
.tt-champ-lbl { font-family: var(--fp-mono); font-size: 8px; letter-spacing: 0.06em; color: var(--fp-faint); text-transform: uppercase; }
.tt-champ-pl { margin-left: auto; font-family: var(--fp-mono); font-size: 9px; font-weight: 700; color: var(--fp-pos); flex-shrink: 0; }

/* ── SURVIVAL LADDER — compact rank window with the single mint slot ── */
.tt-ladder { display: flex; flex-direction: column; gap: 3px; }
.tt-rung {
  position: relative; display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 8px;
  padding: 3px 8px; border-radius: 6px; background: rgba(255,255,255,0.022); border: 1px solid var(--fp-edge);
}
.tt-rung-rank { font-family: var(--fp-mono); font-size: 11px; font-weight: 700; color: var(--fp-dim); text-align: center; line-height: 1; }
.tt-rung-who { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.tt-rung-av { width: 17px; height: 17px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center; font-family: var(--fp-mono); font-size: 7px; font-weight: 700; color: var(--fp-g1); }
.tt-rung-name { font-size: 11px; font-weight: 700; letter-spacing: 0.01em; color: var(--fp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-rung-pl { font-family: var(--fp-mono); font-size: 10px; font-weight: 700; color: var(--fp-ink); flex-shrink: 0; }
.tt-rung-pl.up { color: var(--fp-pos); } .tt-rung-pl.down { color: var(--fp-neg); }
.tt-rung-tag {
  flex-shrink: 0; font-size: 7px; font-weight: 800; letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--fp-gold-soft); display: inline-flex; align-items: center; gap: 3px;
}

/* the MINT slot — rank 1, the only ticket */
.tt-rung.mint {
  background: linear-gradient(180deg, rgba(212,168,67,0.20) 0%, rgba(212,168,67,0.05) 100%);
  border-color: rgba(232,200,117,0.55); box-shadow: 0 0 0 1px rgba(232,200,117,0.12), 0 4px 14px rgba(0,0,0,0.35);
}
.tt-rung.mint .tt-rung-rank { color: var(--fp-gold-soft); }
.tt-rung.mint .tt-rung-name { color: var(--fp-gold-soft); }
.tt-rung.mint .tt-rung-crown { color: var(--fp-gold-soft); margin-left: 4px; font-size: 9px; }

/* YOU rung */
.tt-rung.you { border-color: rgba(232,200,117,0.5); background: linear-gradient(180deg, rgba(212,168,67,0.10), rgba(212,168,67,0.02)); box-shadow: 0 0 0 1px rgba(232,200,117,0.1); }
.tt-rung.you .tt-rung-name { color: var(--fp-gold-soft); }
.tt-you-tag { font-size: 7px; font-weight: 800; letter-spacing: 0.12em; color: var(--fp-g1); background: var(--fp-gold-soft); padding: 1px 4px; border-radius: 3px; margin-left: 5px; vertical-align: middle; }

/* the CUT LINE — between the mint slot and everyone else */
.tt-cut {
  display: flex; align-items: center; gap: 8px; padding: 1px 2px; margin: 1px 0;
  font-size: 7.5px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fp-gold);
}
.tt-cut::before, .tt-cut::after { content: ''; height: 0; flex: 1; border-top: 1px dashed rgba(232,200,117,0.5); }
.tt-cut span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.tt-cut .gc { width: 0.85em; height: 0.85em; margin-right: 0; }

/* ladder footer: your standing + open-board affordance */
/* #3622 — chase-line: toned lower-contrast + tighter so it integrates into the
   ladder/cut styling instead of reading as a bright grey row. */
.tt-more { font-family: var(--fp-mono); font-size: 7.5px; letter-spacing: 0.08em; color: var(--fp-ghost); text-transform: uppercase; text-align: center; padding: 2px 0 0; opacity: 0.9; }
.tt-foot {
  /* #3622 — this is a <button>; without an explicit reset iOS Safari paints the
     UA-default light-grey/white pill, which on dark felt read as a washed-out
     white strip over "YOU'RE 13TH…". Reset chrome + give it the dark glory band
     treatment so the standing line is legible and matches .tt-rung / .tt-cut. */
  -webkit-appearance: none; appearance: none; width: 100%; text-align: left;
  margin-top: 2px; padding: 5px 9px; border-radius: 7px;
  background: linear-gradient(180deg, rgba(212,168,67,0.06), rgba(0,0,0,0.18));
  border: 1px solid var(--fp-edge);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-family: var(--fp-disp); font-size: 8.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fp-dim);
}
.tt-foot:hover { border-color: rgba(232,200,117,0.28); background: linear-gradient(180deg, rgba(212,168,67,0.09), rgba(0,0,0,0.18)); }
.tt-foot b { color: var(--fp-gold-soft); font-weight: 800; }
.tt-foot-open { font-family: var(--fp-mono); font-size: 8px; letter-spacing: 0.06em; color: var(--fp-faint); text-transform: none; }
.tt-ladder-btn { cursor: pointer; }
.tt-ladder-btn:hover .tt-foot-open { color: var(--fp-gold-soft); }

/* ════════════════════════════════════════════════════════════════════
   LAYOUT VARIANT · COLLAPSE — single-line header that expands
   ════════════════════════════════════════════════════════════════════ */
.fp2-screen[data-rail="collapse"] .tt-toggle { display: grid; }
.fp2-screen[data-rail="collapse"] .ttable[data-open="false"] .tt-champ,
.fp2-screen[data-rail="collapse"] .ttable[data-open="false"] .tt-ladder,
.fp2-screen[data-rail="collapse"] .ttable[data-open="false"] .tt-foot { display: none; }
.fp2-screen[data-rail="collapse"] .ttable[data-open="false"] .tt-summary {
  display: inline-flex; align-items: center; gap: 7px; margin-left: 2px; min-width: 0;
}
.fp2-screen[data-rail="collapse"] .ttable[data-open="false"] .tt-match { display: none; }
.fp2-screen[data-rail="collapse"] .ttable[data-open="true"] .tt-toggle { transform: rotate(180deg); }
.tt-summary-rank { font-family: var(--fp-mono); font-size: 10px; font-weight: 700; color: var(--fp-ink); }
.tt-summary-rank b { color: var(--fp-gold-soft); }
.tt-summary-mint {
  display: inline-flex; align-items: center; gap: 3px; font-size: 8px; font-weight: 800; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--fp-gold-soft); white-space: nowrap;
}
.tt-summary-mint .tt-champ-crown { font-size: 9px; }

/* ════════════════════════════════════════════════════════════════════
   NIGHTLY CADENCE — scheduled (no contest live) state
   ════════════════════════════════════════════════════════════════════ */
.fp2-card .ttable[data-state="scheduled"] { background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent); }
.ttable[data-state="scheduled"] .tt-ladder,
.ttable[data-state="scheduled"] .tt-foot,
.ttable[data-state="scheduled"] .tt-count,
.ttable[data-state="scheduled"] .tt-toggle { display: none !important; }
.tt-next {
  display: none; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 8px;
  background: rgba(0,0,0,0.22); border: 1px dashed var(--fp-edge2);
}
.ttable[data-state="scheduled"] .tt-next { display: flex; }
.tt-next-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--fp-gold-soft); box-shadow: 0 0 8px var(--fp-gold-soft); flex-shrink: 0; }
.tt-next-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tt-next-txt b { font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fp-ink); }
.tt-next-txt span { font-family: var(--fp-mono); font-size: 8px; letter-spacing: 0.04em; color: var(--fp-faint); }
.tt-next-time { margin-left: auto; flex-shrink: 0; font-family: var(--fp-mono); font-size: 14px; font-weight: 700; color: var(--fp-gold-soft); letter-spacing: 0.02em; }
.ttable[data-state="scheduled"] .tt-count i { background: var(--fp-gold-soft); box-shadow: 0 0 5px var(--fp-gold-soft); }

/* ════════════════════════════════════════════════════════════════════
   DRAWER MINT-LINE — Full-Game board shows the single championship ticket
   (canon: ONLY the champion mints; never top-N)
   ════════════════════════════════════════════════════════════════════ */
.lb-drawer[data-tier="game"] .lb-row[data-rank="1"] {
  background: linear-gradient(180deg, rgba(212,168,67,0.18) 0%, rgba(212,168,67,0.04) 100%);
  border-color: rgba(232,200,117,0.55);
}
.lb-mint-badge {
  display: inline-flex; align-items: center; gap: 4px; margin-left: 8px;
  font-size: 7.5px; font-weight: 800; letter-spacing: 0.10em; text-transform: uppercase; color: var(--fp-gold-soft);
  background: rgba(212,168,67,0.16); border: 1px solid rgba(232,200,117,0.5); border-radius: 4px; padding: 2px 5px; white-space: nowrap;
}
.lb-mint-badge.house { color: var(--fp-dim); border-color: var(--fp-edge2); background: rgba(255,255,255,0.04); }
.lb-mintline {
  display: flex; align-items: center; gap: 8px; margin: 6px 2px 4px;
  font-size: 8px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--fp-gold);
}
.lb-mintline::before, .lb-mintline::after { content: ''; flex: 1; height: 0; border-top: 1px dashed rgba(232,200,117,0.5); }
.lb-mintline span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.lb-drawer[data-tier="game"] .lb-foot { border-top-color: rgba(232,200,117,0.25); }
.lb-foot .mintrule { color: var(--fp-gold-soft); }

/* ════════════════════════════════════════════════════════════════════
   WINNER BANNER — one-shot contest-settle moment. Dismissible, ambient,
   never blocks betting (slides over the card, not the wallet/CTA).
   ════════════════════════════════════════════════════════════════════ */
.fp2-device { position: relative; }
.glory-banner {
  position: absolute; left: 14px; right: 14px; z-index: 60;
  top: 42%; transform: translateY(-50%) scale(0.96);
  border-radius: 14px; padding: 16px 16px 14px; text-align: center; overflow: hidden;
  background: linear-gradient(180deg, #1a1407 0%, #120d04 100%);
  border: 1px solid rgba(232,200,117,0.6);
  box-shadow: 0 18px 50px rgba(0,0,0,0.7), 0 0 0 1px rgba(232,200,117,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
  opacity: 0; pointer-events: none; transition: opacity 320ms var(--fp-ease), transform 320ms var(--fp-ease);
}
.glory-banner.show { opacity: 1; pointer-events: auto; transform: translateY(-50%) scale(1); }
.glory-banner.show .glory-banner-rays { animation: gb-spin 18s linear infinite; }
.glory-banner.show .gb-crown { animation: gb-crown-in 560ms var(--fp-ease) both; }
.glory-banner-glow {
  position: absolute; top: -50%; left: 50%; transform: translateX(-50%);
  width: 260px; height: 200px; pointer-events: none;
  background: radial-gradient(circle, rgba(232,200,117,0.30), transparent 68%);
}
.glory-banner-rays {
  position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
  background: conic-gradient(from 0deg at 50% 38%, transparent 0deg, rgba(232,200,117,0.10) 12deg, transparent 24deg, rgba(232,200,117,0.10) 36deg, transparent 48deg, rgba(232,200,117,0.10) 60deg, transparent 72deg);
}
.fp2-screen[data-banner="never"] .glory-banner-rays { animation: gb-spin 18s linear infinite; }
@keyframes gb-spin { to { transform: rotate(360deg); } }
.glory-banner-inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.gb-eyebrow { font-family: var(--fp-mono); font-size: 8.5px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--fp-gold); }
.gb-crown { font-size: 30px; line-height: 1; color: var(--fp-gold-soft); filter: drop-shadow(0 0 14px rgba(232,200,117,0.7)); margin: 1px 0 2px; }
.fp2-screen[data-banner="never"] .gb-crown { animation: gb-crown-in 560ms var(--fp-ease) both; }
@keyframes gb-crown-in { 0% { opacity: 0; transform: scale(1.7) translateY(-6px); } 60% { transform: scale(0.92); } 100% { opacity: 1; transform: scale(1); } }
.gb-handle { font-size: 26px; font-weight: 900; letter-spacing: 0.01em; color: var(--fp-gold-soft); line-height: 1; text-shadow: 0 0 22px rgba(232,200,117,0.4); }
.gb-line { font-size: 12.5px; font-weight: 700; letter-spacing: 0.04em; color: var(--fp-ink); line-height: 1.3; max-width: 30ch; }
.gb-line .gc { width: 0.85em; height: 0.85em; }
.gb-ticket {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; padding: 6px 12px; border-radius: 999px;
  font-size: 11px; font-weight: 800; letter-spacing: 0.10em; text-transform: uppercase; color: var(--fp-g1);
  background: linear-gradient(180deg, var(--fp-gold-soft), var(--fp-gold)); box-shadow: 0 6px 16px rgba(212,168,67,0.35);
}
.gb-ticket-star { font-size: 13px; }
.gb-meta { font-family: var(--fp-mono); font-size: 8.5px; letter-spacing: 0.06em; color: var(--fp-faint); margin-top: 3px; }
.gb-meta b { color: var(--fp-dim); font-weight: 700; }
.gb-close {
  position: absolute; top: 8px; right: 9px; z-index: 2; width: 24px; height: 24px; border-radius: 6px; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1px solid var(--fp-edge2); color: var(--fp-dim); font-size: 12px; display: grid; place-items: center;
}
.gb-close:hover { color: var(--fp-ink); }

/* bot-won / house-held honesty variant (bots never mint) */
.glory-banner[data-outcome="house"] { border-color: var(--fp-edge2); }
.glory-banner[data-outcome="house"] .glory-banner-glow,
.glory-banner[data-outcome="house"] .glory-banner-rays { display: none; }
.glory-banner[data-outcome="house"] .gb-crown { color: var(--fp-faint); filter: none; }
.glory-banner[data-outcome="house"] .gb-handle { color: var(--fp-dim); text-shadow: none; }
.glory-banner[data-outcome="house"] .gb-ticket {
  background: rgba(255,255,255,0.05); color: var(--fp-dim); border: 1px dashed var(--fp-edge2); box-shadow: none;
}

/* ════════════════════════════════════════════════════════════════════
   DICE BAND · "WAITING FOR FIRST ROLL" — come-out, before any throw.
   Dark unrolled dice + breathing standby, vs cream pipped dice when live.
   ════════════════════════════════════════════════════════════════════ */
.dice-band[data-waiting] { background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(0,0,0,0.2)); }
.dice-band[data-waiting] .die-total { display: none; }
.dice-band[data-waiting] .dice-pair .die {
  background: linear-gradient(160deg, #2b323a 0%, #191e23 100%);
  box-shadow: inset 0 0 0 1px var(--fp-edge2), 0 2px 5px rgba(0,0,0,0.45);
}
.dice-band[data-waiting] .dice-pair .die .pip { display: none; }
.dice-band[data-waiting] .dice-pair .die::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; border-radius: 50%;
  transform: translate(-50%, -50%); background: var(--fp-edge2);
  animation: db-wait-pip 1.5s ease-in-out infinite;
}
.dice-band[data-waiting] .dice-pair .die:nth-child(2)::after { animation-delay: 0.25s; }
@keyframes db-wait-pip { 0%, 100% { opacity: 0.22; transform: translate(-50%,-50%) scale(0.75); } 50% { opacity: 0.85; transform: translate(-50%,-50%) scale(1.12); background: var(--fp-gold-soft); } }
.dice-band[data-waiting] .die-evt-label { color: var(--fp-dim); font-weight: 700; }
.die-tag.wait { background: rgba(212,168,67,0.14); color: var(--fp-gold-soft); }
.dice-band[data-waiting] { animation: db-wait-edge 2.2s ease-in-out infinite; }
@keyframes db-wait-edge { 0%, 100% { border-color: var(--fp-edge2); } 50% { border-color: rgba(232,200,117,0.42); } }

@media (prefers-reduced-motion: reduce) {
  .tt-count i, .tt-champ-crown, .glory-banner-rays, .gb-crown,
  .dice-band[data-waiting], .dice-band[data-waiting] .dice-pair .die::after { animation: none !important; }
}
