/* =====================================================================
   ASE Vegas — thème « Asentum » (chargé en dernier par toutes les pages)
   Noir profond, lignes de repère en pointillés, titres Plus Jakarta Sans
   en deux tons, textes DM Mono, boutons carrés en majuscules espacées,
   touches pêche / orange comme sur airdrop.asentum.com.
   ===================================================================== */
:root, :root[data-theme="dark"], :root[data-theme="light"] {
  --night: #000000; --deep: #0A0A0A; --deeper: #050505; --line: #1F1F1F; --line-strong: #2E2E2E;
  --ink: #FFFFFF; --muted: #8C8C8C; --dim: #A6A6A6;
  --indigo: #F29A5B; --indigo-hi: #F7C995; --violet: #F7C995;
  --accent: #F8D4A4; --accent-2: #F09A58; --accent-ink: #1C1206; --accent-bg: #1C130A;
  --grad: linear-gradient(90deg, #F8D4A4, #F09A58);
  --dash: repeating-linear-gradient(90deg, #2A2A2A 0 18px, transparent 18px 30px);
  --gold: #F4C542; --gold-ink: #2A1E00; --ok: #26CC6B; --warn: #F29751;
  --ball-face: #F2F2F2; --ball-ink: #0A0A0A;
  --shadow: none; --r-panel: 2px; --r-ctl: 0px;
  --display: "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
  --body: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  color-scheme: dark;
}
/* Uniquement en mode sombre : même si le système ou un ancien réglage demande le clair */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) { --night: #000000; --deep: #0A0A0A; --deeper: #050505; --line: #1F1F1F; --ink: #FFFFFF; --muted: #8C8C8C;
    --indigo-hi: #F7C995; --violet: #F7C995; --ball-face: #F2F2F2; --ball-ink: #0A0A0A; color-scheme: dark; }
}

/* Repères en pointillés, comme sur asentum.com */
body {
  font-size: 14px; letter-spacing: .01em;
  background-color: var(--night);
  background-image:
    repeating-linear-gradient(to bottom, var(--line-strong) 0 8px, transparent 8px 16px),
    repeating-linear-gradient(to bottom, var(--line-strong) 0 8px, transparent 8px 16px);
  background-size: 1px 100%, 1px 100%;
  background-position: calc(50% - min(568px, 50vw - 10px)) 0, calc(50% + min(568px, 50vw - 10px)) 0;
  background-repeat: no-repeat; background-attachment: fixed;
}
.top { border-bottom: 0; padding-block: 18px !important; background: var(--dash) bottom left / 100% 1px no-repeat; }
main { padding-top: 8px; }

/* Typographie */
h1, h2, h3, .brand-name, .jackpot, .amount, .stat dd, .hero-stats dd, .live-stats dd, .podium strong, .cart-total strong, .buy-total strong, #qty {
  font-family: var(--display) !important;
}
h2 { font-size: 1.5rem; letter-spacing: -0.02em; }
.dim, h1 .dim, h2 .dim { color: var(--dim); }
.brand-name { font-family: var(--body) !important; font-weight: 500 !important; font-size: 1rem !important; letter-spacing: .32em !important; text-transform: uppercase; }
.muted, .hero-sub, .hero-label, .p-label, .cart-note, .intro p { color: var(--muted) !important; }
.hero-label, .p-label, .hero-stats dt, .live-stats dt, .stat dt, .tabs button, .state, .admin-box label, .odds thead th, .res-table th {
  font-family: var(--body) !important; text-transform: uppercase; letter-spacing: .14em; font-size: .72rem !important; font-weight: 500 !important;
}

/* Boutons : carrés, majuscules espacées */
.btn, .chip, .step, .icon-btn, .all-games {
  font-family: var(--body); border-radius: 0 !important; text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 500;
}
.btn { padding: .95em 1.3em; background: transparent; border: 1px solid var(--line-strong); color: var(--ink); position: relative; }
.btn:hover:not(:disabled) { border-color: var(--accent); }
.btn-primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.btn-primary:hover:not(:disabled) { background: var(--accent-2); border-color: var(--accent-2); color: var(--accent-ink); }
.btn-primary:disabled { background: #2A2118; border-color: #2A2118; color: #7A6A58; }
.btn-ghost {
  border-color: transparent;
  background:
    linear-gradient(var(--line-strong), var(--line-strong)) top left / 10px 1px, linear-gradient(var(--line-strong), var(--line-strong)) top left / 1px 10px,
    linear-gradient(var(--line-strong), var(--line-strong)) top right / 10px 1px, linear-gradient(var(--line-strong), var(--line-strong)) top right / 1px 10px,
    linear-gradient(var(--line-strong), var(--line-strong)) bottom left / 10px 1px, linear-gradient(var(--line-strong), var(--line-strong)) bottom left / 1px 10px,
    linear-gradient(var(--line-strong), var(--line-strong)) bottom right / 10px 1px, linear-gradient(var(--line-strong), var(--line-strong)) bottom right / 1px 10px;
  background-repeat: no-repeat;
}
.btn-wallet { border-color: var(--line-strong); }
.btn-danger { color: var(--warn); border-color: var(--warn); }
.icon-btn { border-radius: 0 !important; }
.chip:hover, .step:hover:not(:disabled) { border-color: var(--ink) !important; }
.link-btn, a { color: var(--violet); }
.link-btn { font-family: var(--body); text-transform: uppercase; letter-spacing: .1em; font-size: .75rem; }

/* Étiquettes : fond teinté, texte coloré en mono */
.tag, .net, .state {
  font-family: var(--body); border-radius: 0 !important; border: 0 !important; text-transform: uppercase; letter-spacing: .12em; font-size: .68rem !important; padding: .35em .7em !important;
  background: #141414; color: var(--muted);
}
.net { background: var(--accent-bg); color: var(--accent) !important; }
.tag.ok { background: #0A1D12; color: var(--ok); }
.tag.win { background: var(--accent-bg); color: var(--accent); }
.tag.warn { background: #231409; color: var(--warn); }
.live .state, .game.live .state { background: #0A1D12; color: var(--ok) !important; display: inline-flex; width: max-content; }
.dot { box-shadow: none !important; background: var(--ok) !important; border-radius: 0 !important; width: 6px !important; height: 6px !important; }

/* Panneaux : noir, bordure fine, angles nets */
.hero, .picker, .cart, .panel, .buy, .game, .admin-box, .stat, .podium li, .claim-banner, .cart-list li, .dlg, .toast {
  border-radius: var(--r-panel) !important; box-shadow: none !important;
}
.picker, .cart, .panel, .buy, .game { background: var(--deep) !important; border: 1px solid var(--line) !important; }
.hero {
  background-color: var(--deep) !important; border: 1px solid var(--line) !important;
  /* trame de points « pixel », comme les visuels d'Asentum */
  background-image: radial-gradient(circle, rgba(255,255,255,.09) 1px, transparent 1.4px) !important;
  background-size: 7px 7px !important;
}
.hero::after { content: none; }
.hero-main, .podium, .hero-stats { position: relative; }
.jackpot { letter-spacing: -0.04em; font-weight: 500 !important; }
.hero-stats dd, .live-stats dd, .podium strong { font-weight: 500 !important; }
.jackpot .unit, .unit { color: var(--accent) !important; font-family: var(--body) !important; letter-spacing: .1em !important; font-weight: 500 !important; }
.hero-stats div, .live-stats div, .share div { border-top: 0 !important; background: var(--dash) top left / 100% 1px no-repeat; }
.round-block + .round-block { border-top: 0 !important; background: var(--dash) top left / 100% 1px no-repeat; }
.podium li { background: #0D0D0D !important; border: 1px solid var(--line) !important; }
.stat { background: #0D0D0D !important; border: 1px solid var(--line); }
.admin-box { background: #0D0D0D !important; border: 1px solid var(--line); }
.claim-banner { background: #0A1D12 !important; border: 1px solid #154D2C !important; }
.claim-banner strong { color: var(--ok) !important; }
.cart-list li { background: #0D0D0D !important; }
input, select { border-radius: 0 !important; font-family: var(--body); background: #050505 !important; }

/* Onglets */
.tabs { border-bottom: 0 !important; background: var(--dash) bottom left / 100% 1px no-repeat; }
.tabs button[aria-selected="true"] { border-bottom-color: var(--accent) !important; color: var(--accent) !important; }

/* Bandeau démo : comme le bandeau violet d'asentum.com */
.demobar { background: var(--accent-bg) !important; color: var(--accent) !important; font-family: var(--body); font-weight: 500 !important; letter-spacing: .06em; font-size: .78rem !important; }
.demobar .btn { background: var(--accent) !important; color: var(--accent-ink) !important; border-color: var(--accent) !important; }

/* Notifications, fenêtres */
.toast { background: #0D0D0D !important; border: 1px solid var(--line-strong) !important; border-left: 3px solid var(--violet) !important; font-size: .85rem; }
.toast.ok { border-left-color: var(--ok) !important; }
.toast.err { border-left-color: var(--warn) !important; }
.dlg { background: #0A0A0A !important; border: 1px solid var(--line-strong) !important; }
.choice { border-radius: 0 !important; }

/* Page d'accueil */
.intro h1 { font-weight: 700 !important; letter-spacing: -0.045em !important; }
.game { transition: border-color .15s !important; }
.game:hover { transform: none !important; border-color: var(--line-strong) !important; }
.game-art { background: #050505 !important; background-image: radial-gradient(circle, rgba(255,255,255,.12) 1px, transparent 1.4px) !important; background-size: 7px 7px !important; border-bottom: 1px solid var(--line); }
.game.soon .game-art, .game.raffle .game-art { border-bottom: 0; border-right: 1px solid var(--line); }
.foot { font-family: var(--body); font-size: .75rem; letter-spacing: .04em; border-top: 0; background: var(--dash) top left / 100% 1px no-repeat; padding-top: 18px !important; }

/* Tapis de dés : noir avec trame de points, comme les visuels d'Asentum */
.dice-table { background-color: #050505 !important; background-image: radial-gradient(circle, rgba(255,255,255,.11) 1px, transparent 1.4px) !important; background-size: 9px 9px !important;
  box-shadow: none !important; border: 1px solid var(--line-strong); border-radius: 0 !important; }
.table-hint { font-family: var(--body) !important; text-transform: uppercase; letter-spacing: .3em; font-size: .75rem !important; color: var(--muted) !important; font-weight: 500 !important; }
.roll-slots .slot { border-radius: 50%; }
.printer-head { border-radius: 0 !important; background: #111 !important; border: 1px solid var(--line-strong); font-family: var(--body) !important; letter-spacing: .3em !important; font-weight: 500 !important; }
.printer-slot { border-radius: 0 !important; }
.medal { border-radius: 0 !important; }
@media (max-width: 520px) {
  .brand-name { letter-spacing: .18em !important; font-size: .85rem !important; }
  .top { gap: 8px !important; }
  .top-actions { min-width: 0; gap: 6px !important; }
  .btn-wallet { padding: .8em .7em !important; letter-spacing: .06em !important; max-width: 46vw; overflow: hidden; text-overflow: ellipsis; }
  .icon-btn { width: 36px !important; height: 36px !important; flex: none; }
}

/* Fenêtre « Connect to Asentum » (comme sur les dapps Asentum) */
.wdlg { padding: 0 !important; width: min(470px, calc(100vw - 24px)) !important; border-radius: 16px !important; background: #0B0B0C !important; border: 1px solid #232326 !important; overflow: hidden; }
.wdlg::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(4px); }
.wdlg-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 22px 22px 18px; border-bottom: 1px solid #1E1E21; }
.wdlg-head h2 { margin: 0; font-family: var(--display) !important; font-size: 1.35rem; letter-spacing: -0.02em; }
.wdlg-eyebrow { margin: 0 0 6px; font-family: var(--body); text-transform: uppercase; letter-spacing: .16em; font-size: .7rem; color: var(--muted); }
.wdlg-x { width: 38px; height: 38px; border-radius: 10px; border: 1px solid #2A2A2E; background: #121214; color: #cfcfd4; font-size: 1.4rem; line-height: 1; cursor: pointer; }
.wdlg-x:hover { border-color: #4A4A50; color: #fff; }
.wdlg-body { padding: 20px 20px 18px; }
.wdlg .choice { display: flex !important; align-items: center; justify-content: space-between; gap: 14px; width: 100%; text-align: left; padding: 20px !important; margin: 0 0 12px !important;
  background: #121214 !important; border: 1px solid #232326 !important; border-radius: 14px !important; cursor: pointer; color: var(--ink); }
.wdlg .choice:hover:not(:disabled) { border-color: #3B3B42 !important; background: #151518 !important; }
.wdlg .choice:disabled { opacity: .55; cursor: not-allowed; }
.c-text { display: grid; gap: 6px; }
.c-text strong { font-family: var(--display); font-size: 1.05rem; font-weight: 700; letter-spacing: -0.01em; }
.c-text span { font-family: var(--display); color: #9A9AA3; font-size: .9rem; line-height: 1.4; }
.wdlg .c-cta { font-family: var(--body); text-transform: uppercase; letter-spacing: .14em; font-weight: 500; font-size: .78rem; color: var(--violet); white-space: nowrap; }
.wdlg-net { display: flex; align-items: center; gap: 14px; padding: 14px 22px; border-top: 1px solid #1E1E21; }
.wdlg-net .wdlg-eyebrow { margin: 0; }
.wdlg-net code { font-family: var(--body); color: #E5E5EA; font-size: .85rem; }
.wdlg-foot { margin: 0; padding: 14px 22px 18px; border-top: 1px solid #1E1E21; color: #8A8A93; font-family: var(--display); font-size: .82rem; line-height: 1.5; }
.wdlg-text { text-align: center; color: #C9C9D1; font-family: var(--display); line-height: 1.6; margin: 0 0 18px; }
.wdlg-text strong { color: #fff; }
.wdlg-addr { font-family: var(--body); text-align: center; word-break: break-all; margin: 0 0 16px; font-size: .9rem; }
.code-boxes { display: flex; justify-content: center; gap: 10px; margin: 0 0 14px; }
.code-boxes span { width: 50px; height: 64px; display: grid; place-items: center; border-radius: 10px; background: #121214; border: 1px solid #2A2A2E;
  font-family: var(--display); font-weight: 800; font-size: 1.9rem; color: #fff; }
.tg-expire { text-align: center; color: #8A8A93; font-family: var(--display); font-size: .88rem; margin: 0 0 18px; }
.tg-open { display: block; text-align: center; padding: 14px; border-radius: 12px; background: var(--accent-bg); border: 1px solid #3A2A18; color: var(--violet) !important; font-family: var(--display); font-weight: 700; text-decoration: none; margin-bottom: 14px; }
.tg-open:hover { border-color: var(--accent-2); }
.wdlg .tg-back { border-radius: 12px !important; text-transform: none !important; letter-spacing: 0 !important; font-family: var(--display) !important; font-size: .95rem !important; background: #121214 !important; border-color: #2A2A2E !important; }
.wdlg .error { margin: 6px 0 0; }
@media (max-width: 420px) { .code-boxes span { width: 42px; height: 56px; font-size: 1.6rem; } .code-boxes { gap: 7px; } }
.wdlg .c-text strong { color: #fff; } .wdlg .c-text span { color: #9A9AA3; }

/* ---------------------------------------------------------------------
   Touches orangées (style airdrop.asentum.com)
   --------------------------------------------------------------------- */
/* Étiquettes de cartes : « • LIBELLÉ » en mono gris */
.hero-label::before, .live-stats dt::before, .hero-stats dt::before { content: "•"; margin-right: .9em; color: #5A5A5A; }
/* Statut à droite des en-têtes (ex. « ×2 ACTIFS ») */
.hot, .state.hot { color: var(--accent) !important; font-family: var(--body); text-transform: uppercase; letter-spacing: .14em; }
/* Barres de progression : dégradé pêche → orange */
.bar { border-radius: 0 !important; background: #161616 !important; height: 10px !important; }
.bar i { background: var(--grad) !important; border-radius: 0 !important; }
/* Médailles et petits marqueurs */
.medal.m1 { background: var(--grad) !important; color: var(--accent-ink) !important; }
.stub.win { background: var(--accent) !important; border-color: var(--accent) !important; color: var(--accent-ink) !important; }
.claim-banner { background: var(--accent-bg) !important; border: 1px solid #3A2A18 !important; }
.claim-banner strong { color: var(--accent) !important; }
.win-banner { background: var(--accent-bg) !important; color: var(--accent) !important; }
/* Points / statut « live » orangés */
.live .state, .game.live .state { background: var(--accent-bg) !important; color: var(--accent) !important; }
.dot { background: var(--accent-2) !important; }
/* Cartes : survol bordé d'orange */
.game:hover, a.how-card:hover { border-color: #5A3A20 !important; }
.game:hover .btn-primary { background: var(--accent-2); border-color: var(--accent-2); }
/* Titre d'accueil : 2e ligne avec un reflet pêche */
.intro h1 { background: linear-gradient(180deg, #fff 55%, #F8D4A4 140%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.intro h1 .dim { -webkit-text-fill-color: var(--dim); }
:focus-visible { outline-color: var(--accent) !important; }
input:focus-visible { outline: 1px solid var(--accent) !important; }
.toast { border-left-color: var(--accent) !important; }
.wdlg .c-cta { color: var(--accent) !important; }
.mark.ok { color: var(--accent) !important; }
/* En-tête de carte façon Asentum : « • LIBELLÉ ……… STATUT » + pointillés */
.card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: -20px -18px 18px; padding: 16px 18px;
  background: var(--dash) bottom left / 100% 1px no-repeat; font-family: var(--body); text-transform: uppercase; letter-spacing: .16em; font-size: .72rem; color: var(--muted); }
.card-head > span:first-child::before { content: "•"; margin-right: .9em; color: #5A5A5A; }
.card-head .hot { font-size: .72rem; }
.how-card { border-radius: 0 !important; }
.printer-light { background: #2A2A2A !important; box-shadow: none !important; }
.printer-light.on { background: var(--accent-2) !important; box-shadow: 0 0 10px var(--accent-2) !important; }
.printer-slot { background: #1A1A1A !important; }
/* Progression de la semaine (Airdrop) */
.week { display: grid; gap: 8px; margin-top: 18px; }
.week-row { display: flex; justify-content: space-between; gap: 10px; font-family: var(--body); text-transform: uppercase; letter-spacing: .14em; font-size: .7rem; color: var(--muted); }
.week-row .hot { font-size: .7rem; }
