:root {
  --bg: #070b16;
  --bg-deep: #050812;
  --panel: rgba(14, 21, 39, .84);
  --panel-solid: #10172a;
  --panel-soft: rgba(22, 32, 57, .72);
  --line: rgba(160, 179, 221, .15);
  --line-strong: rgba(160, 179, 221, .25);
  --text: #eff4ff;
  --muted: #8c9ab6;
  --faint: #5c6b87;
  --teal: #65e6d2;
  --teal-deep: #1db9aa;
  --gold: #f4c96e;
  --purple: #c09aff;
  --purple-deep: #8c66ee;
  --orange: #ffab75;
  --danger: #ff8a97;
  --shadow: 0 24px 80px rgba(0, 0, 0, .28);
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; color: var(--text); background: var(--bg); font-size: 14px; line-height: 1.5; }
button, input { font: inherit; }
button { border: 0; cursor: pointer; }
button:focus-visible, input:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.ambient { position: fixed; z-index: -1; pointer-events: none; border-radius: 999px; filter: blur(95px); opacity: .2; }
.ambient-a { top: -190px; right: 8%; width: 470px; height: 470px; background: #304fbb; }
.ambient-b { bottom: -240px; left: 22%; width: 420px; height: 420px; background: #0bc2af; opacity: .1; }
.ambient-c { top: 40%; left: 36%; width: 240px; height: 240px; background: #7024ae; opacity: .08; }

.app-shell { display: flex; min-height: 100vh; }
.sidebar { width: 256px; flex: 0 0 256px; display: flex; flex-direction: column; padding: 30px 18px 20px; border-right: 1px solid var(--line); background: rgba(5, 10, 21, .8); }
.brand-lockup { display: flex; gap: 11px; align-items: center; padding: 0 12px 27px; }
.brand-lockup h1 { margin: 1px 0 0; font-size: 18px; letter-spacing: .14em; font-weight: 850; }
.brand-lockup h1 span { color: var(--teal); }
.eyebrow { margin: 0; color: #6f819e; font-size: 9px; font-weight: 850; letter-spacing: .15em; line-height: 1.3; }
.brand-lockup .eyebrow { color: #788ba8; font-size: 8px; }
.brand-mark { position: relative; display: flex; gap: 3px; align-items: end; width: 25px; height: 27px; padding: 4px; border: 1px solid rgba(101, 230, 210, .35); border-radius: 8px; background: rgba(101, 230, 210, .07); }
.brand-mark span { display: block; width: 4px; border-radius: 3px; background: var(--teal); }
.brand-mark span:nth-child(1) { height: 8px; opacity: .55; }.brand-mark span:nth-child(2) { height: 14px; opacity: .8; }.brand-mark span:nth-child(3) { height: 19px; }
.zeus-bolt { position: absolute; top: -10px; right: -8px; color: var(--gold); font-family: Georgia, serif; font-size: 18px; line-height: 1; text-shadow: 0 0 12px rgba(244, 201, 110, .8); transform: rotate(12deg); }
.demo-badge { display: inline-flex; gap: 7px; align-items: center; width: max-content; margin: 0 9px 27px; padding: 6px 8px; border: 1px solid rgba(244, 201, 110, .22); border-radius: 5px; color: var(--gold); background: rgba(244, 201, 110, .07); font-size: 9px; font-weight: 850; letter-spacing: .04em; }
.pulse-dot, .status-dot, .live-indicator > span { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(101, 230, 210, .09); }
.pulse-dot { animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 6px rgba(101, 230, 210, 0); } }
.nav-stack { display: grid; gap: 3px; }
.nav-item { display: flex; gap: 11px; align-items: center; width: 100%; padding: 11px 12px; border: 1px solid transparent; border-radius: 7px; color: #8494af; background: transparent; text-align: left; font-size: 11px; font-weight: 720; transition: .2s ease; }
.nav-item:hover { color: var(--text); background: rgba(255, 255, 255, .035); }.nav-item.active { color: var(--teal); border-color: rgba(101, 230, 210, .14); background: linear-gradient(90deg, rgba(101, 230, 210, .12), rgba(101, 230, 210, .025)); }
.nav-icon { width: 17px; color: #667894; font-size: 16px; text-align: center; }.nav-item.active .nav-icon { color: var(--teal); }.nav-count { margin-left: auto; padding: 2px 5px; border-radius: 4px; color: var(--purple); background: rgba(192, 154, 255, .12); font-size: 8px; }
.sidebar-bottom { margin-top: auto; }
.system-card { margin: 0 3px 17px; padding: 13px 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(18, 30, 52, .55); }.system-card-head { display: flex; gap: 8px; align-items: center; color: #c3d5dd; font-size: 10px; font-weight: 800; }.system-card-head .status-dot { width: 5px; height: 5px; }.system-row { display: flex; justify-content: space-between; margin-top: 15px; color: #72839e; font-size: 9px; }.system-row strong { color: var(--teal); }.meter { height: 3px; margin: 6px 0 10px; overflow: hidden; border-radius: 4px; background: rgba(136, 155, 189, .16); }.meter span { display: block; height: 100%; border-radius: inherit; background: var(--teal); }.system-card p { margin: 0; color: var(--faint); font-size: 8px; line-height: 1.4; }
.user-chip { display: flex; gap: 9px; align-items: center; padding: 0 7px; }.user-chip > div:nth-child(2) { min-width: 0; }.user-chip strong, .user-chip span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.user-chip strong { color: #c2cfdf; font-size: 10px; }.user-chip span { margin-top: 2px; color: #677894; font-family: ui-monospace, monospace; font-size: 8px; }.user-chip .icon-button { margin-left: auto; }
.avatar { display: grid; place-items: center; width: 31px; height: 31px; flex: 0 0 31px; border-radius: 50%; color: #111c2e; background: var(--teal); font-size: 10px; font-weight: 950; }.avatar-button { color: #111c2e; background: var(--teal); }.icon-button { padding: 2px; color: #7888a1; background: transparent; font-size: 17px; }

.main-content { width: 100%; max-width: 1520px; min-width: 0; margin: 0 auto; padding: 31px 46px 55px; }
.topbar { display: flex; justify-content: space-between; gap: 25px; align-items: center; margin-bottom: 21px; }.topbar h2 { margin: 3px 0 0; font-size: 24px; letter-spacing: -.045em; line-height: 1.1; }.topbar-actions { display: flex; gap: 10px; align-items: center; }.network-chip { display: inline-flex; gap: 7px; align-items: center; padding: 8px 10px; border: 1px solid rgba(101, 230, 210, .18); border-radius: 6px; color: #99b8ba; background: rgba(101, 230, 210, .045); font-size: 9px; font-weight: 800; }.chain-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #6d88ff; box-shadow: 0 0 0 4px rgba(109, 136, 255, .11); }.outline-button, .filter-button { padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 6px; color: #a1b0c6; background: transparent; font-size: 9px; font-weight: 800; }.outline-button:hover, .filter-button:hover { border-color: rgba(101, 230, 210, .4); color: var(--teal); }
.preview-banner { display: flex; gap: 8px; align-items: center; margin-bottom: 18px; padding: 9px 12px; border: 1px solid rgba(244, 201, 110, .17); border-radius: 7px; color: #9f9a77; background: rgba(244, 201, 110, .045); font-size: 10px; }.preview-banner strong { color: var(--gold); }.preview-lock { color: var(--gold); font-size: 14px; }
.view { display: none; animation: rise .25s ease both; }.view.active { display: block; }@keyframes rise { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

.hero-panel { position: relative; display: flex; min-height: 302px; overflow: hidden; padding: 42px 44px; border: 1px solid rgba(101, 230, 210, .18); border-radius: 14px; background: radial-gradient(circle at 78% 45%, rgba(58, 101, 169, .27), transparent 30%), linear-gradient(120deg, rgba(17, 38, 62, .94), rgba(18, 20, 51, .78) 70%, rgba(35, 25, 68, .7)); box-shadow: var(--shadow); }.hero-panel::after { position: absolute; right: -90px; bottom: -130px; width: 390px; height: 240px; border-radius: 50%; background: rgba(101, 230, 210, .04); content: ""; filter: blur(2px); }.hero-copy { position: relative; z-index: 2; max-width: 560px; }.kicker { display: flex; gap: 7px; align-items: center; color: var(--teal); font-size: 9px; font-weight: 900; letter-spacing: .13em; }.spark { color: var(--gold); font-size: 15px; }.hero-copy h3 { margin: 16px 0 11px; font-size: clamp(39px, 5vw, 58px); font-weight: 780; letter-spacing: -.075em; line-height: .94; }.hero-copy h3 em { color: var(--teal); font-style: normal; }.hero-copy > p { max-width: 500px; margin: 0; color: #a6b6ca; font-size: 12px; line-height: 1.7; }.hero-actions { display: flex; gap: 18px; align-items: center; margin-top: 24px; }.primary-button { display: inline-flex; gap: 10px; align-items: center; justify-content: center; padding: 11px 14px; border-radius: 7px; color: #07131d; background: var(--teal); font-size: 10px; font-weight: 950; box-shadow: 0 8px 22px rgba(101, 230, 210, .11); transition: .2s ease; }.primary-button:hover { background: #83f0df; transform: translateY(-1px); }.text-button { padding: 7px 0; color: #a9b8ce; background: transparent; font-size: 10px; font-weight: 850; }.text-button:hover { color: var(--teal); }.hero-micro { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; color: #758ba4; font-size: 9px; }.hero-micro span { display: inline-flex; gap: 6px; align-items: center; }.hero-micro .mini-dot { margin: 0; }
.daily-gift { display: grid; grid-template-columns: 92px 1fr auto; gap: 20px; align-items: center; margin: 12px 0 30px; padding: 20px 22px; overflow: hidden; border-color: rgba(244, 201, 110, .26); background: radial-gradient(circle at 10% 50%, rgba(244, 201, 110, .12), transparent 23%), linear-gradient(120deg, rgba(45, 34, 30, .8), rgba(17, 25, 45, .78)); }
.daily-wheel-wrap { position: relative; display: grid; place-items: center; width: 184px; height: 184px; }
.daily-wheel { position: relative; width: 164px; height: 164px; overflow: visible; border: 4px solid rgba(244, 201, 110, .72); border-radius: 50%; background: conic-gradient(#667cff 0 72deg, #d2a15c 72deg 144deg, #229edc 144deg 216deg, #c44b3d 216deg 288deg, #37a86c 288deg 360deg); box-shadow: 0 0 0 7px rgba(244, 201, 110, .06), 0 0 38px rgba(244, 201, 110, .24); transform: rotate(0deg); transition: transform 4.6s cubic-bezier(.12, .83, .18, 1); }
.daily-wheel::after { position: absolute; inset: 12px; border: 1px solid rgba(255, 255, 255, .23); border-radius: 50%; content: ""; }
.daily-wheel-pointer { position: absolute; z-index: 8; top: -2px; color: var(--gold); font-size: 24px; line-height: 1; text-shadow: 0 0 16px rgba(244, 201, 110, .8); }
.wheel-god { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 48px; margin: -24px; color: #fff9e8; font-family: Georgia, serif; font-size: 21px; font-weight: 900; line-height: .9; text-align: center; text-shadow: 0 2px 5px rgba(0, 0, 0, .42); }
.wheel-god small { display: block; margin-top: 5px; font-family: Inter, system-ui, sans-serif; font-size: 6px; font-weight: 950; letter-spacing: .08em; }
.wheel-zeus { transform: rotate(0deg) translateY(-57px) rotate(0deg); }.wheel-athena { transform: rotate(72deg) translateY(-57px) rotate(-72deg); }.wheel-poseidon { transform: rotate(144deg) translateY(-57px) rotate(-144deg); }.wheel-ares { transform: rotate(216deg) translateY(-57px) rotate(-216deg); }.wheel-hermes { transform: rotate(288deg) translateY(-57px) rotate(-288deg); }
.daily-wheel-core { position: absolute; z-index: 3; top: 50%; left: 50%; display: grid; place-items: center; width: 47px; height: 47px; border: 2px solid rgba(255, 255, 255, .52); border-radius: 50%; color: #fff4c2; background: #17182d; font-family: Georgia, serif; font-size: 25px; transform: translate(-50%, -50%); box-shadow: 0 0 20px rgba(4, 8, 22, .5); }
.daily-god-animation { position: absolute; z-index: 9; inset: 0; display: grid; place-items: center; pointer-events: none; color: var(--gold); font-family: Georgia, serif; font-size: 40px; opacity: 0; transform: scale(.6); }
.daily-wheel.spinning { animation: wheelGlow .6s ease-in-out infinite alternate; }
.daily-gift.god-zeus { border-color: rgba(122, 151, 255, .52); }.daily-gift.god-athena { border-color: rgba(244, 201, 110, .55); }.daily-gift.god-poseidon { border-color: rgba(34, 158, 220, .5); }.daily-gift.god-ares { border-color: rgba(196, 75, 61, .52); }.daily-gift.god-hermes { border-color: rgba(55, 168, 108, .5); }
.daily-gift.god-zeus .daily-god-animation { color: #d8ddff; animation: giftZeus .9s steps(2, end) 3; }.daily-gift.god-athena .daily-god-animation { color: #ffe9a6; animation: giftAthena .9s ease-out 3; }.daily-gift.god-poseidon .daily-god-animation { color: #8de8ff; animation: giftPoseidon .9s ease-in-out 3; }.daily-gift.god-ares .daily-god-animation { color: #ff9a70; animation: giftAres .65s ease-in-out 4; }.daily-gift.god-hermes .daily-god-animation { color: #9affc1; animation: giftHermes .55s ease-in-out 5; }
@keyframes wheelGlow { to { filter: brightness(1.2) saturate(1.2); } } @keyframes giftZeus { 0%,100% { opacity: .2; transform: scale(.75); } 25%,35% { opacity: 1; transform: scale(1.14) translate(8px, -3px); } 55% { opacity: .1; transform: scale(1.24) translate(-8px, 3px); } } @keyframes giftAthena { 0%,100% { opacity: .3; transform: translateY(7px) scale(.82); } 50% { opacity: 1; transform: translateY(-10px) scale(1.08); } } @keyframes giftPoseidon { 0%,100% { opacity: .35; transform: translateY(5px) scale(.9) rotate(-3deg); } 50% { opacity: 1; transform: translateY(-9px) scale(1.13) rotate(3deg); } } @keyframes giftAres { 0%,100% { opacity: .25; transform: translateY(4px) scale(.9); } 50% { opacity: 1; transform: translateY(-5px) scale(1.2); } } @keyframes giftHermes { 0%,100% { opacity: .25; transform: translateX(-12px) scale(.8); } 50% { opacity: 1; transform: translateX(12px) scale(1.08); } }
.gift-ray { color: var(--gold); font-family: Georgia, serif; font-size: 44px; line-height: 1; text-shadow: 0 0 18px rgba(244, 201, 110, .58); transform: rotate(12deg); }
.gift-orbit { position: absolute; color: var(--purple); font-size: 12px; }.orbit-a { top: 8px; right: 11px; }.orbit-b { bottom: 10px; left: 10px; color: var(--teal); }
.daily-gift-copy h3 { margin: 4px 0 4px; font-size: 20px; letter-spacing: -.045em; }.daily-gift-copy p:not(.eyebrow) { max-width: 660px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.daily-god-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }.daily-god-row span { padding: 4px 7px; border: 1px solid rgba(244, 201, 110, .17); border-radius: 999px; color: #9f947b; background: rgba(244, 201, 110, .045); font-size: 8px; font-weight: 800; transition: .25s ease; }.daily-god-row span.active { color: #171222; border-color: var(--gold); background: var(--gold); box-shadow: 0 0 16px rgba(244, 201, 110, .26); transform: translateY(-2px); }
.daily-gift-action { display: grid; gap: 10px; min-width: 190px; }.gift-result { padding: 10px 12px; border: 1px solid rgba(244, 201, 110, .18); border-radius: 7px; background: rgba(5, 12, 25, .35); }.gift-result-label, .gift-result strong, .gift-result small { display: block; }.gift-result-label { color: #8c826d; font-size: 7px; font-weight: 900; letter-spacing: .12em; }.gift-result strong { margin-top: 3px; color: var(--gold); font-size: 13px; }.gift-result small { margin-top: 2px; color: var(--muted); font-size: 8px; }.gift-spin-button { width: 100%; }.gift-spin-button[disabled] { cursor: wait; opacity: .65; transform: none; }
.hero-orbit { position: absolute; top: 50%; right: 5%; width: 305px; height: 305px; transform: translateY(-50%); }.orbit-ring { position: absolute; inset: 20px; border: 1px solid rgba(101, 230, 210, .25); border-radius: 50%; transform: rotate(25deg) skew(-5deg); }.ring-two { inset: 49px -9px; border-color: rgba(192, 154, 255, .35); transform: rotate(-44deg) skew(5deg); }.ring-three { inset: 2px 54px; border-color: rgba(244, 201, 110, .17); transform: rotate(70deg); }.orbit-core { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 100px; height: 100px; border: 1px solid rgba(101, 230, 210, .55); border-radius: 50%; background: rgba(9, 21, 39, .8); transform: translate(-50%, -50%); box-shadow: 0 0 0 13px rgba(101, 230, 210, .035), 0 0 55px rgba(101, 230, 210, .14); }.orbit-core span { color: var(--teal); font-family: Georgia, serif; font-size: 37px; font-weight: 800; line-height: 1; }.orbit-core small { margin-top: -17px; color: #7f9caa; font-size: 7px; font-weight: 900; letter-spacing: .15em; }.orbit-label { position: absolute; color: #768aa6; font-size: 7px; letter-spacing: .08em; line-height: 1.25; }.orbit-label strong { color: var(--text); font-size: 9px; letter-spacing: .1em; }.label-one { top: 45px; left: 11px; }.label-two { top: 34px; right: 1px; text-align: right; }.label-three { bottom: 34px; left: 62px; }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin: 12px 0 30px; }.stat-card { min-height: 96px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 10px; background: rgba(13, 22, 41, .72); }.stat-label { display: block; color: #6e809d; font-size: 8px; font-weight: 900; letter-spacing: .11em; }.stat-card strong { display: block; margin: 6px 0 5px; font-size: 26px; letter-spacing: -.06em; }.stat-card strong small { color: var(--faint); font-size: 11px; letter-spacing: 0; }.stat-card > small:not(.positive) { color: #8494ae; font-size: 9px; }.stat-card .positive { color: var(--teal); font-size: 9px; }.accent-stat { border-color: rgba(192, 154, 255, .23); background: linear-gradient(140deg, rgba(45, 35, 75, .5), rgba(15, 22, 41, .7)); }.accent-stat strong { color: var(--purple); }
.section-heading, .panel-heading, .view-heading { display: flex; justify-content: space-between; gap: 15px; align-items: center; }.section-heading { margin-bottom: 13px; }.section-heading h3, .panel-heading h3 { margin: 4px 0 0; font-size: 18px; letter-spacing: -.04em; }.section-actions { display: flex; gap: 12px; align-items: center; }.live-indicator { display: inline-flex; gap: 7px; align-items: center; color: #92a5b8; font-size: 9px; font-weight: 750; }.live-indicator > span { width: 5px; height: 5px; }
.format-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.format-card { padding: 21px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, rgba(17, 31, 54, .88), rgba(10, 20, 37, .76)); }.flash-format { border-color: rgba(101, 230, 210, .2); }.box-format { border-color: rgba(192, 154, 255, .24); background: linear-gradient(145deg, rgba(35, 28, 65, .77), rgba(12, 20, 39, .82)); }.format-topline { display: flex; justify-content: space-between; align-items: center; }.category-pill { display: inline-block; padding: 4px 7px; border-radius: 5px; font-size: 8px; font-weight: 900; letter-spacing: .1em; }.teal-pill { color: var(--teal); background: rgba(101, 230, 210, .1); }.purple-pill { color: var(--purple); background: rgba(192, 154, 255, .11); }.format-symbol { color: var(--teal); font-size: 25px; line-height: 1; }.box-format .format-symbol { color: var(--purple); }.format-card h4 { margin: 20px 0 5px; font-size: 21px; letter-spacing: -.055em; }.format-card > p { min-height: 40px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }.rule-row { display: flex; gap: 20px; margin: 19px 0; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #8294ae; font-size: 9px; }.rule-row b { color: var(--text); font-size: 12px; }.format-footer { display: flex; justify-content: space-between; align-items: end; }.format-footer small { display: block; color: var(--faint); font-size: 8px; font-weight: 850; letter-spacing: .1em; }.format-footer strong { display: block; margin-top: 3px; font-size: 16px; }.small-primary, .small-purple, .small-outline { display: inline-flex; gap: 7px; align-items: center; justify-content: center; padding: 8px 10px; border-radius: 6px; font-size: 9px; font-weight: 900; }.small-primary { color: #07131d; background: var(--teal); }.small-primary:hover { background: #83f0df; }.small-purple { color: #0e0c19; background: var(--purple); }.small-purple:hover { background: #d2baff; }.small-outline { color: #a8b8cc; border: 1px solid var(--line-strong); background: transparent; }.small-outline:hover { color: var(--teal); border-color: rgba(101, 230, 210, .35); }.large-action { padding: 10px 13px; }
.lower-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 12px; margin-top: 12px; }.panel { border: 1px solid var(--line); border-radius: 12px; background: rgba(13, 22, 41, .72); }.schedule-panel, .integrity-panel, .payout-history, .ops-table-panel { padding: 20px; }.schedule-panel .panel-heading, .integrity-panel .panel-heading { margin-bottom: 15px; }.schedule-row { display: grid; grid-template-columns: 73px 1fr 60px 56px; gap: 12px; align-items: center; padding: 13px 0; border-top: 1px solid var(--line); }.featured-schedule { padding-top: 3px; border-top: 0; }.schedule-time strong { display: block; font-size: 15px; }.schedule-time span, .schedule-info span { display: block; color: var(--muted); font-size: 9px; }.schedule-info strong { display: block; font-size: 11px; }.schedule-entry { text-align: right; }.schedule-entry span { display: block; color: #70839e; font-size: 8px; font-weight: 800; letter-spacing: .1em; }.schedule-entry strong { display: block; margin-top: 3px; font-size: 13px; }.panel-footnote { display: flex; gap: 7px; align-items: center; margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--line); color: #7489a4; font-size: 9px; }.panel-footnote .status-dot { width: 5px; height: 5px; }.secure-badge, .review-badge, .preview-label, .wallet-lock { display: inline-flex; align-items: center; width: max-content; padding: 5px 7px; border-radius: 5px; color: var(--teal); background: rgba(101, 230, 210, .08); font-size: 8px; font-weight: 900; letter-spacing: .1em; }.purple-badge { color: var(--purple); background: rgba(192, 154, 255, .1); }.preview-label { color: #9b8e6e; background: rgba(244, 201, 110, .07); }.wallet-lock { margin-top: 8px; color: #a9b5cf; border: 1px solid var(--line); background: transparent; }.integrity-score { display: flex; gap: 14px; align-items: center; padding: 8px 0 17px; }.score-ring { display: grid; place-items: center; width: 68px; height: 68px; border: 5px solid rgba(101, 230, 210, .72); border-left-color: rgba(101, 230, 210, .16); border-radius: 50%; transform: rotate(-34deg); }.score-ring strong, .score-ring span { transform: rotate(34deg); }.score-ring strong { font-size: 21px; line-height: 1; }.score-ring span { color: var(--faint); font-size: 8px; }.integrity-score > div:last-child strong { font-size: 12px; }.integrity-score p { max-width: 185px; margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; }.integrity-list { border-top: 1px solid var(--line); }.integrity-list div { display: flex; gap: 8px; align-items: center; padding: 9px 0; border-bottom: 1px solid rgba(160, 179, 221, .08); color: #9eadc1; font-size: 9px; }.integrity-list b { margin-left: auto; color: var(--teal); font-size: 8px; letter-spacing: .08em; }.check-icon { display: grid; place-items: center; width: 17px; height: 17px; color: var(--teal); border: 1px solid rgba(101, 230, 210, .35); border-radius: 50%; font-size: 10px; }

.view-heading { align-items: flex-start; margin: 18px 0 24px; }.view-heading h3 { margin: 5px 0 0; font-size: 30px; letter-spacing: -.06em; line-height: 1.05; }.view-heading p:last-child { margin: 7px 0 0; color: var(--muted); font-size: 11px; }.view-heading > :last-child { margin-top: 8px; }
.rule-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--line); }.rule-strip > div { display: grid; grid-template-columns: 30px 1fr; gap: 4px 9px; padding: 16px; background: rgba(14, 24, 44, .8); }.rule-number { grid-row: span 2; color: var(--teal); font-family: ui-monospace, monospace; font-size: 11px; }.rule-strip strong { font-size: 11px; }.rule-strip small { color: var(--muted); font-size: 9px; line-height: 1.4; }.flash-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.format-detail, .preview-callout { min-height: 277px; padding: 23px; }.detail-label { font-size: 8px; font-weight: 900; letter-spacing: .13em; }.teal-text { color: var(--teal); }.detail-number { margin: 11px 0 1px; color: var(--teal); font-size: 54px; font-weight: 850; letter-spacing: -.08em; line-height: 1; }.detail-number span { margin-left: 4px; color: var(--faint); font-size: 11px; letter-spacing: .08em; }.format-detail h4, .preview-callout h4 { margin: 11px 0 7px; font-size: 18px; letter-spacing: -.04em; }.format-detail > p, .preview-callout > p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }.detail-list { margin-top: 17px; border-top: 1px solid var(--line); }.detail-list div { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid rgba(160, 179, 221, .08); color: #7589a5; font-size: 9px; }.detail-list b { color: var(--text); }.preview-callout { position: relative; overflow: hidden; border-color: rgba(192, 154, 255, .23); background: radial-gradient(circle at 80% 20%, rgba(192, 154, 255, .14), transparent 28%), rgba(31, 26, 59, .56); }.callout-orb { display: grid; place-items: center; width: 43px; height: 43px; margin-bottom: 20px; border: 1px solid rgba(192, 154, 255, .35); border-radius: 12px; color: var(--purple); background: rgba(192, 154, 255, .1); font-size: 24px; }.preview-callout .eyebrow { color: var(--purple); }.preview-callout .small-primary { margin-top: 20px; }.preview-note { display: flex; gap: 7px; align-items: flex-start; margin-top: 25px; padding-top: 12px; border-top: 1px solid rgba(192, 154, 255, .16); color: #8f8aa8; font-size: 9px; }.preview-note .status-dot { width: 5px; height: 5px; margin-top: 5px; }

.box-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin-bottom: 12px; }.box-stat { padding: 16px 18px; border: 1px solid rgba(192, 154, 255, .16); border-radius: 9px; background: rgba(24, 22, 49, .58); }.box-stat span { display: block; color: #817d9d; font-size: 8px; font-weight: 900; letter-spacing: .1em; }.box-stat strong { display: block; margin: 5px 0 2px; color: var(--purple); font-size: 25px; letter-spacing: -.06em; }.box-stat small { color: var(--muted); font-size: 9px; }.box-layout { display: grid; grid-template-columns: 1.3fr .7fr; gap: 12px; }.board-preview-panel { padding: 21px; }.board-preview-panel .panel-heading { margin-bottom: 16px; }.board-mini { overflow: hidden; border: 1px solid rgba(192, 154, 255, .22); border-radius: 8px; background: rgba(8, 13, 29, .58); }.board-head, .board-cells { display: grid; grid-template-columns: repeat(5, 1fr); }.board-head span { min-width: 0; padding: 10px 5px; border-right: 1px solid rgba(192, 154, 255, .14); color: #a591dd; background: rgba(111, 75, 183, .12); font-size: 8px; font-weight: 900; text-align: center; }.board-head span:last-child { border: 0; }.board-cells button { min-height: 50px; border-top: 1px solid rgba(192, 154, 255, .12); border-right: 1px solid rgba(192, 154, 255, .12); color: var(--purple); background: rgba(21, 24, 52, .65); font-size: 14px; font-weight: 850; }.board-cells button:nth-child(5n) { border-right: 0; }.board-cells button:hover { color: #fff; background: rgba(137, 98, 220, .3); }.board-caption { display: flex; gap: 7px; align-items: center; margin: 12px 0 0; color: var(--muted); font-size: 9px; }.board-caption .mini-dot { margin: 0; }.box-steps { padding: 23px; }.box-steps > .eyebrow { color: var(--purple); }.box-step { display: flex; gap: 11px; align-items: flex-start; margin-top: 22px; }.box-step > span { display: grid; place-items: center; width: 23px; height: 23px; flex: 0 0 23px; border: 1px solid rgba(192, 154, 255, .38); border-radius: 50%; color: var(--purple); font-size: 9px; }.box-step strong, .box-step small { display: block; }.box-step strong { font-size: 11px; }.box-step small { margin-top: 2px; color: var(--muted); font-size: 9px; line-height: 1.4; }.cancel-note { display: flex; gap: 9px; align-items: flex-start; margin-top: 24px; padding: 11px; border: 1px solid rgba(244, 201, 110, .17); border-radius: 7px; background: rgba(244, 201, 110, .045); }.cancel-note > span { display: grid; place-items: center; width: 18px; height: 18px; color: var(--gold); border: 1px solid rgba(244, 201, 110, .4); border-radius: 50%; font-size: 10px; font-weight: 900; }.cancel-note strong, .cancel-note small { display: block; }.cancel-note strong { color: var(--gold); font-size: 10px; }.cancel-note small { margin-top: 2px; color: #aaa078; font-size: 9px; line-height: 1.4; }

.wallet-layout { display: grid; grid-template-columns: .88fr 1.12fr; gap: 12px; }.balance-panel, .payout-panel { padding: 23px; }.big-balance { margin: 8px 0 24px; font-size: 43px; font-weight: 800; letter-spacing: -.07em; }.big-balance span { color: var(--teal); font-size: 11px; font-weight: 900; letter-spacing: .1em; }.balance-sub { display: flex; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }.balance-sub strong { color: var(--text); }.wallet-address { display: flex; gap: 9px; align-items: center; margin-top: 21px; padding: 12px; border: 1px solid rgba(101, 230, 210, .18); border-radius: 8px; background: rgba(101, 230, 210, .035); }.wallet-address small, .wallet-address strong { display: block; }.wallet-address small { color: #7287a2; font-size: 8px; letter-spacing: .1em; }.wallet-address strong { margin-top: 2px; color: #c6d9e5; font-family: ui-monospace, monospace; font-size: 10px; }.copy-button { margin-left: auto; color: var(--teal); background: transparent; font-size: 10px; font-weight: 800; }.locked-note { display: flex; gap: 7px; margin-top: 15px; color: #778ba6; font-size: 9px; line-height: 1.45; }.locked-note > span { color: var(--gold); font-size: 14px; }.input-label { display: block; margin: 17px 0 7px; color: #9cb0c9; font-size: 10px; font-weight: 800; }.amount-input, .secret-input { display: flex; gap: 8px; align-items: center; padding: 0 12px; border: 1px solid rgba(151, 181, 218, .24); border-radius: 8px; background: rgba(5, 15, 30, .5); }.amount-input { color: var(--teal); font-size: 20px; }.amount-input input, .secret-input input { width: 100%; padding: 12px 0; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 21px; font-weight: 800; }.amount-input .unit { color: #7b91ac; font-size: 10px; font-weight: 900; letter-spacing: .1em; }.payout-tier { display: flex; gap: 9px; align-items: center; margin-top: 13px; padding: 11px; border: 1px solid rgba(101, 230, 210, .22); border-radius: 8px; background: rgba(101, 230, 210, .06); }.tier-icon { display: grid; place-items: center; width: 21px; height: 21px; color: var(--teal); border-radius: 50%; background: rgba(101, 230, 210, .15); font-size: 11px; }.payout-tier strong, .payout-tier span { display: block; }.payout-tier strong { color: #c5eadd; font-size: 10px; }.payout-tier span { color: #8ea9ad; font-size: 9px; }.tier-tag { margin-left: auto; color: var(--teal) !important; font-size: 8px !important; font-weight: 900; letter-spacing: .1em; }.payout-tier.kyc-required { border-color: rgba(192, 154, 255, .33); background: rgba(192, 154, 255, .07); }.payout-tier.kyc-required .tier-icon { color: var(--purple); background: rgba(192, 154, 255, .15); }.payout-tier.kyc-required .tier-tag { color: var(--purple) !important; }.secret-input span { color: var(--faint); }.full-width { width: 100%; }.center { text-align: center; }.fine-print { margin: 13px 0 0; color: var(--faint); font-size: 9px; line-height: 1.5; }.payout-history { margin-top: 12px; }.history-table { margin-top: 15px; }.history-head, .history-row { display: grid; grid-template-columns: .7fr 1fr 1.1fr .6fr; gap: 15px; align-items: center; padding: 12px 4px; }.history-head { color: #7287a2; border-bottom: 1px solid var(--line); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.history-row { color: var(--muted); border-bottom: 1px solid rgba(155, 181, 219, .1); font-size: 10px; }.history-row strong { color: var(--text); font-size: 12px; }.mini-dot { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; }.green-dot { background: var(--teal); }.gold-dot { background: var(--gold); }.blue-dot { background: #83bbff; }.purple-dot { background: var(--purple); }.status-text { font-size: 9px; letter-spacing: .04em; }.status-text.amber { color: var(--gold); }.status-text.green { color: var(--teal); }

.policy-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.policy-card { min-height: 180px; padding: 25px; }.policy-number { color: rgba(101, 230, 210, .65); font-family: ui-monospace, monospace; font-size: 11px; font-weight: 900; }.policy-card h4 { margin: 20px 0 7px; font-size: 16px; }.policy-card p { max-width: 390px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }.policy-line { display: flex; justify-content: space-between; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--faint); font-size: 9px; }.policy-line strong { color: var(--teal); }.ops-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 12px 0; }.ops-stat { padding: 16px 18px; border: 1px solid var(--line); border-radius: 10px; background: rgba(13, 27, 48, .7); }.ops-stat span, .ops-stat small { display: block; color: #7185a0; font-size: 8px; font-weight: 800; letter-spacing: .1em; }.ops-stat strong { display: block; margin: 4px 0; font-size: 24px; }.ops-stat small { font-weight: 500; letter-spacing: 0; }.purple-card strong { color: var(--purple); }.green-card strong { color: var(--teal); }.ops-table { margin-top: 16px; overflow-x: auto; }.ops-head, .ops-row { display: grid; grid-template-columns: 1.45fr .65fr 1fr 1fr 1.15fr .6fr; gap: 12px; align-items: center; min-width: 850px; padding: 12px 7px; }.ops-head { color: #7185a0; border-bottom: 1px solid var(--line); font-size: 8px; font-weight: 900; letter-spacing: .11em; }.ops-row { color: #9cafc7; border-bottom: 1px solid rgba(155, 181, 219, .1); font-size: 10px; }.ops-row > strong { color: var(--text); font-size: 12px; }.player-cell { display: flex; gap: 8px; align-items: center; }.player-cell strong, .player-cell span { display: block; }.player-cell strong { color: var(--text); font-size: 11px; }.player-cell span { margin-top: 2px; color: var(--faint); font-size: 9px; }.tiny { width: 26px; height: 26px; flex-basis: 26px; font-size: 8px; }.tiny.gold { background: var(--gold); }.tiny.teal { background: var(--teal); }.tier-label { font-size: 9px; font-weight: 800; }.kyc-label { color: var(--purple); }.manual-label { color: #83bbff; }.status-pill { width: max-content; padding: 4px 6px; border-radius: 5px; font-size: 8px; font-weight: 800; }.status-pill.waiting { color: var(--purple); background: rgba(192, 154, 255, .11); }.status-pill.ready { color: var(--gold); background: rgba(244, 201, 110, .1); }.status-pill.verified { color: var(--teal); background: rgba(101, 230, 210, .1); }.row-action { color: var(--teal); background: transparent; font-size: 9px; font-weight: 900; text-align: right; }.notice-panel { display: flex; gap: 13px; align-items: flex-start; margin-top: 12px; padding: 16px 18px; border-color: rgba(244, 201, 110, .19); background: rgba(244, 201, 110, .05); }.notice-icon { display: grid; place-items: center; width: 22px; height: 22px; color: var(--gold); border: 1px solid rgba(244, 201, 110, .4); border-radius: 50%; font-weight: 900; }.notice-panel strong { font-size: 11px; }.notice-panel p { margin: 3px 0 0; color: #a9a886; font-size: 9px; line-height: 1.5; }

.site-footer { display: flex; justify-content: space-between; gap: 14px; margin-top: 28px; padding: 14px 2px 0; border-top: 1px solid var(--line); color: #5c6a83; font-size: 9px; }.site-footer a { color: #879bd0; }.site-footer a:hover { color: var(--teal); }

.modal-backdrop { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(2, 6, 15, .79); backdrop-filter: blur(8px); }.modal-backdrop[hidden] { display: none; }.modal-card, .game-card { position: relative; width: min(460px, 100%); padding: 29px; border: 1px solid rgba(192, 154, 255, .35); border-radius: 15px; background: #10172a; box-shadow: 0 30px 90px rgba(0, 0, 0, .46); }.modal-close { position: absolute; top: 12px; right: 15px; color: #8ca0bc; background: transparent; font-size: 23px; }.modal-icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 18px; color: var(--purple); border: 1px solid rgba(192, 154, 255, .42); border-radius: 10px; background: rgba(192, 154, 255, .1); font-size: 21px; }.modal-card h3 { max-width: 350px; margin: 0; font-size: 23px; line-height: 1.1; letter-spacing: -.04em; }.modal-copy { color: var(--muted); font-size: 11px; line-height: 1.55; }.verification-steps { display: grid; gap: 11px; margin: 22px 0; }.verification-step { display: flex; gap: 10px; align-items: center; color: var(--muted); }.verification-step > span { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid var(--line); border-radius: 50%; font-size: 10px; }.verification-step.active { color: var(--text); }.verification-step.active > span { color: var(--purple); border-color: rgba(192, 154, 255, .55); background: rgba(192, 154, 255, .12); }.verification-step strong, .verification-step small { display: block; }.verification-step strong { font-size: 11px; }.verification-step small { color: var(--faint); font-size: 9px; }.provider-note { display: flex; gap: 8px; align-items: flex-start; margin: 17px 0; padding: 11px; border: 1px solid rgba(244, 201, 110, .18); border-radius: 7px; color: #cfc18d; font-size: 10px; }.provider-note .status-dot { margin-top: 4px; background: var(--gold); }.provider-note strong, .provider-note small { display: block; }.provider-note small { margin-top: 3px; color: #999575; }

.game-backdrop { z-index: 25; align-items: center; overflow: auto; padding: 28px; }.game-card { width: min(820px, 100%); padding: 24px; border-color: rgba(101, 230, 210, .3); background: linear-gradient(145deg, #111a2e, #0b1325); }.game-header { display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; }.game-header h3 { margin: 5px 0 0; font-size: 25px; letter-spacing: -.055em; }.game-header-actions { display: flex; gap: 14px; align-items: center; }.game-header-actions .modal-close { position: static; padding: 0; }.game-warning { display: flex; gap: 8px; align-items: flex-start; margin: 18px 0; padding: 9px 11px; border: 1px solid rgba(244, 201, 110, .2); border-radius: 7px; color: #aaa37e; background: rgba(244, 201, 110, .05); font-size: 9px; line-height: 1.45; }.game-warning > span:first-child { color: var(--gold); font-size: 14px; }.game-warning strong { color: var(--gold); }.game-mode[hidden] { display: none; }.game-meta { display: grid; grid-template-columns: 1fr 1fr 92px; gap: 10px; margin-top: 5px; }.game-meta > div { padding: 11px 13px; border: 1px solid var(--line); border-radius: 7px; background: rgba(5, 12, 26, .4); }.game-meta span { display: block; color: #6c80a0; font-size: 8px; font-weight: 900; letter-spacing: .11em; }.game-meta strong { display: block; margin-top: 3px; font-size: 15px; }.timer-box { border-color: rgba(101, 230, 210, .28) !important; text-align: right; }.timer-box strong { color: var(--teal); font-family: ui-monospace, monospace; }.progress-line { height: 4px; margin: 13px 0; overflow: hidden; border-radius: 4px; background: rgba(139, 160, 201, .12); }.progress-line span { display: block; height: 100%; width: 10%; border-radius: inherit; background: linear-gradient(90deg, var(--teal), var(--purple)); transition: width .25s ease; }.question-card { min-height: 160px; padding: 22px; border: 1px solid rgba(101, 230, 210, .22); border-radius: 10px; background: radial-gradient(circle at 85% 5%, rgba(101, 230, 210, .1), transparent 30%), rgba(13, 29, 49, .75); }.question-kicker { display: flex; justify-content: space-between; color: var(--teal); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.question-kicker span:last-child { color: #8692a9; }.question-card h4 { max-width: 680px; margin: 24px 0 8px; font-size: 23px; letter-spacing: -.045em; line-height: 1.15; }.question-card p { margin: 0; color: var(--muted); font-size: 9px; }.answer-form { margin-top: 16px; }.answer-form label { display: block; margin-bottom: 7px; color: #94a7c3; font-size: 9px; font-weight: 800; }.answer-row { display: flex; gap: 8px; }.answer-row input { width: 100%; min-width: 0; padding: 12px 13px; border: 1px solid rgba(152, 180, 220, .25); border-radius: 7px; outline: 0; color: var(--text); background: rgba(5, 13, 27, .55); font-size: 12px; }.answer-row input::placeholder { color: #556782; }.answer-row input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(101, 230, 210, .07); }.answer-row .primary-button, .answer-row .small-purple { flex: 0 0 auto; }.timeout-button { margin-top: 9px; padding: 0; color: #7f8da7; background: transparent; font-size: 9px; text-decoration: underline; text-decoration-color: rgba(127, 141, 167, .35); }.timeout-button:hover { color: var(--gold); }.pass-banner { display: none; gap: 9px; align-items: flex-start; margin-top: 13px; padding: 10px 11px; border: 1px solid rgba(192, 154, 255, .2); border-radius: 7px; color: #a79fc0; background: rgba(192, 154, 255, .06); }.pass-banner.show { display: flex; }.pass-banner > span { color: var(--purple); font-size: 16px; }.pass-banner strong, .pass-banner small { display: block; }.pass-banner strong { color: var(--purple); font-size: 10px; }.pass-banner small { margin-top: 2px; font-size: 9px; }.score-strip { display: grid; grid-template-columns: 1fr 40px 1fr; gap: 8px; align-items: center; margin-top: 17px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(5, 12, 25, .4); text-align: center; }.score-strip div:not(.score-divider) span { display: block; color: #7283a1; font-size: 8px; font-weight: 900; letter-spacing: .12em; }.score-strip div:not(.score-divider) strong { display: block; margin-top: 2px; font-size: 20px; }.score-strip div:first-child strong { color: var(--teal); }.score-strip div:last-child strong { color: var(--purple); }.score-divider { color: var(--faint); font-size: 9px; font-weight: 900; }.game-result { display: grid; place-items: center; padding: 30px 10px 8px; text-align: center; }.result-mark { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 12px; border: 1px solid rgba(101, 230, 210, .35); border-radius: 50%; color: var(--teal); background: rgba(101, 230, 210, .08); font-size: 26px; }.game-result h4 { margin: 7px 0 4px; font-size: 24px; letter-spacing: -.05em; }.game-result p:not(.eyebrow) { margin: 0 0 18px; color: var(--muted); font-size: 10px; }
.box-meta { grid-template-columns: 1fr 1fr 92px; }.box-scoreboard { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 13px 0; }.box-player { padding: 7px 5px; border: 1px solid var(--line); border-radius: 6px; background: rgba(5, 12, 25, .42); text-align: center; }.box-player.active { border-color: rgba(101, 230, 210, .48); background: rgba(101, 230, 210, .08); }.box-player.you { border-color: rgba(101, 230, 210, .24); }.box-player span { display: block; color: #7585a0; font-size: 7px; font-weight: 900; letter-spacing: .08em; }.box-player strong { display: block; margin-top: 2px; color: var(--text); font-size: 15px; }.box-player.active strong { color: var(--teal); }.live-box-board { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; padding: 7px; border: 1px solid rgba(192, 154, 255, .22); border-radius: 8px; background: rgba(7, 10, 24, .7); }.live-box-board button { min-height: 62px; border: 1px solid rgba(192, 154, 255, .17); border-radius: 5px; color: var(--purple); background: rgba(28, 24, 57, .82); font-size: 14px; font-weight: 900; transition: .16s ease; }.live-box-board button:hover:not(:disabled) { border-color: var(--purple); background: rgba(114, 73, 181, .3); transform: translateY(-1px); }.live-box-board button:disabled { cursor: default; opacity: .3; }.live-box-board button.selected { color: var(--gold); border-color: rgba(244, 201, 110, .45); background: rgba(90, 69, 37, .4); }.live-box-board button.resolved { color: #61738d; background: rgba(17, 23, 39, .8); text-decoration: line-through; }.box-prompt { min-height: 112px; margin-top: 12px; padding: 16px; border: 1px solid rgba(101, 230, 210, .2); border-radius: 8px; background: rgba(13, 29, 49, .66); }.empty-prompt { display: grid; place-items: center; text-align: center; }.prompt-icon { color: var(--purple); font-size: 24px; }.empty-prompt strong { margin-top: 6px; font-size: 13px; }.empty-prompt p { margin: 3px 0 0; color: var(--muted); font-size: 9px; }.box-prompt.active-prompt { text-align: left; }.box-prompt .prompt-kicker { display: flex; justify-content: space-between; color: var(--purple); font-size: 8px; font-weight: 900; letter-spacing: .11em; }.box-prompt .prompt-kicker span:last-child { color: var(--gold); }.box-prompt h4 { margin: 13px 0 0; font-size: 18px; letter-spacing: -.04em; line-height: 1.2; }.box-answer-form { margin-top: 12px; }.box-footer-note { display: flex; gap: 7px; align-items: center; margin-top: 12px; color: #7185a0; font-size: 9px; }.box-footer-note .status-dot { width: 5px; height: 5px; }
.toast { position: fixed; z-index: 40; right: 22px; bottom: 22px; max-width: 340px; padding: 12px 15px; border-radius: 8px; color: #07131d; background: var(--teal); font-size: 11px; font-weight: 800; box-shadow: var(--shadow); transform: translateY(20px); opacity: 0; pointer-events: none; transition: .25s ease; }.toast.show { transform: none; opacity: 1; }

@media (max-width: 1120px) { .main-content { padding: 28px 28px 50px; }.hero-orbit { right: -20px; transform: translateY(-50%) scale(.86); }.stats-grid, .box-summary-grid, .ops-stats { grid-template-columns: repeat(2, 1fr); }.lower-grid, .wallet-layout, .box-layout { grid-template-columns: 1fr; }.daily-gift { grid-template-columns: 184px 1fr; }.daily-gift-action { grid-column: 2; grid-template-columns: 1fr auto; align-items: center; }.daily-gift-action .gift-result { min-width: 0; } }
@media (max-width: 790px) { .sidebar { width: 68px; flex-basis: 68px; padding: 19px 8px; }.brand-lockup { justify-content: center; padding: 0 0 23px; }.brand-lockup > div:last-child, .demo-badge, .sidebar-bottom, .nav-item span:not(.nav-icon), .nav-count { display: none; }.brand-lockup .eyebrow, .brand-lockup h1 { display: none; }.nav-item { justify-content: center; padding: 12px 0; }.nav-icon { width: auto; font-size: 18px; }.topbar { display: block; }.topbar-actions { margin-top: 15px; flex-wrap: wrap; }.hero-panel { min-height: 370px; padding: 29px; }.hero-orbit { right: -72px; opacity: .42; }.format-grid, .flash-layout, .policy-grid { grid-template-columns: 1fr; }.section-actions { display: none; }.rule-strip { grid-template-columns: 1fr; }.rule-strip > div { grid-template-columns: 29px 1fr; }.schedule-row { grid-template-columns: 64px 1fr 58px; }.schedule-row button { grid-column: 2 / -1; justify-self: start; }.history-head { display: none; }.history-row { grid-template-columns: 1fr 1fr; gap: 8px; }.history-row > :nth-child(3) { grid-column: 1; }.history-row > :nth-child(4) { text-align: right; }.view-heading { display: block; }.view-heading > :last-child { display: inline-flex; margin-top: 14px; }.site-footer { display: block; }.site-footer span { display: block; margin-top: 6px; }.daily-gift { grid-template-columns: 1fr; text-align: left; }.daily-wheel-wrap { margin: 0 auto; }.daily-gift-action { grid-column: auto; grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .daily-wheel { transition-duration: .01ms; }.daily-wheel.spinning, .daily-god-animation { animation: none !important; } }
@media (max-width: 480px) { .main-content { padding: 22px 14px 44px; }.topbar h2 { font-size: 22px; }.network-chip, .outline-button { font-size: 8px; }.hero-copy h3 { font-size: 40px; }.hero-copy > p { font-size: 11px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 10px; }.hero-panel { min-height: 410px; padding: 25px 22px; }.hero-micro { gap: 8px; }.stats-grid, .box-summary-grid, .ops-stats { gap: 8px; }.stat-card, .box-stat { padding: 13px; }.stat-card strong { font-size: 20px; }.format-card, .format-detail, .preview-callout, .board-preview-panel, .box-steps, .schedule-panel, .integrity-panel, .payout-history, .ops-table-panel, .balance-panel, .payout-panel { padding: 16px; }.rule-row { gap: 9px; justify-content: space-between; }.game-backdrop { padding: 10px; }.game-card { padding: 16px; }.game-header h3 { font-size: 20px; }.game-header-actions .preview-label { display: none; }.game-meta { grid-template-columns: 1fr 1fr 73px; }.question-card { min-height: 180px; padding: 17px; }.question-card h4 { margin-top: 20px; font-size: 20px; }.answer-row { display: block; }.answer-row .primary-button, .answer-row .small-purple { width: 100%; margin-top: 8px; }.box-scoreboard { gap: 3px; }.box-player { padding: 6px 2px; }.box-player strong { font-size: 12px; }.live-box-board button { min-height: 50px; font-size: 12px; } }
.faq-callout { display: flex; gap: 13px; align-items: flex-start; margin: 12px 0; padding: 17px 19px; border-color: rgba(101, 230, 210, .2); background: linear-gradient(120deg, rgba(20, 52, 65, .55), rgba(14, 24, 44, .7)); }.faq-callout-icon { display: grid; place-items: center; width: 25px; height: 25px; flex: 0 0 25px; color: var(--teal); border: 1px solid rgba(101, 230, 210, .45); border-radius: 50%; font-weight: 900; }.faq-callout strong { font-size: 12px; }.faq-callout p { margin: 3px 0 0; color: #9eafc4; font-size: 10px; line-height: 1.55; }.faq-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.faq-card { min-height: 184px; padding: 21px 22px; }.faq-tag { display: inline-block; padding: 4px 7px; border-radius: 5px; font-size: 8px; font-weight: 900; letter-spacing: .1em; }.teal-tag { color: var(--teal); background: rgba(101, 230, 210, .1); }.purple-tag { color: var(--purple); background: rgba(192, 154, 255, .11); }.gold-tag { color: var(--gold); background: rgba(244, 201, 110, .1); }.faq-card h4 { margin: 16px 0 7px; font-size: 16px; letter-spacing: -.035em; }.faq-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
@media (max-width: 790px) { .faq-grid { grid-template-columns: 1fr; } }
.locale-picker { display: inline-flex; gap: 7px; align-items: center; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; color: #8294ae; background: rgba(13, 22, 41, .65); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.locale-picker select { min-width: 82px; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 10px; font-weight: 750; letter-spacing: 0; text-transform: none; }.locale-picker option { color: #0d1629; background: #eef4ff; }
.choice-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 10px; }.choice-button { min-height: 46px; padding: 10px 12px; border: 1px solid rgba(152, 180, 220, .25); border-radius: 7px; color: #b6c7da; background: rgba(5, 13, 27, .55); font-size: 10px; font-weight: 750; text-align: left; transition: .16s ease; }.choice-button:hover:not(:disabled), .choice-button.selected { border-color: var(--teal); color: #07131d; background: var(--teal); }.choice-button:disabled { cursor: default; opacity: .35; }
.flash-market-panel { margin-top: 12px; padding: 21px; }.market-copy { max-width: 690px; margin: 10px 0 15px; color: var(--muted); font-size: 10px; line-height: 1.55; }.market-category-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 10px; }.market-category { display: flex; gap: 6px; align-items: center; justify-content: space-between; padding: 8px 9px; border: 1px solid var(--line); border-radius: 6px; color: #8597b0; background: rgba(5, 12, 25, .35); font-size: 8px; text-align: left; }.market-category strong { color: var(--teal); font-size: 10px; }.market-category.active { border-color: rgba(101, 230, 210, .45); color: var(--text); background: rgba(101, 230, 210, .08); }.market-controls { display: grid; grid-template-columns: 1fr 130px 1fr 150px auto; gap: 8px; align-items: center; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: rgba(5, 12, 25, .38); }.market-controls .input-label { margin: 0; }.market-controls select, .market-amount { min-width: 0; padding: 10px; border: 1px solid rgba(152, 180, 220, .22); border-radius: 6px; outline: 0; color: var(--text); background: rgba(5, 13, 27, .6); font-size: 10px; }.market-amount { display: flex; gap: 6px; align-items: center; color: var(--teal); }.market-amount input { width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 12px; font-weight: 800; }.market-amount span:last-child { color: var(--faint); font-size: 8px; font-weight: 850; }.market-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin-top: 11px; }.market-card { padding: 13px; border: 1px solid rgba(101, 230, 210, .18); border-radius: 8px; background: rgba(13, 29, 49, .55); }.market-card.market-you { border-color: rgba(244, 201, 110, .28); background: rgba(55, 43, 27, .28); }.market-card-top { display: flex; gap: 9px; align-items: center; }.market-card-top > b { margin-left: auto; color: var(--teal); font-size: 16px; }.market-avatar { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid rgba(101, 230, 210, .35); border-radius: 50%; color: var(--teal); font-size: 8px; font-weight: 900; }.market-card strong, .market-card small { display: block; }.market-card strong { font-size: 10px; }.market-card small { margin-top: 3px; color: var(--muted); font-size: 8px; }.market-card-actions { display: flex; gap: 7px; margin-top: 12px; }.market-card-actions button { flex: 1; }.market-empty { grid-column: 1 / -1; padding: 25px; border: 1px dashed var(--line-strong); border-radius: 8px; color: var(--muted); font-size: 10px; text-align: center; }.market-offers { grid-column: 1 / -1; margin-top: 4px; padding-top: 13px; border-top: 1px solid var(--line); }.market-offer-row { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 9px 0; color: var(--muted); font-size: 9px; }.market-offer-row strong { color: var(--text); }.market-offer-row > div { display: flex; gap: 6px; }.market-footnote { display: flex; gap: 7px; align-items: center; margin-top: 11px; color: #7185a0; font-size: 8px; }.market-footnote .status-dot { width: 5px; height: 5px; }
@media (max-width: 790px) { .market-category-strip { grid-template-columns: repeat(2, 1fr); }.market-controls { grid-template-columns: 1fr 1fr; }.market-controls .input-label { grid-column: auto; }.market-controls select, .market-amount { width: 100%; }.market-controls .small-primary { grid-column: 1 / -1; }.market-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .choice-grid { grid-template-columns: 1fr; }.locale-picker { width: 100%; justify-content: space-between; }.market-controls { grid-template-columns: 1fr; }.market-offer-row { display: block; }.market-offer-row > div { margin-top: 7px; } }

.recording-panel { margin: 13px 0; padding: 14px; border: 1px solid rgba(192, 154, 255, .23); border-radius: 9px; background: linear-gradient(115deg, rgba(33, 28, 61, .74), rgba(7, 15, 29, .64)); }
.recording-panel-head { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; }
.recording-panel h4 { margin: 4px 0 0; font-size: 14px; letter-spacing: -.03em; }
.recording-copy { max-width: 610px; margin: 8px 0 11px; color: #9da9bd; font-size: 9px; line-height: 1.5; }
.recording-status { padding: 4px 7px; border: 1px solid rgba(139, 160, 201, .2); border-radius: 5px; color: #8190a8; font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.recording-status.active { border-color: rgba(244, 201, 110, .35); color: var(--gold); background: rgba(244, 201, 110, .08); }
.recording-controls { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.recording-indicator { display: inline-flex; gap: 6px; align-items: center; color: #899bb3; font-size: 8px; }
.recording-indicator .status-dot { width: 5px; height: 5px; background: var(--gold); }
.recording-indicator.active .status-dot { background: #ff6f79; box-shadow: 0 0 0 4px rgba(255, 111, 121, .1); animation: recording-pulse 1.2s infinite; }
.recording-preview { display: block; width: 100%; max-height: 180px; margin-top: 11px; object-fit: cover; border: 1px solid rgba(101, 230, 210, .28); border-radius: 7px; background: #050b16; }
.recording-review-panel { margin-top: 12px; padding: 21px; }
.recording-review-row { display: flex; gap: 12px; align-items: center; padding: 12px; border: 1px solid rgba(192, 154, 255, .18); border-radius: 8px; background: rgba(7, 13, 27, .45); }
.recording-review-main { display: flex; gap: 10px; align-items: center; min-width: 0; flex: 1; }
.recording-review-main strong, .recording-review-main small { display: block; }
.recording-review-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.recording-review-main small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.recording-file-icon { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border: 1px solid rgba(192, 154, 255, .35); border-radius: 7px; color: var(--purple); background: rgba(192, 154, 255, .08); }
.recording-review-note { display: flex; gap: 7px; align-items: center; margin: 10px 0 0; color: #7185a0; font-size: 8px; }
.recording-review-note .status-dot { width: 5px; height: 5px; background: var(--purple); }
@keyframes recording-pulse { 50% { opacity: .35; transform: scale(.72); } }
@media (max-width: 600px) { .recording-review-row { display: grid; grid-template-columns: 1fr auto; }.recording-review-row .status-pill { grid-column: 1; justify-self: start; }.recording-review-row .row-action { grid-column: 2; grid-row: 2; }.recording-controls { display: grid; grid-template-columns: 1fr 1fr; }.recording-indicator { grid-column: 1 / -1; } }

/* Server-fed lists and one-time account setup */
.server-list { display: grid; gap: 9px; }
.deposit-panel { margin-top: 12px; padding: 21px; }
.deposit-list { display: grid; gap: 9px; }
.deposit-route { padding: 13px; border: 1px solid rgba(101, 230, 210, .18); border-radius: 8px; background: rgba(7, 13, 27, .48); }
.deposit-route-head { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; }
.deposit-route-head strong, .deposit-route-head small { display: block; }
.deposit-route-head strong { font-size: 11px; }
.deposit-route-head small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.deposit-address { display: grid; grid-template-columns: 105px minmax(0, 1fr) auto; gap: 8px; align-items: center; margin-top: 10px; padding: 8px 9px; border: 1px solid var(--line); border-radius: 6px; background: rgba(5, 12, 25, .42); }
.deposit-address > span { color: var(--faint); font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.deposit-address code { overflow: hidden; color: var(--teal); font-family: ui-monospace, monospace; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.deposit-address .copy-button { padding: 5px 7px; font-size: 7px; }
.deposit-warning { display: flex; gap: 8px; align-items: flex-start; margin-top: 11px; color: #c6a86d; font-size: 8px; line-height: 1.5; }
.deposit-warning > span:first-child { display: grid; place-items: center; width: 16px; height: 16px; flex: 0 0 16px; border: 1px solid rgba(244, 201, 110, .38); border-radius: 50%; color: var(--gold); font-weight: 900; }
.server-match-row { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 13px; border: 1px solid rgba(192, 154, 255, .18); border-radius: 8px; background: rgba(7, 13, 27, .48); }
.server-match-row strong, .server-match-row small { display: block; }
.server-match-row strong { font-size: 10px; }
.server-match-row small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.server-match-row .small-purple { flex: 0 0 auto; }
.onboarding-panel { margin-top: 12px; padding: 21px; }
.onboarding-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin: 13px 0; }
.onboarding-grid .input-label { display: grid; gap: 6px; }
.onboarding-grid input, .onboarding-grid select { width: 100%; min-width: 0; padding: 10px; border: 1px solid rgba(152, 180, 220, .22); border-radius: 6px; outline: 0; color: var(--text); background: rgba(5, 13, 27, .6); font-size: 10px; }
@media (max-width: 600px) { .server-match-row { align-items: flex-start; flex-direction: column; }.server-match-row .small-purple { width: 100%; }.onboarding-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .deposit-route-head { display: grid; gap: 8px; }.deposit-address { grid-template-columns: 1fr auto; }.deposit-address > span { grid-column: 1 / -1; }.deposit-address code { min-width: 0; } }

/* Auth and compact lobby polish */
.auth-trigger { display: inline-flex; gap: 8px; align-items: center; padding: 8px 11px; border: 1px solid rgba(101, 230, 210, .3); border-radius: 7px; color: var(--text); background: rgba(101, 230, 210, .07); font-size: 9px; font-weight: 850; transition: .2s ease; }
.auth-trigger:hover { border-color: var(--teal); background: rgba(101, 230, 210, .13); transform: translateY(-1px); }
.auth-trigger-icon { color: var(--teal); font-size: 14px; line-height: 1; }
.lobby-strip { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 20px; align-items: center; margin-top: 12px; padding: 18px 21px; border-color: rgba(244, 201, 110, .2); background: linear-gradient(105deg, rgba(38, 34, 44, .72), rgba(13, 24, 41, .8)); }
.lobby-copy h3 { margin: 5px 0 3px; font-size: 16px; letter-spacing: -.04em; }.lobby-copy p:last-child { max-width: 530px; margin: 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.lobby-metrics { display: flex; gap: 19px; color: var(--muted); font-size: 8px; white-space: nowrap; }.lobby-metrics b { display: block; margin-bottom: 2px; color: var(--gold); font-size: 14px; }
.auth-modal-card { border-color: rgba(101, 230, 210, .33); background: radial-gradient(circle at 92% 0, rgba(101, 230, 210, .1), transparent 32%), #10172a; }.teal-icon { color: var(--teal); border-color: rgba(101, 230, 210, .42); background: rgba(101, 230, 210, .09); }
.wallet-login-button { display: flex; gap: 11px; align-items: center; width: 100%; margin: 20px 0 11px; padding: 13px; border: 1px solid rgba(101, 230, 210, .35); border-radius: 9px; color: var(--text); background: rgba(101, 230, 210, .08); text-align: left; transition: .2s ease; }.wallet-login-button:hover { border-color: var(--teal); background: rgba(101, 230, 210, .14); }.wallet-button-mark { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; color: #111827; background: linear-gradient(135deg, #f6851b, #f8c15b); font-size: 19px; }.wallet-login-button strong, .wallet-login-button small { display: block; }.wallet-login-button strong { font-size: 11px; }.wallet-login-button small { margin-top: 2px; color: var(--muted); font-size: 8px; }.wallet-arrow { margin-left: auto; color: var(--teal); font-size: 17px; }
.auth-state { display: flex; gap: 8px; align-items: center; min-height: 26px; color: var(--muted); font-size: 9px; }.auth-state .status-dot { width: 5px; height: 5px; }.auth-state.is-ready { color: var(--teal); }.auth-state.is-warning { color: var(--gold); }.auth-state.is-warning .status-dot { background: var(--gold); }
.auth-account { display: flex; gap: 12px; align-items: center; justify-content: space-between; margin-top: 12px; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: rgba(5, 12, 25, .4); }.auth-account small, .auth-account strong { display: block; }.auth-account small { color: var(--faint); font-size: 7px; font-weight: 900; letter-spacing: .11em; }.auth-account strong { max-width: 220px; margin-top: 3px; overflow: hidden; color: var(--teal); font-family: ui-monospace, monospace; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.auth-wallet-list { display: grid; gap: 6px; margin: 8px 0; }.wallet-choice { display: flex; gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: rgba(5, 12, 25, .4); font-size: 9px; text-align: left; }.wallet-choice:hover { color: var(--text); border-color: rgba(101, 230, 210, .35); }.wallet-choice img { width: 17px; height: 17px; border-radius: 4px; }.fine-print { margin: 16px 0 0; color: #6e809b; font-size: 8px; line-height: 1.55; }
@media (max-width: 790px) { .lobby-strip { grid-template-columns: 1fr; gap: 13px; }.lobby-metrics { justify-content: space-between; }.lobby-strip .small-purple { justify-self: start; } }
@media (max-width: 480px) { .auth-trigger { width: 100%; justify-content: center; }.lobby-metrics { gap: 10px; }.lobby-metrics b { font-size: 12px; }.auth-modal-card { padding: 23px 19px; } }