@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/jetbrains-mono-latin-600-normal.woff2') format('woff2'); }
/* Layout: terminal de trading. Positions à gauche, fortune et graphique en bougies au centre, améliorations à droite */
/* Thème sombre assumé, couleurs sobres façon plateforme pro */
:root {
  --bg: #131722;
  --panel: #1e222d;
  --panel2: #2a2e39;
  --line: #2a2e39;
  --line2: #363a45;
  --grid: #1c202b;
  --fg: #d1d4dc;
  --muted: #787b86;
  --up: #089981;
  --down: #f23645;
  --short: #7e57c2;
  --blue: #2962ff;
  --gold: #f0b90b;
  --teal: #22ab94;
  --body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Trebuchet MS", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  color-scheme: dark;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body {
  background: var(--bg); color: var(--fg); font-family: var(--body); font-size: 14px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  padding-block: 8px 10px; -webkit-user-select: none; user-select: none;
}
.wrap { max-width: 760px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "money" "shop" "chart" "order" "pos" "note"; gap: 8px; }
.wrap.haspat { grid-template-areas: "money" "shop" "chart" "order" "pat" "pos" "note"; }
.posbox { padding: 6px 10px; }
.money { grid-area: money; } .chartbox { grid-area: chart; } .order { grid-area: order; } .note { grid-area: note; }
.posbox { grid-area: pos; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.shopbox { grid-area: shop; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.leftcol { grid-area: pat; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.patbox, .rankbox { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 10px; }
.money, .chartbox, .order, .posbox, .shopbox, .patbox, .rankbox { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; }
.posbox, .shopbox { padding: 10px; }
@media (min-width: 980px) {
  .wrap { max-width: 1320px; grid-template-columns: minmax(0, 1fr) 260px; grid-template-rows: auto auto auto auto auto 1fr;
    grid-template-areas: "money shop" "chart shop" "order shop" "pos shop" "note shop" ". shop"; align-items: start; }
  .shopbox { position: sticky; top: max(12px, env(safe-area-inset-top, 0px)); max-height: calc(100vh - 24px); overflow-y: auto; align-self: start; }
  .shopbox .shop { flex-direction: column; overflow: visible; padding-bottom: 0; }
  .shopbox .item { flex: none; height: 158px; } /* v73 : retour à 4 cartes, taille d'origine (Thomas) */
  .shopbox .idesc { -webkit-line-clamp: 3; flex: 1; }
  .shopbox .iprog { margin-top: auto; } /* barre et bouton calés en bas, quel que soit le contenu */
  /* Tout débloqué (v62) : la colonne des améliorations disparaît, le jeu prend la place */
  .wrap.noshop { grid-template-columns: minmax(0, 1fr); grid-template-areas: "money" "chart" "order" "pos" "note" "."; }
}
@media (min-width: 1240px) {
  .wrap { grid-template-columns: minmax(0, 1fr) 290px; }
  .wrap.noshop { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 980px) {
  .wrap.haspat { max-width: 1500px; grid-template-columns: 190px minmax(0, 1fr) 260px;
    grid-template-areas: "pat money shop" "pat chart shop" "pat order shop" "pat pos shop" "pat note shop" "pat . shop"; }
  .wrap.haspat.noshop { grid-template-columns: 190px minmax(0, 1fr); grid-template-areas: "pat money" "pat chart" "pat order" "pat pos" "pat note" "pat ."; }
  .leftcol { position: sticky; top: max(12px, env(safe-area-inset-top, 0px)); align-self: start; max-height: calc(100vh - 24px); overflow-y: auto; }
  .patbox .patlist { flex-direction: column; overflow: visible; }
  .patbox .pcard { flex: none; }
}
@media (min-width: 1240px) { .wrap.haspat { grid-template-columns: 210px minmax(0, 1fr) 290px; } .wrap.haspat.noshop { grid-template-columns: 210px minmax(0, 1fr); } }
@media (min-width: 980px) {
  .posbox { flex-direction: row; align-items: center; gap: 12px; }
  .poshead { flex: none; flex-direction: column; align-items: flex-start; gap: 2px; width: 200px; }
  .poshead h2 { white-space: nowrap; }
  .positions { flex: 1; min-width: 0; }
  .posbox .empty { padding: 4px 2px; }
}
button { font-family: var(--body); font-weight: 600; cursor: pointer; border: 0; color: inherit; }
button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
button:disabled { opacity: .4; cursor: not-allowed; }
.act, .chip, .buy, .pos button, .pw, .snd { transition: transform .08s, filter .15s, background .15s; }
.act:active:not(:disabled), .chip:active, .buy:active:not(:disabled), .pos button:active, .pw:active { transform: scale(.97); }
.act:hover:not(:disabled), .buy:hover:not(:disabled), .pos button:hover { filter: brightness(1.12); }
.muted { color: var(--muted); }
.up { color: var(--up); } .down { color: var(--down); }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
h2 { font-size: .72rem; font-weight: 600; margin: 0; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }

/* Fortune */
.money { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 6px 14px; }
.toprow { align-items: center !important; }
.sndtop { align-self: flex-start; }
.devbar { max-width: 1420px; margin: 14px auto 0; padding: 8px 10px; border: 1px dashed var(--line2); border-radius: 6px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.devlab { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-right: 6px; }
.moneyline { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
.money.boosted { border-color: var(--gold); }
.brand { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.brand b { font-size: .9rem; font-weight: 700; letter-spacing: .04em; }
.brand b span { color: var(--blue); }
.lvl { font-size: .78rem; color: var(--muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.lvl b { color: var(--fg); font-family: var(--mono); font-weight: 500; }
.snd { background: var(--panel2); border: 1px solid var(--line2); color: var(--muted); border-radius: 4px; padding: 3px 8px; font-size: .72rem; margin-left: 6px; }
.snd.on { color: var(--fg); }
.toprow { display: flex; justify-content: space-between; align-items: flex-end; gap: 6px 16px; flex-wrap: wrap; }
.fcol { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.live { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; margin-left: auto; }
.fortune-label { font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.fortune { display: inline-block; transform-origin: left bottom; font-family: var(--mono); font-weight: 600; font-size: clamp(1.7rem, 6vw, 2.3rem); line-height: 1; color: var(--fg); white-space: nowrap; transition: color .3s; font-variant-numeric: tabular-nums; }
.fortune.flash-up { color: var(--up); }
.fortune.flash-down { color: var(--down); }
.livev { font-family: var(--mono); font-weight: 600; font-size: clamp(1.3rem, 4.5vw, 1.8rem); line-height: 1; white-space: nowrap; color: var(--fg); transition: color .2s; font-variant-numeric: tabular-nums; }
.subs { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: .8rem; color: var(--muted); }
.subs b { font-family: var(--mono); color: var(--fg); font-weight: 500; }
.xp { height: 3px; background: var(--line); border-radius: 2px; overflow: hidden; }
.xp div { height: 100%; width: 0; background: var(--blue); transition: width .4s; }
.boosts { display: flex; flex-wrap: wrap; gap: 6px; }
.boosts:empty { display: none; }
.boost { position: relative; overflow: hidden; background: color-mix(in srgb, var(--gold) 14%, var(--panel)); border: 1px solid var(--gold); color: var(--gold); border-radius: 4px; padding: 4px 9px 6px; font-size: .78rem; font-weight: 600; }
.boost.t2 { border-color: var(--up); color: var(--up); background: color-mix(in srgb, var(--up) 14%, var(--panel)); }
.boost em { font-style: normal; font-family: var(--mono); opacity: .8; margin-left: 6px; }
.boost i { position: absolute; left: 0; bottom: 0; height: 2px; background: currentColor; opacity: .6; }

/* Graphique */
.chartbox { position: relative; display: flex; flex-direction: column; height: min(44vh, 440px); min-height: 230px; overflow: hidden; background: var(--bg); }
.chead { display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; padding: 7px 12px; border-bottom: 1px solid var(--line); background: var(--panel); font-size: .8rem; }
.sym { font-weight: 700; font-size: .95rem; display: flex; align-items: center; gap: 8px; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--up); animation: ping 1.6s infinite; }
@keyframes ping { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--up) 70%, transparent); } 100% { box-shadow: 0 0 0 8px transparent; } }
.tf { color: var(--fg); font-size: .74rem; padding: 2px 7px; background: var(--panel2); border-radius: 3px; font-family: var(--mono); }
.ohlc { margin-left: auto; font-family: var(--mono); font-size: .74rem; color: var(--muted); display: flex; gap: 10px; flex-wrap: wrap; }
.ohlc b { font-weight: 500; margin-left: 4px; color: var(--fg); }
.chrono { font-family: var(--mono); font-size: .74rem; color: var(--muted); white-space: nowrap; }
#hlBox[hidden] ~ .chrono { margin-left: auto; }
.acct h2 .fbtn { margin-left: 8px; font-size: .68rem; padding: 2px 7px; vertical-align: middle; }
.mbox.fbox { width: min(720px, 100%); }
.fbox canvas { width: 100%; height: 260px; display: block; background: var(--bg); border: 1px solid var(--line); border-radius: 4px; cursor: crosshair; }
.fopts { display: flex; gap: 5px; align-items: center; margin-bottom: 6px; } .fopts .chip { padding: 3px 8px; font-size: .72rem; } .fsep { flex: 1; }
.ftable { max-height: 180px; overflow: auto; border: 1px solid var(--line); border-radius: 4px; }
.ftable table { width: 100%; border-collapse: collapse; font-size: .76rem; }
.ftable th, .ftable td { padding: 4px 8px; text-align: right; font-family: var(--mono); white-space: nowrap; }
.ftable th { position: sticky; top: 0; background: var(--panel2); color: var(--muted); font-weight: 500; font-family: var(--body); text-transform: uppercase; font-size: .62rem; letter-spacing: .08em; }
.ftable td:first-child, .ftable th:first-child { text-align: left; }
.ftable tr:nth-child(even) td { background: rgba(255,255,255,.02); }
.ftable td.up { color: var(--up); } .ftable td.down { color: var(--down); }
.cprice { font-family: var(--mono); font-weight: 600; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.chg { font-family: var(--mono); font-size: .76rem; }
.cwrap { position: relative; flex: 1; min-height: 0; cursor: crosshair; }
canvas { display: block; width: 100%; height: 100%; }
/* Barre d'annonces : flash infos à gauche, messages à droite. Réservée en permanence, rien ne se superpose à la courbe */
.news { position: absolute; left: 12px; right: 90px; top: 44px; background: var(--panel); border: 1px solid var(--line2); border-left: 3px solid var(--gold); border-radius: 4px; padding: 7px 12px; font-size: .84rem; display: flex; gap: 10px; align-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.45); animation: slidein .3s ease-out; z-index: 2; }
.news.up { border-left-color: var(--up); border-color: var(--up); } .news.up b { color: var(--up); }
.news.down { border-left-color: var(--down); border-color: var(--down); } .news.down b { color: var(--down); }
.news b { color: var(--gold); font-size: .68rem; letter-spacing: .1em; }
@keyframes slidein { from { transform: translateY(-10px); opacity: 0; } to { transform: none; opacity: 1; } }
.fx { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 6px; }
.fx span { font-size: .7rem; font-weight: 600; padding: 2px 8px; border-radius: 3px; background: var(--blue); color: #fff; }
.toasts { position: absolute; left: 50%; top: 40%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; pointer-events: none; z-index: 3; }
.toast { font-family: var(--mono); font-weight: 700; font-size: 1.2rem; white-space: nowrap; text-shadow: 0 2px 8px #000; animation: rise 1.4s forwards; }
.toast.big { font-family: var(--body); font-size: 1.8rem; letter-spacing: .04em; }
@keyframes rise { 0% { opacity: 0; transform: translateY(10px); } 15% { opacity: 1; transform: none; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-24px); } }
.broke { position: absolute; inset: 0; background: color-mix(in srgb, var(--bg) 92%, transparent); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 16px; z-index: 4; }
.broke h3 { font-size: 1.6rem; margin: 0; color: var(--down); }
.broke button { background: var(--blue); color: #fff; border-radius: 4px; padding: 11px 18px; font-size: .95rem; }

/* Ordres */
.order { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 8px 12px; padding: 8px 10px; }
.row { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.row small { color: var(--muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; width: 48px; }
.sltp .row small { width: auto; margin-right: 4px; font-size: .62rem; }
.chip { background: var(--panel2); color: var(--muted); border: 1px solid transparent; border-radius: 4px; padding: 5px 10px; font-size: .78rem; font-family: var(--mono); }
.chip.on { color: var(--fg); border-color: var(--blue); background: color-mix(in srgb, var(--blue) 20%, var(--panel2)); }
.order { grid-template-areas: "left acts" "left sltp"; align-items: start; }
#ordLeft { grid-area: left; }
.acts { grid-area: acts; }
.acts .act { min-height: 92px; }
.sltp { grid-area: sltp; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.sltp .chip { padding: 4px 6px; font-size: .72rem; }
.sltp .row { gap: 3px; }
.order.solo { grid-template-areas: "acts" "sltp"; }
.sltp[hidden] { display: none; }
.acts { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; }
.order.solo { grid-template-columns: 1fr; }
.reveal { animation: reveal .7s ease-out; }
@keyframes reveal { 0% { opacity: 0; transform: translateY(8px); } 60% { opacity: 1; } 100% { transform: none; } }
.item.new { animation: reveal .5s ease-out; }
.act { border-radius: 4px; padding: 12px 6px; font-size: 1rem; font-weight: 700; color: #fff; letter-spacing: .02em; }
.act small { display: block; font-weight: 400; font-size: .7rem; opacity: .85; margin-top: 2px; }
.act.long { background: var(--up); }
.act.sell { background: var(--down); }
.act.short { background: var(--short); }
.powers { display: flex; gap: 4px; flex-wrap: wrap; }
.pw { background: var(--panel2); border: 1px solid transparent; border-radius: 4px; padding: 5px 10px; font-size: .76rem; color: var(--muted); }
.pw.ready { border-color: var(--blue); color: var(--fg); }
.pw em { font-style: normal; font-family: var(--mono); margin-left: 4px; }
/* Investir : gros bouton doré avec icône dans l'en-tête des positions (Thomas : « mets le bouton Investir dans un meilleur endroit, plus gros, avec une icône ») */
.invbig { display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; padding: 8px 14px; font-size: .9rem; font-weight: 600; color: var(--gold); background: rgba(240, 185, 11, .1); border: 1px solid rgba(240, 185, 11, .55); border-radius: 6px; cursor: pointer; transition: transform .08s, background .15s, box-shadow .3s; box-shadow: 0 0 0 0 rgba(240, 185, 11, .35); }
.invbig:hover { background: rgba(240, 185, 11, .2); }
.invbig:active { transform: scale(.97); }
.invbig.can { animation: invpulse 1.6s ease-in-out infinite; }
.invbig em { font-style: normal; font-family: var(--mono); font-size: .72rem; background: var(--gold); color: #131722; border-radius: 10px; padding: 1px 6px; }
@keyframes invpulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(240, 185, 11, .35); } 50% { box-shadow: 0 0 0 5px rgba(240, 185, 11, 0); } }

/* Positions */
.poshead { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.positions { display: flex; flex-direction: column; gap: 6px; }
.pos { position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; background: var(--bg); border: 1px solid var(--line); border-left: 3px solid; border-radius: 4px; padding: 8px 8px 8px 10px; }
.pos.L { border-left-color: var(--up); } .pos.S { border-left-color: var(--short); }
.pos .info { min-width: 0; font-size: .74rem; color: var(--muted); line-height: 1.4; }
.pos .info b { color: var(--fg); font-size: .82rem; }
.pos .pnl { font-family: var(--mono); font-weight: 600; font-size: .98rem; text-align: right; white-space: nowrap; }
.pos .pnl small { display: block; font-size: .7rem; font-weight: 500; }
.pos button { background: var(--down); color: #fff; border-radius: 4px; padding: 7px 10px; font-size: .78rem; }
.pos .bar { grid-column: 1 / -1; height: 2px; background: var(--line); border-radius: 1px; overflow: hidden; margin-top: -2px; }
.pos .bar i { display: block; height: 100%; width: 0; transition: width .2s, background .2s; }
.empty { color: var(--muted); font-size: .82rem; padding: 8px 2px; line-height: 1.5; }

/* Améliorations */
.shop { display: flex; gap: 6px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 4px; }
.item { flex: 0 0 200px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 5px; background: var(--bg); border: 1px solid var(--line); border-radius: 4px; padding: 9px 10px; min-width: 0; transition: border-color .2s; }
.item.can { border-color: var(--blue); }
.ihead { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
.ihead b { font-size: .86rem; font-weight: 600; line-height: 1.2; }
.lvtag { font-family: var(--mono); font-size: .7rem; color: var(--muted); white-space: nowrap; }
.idesc { font-size: .74rem; color: var(--muted); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1; }
.ival { font-size: .8rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: var(--mono); }
.ival b { color: var(--up); font-weight: 500; }
.buy { border: 1px solid var(--line2); background: var(--panel2); color: var(--muted); border-radius: 4px; padding: 7px; font-family: var(--mono); font-weight: 600; font-size: .82rem; }
.buy.can { background: var(--blue); border-color: var(--blue); color: #fff; }
@media (min-width: 1240px) {
  .shop { flex-direction: column; overflow: visible; padding-bottom: 0; }
  .item { flex: none; }
  .idesc { -webkit-line-clamp: unset; }
}
.note { font-size: .74rem; color: var(--muted); text-align: center; line-height: 1.5; }
@media (max-width: 560px) { .order { grid-template-columns: 1fr; } }
.fortune.pop { animation: fpop .3s ease-out; }
@keyframes fpop { 40% { transform: scale(1.06); } }
.money.shake { animation: shake .35s; }
.money.taxed .fortune { animation: taxed 1.4s; }
@keyframes taxed { 0%, 60% { color: var(--down); text-shadow: 0 0 18px rgba(242,54,69,.6); } 100% { color: inherit; } }
@keyframes shake { 20% { transform: translateX(-5px); } 40% { transform: translateX(5px); } 60% { transform: translateX(-3px); } 80% { transform: translateX(2px); } }
.mode { margin-left: 8px; background: var(--panel2); border: 1px solid var(--line2); color: var(--fg); border-radius: 4px; padding: 3px 9px; font-size: .74rem; }
.mode:hover { border-color: var(--blue); }
.gcoins { position: fixed; inset: 0; z-index: 45; pointer-events: none; overflow: hidden; }
/* Jetons fixes : apparaissent n'importe où sur l'écran, même sur les boutons, et pulsent */
.gcoin.fixed { animation: gpop .45s cubic-bezier(.2, 1.5, .4, 1), gring 1.3s .45s infinite; }
.gcoin.fixed.out, .gchest.out { animation: gout .45s forwards; }
@keyframes gpop { 0% { transform: scale(0); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes gring { 0% { outline: 0 solid rgba(240,185,11,.55); outline-offset: 0; } 100% { outline: 10px solid rgba(240,185,11,0); outline-offset: 10px; } }
@keyframes gout { to { transform: scale(.4); opacity: 0; } }
/* Petits coffres : tombent du haut et viennent se poser sur un élément de l'interface (le mot Historique, le bouton Acheter...) */
.gchest { position: absolute; pointer-events: auto; z-index: 3; width: 32px; height: 26px; margin: -13px 0 0 -16px; padding: 0; cursor: pointer; left: var(--x0); top: var(--y);
  background: linear-gradient(180deg, #2a2e39 0 42%, #1e222d 42% 100%); border: 2px solid var(--gold); border-radius: 6px 6px 4px 4px;
  box-shadow: inset 0 0 0 2px #131722, 0 0 14px rgba(240,185,11,.4), 0 4px 10px rgba(0,0,0,.5); animation: gdrop .7s cubic-bezier(.3, 1.6, .5, 1), gring 1.3s .7s infinite; }
.gchest::before { content: ''; position: absolute; left: 4px; right: 4px; top: 9px; height: 2px; background: var(--gold); opacity: .8; }
.gchest::after { content: ''; position: absolute; left: 50%; top: 10px; width: 6px; height: 7px; margin-left: -3px; background: var(--gold); border-radius: 2px; box-shadow: 0 0 6px rgba(240,185,11,.9); }
.gchest.gold { border-color: #fff1b8; box-shadow: inset 0 0 0 2px #131722, 0 0 26px rgba(240,185,11,.85), 0 4px 10px rgba(0,0,0,.5); background: linear-gradient(180deg, #5a4300 0 42%, #2a2e39 42% 100%); }
.gchest:hover { filter: brightness(1.3); }
@keyframes gdrop { 0% { transform: translateY(-60vh); opacity: 0; } 30% { opacity: 1; } 100% { transform: none; } }
/* Boutique des biens (v63 ; v68 : un bouton dans la colonne de gauche, une fenêtre pour acheter et revendre) */
.goodsbox { padding: 8px; } .goodsbox .gshop { width: 100%; margin: 0; justify-content: center; font-size: .82rem; } .goodsbox .gshop.locked { color: var(--muted); border-color: var(--line2); background: var(--panel2); } .goodsbox .gshop.locked.can { color: var(--gold); border-color: rgba(240, 185, 11, .55); background: rgba(240, 185, 11, .1); }
.grow .gcur { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .grow .gcur .sell { padding: 1px 6px; font-size: .66rem; margin-left: auto; }
.glist { display: flex; flex-direction: column; gap: 6px; }
.grow { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 2px 10px; background: var(--panel2); border: 1px solid var(--line); border-radius: 4px; padding: 8px 10px; font-size: .78rem; align-items: center; }
.grow .gfam { grid-row: 1 / 3; font-weight: 700; color: var(--gold); text-transform: uppercase; letter-spacing: .06em; font-size: .7rem; }
.grow .gcur { color: var(--muted); } .grow .gcur b { color: var(--fg); }
.grow .gnext { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.grow .gnm em { font-style: normal; color: var(--gold); font-family: var(--mono); font-weight: 600; }
.grow .buy { padding: 5px 9px; font-size: .76rem; } .grow .buy.can { background: var(--gold); border-color: var(--gold); color: #0b0e14; }
.acct h2 .fbtn.can { border-color: var(--gold); color: var(--gold); animation: invpulse 1.6s ease-in-out infinite; }
/* Fenêtre Comptes à terme (ex-Investir) */
.ilist { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 6px; }
.iopt { background: var(--panel2); border: 1px solid transparent; border-radius: 4px; padding: 8px; text-align: left; color: var(--muted); font-size: .72rem; line-height: 1.4; }
.iopt b { display: block; color: var(--fg); font-size: .86rem; }
.iopt em { font-style: normal; color: var(--gold); font-family: var(--mono); }
.iopt.on { border-color: var(--gold); color: var(--fg); background: color-mix(in srgb, var(--gold) 14%, var(--panel2)); }
.iopt:disabled { opacity: .45; }
.pchip.I { border-left-color: var(--gold); cursor: default; }
.pchip.I:hover { border-color: var(--line); } .pchip.I:hover .key { background: var(--panel2); color: var(--gold); }
.pchip.I .key { color: var(--gold); font-size: .7rem; }
.pchip.I .pp { color: var(--gold); }
/* Jeton bonus : disque sombre cerclé d'or, dans le style de la plateforme (pas de pièce de dessin animé) */
.gcoin { position: absolute; pointer-events: auto; z-index: 3; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; padding: 0; cursor: pointer;
  left: var(--x0); top: var(--y); background: radial-gradient(circle at 50% 50%, #2a2e39 0 52%, #1e222d 53% 100%); border: 2px solid var(--gold);
  box-shadow: inset 0 0 0 3px #131722, inset 0 0 0 4px rgba(240,185,11,.55), 0 0 14px rgba(240,185,11,.35), 0 4px 12px rgba(0,0,0,.5);
  color: var(--gold); font-family: var(--mono); font-weight: 700; font-size: .9rem; line-height: 1;
  animation: gdrift var(--dur) linear forwards, gbob 1.1s ease-in-out infinite; }
.gcoin.rich { width: 40px; height: 40px; margin: -20px 0 0 -20px; font-size: 1rem; box-shadow: inset 0 0 0 3px #131722, inset 0 0 0 4px rgba(240,185,11,.7), 0 0 22px rgba(240,185,11,.55), 0 4px 12px rgba(0,0,0,.5); }
.gcoin.gold { width: 48px; height: 48px; margin: -24px 0 0 -24px; font-size: .8rem; letter-spacing: .04em; border-color: #fff1b8; color: #fff1b8;
  background: radial-gradient(circle at 50% 50%, #5a4300 0 52%, #2a2e39 53% 100%); box-shadow: inset 0 0 0 3px #131722, inset 0 0 0 4px rgba(255,241,184,.8), 0 0 30px rgba(240,185,11,.8), 0 4px 12px rgba(0,0,0,.5); }
.gcoin:hover { filter: brightness(1.3); }
@keyframes gdrift { 0% { left: var(--x0); top: var(--y); opacity: 0; } 6% { opacity: 1; } 88% { opacity: 1; } 100% { left: var(--x1); top: var(--y1, var(--y)); opacity: 0; } }
@keyframes gbob { 50% { transform: translateY(-9px) rotate(6deg); } }
@media (prefers-reduced-motion: reduce) { .gcoin { animation: gdrift var(--dur) linear forwards; } }
.reset { margin-top: 8px; background: transparent; border: 1px solid var(--line2); color: var(--muted); border-radius: 4px; padding: 4px 10px; font-size: .72rem; font-weight: 500; }
.reset:hover { color: var(--fg); }
.reset.danger { border-color: var(--down); color: var(--down); }
.snd.danger { border-color: var(--down); color: var(--down); }
.ask { display: inline-flex; align-items: center; gap: 0; margin-left: 6px; color: var(--down); font-size: .76rem; }
.toast.huge { font-family: var(--body); font-size: clamp(2.4rem, 7vw, 3.6rem); letter-spacing: .06em; color: var(--down); animation-duration: 1.8s; }
.chartbox.trap { animation: trapflash .9s; }
.chartbox.lucky { animation: luckyflash .9s; }
@keyframes luckyflash { 0%, 100% { box-shadow: none; } 25%, 60% { box-shadow: 0 0 0 2px var(--up), 0 0 30px -4px var(--up); } }
@keyframes trapflash { 0%, 100% { box-shadow: none; } 25%, 60% { box-shadow: 0 0 0 2px var(--down), 0 0 30px -4px var(--down); } }
.snd.test { border-style: dashed; }
.testbox { color: var(--muted); gap: 4px; }
.testbox input { width: 110px; background: var(--bg); color: var(--fg); border: 1px solid var(--line2); border-radius: 4px; padding: 3px 6px; font-family: var(--mono); font-size: .76rem; -webkit-user-select: text; user-select: text; }
.testbox input:focus { outline: none; border-color: var(--blue); }

.item.up2 { gap: 8px; padding: 10px 11px 11px; border-color: color-mix(in srgb, var(--cc) 35%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--cc) 9%, var(--bg)), var(--bg) 70%); }
.item.up2.can { border-color: var(--cc); box-shadow: 0 0 0 1px var(--cc), 0 0 22px -8px var(--cc); animation: canpulse 1.6s ease-in-out infinite; }
@keyframes canpulse { 50% { box-shadow: 0 0 0 1px var(--cc), 0 0 30px -4px var(--cc); } }
.ihead2 { display: flex; align-items: center; gap: 9px; min-width: 0; }
.ico { flex: none; width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; color: var(--cc); background: color-mix(in srgb, var(--cc) 16%, transparent); border: 1px solid color-mix(in srgb, var(--cc) 40%, transparent); }
.inm { display: flex; flex-direction: column; min-width: 0; }
.inm small { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--cc); }
.inm b { font-size: .95rem; font-weight: 700; line-height: 1.2; color: var(--fg); }
.ifx { display: flex; align-items: baseline; gap: 6px; font-family: var(--mono); font-weight: 600; flex-wrap: wrap; }
.ifx .from { color: var(--muted); font-size: .85rem; text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--muted) 60%, transparent); }
.ifx .arr { color: var(--muted); font-size: .85rem; }
.ifx .to { color: var(--cc); font-size: 1.15rem; }
.item.up2 .idesc { font-size: .74rem; }
.iprog { height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; }
.iprog i { display: block; height: 100%; width: 0; background: var(--cc); transition: width .25s; }
.item.up2 .buy { font-family: var(--body); font-size: .82rem; font-weight: 700; padding: 8px 6px; }
.item.up2 .buy.can { background: var(--cc); border-color: var(--cc); color: #0b0e14; }
.item.up2 .buy:disabled { opacity: 1; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .item.up2.can { animation: none; } }
.news.ext { border-left-color: var(--down); border-color: var(--down); box-shadow: 0 0 0 1px var(--down), 0 8px 30px -6px var(--down); animation: slidein .3s ease-out, extblink .5s steps(2) infinite; }
.news.ext b { color: var(--down); }
@keyframes extblink { 50% { background: color-mix(in srgb, var(--down) 22%, var(--panel)); } }
.positions { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 5px; }
.pchip { position: relative; display: flex; align-items: center; gap: 7px; width: 100%; text-align: left; background: var(--bg); border: 1px solid var(--line); border-left: 3px solid var(--up); border-radius: 4px; padding: 5px 8px 7px 5px; font-family: var(--body); font-weight: 500; color: var(--fg); overflow: hidden; }
.pchip.S { border-left-color: var(--short); }
.pchip:hover { border-color: var(--down); }
.pchip:hover .key { background: var(--down); color: #fff; }
.pchip .key { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 4px; background: var(--panel2); border: 1px solid var(--line2); font-family: var(--mono); font-weight: 700; font-size: .78rem; color: var(--fg); transition: background .15s; }
.pchip .key.none { opacity: .4; }
.pchip .pi { flex: 1; min-width: 0; font-size: .68rem; line-height: 1.25; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pchip .pi b { color: var(--fg); font-weight: 600; }
.pchip .pp { flex: none; font-family: var(--mono); font-weight: 600; font-size: .82rem; text-align: right; line-height: 1.15; }
.pchip .pp small { display: block; font-size: .64rem; font-weight: 500; }
.pchip .pb { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; transition: width .2s; }
.posbox .empty { padding: 2px; font-size: .78rem; }
.patlist { display: flex; gap: 6px; overflow-x: auto; }
.pcard { flex: 0 0 150px; display: flex; flex-direction: column; gap: 4px; background: var(--bg); border: 1px solid var(--line); border-radius: 4px; padding: 7px 8px; }
.pcard b { font-size: .78rem; font-weight: 600; }
.pcard svg { width: 100%; height: 58px; display: block; background: var(--panel); border-radius: 3px; }
.pcard small { font-size: .66rem; color: var(--muted); line-height: 1.3; }
.pcard .pstate { font-family: var(--mono); font-size: .7rem; font-weight: 700; }
.pcard.on { border-color: var(--gold); animation: pblink .45s steps(2) infinite; }
.pcard.on { --pc: var(--gold); }
@keyframes pblink { 50% { background: color-mix(in srgb, var(--gold) 20%, var(--bg)); box-shadow: 0 0 18px -4px var(--gold); } }
@media (prefers-reduced-motion: reduce) { .pcard.on { animation: none; background: color-mix(in srgb, var(--gold) 16%, var(--bg)); } }
.news.ext.bull { border-color: var(--up); border-left-color: var(--up); box-shadow: 0 0 0 1px var(--up), 0 8px 30px -6px var(--up); animation: slidein .3s ease-out, bullblink .5s steps(2) infinite; }
.news.ext.bull b { color: var(--up); }
.news.ext span { font-size: .9rem; font-weight: 700; color: var(--fg); }
@keyframes bullblink { 50% { background: color-mix(in srgb, var(--up) 22%, var(--panel)); } }
.xprow { display: flex; align-items: center; gap: 10px; margin-top: 2px; }
.lvbadge { font-family: var(--mono); font-weight: 700; font-size: .72rem; color: #fff; background: var(--blue); border-radius: 4px; padding: 3px 9px; white-space: nowrap; letter-spacing: .05em; }
.lvbadge b { font-size: 1.05rem; margin-left: 2px; }
.lvbadge.up { animation: lvpop .8s ease-out; }
@keyframes lvpop { 30% { transform: scale(1.35); box-shadow: 0 0 24px var(--blue); } }
.xprow .xp { position: relative; flex: 1; height: 18px; border-radius: 4px; background: var(--panel2); overflow: visible; }
.xprow .xp > div { height: 100%; border-radius: 4px; background: linear-gradient(90deg, #2962ff, #6c95ff); transition: width .4s; }
#xptxt { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--mono); font-size: .7rem; font-weight: 600; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.xpgain { position: absolute; right: 8px; top: -18px; font-family: var(--mono); font-size: .78rem; font-weight: 700; color: #6c95ff; pointer-events: none; animation: rise 1.3s forwards; }
.lvgain { font-family: var(--mono); font-size: .8rem; font-weight: 600; color: var(--up); white-space: nowrap; }
.bank { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .8rem; color: var(--muted); }
.bk { display: inline-flex; align-items: center; gap: 6px; }
.bk b { font-family: var(--mono); font-weight: 500; color: var(--fg); }
.bk b.down { color: var(--down); }
.mini { background: var(--panel2); border: 1px solid var(--line2); color: var(--fg); border-radius: 4px; padding: 3px 8px; font-size: .72rem; }
.mini:hover:not(:disabled) { border-color: var(--blue); }
#botLast.up { color: var(--up); } #botLast.down { color: var(--down); }
.patbox .pcard { padding: 5px 7px; gap: 3px; }
.patbox .pcard b { font-size: .74rem; }
.patbox .pcard small { display: block; text-align: center; font-size: .72rem; font-weight: 600; color: var(--fg); }
.patbox .pcard .pstate { text-align: center; }
/* Thomas : « seulement le petit graphique, enlève le titre et le cadre » : pas de panneau, pas de bordure, juste le dessin et le mot */
.leftcol .patbox { background: none; border: 0; padding: 0; }
.leftcol .patbox .pcard { background: none; border: 0; padding: 0; }
.leftcol .patbox .pcard svg { background: var(--panel); border-radius: 6px; height: 48px; }
.leftcol .patbox .pcard.on svg { outline: 1px solid var(--gold); }
.patbox .pcard svg { height: 34px; }
.patbox .patlist { gap: 4px; }
.patbox .pcard .pstate { font-size: .64rem; }
.acct { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--line); padding-top: 10px; margin-top: 4px; }
.leftcol .acct { border-top: 0; margin-top: 0; padding: 10px; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; }
.leftcol .acct .subs > span b { font-size: .78rem; white-space: nowrap; }
.leftcol .hstats { grid-template-columns: 1fr; gap: 2px; }
.leftcol .hstats span { display: flex; justify-content: space-between; }
.leftcol .hlist { max-height: 320px; }
.acct .moneyline { flex-direction: column; align-items: stretch; gap: 8px; }
.acct .subs { display: flex; flex-direction: column; gap: 5px; font-size: .82rem; }
.acct .subs > span { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; }
.acct .subs > span b { margin-left: auto; }
.acct .subs > span[hidden] { display: none; }
.acct .bank { flex-direction: column; gap: 6px; }
.acct .bk { flex-wrap: wrap; justify-content: space-between; }
.acct .bk b { margin-right: auto; }
.acct .xprow { flex-wrap: wrap; gap: 6px 8px; }
.acct .xprow .xp { flex: 1 1 100%; order: 3; }
.acct .lvgain { margin-left: auto; }
.shoptip { position: fixed; z-index: 55; width: 280px; background: var(--panel); border: 1px solid var(--cc, var(--line2)); border-radius: 6px; padding: 10px 12px; box-shadow: 0 12px 40px rgba(0,0,0,.6), 0 0 0 1px color-mix(in srgb, var(--cc, var(--line2)) 30%, transparent); pointer-events: none; display: flex; flex-direction: column; gap: 6px; }
.shoptip small { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--cc, var(--muted)); }
.shoptip b { font-size: .95rem; color: var(--fg); }
.shoptip p { margin: 0; font-size: .8rem; line-height: 1.45; color: var(--fg); }
.shoptip .tfx { font-family: var(--mono); font-size: .8rem; color: var(--muted); }
.shoptip .tfx em { font-style: normal; color: var(--cc, var(--fg)); font-weight: 600; }
.modal { position: fixed; inset: 0; z-index: 60; background: rgba(5,8,14,.6); display: grid; place-items: center; padding: 16px; }
.mbox { width: min(380px, 100%); background: var(--panel); border: 1px solid var(--line2); border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.mbox h3 { margin: 0; font-size: 1.05rem; }
.mbox p { margin: 0; font-size: .82rem; color: var(--muted); line-height: 1.5; }
.mbox p b { color: var(--fg); font-family: var(--mono); font-weight: 500; }
.mbox p b.down { color: var(--down); }
.mbox p b.gold { color: var(--gold); }
.mok:disabled { opacity: .5; }
.mrow { display: flex; align-items: center; gap: 8px; }
.mrow input { flex: 1; min-width: 0; background: var(--bg); border: 1px solid var(--line2); color: var(--fg); border-radius: 4px; padding: 9px 10px; font-family: var(--mono); font-size: 1.1rem; -webkit-user-select: text; user-select: text; }
.mrow input:focus { outline: none; border-color: var(--blue); }
.mquick { display: flex; gap: 6px; }
.mbtns { display: flex; justify-content: flex-end; gap: 8px; }
.mok { background: var(--blue); color: #fff; border-radius: 4px; padding: 8px 16px; font-size: .88rem; }
.ranklist { display: flex; flex-direction: column; gap: 4px; }
.rrow { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 2px 6px; align-items: center; background: var(--bg); border: 1px solid var(--line); border-radius: 4px; padding: 5px 7px; font-size: .74rem; }
.rrow.me { border-color: var(--blue); }
.rrow .rk { font-family: var(--mono); font-weight: 700; color: var(--muted); }
.rrow:nth-child(1) .rk { color: var(--gold); }
.rrow .rn { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rrow .rf { font-family: var(--mono); font-weight: 600; white-space: nowrap; }
.rrow[data-p]:not([data-p=""]) { cursor: pointer; } .rrow.open { border-color: var(--short); }
/* Coups contre un pote, directement sous sa ligne (v62) : krach en rouge, les autres en violet ; deux clics pour envoyer */
.ractions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; padding-top: 3px; }
.ractions .ab { background: color-mix(in srgb, var(--short) 16%, var(--panel2)); border: 1px solid var(--short); color: var(--fg); border-radius: 4px; padding: 2px 6px; font-size: .68rem; font-weight: 600; }
.ractions .ab.krach { background: color-mix(in srgb, var(--down) 18%, var(--panel2)); border-color: var(--down); color: var(--down); }
.ractions .ab.arm { background: var(--short); color: #fff; } .ractions .ab.krach.arm { background: var(--down); color: #fff; }
.ractions .ab:disabled { opacity: .4; } .ractions .ab em { font-style: normal; font-family: var(--mono); color: var(--muted); margin-left: 3px; font-weight: 500; }
.rankbox .mpfeed { margin-top: 2px; }
.rrow .kb { grid-column: 2 / -1; justify-self: start; background: color-mix(in srgb, var(--down) 18%, var(--panel2)); border: 1px solid var(--down); color: var(--down); border-radius: 4px; padding: 2px 7px; font-size: .66rem; font-weight: 700; }
.rrow .kb.arm { background: var(--down); color: #fff; }
.rrow .kb:disabled { opacity: .35; }
.rankhint { margin: 0; font-size: .66rem; color: var(--muted); line-height: 1.4; }
.hstats { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 10px; font-size: .74rem; color: var(--muted); }
.hstats b { font-family: var(--mono); font-weight: 500; color: var(--fg); }
.hlist { display: flex; flex-direction: column; gap: 3px; max-height: 260px; overflow-y: auto; }
.hrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; background: var(--bg); border-left: 3px solid var(--line); border-radius: 3px; padding: 4px 7px; font-size: .7rem; color: var(--muted); }
.hrow.w { border-left-color: var(--up); } .hrow.l { border-left-color: var(--down); }
.hrow b { color: var(--fg); font-weight: 600; }
.hrow .hp { font-family: var(--mono); font-weight: 600; text-align: right; }
.hrow.bot { opacity: .45; } /* trade pris par le robot, pas par le joueur */
.loanbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: .82rem; color: var(--fg); background: color-mix(in srgb, var(--down) 14%, var(--panel)); border: 1px solid var(--down); border-radius: 5px; padding: 6px 10px; }
.loanbar b { font-family: var(--mono); color: var(--down); }
.loanbar .lbnote { color: var(--muted); font-size: .72rem; }
.loanbar.urgent { animation: extblink .5s steps(2) infinite; }
#offerTxt b { color: var(--fg); font-family: var(--mono); font-weight: 600; }
#offerTxt b.down { color: var(--down); }
/* Panneau Potes : sous la boutique, dans la place libérée en fin de partie */
.mpbox { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--line); padding-top: 8px; }
.mplist { display: flex; flex-wrap: wrap; gap: 5px; }
.mpb { background: color-mix(in srgb, var(--short) 16%, var(--panel2)); border: 1px solid var(--short); color: var(--fg); border-radius: 4px; padding: 6px 9px; font-size: .74rem; font-weight: 600; }
.mpb em { font-style: normal; font-family: var(--mono); color: var(--muted); margin-left: 4px; font-weight: 500; }
.mpb:disabled { opacity: .45; }
.mpfeed { display: flex; flex-direction: column; gap: 3px; font-size: .7rem; color: var(--muted); line-height: 1.35; }
.mpfeed div { border-left: 2px solid var(--short); padding-left: 6px; }
.mpfeed:empty { display: none; }
.mbox .row small { width: 44px; }
.ftabs { display: flex; gap: 6px; }
.uplist { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; max-height: 420px; overflow: auto; }
.upcat { display: flex; flex-direction: column; gap: 3px; }
.upcat h4 { margin: 0 0 2px; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--cc); display: flex; justify-content: space-between; }
.upcat h4 span { color: var(--muted); font-family: var(--mono); }
.upcat div { display: flex; justify-content: space-between; gap: 8px; font-size: .76rem; background: var(--bg); border-left: 2px solid var(--cc); border-radius: 3px; padding: 3px 7px; }
.upcat div b { font-family: var(--mono); font-weight: 500; color: var(--muted); }
.upcat .next { opacity: .5; border-left-style: dashed; }
.ftable td.gold { color: var(--gold); }
/* Pari reçu : bandeau avec deux boutons, 5 s pour répondre */
.betask { position: absolute; left: 50%; top: 56%; transform: translateX(-50%); z-index: 4; display: flex; align-items: center; gap: 8px; background: var(--panel); border: 1px solid var(--short); border-radius: 6px; padding: 8px 12px; font-size: .84rem; box-shadow: 0 12px 40px rgba(0,0,0,.6); white-space: nowrap; }
.betask b { color: var(--short); font-family: var(--mono); }
.betask button { border-radius: 4px; padding: 5px 10px; font-size: .8rem; }
.betask .yes { background: var(--up); color: #fff; } .betask .no { background: var(--panel2); color: var(--fg); }
/* Pièces volées par un pote : rouges */
.gcoin.stolen, .gchest.stolen { border-color: var(--down); color: var(--down); box-shadow: inset 0 0 0 3px #131722, inset 0 0 0 4px rgba(242,54,69,.6), 0 0 18px rgba(242,54,69,.6); }
.chartbox.night { background: #0a0d17; }
.chartbox.night .chead { background: #171a24; }
.fx .nightlab { background: #2a2a55; color: #cfd3ff; }
.chartbox.jammed .cprice, .chartbox.jammed .chg, .chartbox.jammed .ohlc { filter: blur(6px); }
#fxcv { position: fixed; inset: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: 50; }
/* Krach envoyé par un pote : flash rouge plein écran, secousse de toute la page, message géant */
.attackflash { position: fixed; inset: 0; pointer-events: none; z-index: 55; background: var(--down); animation: aflash 1.2s ease-out forwards; }
@keyframes aflash { 0% { opacity: .75; } 12% { opacity: .15; } 24% { opacity: .6; } 40% { opacity: .1; } 100% { opacity: 0; } }
.wrap.shakehard { animation: shakehard .8s; }
@keyframes shakehard { 10% { transform: translate(-14px, 6px); } 20% { transform: translate(12px, -8px); } 30% { transform: translate(-10px, 4px); } 40% { transform: translate(9px, -5px); } 50% { transform: translate(-7px, 3px); } 60% { transform: translate(5px, -3px); } 70% { transform: translate(-3px, 2px); } 80% { transform: translate(2px, -1px); } }
.toast.huge.attack { font-size: clamp(2.6rem, 8vw, 4.2rem); text-shadow: 0 0 24px var(--down), 0 2px 8px #000; animation-duration: 2.6s; }
@media (prefers-reduced-motion: reduce) { .live-dot, .news, .fortune.pop, .money.shake { animation: none; } .toast { animation-duration: 2s; } }

/* Écran de pseudo et de partie (version serveur) */
.login p.err { color: var(--down); min-height: 1.2em; }
/* Écran de chargement (v74) : avant la partie, avec un emplacement réservé pour une future publicité */
.splash { position: fixed; inset: 0; z-index: 80; background: radial-gradient(ellipse at 50% 35%, #1b2233, var(--bg) 70%); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 24px; text-align: center; }
.splash[hidden] { display: none !important; }
.splash .logo { font-family: var(--mono); font-weight: 700; font-size: clamp(2.2rem, 6vw, 3.6rem); letter-spacing: .04em; line-height: 1; }
.splash .logo .c { color: var(--down); } .splash .logo .b { color: var(--up); } .splash .logo .o { color: var(--muted); font-size: .55em; vertical-align: middle; margin: 0 .3em; }
.splash .tag { color: var(--muted); font-size: .9rem; margin: 0; }
.splash .bar { width: min(360px, 80vw); height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.splash .bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--down), var(--gold), var(--up)); transition: width .2s linear; }
.splash .tip { color: var(--fg); font-size: .85rem; max-width: 460px; min-height: 2.6em; margin: 0; line-height: 1.5; }
.splash .adslot { width: min(728px, 92vw); min-height: 90px; display: flex; align-items: center; justify-content: center; }
.splash .adslot:empty { display: none; }
.splash .play { font-size: 1.05rem; padding: 12px 36px; }
.splash .play:disabled { opacity: .4; }
.login .mrow input { font-family: inherit; }
.login #loginCode { text-transform: uppercase; letter-spacing: .12em; }
.login .roomblock { display: flex; flex-direction: column; gap: 6px; padding: 10px; background: var(--bg); border: 1px solid var(--line); border-radius: 6px; }
.login .roomblock p.lbl { color: var(--fg); font-weight: 600; }
.login .mok.wide { width: 100%; padding: 11px 16px; font-size: .95rem; }
.login .roomnow { display: flex; flex-direction: column; gap: 6px; }
.login .roomnow .mrow { gap: 10px; }
.login .roomcode { flex: 1; font-family: var(--mono); font-size: 1.5rem; letter-spacing: .14em; color: var(--gold); -webkit-user-select: text; user-select: text; }
.login .legal { font-size: .8rem; display: flex; gap: 14px; flex-wrap: wrap; }
.login .legal a { color: var(--fg); text-decoration: underline; }
.login button.link { background: none; border: 0; padding: 0; color: var(--muted); text-decoration: underline; font: inherit; cursor: pointer; }
/* Bouton Partie en haut à gauche de l'encadré Classement (choix d'Alexis) : créer, rejoindre, quitter, mentions légales */
.rankbox .rankhead { display: flex; }
.rankbox .rankhead .mini.on { border-color: var(--gold); color: var(--gold); }
.note a { color: var(--muted); }