/* FIRE Quest v1.9.6 — generated CSS bundle. Sources remain in /css/modules. */

/* ---- css/modules/00-foundation.css ---- */
/* 00-foundation.css — Base layout, couleurs initiales, cartes, stats, tabs, fond premium initial.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

* { box-sizing: border-box; }
    body { margin: 0; font-family: Inter, Arial, sans-serif; background: #f4f7fb; color: #172033; }
    .container { max-width: 1520px; margin: 0 auto; padding: 18px; }
    .topbar { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:16px; }
    h1 { margin:0 0 8px; font-size:34px; }
    .subtitle { margin:0; color:#52607a; }
    .badge { background:#dbeafe; color:#1d4ed8; padding:8px 12px; border-radius:999px; font-size:13px; white-space:nowrap; }
    .layout { display:grid; grid-template-columns: 2fr 1fr; gap:16px; }
    .card { background:#fff; border:1px solid #dfe7f2; border-radius:18px; padding:16px; box-shadow:0 6px 18px rgba(17,24,39,.06); }
    .section-title { font-size:19px; font-weight:800; margin:0 0 12px; }
    .stats { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:14px; }
    .stat { border:1px solid #e2e8f0; border-radius:14px; padding:10px 10px 12px; min-width:0; }
    .stat .label { font-size:12px; color:#64748b; margin-bottom:6px; }
    .stat .value { font-size:20px; font-weight:800; display:flex; align-items:baseline; justify-content:flex-start; gap:2px; width:100%; min-width:0; line-height:1.05; }
    .controls { display:flex; flex-wrap:wrap; gap:10px; align-items:end; }
    select, button { font:inherit; }
    select { padding:10px 12px; border-radius:12px; border:1px solid #cbd5e1; background:#fff; min-width:210px; }
    button { border:none; background:#111827; color:#fff; padding:10px 14px; border-radius:12px; cursor:pointer; }
    button.secondary { background:#fff; color:#111827; border:1px solid #cbd5e1; }
    button:disabled { opacity:.5; cursor:not-allowed; }
    .journal { margin-top:14px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:14px; padding:12px; }
    .journal strong { display:block; margin-bottom:4px; }
    .monthly-insight { margin-top:10px; padding:10px 12px; border-radius:12px; border:1px solid rgba(148,163,184,.14); background:rgba(255,255,255,.03); }
    .monthly-insight-title { font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:#cbd5e1; margin-bottom:6px; }
    .monthly-insight ul { margin:0; padding-left:18px; }
    .monthly-insight li { margin:4px 0; color:#dbeafe; }
    .monthly-narrative { margin-top:10px; padding:10px 12px; border-radius:12px; border:1px solid rgba(96,165,250,.18); background:rgba(96,165,250,.08); color:#e0ecff; }
    .alert { margin-top:10px; padding:12px; border-radius:14px; border:1px solid; }
    .success { background:#ecfdf5; border-color:#86efac; color:#166534; }
    .danger { background:#fff1f2; border-color:#fda4af; color:#9f1239; }
    .warning { background:#fff7ed; border-color:#fdba74; color:#9a3412; }
    .info { background:#eff6ff; border-color:#93c5fd; color:#1d4ed8; }
    .progress-row { margin-bottom:12px; }
    .progress-head { display:flex; justify-content:space-between; font-size:13px; margin-bottom:6px; }
    .bar { width:100%; height:11px; border-radius:999px; background:#e2e8f0; overflow:hidden; }
    .fill { height:100%; background:#111827; position:relative; overflow:hidden; }
    .summary { background:#f1f5f9; border-radius:14px; padding:14px; color:#475569; font-size:14px; }
    .summary .big { font-size:30px; color:#111827; font-weight:800; }
    .tabs { display:flex; gap:10px; margin:16px 0; flex-wrap:wrap; }
    .tab-btn { background:#fff; color:#111827; border:1px solid #cbd5e1; }
    .tab-btn.active { background:#111827; color:#fff; }
    .panel { display:none; }
    .panel.active { display:block; }
    .actions-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
    .action-card, .history-item, .market-card, .goal-card, .event-card, .tutorial-card, .condition-card { border:1px solid #e2e8f0; border-radius:14px; padding:14px; background:#fff; }
    .pill { display:inline-block; background:#e2e8f0; color:#334155; border-radius:999px; padding:3px 10px; font-size:12px; margin-bottom:8px; }
    .small { font-size:13px; color:#64748b; }
    .muted { color:#64748b; }
    .choices { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px; }
    .subgrid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .history-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
    .market-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
    .goals-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; }
    .tutorial-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
    .conditions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px; }
    .action-meta { display:flex; justify-content:space-between; align-items:center; margin-top:10px; gap:8px; }
    .month-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
    .tiny { font-size:11px; color:#6b7280; }
    ul.clean { margin:8px 0 0; padding-left:18px; }
    li.ok { color:#166534; }
    li.ko { color:#9f1239; }
    @media (max-width: 1200px) {
      .layout { grid-template-columns:1fr; }
      .stats { grid-template-columns:repeat(3,1fr); }
      .actions-grid,.market-grid,.goals-grid { grid-template-columns:repeat(2,1fr); }
    }
    @media (max-width: 760px) {
      .topbar { flex-direction:column; }
      .stats,.actions-grid,.market-grid,.goals-grid,.subgrid,.history-list,.choices,.tutorial-grid,.conditions-grid { grid-template-columns:1fr; }
    }
  
    :root{
      --bg:#09111f;
      --bg2:#0f172a;
      --panel:rgba(16,24,40,.78);
      --panel-2:rgba(15,23,42,.92);
      --line:rgba(148,163,184,.16);
      --text:#e6eefc;
      --muted:#94a3b8;
      --green:#22c55e;
      --yellow:#f59e0b;
      --red:#ef4444;
      --blue:#60a5fa;
      --violet:#8b5cf6;
      --cyan:#22d3ee;
      --gold:#fbbf24;
      --shadow:0 20px 50px rgba(2,8,23,.38);
    }
    body {
      background:
        radial-gradient(circle at top left, rgba(96,165,250,.14), transparent 30%),
        radial-gradient(circle at top right, rgba(139,92,246,.14), transparent 28%),
        linear-gradient(180deg, #08101d 0%, #0b1220 100%);
      color: var(--text);
      min-height:100vh;
    }
    .container { max-width: 1560px; }
    .card, .action-card, .history-item, .market-card, .goal-card, .event-card, .tutorial-card, .condition-card, .stat {
      background: linear-gradient(180deg, rgba(15,23,42,.88), rgba(15,23,42,.72));
      border:1px solid var(--line);
      box-shadow: var(--shadow);
      backdrop-filter: blur(8px);
    }
    .subtitle, .small, .muted, .stat .label, .tiny { color: var(--muted) !important; }
    .badge {
      background: linear-gradient(90deg, rgba(96,165,250,.18), rgba(139,92,246,.18));
      color: #dbeafe;
      border:1px solid rgba(96,165,250,.2);
      box-shadow: 0 10px 24px rgba(96,165,250,.12);
    }
    h1 {
      background: linear-gradient(90deg, #ffffff 0%, #dbeafe 45%, #c4b5fd 100%);
      -webkit-background-clip: text;
      background-clip:text;
      color:transparent;
    }
    .journal, .summary {
      background: linear-gradient(180deg, rgba(15,23,42,.95), rgba(15,23,42,.78));
      border:1px solid var(--line);
      color:var(--text);
    }
    .summary .big { color:#fff; text-shadow:0 0 20px rgba(255,255,255,.08); }
    .pill {
      background: rgba(148,163,184,.12);
      color: #dbeafe;
      border:1px solid rgba(148,163,184,.14);
    }
    .bar {
      height:12px;
      background: rgba(148,163,184,.12);
      border:1px solid rgba(148,163,184,.12);
    }
    .fill {
      position:relative;
      overflow:hidden;
      background: linear-gradient(90deg, var(--blue), var(--violet));
      transition: width .55s cubic-bezier(.2,.8,.2,1), background .3s ease, box-shadow .3s ease;
      box-shadow: 0 0 18px rgba(96,165,250,.25);
    }
    button {
      background: linear-gradient(180deg, #1e293b 0%, #111827 100%);
      color:#f8fafc;
      border:1px solid rgba(148,163,184,.12);
      box-shadow: 0 10px 22px rgba(2,8,23,.18);
      transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, filter .16s ease;
    }
    button:hover:not(:disabled) {
      transform: translateY(-2px);
      box-shadow: 0 16px 26px rgba(2,8,23,.28);
      border-color: rgba(96,165,250,.24);
      filter: brightness(1.06);
    }
    button:active:not(:disabled) { transform: scale(.98); }
    button.secondary, .tab-btn {
      background: rgba(15,23,42,.75);
      color:#e2e8f0;
      border:1px solid rgba(148,163,184,.12);
    }
    .tab-btn.active {
      background: linear-gradient(90deg, rgba(96,165,250,.25), rgba(139,92,246,.25));
      border-color: rgba(96,165,250,.28);
      color:#fff;
      box-shadow: 0 8px 20px rgba(96,165,250,.12);
    }
    .topbar { margin-bottom:20px; }
    .stats { gap:12px; }
    .stat .value { color:#fff; letter-spacing:-1px; }
    .action-card, .goal-card, .market-card, .event-card { position:relative; overflow:hidden; }
    .action-card::before, .goal-card::before, .market-card::before, .event-card::before {
      content:"";
      position:absolute; inset:0;
      background: linear-gradient(135deg, rgba(255,255,255,.02), transparent 38%);
      pointer-events:none;
    }
    .action-card:hover, .goal-card:hover, .market-card:hover {
      transform: translateY(-2px);
      transition: transform .18s ease;
    }
    .goal-card.active-goal {
      border-color: rgba(251,191,36,.28);
      box-shadow: 0 16px 34px rgba(251,191,36,.08);
    }
    .goal-card.completed-goal {
      animation: goalExplode .8s cubic-bezier(.2,.8,.2,1);
    }
    @keyframes goalExplode {
      0% { transform: scale(1); opacity:1; }
      35% { transform: scale(1.12); opacity:1; box-shadow:0 0 32px rgba(251,191,36,.35); }
      100% { transform: scale(0.2); opacity:0; }
    }
    .event-card.event-negative { border-color: rgba(239,68,68,.24); box-shadow: 0 16px 34px rgba(239,68,68,.10); }
    .event-card.event-positive { border-color: rgba(34,197,94,.24); box-shadow: 0 16px 34px rgba(34,197,94,.10); }
    .event-card.event-strategic { border-color: rgba(96,165,250,.24); box-shadow: 0 16px 34px rgba(96,165,250,.10); }
    .feedback-stack{
      position:fixed;
      top:20px; right:20px;
      display:flex; flex-direction:column; gap:10px;
      z-index:9999;
      pointer-events:none;
    }
    .toast{
      min-width:220px;
      max-width:320px;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid var(--line);
      background: rgba(15,23,42,.92);
      color:#fff;
      box-shadow: var(--shadow);
      animation: toastIn .45s ease, toastOut .45s ease 2.8s forwards;
    }
    .toast.pos{ border-color: rgba(34,197,94,.25); }
    .toast.neg{ border-color: rgba(239,68,68,.25); }
    .toast.info{ border-color: rgba(96,165,250,.25); }
    @keyframes toastIn {
      from { opacity:0; transform: translateY(-8px) translateX(14px); }
      to { opacity:1; transform: translateY(0) translateX(0); }
    }
    @keyframes toastOut {
      to { opacity:0; transform: translateX(20px); }
    }
    .kpi-good{ color:#22c55e !important; }
    .kpi-warn{ color:#f59e0b!important; }
    .kpi-bad{ color:#ef4444!important; }
    .kpi-neutral{ color:#e6eefc!important; }
    .kpi-warn{ color:var(--yellow)!important; }
    .kpi-bad{ color:var(--red)!important; }
    .action-tabs {
      display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px;
    }
    .action-tab.active {
      background: linear-gradient(90deg, rgba(96,165,250,.25), rgba(34,211,238,.18));
      border-color: rgba(96,165,250,.25);
      color:white;
    }
    .action-limit {
      font-size:11px; color:var(--muted); margin-top:8px;
    }
    .floating-glow {
      display:none !important;
    }

  
    .shimmer-text{
      background:none !important;
      -webkit-background-clip:initial !important;
      background-clip:initial !important;
      color:inherit !important;
      animation:none !important;
    }
    @keyframes shimmerText {
      0% { opacity:1; }
      100% { opacity:1; }
    }
    .fill::after{
      content:"";
      position:absolute;
      top:0;
      left:-40%;
      width:30%;
      height:100%;
      background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,.16) 50%, transparent 100%);
      transform: skewX(-18deg);
      animation: barSweep 6s ease-in-out infinite;
      pointer-events:none;
    }
    @keyframes barSweep {
      0%, 75% { left:-45%; }
      100% { left:120%; }
    }
    .month-overlay, .event-splash{
      position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
      pointer-events:none; z-index:9998; opacity:0; transition: opacity .25s ease;
    }
    .month-overlay.show, .event-splash.show{ opacity:1; }
    .month-overlay{
      background: radial-gradient(circle, rgba(10,20,40,.25), rgba(2,6,23,.72));
      backdrop-filter: blur(4px);
    }
    .month-overlay-inner{
      padding:22px 34px; border-radius:24px; border:1px solid rgba(148,163,184,.18);
      background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.74));
      box-shadow: 0 30px 60px rgba(2,8,23,.4);
      transform: translateY(10px) scale(.98);
      animation: monthIn .9s cubic-bezier(.2,.8,.2,1) forwards;
    }
    .month-label{
      font-size:42px; font-weight:900; letter-spacing:-1px;
      background: linear-gradient(90deg, #fff, #dbeafe, #c4b5fd);
      -webkit-background-clip:text; background-clip:text; color:transparent;
    }
    @keyframes monthIn{
      0% { opacity:0; transform: translateY(18px) scale(.94);}
      30% { opacity:1; transform: translateY(0) scale(1);}
      100% { opacity:1; transform: translateY(0) scale(1);}
    }
    .event-splash-card{
      width:min(560px, calc(100vw - 32px));
      border-radius:28px;
      border:1px solid rgba(148,163,184,.16);
      background: linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.82));
      box-shadow: 0 30px 70px rgba(2,8,23,.46);
      padding:28px 28px 24px;
      text-align:center;
      transform: scale(.92) translateY(12px);
      opacity:0;
    }
    .event-splash.show .event-splash-card{
      animation: eventCardIn 2.2s cubic-bezier(.2,.8,.2,1) forwards;
    }
    @keyframes eventCardIn{
      0% { opacity:0; transform: scale(.92) translateY(18px); }
      12% { opacity:1; transform: scale(1) translateY(0); }
      78% { opacity:1; transform: scale(1) translateY(0); }
      100% { opacity:0; transform: scale(.97) translateY(-6px); }
    }
    .event-splash-icon{
      font-size:48px; margin-bottom:10px; filter: drop-shadow(0 0 18px rgba(255,255,255,.15));
      animation: iconPulse 1.4s ease-in-out infinite;
    }
    @keyframes iconPulse{
      0%,100% { transform: scale(1) rotate(0deg); }
      50% { transform: scale(1.08) rotate(2deg); }
    }
    .event-splash-title{ font-size:28px; font-weight:900; color:#fff; margin-bottom:8px; }
    .event-splash-sub{ color:#cbd5e1; font-size:15px; }
    .mini-chart{
      width:100%; height:72px; margin-top:10px; display:block;
      background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
      border-radius:12px;
      overflow:visible;
    }
    .chart-line{
      fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round;
      filter: drop-shadow(0 0 8px rgba(255,255,255,.10));
    }
    .chart-area{ opacity:.12; }
    .chart-grid{ stroke: rgba(148,163,184,.08); stroke-width:1; }
    .chart-dot{ r:3.5; }
    .float-delta{
      position:absolute; font-size:15px; font-weight:800; pointer-events:none; opacity:0;
      animation: deltaFloat 1.2s ease forwards;
      text-shadow: 0 6px 14px rgba(0,0,0,.35);
      z-index:20;
    }
    .float-delta.pos{ color:#4ade80; }
    .float-delta.neg{ color:#fb7185; }
    @keyframes deltaFloat{
      0%{ opacity:0; transform: translateY(10px) scale(.9); }
      18%{ opacity:1; transform: translateY(0) scale(1); }
      100%{ opacity:0; transform: translateY(-26px) scale(1.04); }
    }
    .pulse-danger{
      animation: dangerPulse 1.8s ease-in-out infinite;
    }
    @keyframes dangerPulse{
      0%,100% { box-shadow: 0 16px 34px rgba(239,68,68,.06); border-color: rgba(239,68,68,.18); }
      50% { box-shadow: 0 18px 38px rgba(239,68,68,.18); border-color: rgba(239,68,68,.34); }
    }
    .action-card:hover{
      box-shadow: 0 18px 34px rgba(96,165,250,.12), 0 0 0 1px rgba(96,165,250,.12) inset;
    }
    .goal-progress{
      margin-top:10px;
    }
    .goal-progress .bar{ height:8px; }

  
    .shimmer-text, .summary .big, .stat .value {
      position: relative;
      overflow: hidden;
    }
    .shimmer-text::after, .summary .big::after, .stat .value::after {
      content: "";
      position: absolute;
      top: 0; left: -140%;
      width: 45%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
      transform: skewX(-18deg);
      animation: subtleShine 7s ease-in-out infinite;
      pointer-events: none;
    }
    .bar .fill::after {
      content: "";
      position: absolute;
      top: 0; left: -160%;
      width: 35%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
      transform: skewX(-18deg);
      animation: subtleShine 6s ease-in-out infinite;
      pointer-events: none;
    }
    @keyframes subtleShine {
      0%, 70% { left: -160%; }
      100% { left: 180%; }
    }


    #cashStat.kpi-good, #netWorthStat.kpi-good, #incomeStat.kpi-good, #passiveStat.kpi-good { color:#22c55e !important; }
    #cashStat.kpi-bad, #netWorthStat.kpi-bad, #incomeStat.kpi-bad, #passiveStat.kpi-bad { color:#ef4444 !important; }
    #cashStat.kpi-warn, #netWorthStat.kpi-warn, #incomeStat.kpi-warn, #passiveStat.kpi-warn { color:#f59e0b !important; }
    #cashStat.kpi-neutral, #netWorthStat.kpi-neutral, #incomeStat.kpi-neutral, #passiveStat.kpi-neutral { color:#e6eefc !important; }


    .month-event-overlay{
      position: fixed;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      background: rgba(2, 8, 23, 0.42);
      backdrop-filter: blur(3px);
      z-index: 10000;
      padding: 24px;
    }
    .month-event-overlay.show{
      display: flex;
      animation: overlayFadeIn .25s ease;
    }
    .month-event-modal{
      width: min(720px, 94vw);
      border-radius: 22px;
      padding: 28px 28px 24px;
      border: 1px solid rgba(148,163,184,.18);
      background: linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.88));
      box-shadow: 0 28px 80px rgba(2,8,23,.50);
      color: #eef4ff;
      transform: scale(.96);
      animation: modalPop .32s cubic-bezier(.2,.8,.2,1) forwards;
      text-align: center;
    }
    .month-event-modal.negative{
      border-color: rgba(239,68,68,.28);
      box-shadow: 0 28px 80px rgba(239,68,68,.14);
    }
    .month-event-modal.positive{
      border-color: rgba(34,197,94,.28);
      box-shadow: 0 28px 80px rgba(34,197,94,.14);
    }
    .month-event-modal.strategic{
      border-color: rgba(96,165,250,.28);
      box-shadow: 0 28px 80px rgba(96,165,250,.14);
    }
    .month-event-icon{
      font-size: 44px;
      margin-bottom: 8px;
      line-height: 1;
    }
    .month-event-title{
      font-size: 34px;
      font-weight: 800;
      margin-bottom: 10px;
      color: #ffffff;
    }
    .month-event-subtitle{
      color: #cbd5e1;
      font-size: 17px;
    }
    @keyframes overlayFadeIn{
      from { opacity: 0; }
      to { opacity: 1; }
    }
    @keyframes modalPop{
      from { opacity: 0; transform: scale(.90) translateY(8px); }
      to { opacity: 1; transform: scale(1) translateY(0); }
    }


.intro-overlay{
  position:fixed; inset:0; background:rgba(2,8,23,.75);
  display:flex; align-items:center; justify-content:center; z-index:20000;
}
.intro-card{
  width:min(600px,90vw); background:linear-gradient(180deg,#0f172a,#111827);
  color:#eef4ff; border-radius:20px; padding:24px; box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.intro-card h2{margin-top:0;}
.intro-card button{margin-top:16px; width:100%; padding:12px; font-size:16px;}


.trade-controls{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.trade-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.trade-row input{
  width:140px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(15,23,42,.8);
  color:#eef4ff;
}
.quick-btn{
  padding:8px 10px;
  font-size:12px;
}


.dynamic-objective-card{
  margin-top:12px;
  background:linear-gradient(135deg, rgba(96,165,250,.16), rgba(139,92,246,.16));
  border:1px solid rgba(96,165,250,.22);
  border-radius:16px;
  padding:14px 16px;
  box-shadow:0 14px 34px rgba(2,8,23,.22);
}
.dynamic-objective-title{
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#cbd5e1;
  margin-bottom:6px;
}
.dynamic-objective-text{
  font-weight:800;
  font-size:18px;
  color:#fff;
}
.dynamic-objective-sub{
  margin-top:6px;
  font-size:13px;
  color:#cbd5e1;
}
.stat.main{
  border:1px solid rgba(34,197,94,.24) !important;
  background:linear-gradient(180deg, rgba(34,197,94,.10), rgba(15,23,42,.78)) !important;
}
.progress-row.focus-row{
  padding:10px 10px 8px;
  border:1px solid rgba(239,68,68,.14);
  border-radius:14px;
  background:rgba(239,68,68,.03);
}
.floating-feedback{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:13000;
  pointer-events:none;
  font-size:34px;
  font-weight:900;
  opacity:0;
  transition:all .65s ease;
  text-shadow:0 12px 30px rgba(2,8,23,.35);
}
.floating-feedback.show{
  opacity:1;
  transform:translate(-50%, -72%);
}
.level-card{
  margin-top:12px;
  background:linear-gradient(180deg, rgba(251,191,36,.12), rgba(15,23,42,.78));
  border:1px solid rgba(251,191,36,.18);
  border-radius:14px;
  padding:14px;
}
.level-name{
  font-size:18px;
  font-weight:800;
  color:#fff;
}
.level-sub{
  color:#cbd5e1;
  font-size:13px;
  margin-top:4px;
}
.level-progress{
  margin-top:10px;
}
.urgency-banner{
  margin-top:10px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(245,158,11,.22);
  background:rgba(245,158,11,.10);
  color:#fde68a;
  display:none;
}
.urgency-banner.show{ display:block; }
.action-emotion{
  margin-top:8px;
  font-size:12px;
  color:#cbd5e1;
}
.choice-hint{
  margin-top:8px;
  font-size:12px;
  color:#93c5fd;
}
.mini-reward{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(34,197,94,.22);
  background:rgba(34,197,94,.10);
  color:#dcfce7;
  font-size:12px;
  margin-top:8px;
}


.profile-card{
  margin-top:12px;
  background:linear-gradient(135deg, rgba(34,197,94,.10), rgba(96,165,250,.10));
  border:1px solid rgba(96,165,250,.18);
  border-radius:16px;
  padding:14px;
}
.profile-name{
  font-weight:800;
  color:#fff;
  font-size:18px;
}
.profile-desc{
  margin-top:4px;
  color:#cbd5e1;
  font-size:13px;
}
.wow-banner{
  position:fixed;
  inset:auto 20px 20px auto;
  padding:14px 16px;
  border-radius:16px;
  background:linear-gradient(135deg, rgba(251,191,36,.20), rgba(139,92,246,.18));
  border:1px solid rgba(251,191,36,.25);
  color:#fff;
  z-index:14000;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:all .45s ease;
  box-shadow:0 20px 40px rgba(2,8,23,.35);
}
.wow-banner.show{
  opacity:1;
  transform:translateY(0);
}
.confetti-layer{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:13999;
}
.confetti{
  position:absolute;
  width:10px;
  height:14px;
  opacity:.9;
  animation:confettiFall 1.8s linear forwards;
}
@keyframes confettiFall{
  0%{ transform:translateY(-20px) rotate(0deg); opacity:1; }
  100%{ transform:translateY(110vh) rotate(540deg); opacity:0; }
}




/* ---- css/modules/10-mobile-hud-and-overlays.css ---- */
/* 10-mobile-hud-and-overlays.css — Navigation mobile, overlays, dopamine/victoire, rotation device.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* V10 stratégique */
.mobile-bottom-nav{
  display:none;
}
.onboard-dock{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.onboard-pill{
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(96,165,250,.18);
  background:linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.76));
  color:#e6eefc;
  font-size:13px;
}
.onboard-pill strong{
  display:block;
  font-size:14px;
  margin-bottom:4px;
  color:#fff;
}
.impact-chip-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px;
}
.impact-chip{
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(148,163,184,.08);
  color:#cbd5e1;
  font-size:11px;
}
.mobile-hero{
  display:none;
}
.sonic-ring{
  position:fixed;
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid rgba(96,165,250,.8);
  z-index:15000;
  pointer-events:none;
  animation:ringPulse .6s ease forwards;
}
@keyframes ringPulse{
  0%{ transform:translate(-50%,-50%) scale(.4); opacity:1; }
  100%{ transform:translate(-50%,-50%) scale(4.4); opacity:0; }
}
.flash-overlay{
  position:fixed;
  inset:0;
  z-index:14500;
  pointer-events:none;
  background:transparent;
  opacity:0;
  transition:opacity .2s ease;
}
.flash-overlay.show.pos{ background:rgba(34,197,94,.24); opacity:1; }
.flash-overlay.show.neg{ background:rgba(239,68,68,.28); opacity:1; }
.flash-overlay.show.info{ background:rgba(96,165,250,.24); opacity:1; }
.sticky-cta{
  position:sticky;
  bottom:12px;
  z-index:20;
}
.big-next-btn{
  width:100%;
  padding:14px 18px;
  border-radius:18px;
  font-size:16px;
  font-weight:800;
  background:linear-gradient(90deg, rgba(96,165,250,.95), rgba(139,92,246,.95));
  border:1px solid rgba(96,165,250,.28);
  box-shadow:0 18px 34px rgba(96,165,250,.18);
}
.market-mini-chart{
  height:72px;
  margin-top:10px;
  border-radius:12px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(148,163,184,.10);
}
@media (max-width: 900px){
  .container{ padding:12px; }
  .topbar{ margin-bottom:12px; }
  h1{ font-size:28px; }
  .layout{ grid-template-columns:1fr; }
  .stats{
    grid-template-columns:repeat(2,1fr);
    gap:8px;
  }
  .card{ padding:14px; border-radius:16px; }
  .actions-grid{
    grid-template-columns:1fr;
  }
  .market-grid, .goals-grid, .history-list, .subgrid, .conditions-grid{
    grid-template-columns:1fr;
  }
  .controls{
    gap:8px;
  }
  select, button{
    min-height:44px;
  }
  .mobile-hero{
    display:block;
    margin-bottom:12px;
    padding:14px;
    border-radius:18px;
    background:linear-gradient(135deg, rgba(96,165,250,.18), rgba(139,92,246,.18));
    border:1px solid rgba(96,165,250,.18);
  }
  .mobile-bottom-nav{
    display:grid;
    position:fixed;
    left:0; right:0; bottom:0;
    grid-template-columns:repeat(6,1fr);
    gap:0;
    background:rgba(8,16,29,.96);
    border-top:1px solid rgba(148,163,184,.12);
    z-index:11000;
    padding-bottom:max(8px, env(safe-area-inset-bottom));
  }
  .mobile-bottom-nav button{
    border-radius:0;
    padding:10px 6px;
    font-size:12px;
    background:transparent;
    box-shadow:none;
    border:none;
    color:#cbd5e1;
  }
  .mobile-bottom-nav button.active{
    color:#fff;
    background:rgba(96,165,250,.12);
  }
  body{ padding-bottom:74px; }
}

@media (max-width: 900px) and (orientation: landscape){
  .container{ max-width:none; padding:10px; }
  .topbar{ flex-direction:row; align-items:flex-start; }
  .stats{ grid-template-columns:repeat(3,1fr); }
  .actions-grid,.market-grid,.goals-grid,.subgrid,.history-list,.conditions-grid,.tutorial-grid,.choices{ grid-template-columns:repeat(2,1fr); }
  .mobile-bottom-nav{ grid-template-columns:repeat(6,1fr); }
  body{ padding-bottom:68px; }
}



.advisor-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.advisor-btn{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(96,165,250,.22);
  background:linear-gradient(90deg, rgba(96,165,250,.18), rgba(139,92,246,.16));
  color:#fff;
  cursor:pointer;
  font-weight:700;
}
.advisor-tag{
  display:inline-block;
  margin-top:8px;
  font-size:12px;
  color:#cbd5e1;
}


/* V8.2 dopamine */
.dopamine-popup{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(0.8);
  background:linear-gradient(135deg,#22c55e,#60a5fa);
  color:white;
  padding:20px 30px;
  border-radius:20px;
  font-size:22px;
  font-weight:800;
  z-index:20000;
  opacity:0;
  transition:all .3s ease;
}
.dopamine-popup.show{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.level-badge{
  padding:6px 10px;
  border-radius:999px;
  background:linear-gradient(90deg,#fbbf24,#f59e0b);
  color:#000;
  font-weight:800;
  font-size:12px;
}


/* V9 commercialisable */
.streak-card{
  margin-top:12px;
  background:linear-gradient(135deg, rgba(239,68,68,.14), rgba(251,191,36,.12));
  border:1px solid rgba(239,68,68,.22);
  border-radius:16px;
  padding:14px 16px;
}
.streak-value{
  font-size:22px;
  font-weight:900;
  color:#fff;
}
.streak-sub{
  margin-top:4px;
  color:#fecaca;
  font-size:13px;
}



.victory-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(2,8,23,.82);
  z-index:21000;
}
.victory-overlay.show{
  display:flex;
}
.victory-card{
  width:min(620px,92vw);
  padding:28px 26px;
  border-radius:24px;
  border:1px solid rgba(251,191,36,.28);
  background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.94));
  box-shadow:0 30px 90px rgba(2,8,23,.55);
  text-align:center;
  color:#fff;
}
.victory-title{
  font-size:34px;
  font-weight:900;
  margin-bottom:8px;
  background:linear-gradient(90deg,#fbbf24,#f59e0b,#fde68a);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.victory-text{
  color:#e2e8f0;
  line-height:1.6;
}
.premium-note{
  margin-top:12px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(139,92,246,.10);
  border:1px solid rgba(139,92,246,.18);
  color:#ddd6fe;
  font-size:13px;
}


.intro-overlay[aria-hidden="true"]{
  display:none !important;
  pointer-events:none !important;
}


.sound-note{
  font-size:12px;
  color:var(--muted);
  margin-top:8px;
}


.alert-pulse-overlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:11950;
  opacity:0;
}
.alert-pulse-overlay.red{
  opacity:1;
  background:rgba(239,68,68,.20);
  animation:alertPulseRed .75s ease-in-out infinite;
}
.alert-pulse-overlay.orange{
  opacity:1;
  background:rgba(245,158,11,.18);
  animation:alertPulseOrange .85s ease-in-out infinite;
}
.alert-pulse-overlay.green{
  opacity:1;
  background:rgba(34,197,94,.16);
  animation:alertPulseGreen .95s ease-in-out infinite;
}
@keyframes alertPulseRed{
  0%,100%{ background:rgba(239,68,68,.08); }
  50%{ background:rgba(239,68,68,.28); }
}
@keyframes alertPulseOrange{
  0%,100%{ background:rgba(245,158,11,.07); }
  50%{ background:rgba(245,158,11,.24); }
}
@keyframes alertPulseGreen{
  0%,100%{ background:rgba(34,197,94,.05); }
  50%{ background:rgba(34,197,94,.20); }
}

.rotate-device-overlay{
  position:fixed;
  left:12px;
  right:12px;
  bottom:calc(12px + env(safe-area-inset-bottom));
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  background:transparent;
  z-index:12000;
  pointer-events:none;
}
.rotate-device-overlay.show{
  pointer-events:auto;
}
.rotate-device-card{
  position:relative;
  width:min(560px, calc(100vw - 24px));
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.18);
  background:linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.90));
  box-shadow:0 16px 40px rgba(0,0,0,.30);
  text-align:center;
  padding-right:32px;
}
.rotate-device-close{
  position:absolute;
  top:8px;
  right:8px;
  width:28px;
  height:28px;
  min-height:28px;
  padding:0;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
  color:#e5efff;
  background:rgba(15,23,42,.84);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:none;
  pointer-events:auto;
}
.rotate-device-close:hover{
  transform:none !important;
  filter:brightness(1.12);
}
.rotate-device-title{
  font-size:16px;
  font-weight:800;
  color:#fff;
  margin-bottom:4px;
}
.rotate-device-text{
  color:#cbd5e1;
  font-size:12px;
  line-height:1.45;
}
.rotate-device-tip{
  margin-top:6px;
  color:#93c5fd;
  font-size:11px;
}
.rotate-device-overlay.show{
  display:flex;
}
@media (min-width: 901px){
  .rotate-device-overlay{ display:none !important; }
}

/* V1.8.10 — feedback visuel court : plus de plein écran rouge prolongé */
.flash-overlay{
  left:50% !important;
  top:72px !important;
  right:auto !important;
  bottom:auto !important;
  inset:auto auto auto 50% !important;
  width:min(420px, calc(100vw - 32px)) !important;
  height:5px !important;
  border-radius:999px !important;
  transform:translateX(-50%) scaleX(.70);
  box-shadow:0 8px 22px rgba(2,8,23,.28);
  transition:opacity .18s ease, transform .18s ease !important;
}
.flash-overlay.show{ transform:translateX(-50%) scaleX(1); }
.flash-overlay.show.pos{ background:linear-gradient(90deg, rgba(34,197,94,.20), rgba(34,197,94,.95), rgba(34,197,94,.20)) !important; opacity:1; }
.flash-overlay.show.neg{ background:linear-gradient(90deg, rgba(239,68,68,.18), rgba(239,68,68,.92), rgba(239,68,68,.18)) !important; opacity:1; }
.flash-overlay.show.info{ background:linear-gradient(90deg, rgba(96,165,250,.18), rgba(96,165,250,.92), rgba(96,165,250,.18)) !important; opacity:1; }


/* ---- css/modules/30-premium-polish.css ---- */
/* 30-premium-polish.css — Polish visuel, hiérarchie, cartes, boutons, marchés.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* === NIVEAU 1 : LISIBILITÉ + HIÉRARCHIE + PREMIUM LIGHT === */

/* chiffres plus dominants */
.stat .value{
  font-size: 28px !important;
  font-weight: 900 !important;
  letter-spacing: .3px;
  line-height: 1.05;
}

/* mise en avant des stats principales */
.stat.main{
  transform: scale(1.018);
  border: 1px solid rgba(96,165,250,.34) !important;
  box-shadow:
    0 0 0 1px rgba(96,165,250,.10),
    0 14px 34px rgba(2,8,23,.42),
    0 0 22px rgba(59,130,246,.10) !important;
}

/* hiérarchie couleur sur les valeurs clés */
#cashStat{
  color:#4ade80 !important;
  text-shadow:0 0 14px rgba(34,197,94,.22);
}
#netWorthStat, #incomeStat{
  color:#f8fbff !important;
}
#passiveStat, #bankValue, #repValue{
  color:#60a5fa;
  text-shadow:0 0 14px rgba(96,165,250,.18);
}

/* cartes plus premium et plus reliées au fond */
.card, .action-card, .history-item, .market-card, .goal-card, .event-card, .tutorial-card, .condition-card, .stat{
  box-shadow:
    0 0 0 1px rgba(96,165,250,.08),
    0 10px 28px rgba(0,0,0,.42),
    0 0 18px rgba(59,130,246,.06) !important;
}

/* boutons plus jeu premium */
button{
  background: linear-gradient(135deg, #1847b8 0%, #2563eb 58%, #1d4ed8 100%) !important;
  border:1px solid rgba(96,165,250,.18) !important;
  border-radius:14px !important;
  color:#fff !important;
  font-weight:700 !important;
  letter-spacing:.01em;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, border-color .18s ease !important;
}
button:hover:not(:disabled){
  transform: translateY(-2px);
  box-shadow:0 10px 24px rgba(37,99,235,.28), 0 0 18px rgba(37,99,235,.12) !important;
  filter: brightness(1.05);
  border-color: rgba(147,197,253,.30) !important;
}
button.secondary, .tab-btn{
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.78)) !important;
  color:#e6eefc !important;
}
.big-next-btn{
  background: linear-gradient(90deg, #1d4ed8 0%, #2563eb 55%, #3b82f6 100%) !important;
  box-shadow:0 16px 34px rgba(37,99,235,.24) !important;
}

/* feedback visuel simple */
.action-card, .market-card, .goal-card, .stat, .event-card{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.action-card:hover, .market-card:hover, .goal-card:hover, .stat:hover, .event-card:hover{
  transform: translateY(-4px) scale(1.008);
  box-shadow:
    0 0 0 1px rgba(96,165,250,.14),
    0 16px 34px rgba(0,0,0,.48),
    0 0 22px rgba(59,130,246,.10) !important;
}

/* meilleure hiérarchie des titres et résumés */
.section-title{
  font-size: 20px;
  font-weight: 900;
  letter-spacing: .02em;
  color:#f8fbff;
}
.summary .big{
  font-size: 34px !important;
  font-weight: 900 !important;
}
.pill{
  border-color: rgba(96,165,250,.16) !important;
  background: rgba(96,165,250,.09) !important;
  color:#dbeafe !important;
}

/* meilleure lisibilité des onglets */
.tab-btn.active{
  box-shadow: 0 10px 24px rgba(37,99,235,.20);
}

/* mobile : éviter les grossissements excessifs */
@media (max-width: 900px){
  .stat.main{
    transform:none;
  }
  .stat .value{
    font-size:24px !important;
  }
}


/* === NIVEAU 2 : GLASS + PROFONDEUR + HUD PREMIUM === */
:root{
  --glass-1: rgba(8,18,42,.72);
  --glass-2: rgba(9,20,48,.56);
  --line-strong: rgba(96,165,250,.28);
  --line-soft: rgba(148,163,184,.14);
  --glow-blue: rgba(59,130,246,.18);
}

.card, .action-card, .history-item, .market-card, .goal-card, .event-card, .tutorial-card, .condition-card, .stat{
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(8,18,42,.82), rgba(7,16,36,.74)) !important;
  border: 1px solid var(--line-soft) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 18px 38px rgba(2,8,23,.44),
    0 0 28px rgba(59,130,246,.06) !important;
  backdrop-filter: blur(12px) saturate(135%) !important;
}

.card::before, .action-card::before, .history-item::before, .market-card::before, .goal-card::before, .event-card::before, .tutorial-card::before, .condition-card::before, .stat::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg, rgba(255,255,255,.045), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(96,165,250,.10), transparent 26%);
}

.card::after, .action-card::after, .history-item::after, .market-card::after, .goal-card::after, .event-card::after, .tutorial-card::after, .condition-card::after, .stat::after{
  content:"";
  position:absolute;
  left:14px; right:14px; top:0;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(191,219,254,.36), transparent);
  pointer-events:none;
}

.tabs{
  gap:12px;
  padding: 4px 0 2px;
}
.tab-btn{
  border-radius: 16px !important;
  padding: 11px 16px !important;
  border:1px solid rgba(96,165,250,.14) !important;
}
.tab-btn.active{
  background: linear-gradient(135deg, rgba(37,99,235,.92), rgba(59,130,246,.90)) !important;
  box-shadow: 0 14px 28px rgba(37,99,235,.22), 0 0 24px rgba(96,165,250,.10) !important;
}

.section-title{
  display:flex;
  align-items:center;
  gap:10px;
  text-transform: none;
}
.section-title::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background: linear-gradient(135deg, #60a5fa, #93c5fd);
  box-shadow: 0 0 12px rgba(96,165,250,.40);
}

.summary, .journal{
  background:
    linear-gradient(180deg, rgba(8,18,42,.86), rgba(7,16,36,.76)) !important;
  border:1px solid rgba(96,165,250,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 14px 30px rgba(2,8,23,.36) !important;
}

.stats{
  gap:14px;
}
.stat{
  min-height: 104px;
}
.stat .label{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.stat.main{
  background:
    linear-gradient(180deg, rgba(9,24,58,.88), rgba(7,18,42,.80)) !important;
  border-color: var(--line-strong) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 18px 34px rgba(2,8,23,.46),
    0 0 32px rgba(59,130,246,.12) !important;
}

.controls{
  margin-top: 8px;
  padding: 14px 14px 0;
  border-top:1px solid rgba(96,165,250,.12);
}

.pill{
  backdrop-filter: blur(8px);
  border-radius: 999px !important;
}

.profile-card, .dynamic-objective-card, .level-card, .streak-card{
  background:
    linear-gradient(180deg, rgba(9,20,48,.86), rgba(7,16,36,.78)) !important;
  border:1px solid rgba(96,165,250,.16) !important;
  box-shadow: 0 18px 32px rgba(2,8,23,.34);
}

.bar{
  background: rgba(96,165,250,.08) !important;
  border-color: rgba(96,165,250,.10) !important;
}
.fill{
  box-shadow: 0 0 18px rgba(96,165,250,.24), inset 0 0 8px rgba(255,255,255,.08) !important;
}

/* Market cards become visual hero cards */
#marketPanel .market-card{
  padding-top: 126px !important;
  min-height: 292px;
  border-radius: 18px !important;
}
#marketPanel .market-card::before{
  content:"";
  position:absolute;
  left:12px; right:12px; top:12px;
  height:96px;
  border-radius:16px;
  background-size: cover;
  background-position: center;
  box-shadow:
    inset 0 0 0 1px rgba(191,219,254,.10),
    0 12px 24px rgba(2,8,23,.24);
}
#marketPanel .market-card::after{
  content:"";
  position:absolute;
  left:12px; right:12px; top:12px;
  height:96px;
  border-radius:16px;
  pointer-events:none;
  background: linear-gradient(135deg, rgba(255,255,255,.10), transparent 36%);
}
#marketPanel .market-card:nth-child(1)::before{ background-image: linear-gradient(180deg, rgba(6,14,32,.00), rgba(6,14,32,.00)), url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20800%20420%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%230c235a%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23071631%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27gl%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%270%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235eead4%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2360a5fa%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%27800%27%20height%3D%27420%27%20rx%3D%2728%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Ccircle%20cx%3D%27180%27%20cy%3D%27205%27%20r%3D%27120%27%20fill%3D%27none%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.55%29%27%20stroke-width%3D%278%27/%3E%0A%20%20%3Cellipse%20cx%3D%27180%27%20cy%3D%27205%27%20rx%3D%27120%27%20ry%3D%2746%27%20fill%3D%27none%27%20stroke%3D%27rgba%2894%2C234%2C212%2C.55%29%27%20stroke-width%3D%278%27/%3E%0A%20%20%3Cellipse%20cx%3D%27180%27%20cy%3D%27205%27%20rx%3D%2752%27%20ry%3D%27120%27%20fill%3D%27none%27%20stroke%3D%27rgba%2894%2C234%2C212%2C.40%29%27%20stroke-width%3D%278%27/%3E%0A%20%20%3Cpath%20d%3D%27M330%20270%20C410%20230%2C%20470%20240%2C%20530%20195%20S650%20120%2C%20728%20110%27%20fill%3D%27none%27%20stroke%3D%27url%28%23gl%29%27%20stroke-width%3D%2710%27%20stroke-linecap%3D%27round%27/%3E%0A%20%20%3Ccircle%20cx%3D%27728%27%20cy%3D%27110%27%20r%3D%2710%27%20fill%3D%27%2393c5fd%27/%3E%0A%20%20%3Cpath%20d%3D%27M350%20325%20L728%20325%27%20stroke%3D%27rgba%28148%2C163%2C184%2C.25%29%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Cpath%20d%3D%27M350%20325%20L350%2095%27%20stroke%3D%27rgba%28148%2C163%2C184%2C.25%29%27%20stroke-width%3D%274%27/%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(2)::before{ background-image: linear-gradient(180deg, rgba(6,14,32,.00), rgba(6,14,32,.00)), url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20800%20420%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23081a44%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23071327%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27line%27%20x1%3D%270%27%20y1%3D%271%27%20x2%3D%271%27%20y2%3D%270%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2338bdf8%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23818cf8%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%27800%27%20height%3D%27420%27%20rx%3D%2728%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Crect%20x%3D%27115%27%20y%3D%2795%27%20width%3D%27260%27%20height%3D%27185%27%20rx%3D%2722%27%20fill%3D%27rgba%2815%2C23%2C42%2C.55%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.45%29%27%20stroke-width%3D%276%27/%3E%0A%20%20%3Crect%20x%3D%27160%27%20y%3D%27140%27%20width%3D%27170%27%20height%3D%2795%27%20rx%3D%2712%27%20fill%3D%27rgba%2896%2C165%2C250%2C.10%29%27%20stroke%3D%27rgba%28129%2C140%2C248%2C.35%29%27%20stroke-width%3D%275%27/%3E%0A%20%20%3Cpath%20d%3D%27M450%20300%20L520%20230%20L570%20260%20L655%20145%20L720%20170%27%20fill%3D%27none%27%20stroke%3D%27url%28%23line%29%27%20stroke-width%3D%2712%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%0A%20%20%3Ccircle%20cx%3D%27520%27%20cy%3D%27230%27%20r%3D%2710%27%20fill%3D%27%2360a5fa%27/%3E%0A%20%20%3Ccircle%20cx%3D%27570%27%20cy%3D%27260%27%20r%3D%2710%27%20fill%3D%27%2360a5fa%27/%3E%0A%20%20%3Ccircle%20cx%3D%27655%27%20cy%3D%27145%27%20r%3D%2710%27%20fill%3D%27%23818cf8%27/%3E%0A%20%20%3Ccircle%20cx%3D%27720%27%20cy%3D%27170%27%20r%3D%2710%27%20fill%3D%27%2393c5fd%27/%3E%0A%20%20%3Cpath%20d%3D%27M480%20340%20H730%27%20stroke%3D%27rgba%28148%2C163%2C184%2C.22%29%27%20stroke-width%3D%274%27/%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(3)::before{ background-image: linear-gradient(180deg, rgba(6,14,32,.00), rgba(6,14,32,.00)), url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20800%20420%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%230a214f%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23071225%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27up%27%20x1%3D%270%27%20y1%3D%271%27%20x2%3D%271%27%20y2%3D%270%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2322d3ee%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2360a5fa%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%27800%27%20height%3D%27420%27%20rx%3D%2728%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Cpath%20d%3D%27M110%20305%20L250%20245%20L335%20270%20L455%20160%20L565%20190%20L715%2072%27%20fill%3D%27none%27%20stroke%3D%27url%28%23up%29%27%20stroke-width%3D%2714%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%0A%20%20%3Cpath%20d%3D%27M675%2072%20H715%20V112%27%20fill%3D%27none%27%20stroke%3D%27%2393c5fd%27%20stroke-width%3D%2714%27%20stroke-linecap%3D%27round%27/%3E%0A%20%20%3Crect%20x%3D%27120%27%20y%3D%27108%27%20width%3D%27110%27%20height%3D%27150%27%20rx%3D%2716%27%20fill%3D%27rgba%2815%2C23%2C42%2C.45%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.35%29%27%20stroke-width%3D%275%27/%3E%0A%20%20%3Cpath%20d%3D%27M160%20220%20L160%20150%20M135%20185%20H185%27%20stroke%3D%27%2367e8f9%27%20stroke-width%3D%2712%27%20stroke-linecap%3D%27round%27/%3E%0A%20%20%3Cpath%20d%3D%27M205%20220%20L205%20150%20M180%20185%20H230%27%20stroke%3D%27%2367e8f9%27%20stroke-width%3D%2712%27%20stroke-linecap%3D%27round%27/%3E%0A%20%20%3Cpath%20d%3D%27M250%20220%20L250%20150%20M225%20185%20H275%27%20stroke%3D%27%2367e8f9%27%20stroke-width%3D%2712%27%20stroke-linecap%3D%27round%27/%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(4)::before{ background-image: linear-gradient(180deg, rgba(6,14,32,.00), rgba(6,14,32,.00)), url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20800%20420%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%230a2154%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23071323%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27win%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2393c5fd%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2338bdf8%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%27800%27%20height%3D%27420%27%20rx%3D%2728%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Cpath%20d%3D%27M130%20315%20L245%20118%20H405%20L312%20315%20Z%27%20fill%3D%27rgba%2815%2C23%2C42%2C.66%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.48%29%27%20stroke-width%3D%276%27/%3E%0A%20%20%3Cpath%20d%3D%27M360%20315%20L450%2082%20H630%20L565%20315%20Z%27%20fill%3D%27rgba%2815%2C23%2C42%2C.52%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.42%29%27%20stroke-width%3D%276%27/%3E%0A%20%20%3Crect%20x%3D%27258%27%20y%3D%27160%27%20width%3D%2735%27%20height%3D%2742%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Crect%20x%3D%27248%27%20y%3D%27220%27%20width%3D%2745%27%20height%3D%2762%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Crect%20x%3D%27485%27%20y%3D%27124%27%20width%3D%2748%27%20height%3D%2758%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Crect%20x%3D%27548%27%20y%3D%27124%27%20width%3D%2748%27%20height%3D%2758%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Crect%20x%3D%27470%27%20y%3D%27204%27%20width%3D%2755%27%20height%3D%2778%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Crect%20x%3D%27543%27%20y%3D%27204%27%20width%3D%2755%27%20height%3D%2778%27%20fill%3D%27url%28%23win%29%27%20opacity%3D%27.85%27/%3E%0A%20%20%3Cpath%20d%3D%27M110%20322%20H650%27%20stroke%3D%27rgba%28148%2C163%2C184%2C.28%29%27%20stroke-width%3D%276%27/%3E%0A%3C/svg%3E%0A"); }

/* Action cards more premium without changing logic */
.action-card{
  min-height: 204px;
  border-radius: 18px !important;
}
.action-card .pill{
  background: rgba(37,99,235,.14) !important;
  border-color: rgba(96,165,250,.18) !important;
}
.action-card .action-meta{
  padding-top: 8px;
  border-top:1px solid rgba(96,165,250,.10);
}
.action-card button{
  border-radius: 12px !important;
}

/* Side panels more structured */
.condition-card, .tutorial-card, .event-card{
  border-radius: 18px !important;
}
#eventBox{
  min-height: 168px;
}

.history-item{
  min-height: 112px;
}

/* topbar polish */
.topbar{
  margin-bottom: 22px !important;
}
.badge{
  border-radius: 16px !important;
  padding: 10px 14px !important;
  background: linear-gradient(135deg, rgba(37,99,235,.18), rgba(147,197,253,.08)) !important;
  border:1px solid rgba(96,165,250,.18) !important;
}

/* subtle depth around whole content */
.container{
  filter: drop-shadow(0 24px 48px rgba(2,8,23,.12));
}

@media (max-width: 900px){
  #marketPanel .market-card{
    padding-top:118px !important;
    min-height: 278px;
  }
}


/* === MARCHÉS : GRAPHIQUES BOURSE DYNAMIQUES === */
.mini-chart{
  width:100%;
  height:92px;
  margin-top:12px;
  display:block;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00)),
    radial-gradient(circle at 50% 0%, rgba(96,165,250,.05), transparent 60%);
  border-radius:14px;
  overflow:visible;
}
.chart-grid{
  stroke: rgba(148,163,184,.12);
  stroke-width:1;
}
.chart-midline{
  stroke: rgba(148,163,184,.10);
  stroke-width:1;
  stroke-dasharray:4 5;
}
.chart-area{
  opacity:.16;
}
.chart-line{
  fill:none;
  stroke-width:3.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.08));
}
.chart-glow{
  fill:none;
  stroke-width:9;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.10;
}
.chart-dot{
  r:4.5;
  filter: drop-shadow(0 0 10px rgba(255,255,255,.20));
}
.chart-dot-ring{
  fill:none;
  stroke-width:2;
  opacity:.55;
}
.chart-label{
  font-size:10px;
  fill:#cbd5e1;
  opacity:.9;
}
.chart-change-badge{
  font-size:10px;
  font-weight:800;
}




/* ---- css/modules/40-gameplay-ui-components.css ---- */
/* 40-gameplay-ui-components.css — Composants liés aux marchés, immobilier, décisions, vente, stats.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */



/* === NIVEAU 3 DÉCO RÉALISTE VISIBLE === */
#marketPanel .market-card {
  position: relative;
  overflow: hidden;
  padding-top: 16px !important;
}

#marketPanel .market-card > * {
  position: relative;
  z-index: 2;
}

#marketPanel .market-card::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  opacity: .42;
  filter: saturate(112%);
  transform: scale(1.01);
}

#marketPanel .market-card::after {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(6,12,24,.46), rgba(6,12,24,.22) 28%, rgba(6,12,24,.48) 100%),
    linear-gradient(135deg, rgba(255,255,255,.06), transparent 28%);
  pointer-events: none;
}

#marketPanel .market-card:nth-child(1)::before { background-image: url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201200%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23061024%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2309172d%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3CradialGradient%20id%3D%27planet%27%20cx%3D%2734%25%27%20cy%3D%2748%25%27%20r%3D%2730%25%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%231e40af%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%2770%25%27%20stop-color%3D%27%230f2d63%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2308162f%27/%3E%0A%20%20%20%20%3C/radialGradient%3E%0A%20%20%20%20%3Cfilter%20id%3D%27soft%27%3E%3CfeGaussianBlur%20stdDeviation%3D%278%27/%3E%3C/filter%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%271200%27%20height%3D%27600%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Ccircle%20cx%3D%27310%27%20cy%3D%27315%27%20r%3D%27180%27%20fill%3D%27url%28%23planet%29%27/%3E%0A%20%20%3Cpath%20d%3D%27M190%20255%20C245%20205%20300%20185%20360%20190%20C410%20194%20452%20216%20485%20250%20C470%20272%20435%20294%20395%20302%20C360%20309%20326%20328%20294%20333%20C245%20341%20205%20314%20190%20255%20Z%27%20fill%3D%27%2334d399%27%20opacity%3D%27.62%27%20filter%3D%27url%28%23soft%29%27/%3E%0A%20%20%3Cpath%20d%3D%27M235%20370%20C280%20340%20350%20328%20420%20334%20C470%20339%20520%20358%20545%20388%20C520%20410%20470%20432%20408%20440%20C335%20449%20265%20431%20228%20400%20C214%20388%20220%20380%20235%20370%20Z%27%20fill%3D%27%2338bdf8%27%20opacity%3D%27.50%27%20filter%3D%27url%28%23soft%29%27/%3E%0A%20%20%3Cpath%20d%3D%27M610%20215%20C720%20185%20830%20188%20940%20225%20C995%20243%201040%20255%201100%20240%27%20stroke%3D%27%2393c5fd%27%20stroke-width%3D%278%27%20opacity%3D%27.45%27%20fill%3D%27none%27%20stroke-linecap%3D%27round%27/%3E%0A%20%20%3Ccircle%20cx%3D%271100%27%20cy%3D%27240%27%20r%3D%279%27%20fill%3D%27%23bfdbfe%27%20opacity%3D%27.65%27/%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(2)::before { background-image: url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201200%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23061024%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2309172d%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27rack%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2310264b%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%230a1730%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%271200%27%20height%3D%27600%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Crect%20x%3D%27130%27%20y%3D%27110%27%20width%3D%27180%27%20height%3D%27340%27%20rx%3D%2722%27%20fill%3D%27url%28%23rack%29%27%20stroke%3D%27%233b82f6%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Crect%20x%3D%27365%27%20y%3D%2792%27%20width%3D%27205%27%20height%3D%27368%27%20rx%3D%2722%27%20fill%3D%27url%28%23rack%29%27%20stroke%3D%27%2360a5fa%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Crect%20x%3D%27640%27%20y%3D%27115%27%20width%3D%27190%27%20height%3D%27335%27%20rx%3D%2722%27%20fill%3D%27url%28%23rack%29%27%20stroke%3D%27%233b82f6%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Crect%20x%3D%27900%27%20y%3D%27130%27%20width%3D%27170%27%20height%3D%27320%27%20rx%3D%2722%27%20fill%3D%27url%28%23rack%29%27%20stroke%3D%27%2360a5fa%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Cg%20opacity%3D%27.9%27%3E%0A%20%20%20%20%3Crect%20x%3D%27165%27%20y%3D%27160%27%20width%3D%27110%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%3Crect%20x%3D%27165%27%20y%3D%27203%27%20width%3D%2792%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2360a5fa%27/%3E%3Crect%20x%3D%27165%27%20y%3D%27246%27%20width%3D%27118%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%0A%20%20%20%20%3Crect%20x%3D%27402%27%20y%3D%27150%27%20width%3D%27132%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%3Crect%20x%3D%27402%27%20y%3D%27193%27%20width%3D%2798%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2360a5fa%27/%3E%3Crect%20x%3D%27402%27%20y%3D%27236%27%20width%3D%27140%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%0A%20%20%20%20%3Crect%20x%3D%27675%27%20y%3D%27165%27%20width%3D%27110%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%3Crect%20x%3D%27675%27%20y%3D%27208%27%20width%3D%27126%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2360a5fa%27/%3E%0A%20%20%20%20%3Crect%20x%3D%27935%27%20y%3D%27170%27%20width%3D%2795%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2338bdf8%27/%3E%3Crect%20x%3D%27935%27%20y%3D%27213%27%20width%3D%27105%27%20height%3D%2712%27%20rx%3D%276%27%20fill%3D%27%2360a5fa%27/%3E%0A%20%20%3C/g%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(3)::before { background-image: url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201200%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23061024%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%2309172d%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27up%27%20x1%3D%270%27%20y1%3D%271%27%20x2%3D%271%27%20y2%3D%270%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2338bdf8%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%234ade80%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%271200%27%20height%3D%27600%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Crect%20x%3D%27120%27%20y%3D%27110%27%20width%3D%27420%27%20height%3D%27250%27%20rx%3D%2724%27%20fill%3D%27rgba%2815%2C23%2C42%2C.56%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.4%29%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Crect%20x%3D%27600%27%20y%3D%27140%27%20width%3D%27470%27%20height%3D%27220%27%20rx%3D%2724%27%20fill%3D%27rgba%2815%2C23%2C42%2C.52%29%27%20stroke%3D%27rgba%2896%2C165%2C250%2C.34%29%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Cg%20opacity%3D%27.28%27%20stroke%3D%27%2394a3b8%27%20stroke-width%3D%272%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M155%20315%20H505%27/%3E%3Cpath%20d%3D%27M155%20260%20H505%27/%3E%3Cpath%20d%3D%27M155%20205%20H505%27/%3E%0A%20%20%20%20%3Cpath%20d%3D%27M635%20315%20H1035%27/%3E%3Cpath%20d%3D%27M635%20260%20H1035%27/%3E%3Cpath%20d%3D%27M635%20205%20H1035%27/%3E%0A%20%20%3C/g%3E%0A%20%20%3Cpath%20d%3D%27M165%20310%20L225%20278%20L288%20286%20L356%20218%20L422%20242%20L490%20158%27%20fill%3D%27none%27%20stroke%3D%27url%28%23up%29%27%20stroke-width%3D%2712%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%0A%20%20%3Cpath%20d%3D%27M650%20300%20L725%20306%20L792%20242%20L868%20252%20L940%20180%20L1015%20198%27%20fill%3D%27none%27%20stroke%3D%27%2360a5fa%27%20stroke-width%3D%2710%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%0A%20%20%3Ccircle%20cx%3D%27490%27%20cy%3D%27158%27%20r%3D%2710%27%20fill%3D%27%2386efac%27/%3E%0A%20%20%3Ccircle%20cx%3D%27940%27%20cy%3D%27180%27%20r%3D%2710%27%20fill%3D%27%2393c5fd%27/%3E%0A%3C/svg%3E%0A"); }
#marketPanel .market-card:nth-child(4)::before { background-image: url("data:image/svg+xml;utf8,%0A%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201200%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27bg%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%2308162f%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%230a1324%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27floor%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%231e293b%27/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%230f172a%27/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Crect%20width%3D%271200%27%20height%3D%27600%27%20fill%3D%27url%28%23bg%29%27/%3E%0A%20%20%3Crect%20x%3D%270%27%20y%3D%27390%27%20width%3D%271200%27%20height%3D%27210%27%20fill%3D%27url%28%23floor%29%27/%3E%0A%20%20%3Crect%20x%3D%2790%27%20y%3D%2790%27%20width%3D%27350%27%20height%3D%27210%27%20rx%3D%2728%27%20fill%3D%27rgba%2896%2C165%2C250%2C.08%29%27%20stroke%3D%27rgba%28147%2C197%2C253%2C.28%29%27%20stroke-width%3D%274%27/%3E%0A%20%20%3Crect%20x%3D%27130%27%20y%3D%27130%27%20width%3D%27270%27%20height%3D%27130%27%20rx%3D%2718%27%20fill%3D%27rgba%2896%2C165%2C250%2C.20%29%27/%3E%0A%20%20%3Crect%20x%3D%27640%27%20y%3D%27312%27%20width%3D%27305%27%20height%3D%27110%27%20rx%3D%2724%27%20fill%3D%27rgba%28148%2C163%2C184%2C.22%29%27/%3E%0A%20%20%3Crect%20x%3D%27675%27%20y%3D%27275%27%20width%3D%27110%27%20height%3D%2758%27%20rx%3D%2718%27%20fill%3D%27rgba%28148%2C163%2C184%2C.28%29%27/%3E%0A%20%20%3Crect%20x%3D%27205%27%20y%3D%27348%27%20width%3D%27165%27%20height%3D%2760%27%20rx%3D%2716%27%20fill%3D%27rgba%2859%2C130%2C246%2C.24%29%27/%3E%0A%20%20%3Crect%20x%3D%27110%27%20y%3D%27315%27%20width%3D%2782%27%20height%3D%2795%27%20rx%3D%2718%27%20fill%3D%27rgba%28148%2C163%2C184%2C.18%29%27/%3E%0A%20%20%3Crect%20x%3D%27990%27%20y%3D%27155%27%20width%3D%2786%27%20height%3D%27250%27%20rx%3D%2718%27%20fill%3D%27rgba%2896%2C165%2C250%2C.12%29%27%20stroke%3D%27rgba%28147%2C197%2C253%2C.20%29%27/%3E%0A%20%20%3Crect%20x%3D%271000%27%20y%3D%27172%27%20width%3D%2766%27%20height%3D%2762%27%20rx%3D%2710%27%20fill%3D%27rgba%28191%2C219%2C254%2C.30%29%27/%3E%0A%20%20%3Crect%20x%3D%271000%27%20y%3D%27246%27%20width%3D%2766%27%20height%3D%2762%27%20rx%3D%2710%27%20fill%3D%27rgba%28191%2C219%2C254%2C.18%29%27/%3E%0A%20%20%3Crect%20x%3D%271000%27%20y%3D%27320%27%20width%3D%2766%27%20height%3D%2774%27%20rx%3D%2710%27%20fill%3D%27rgba%28191%2C219%2C254%2C.12%29%27/%3E%0A%3C/svg%3E%0A"); }

#marketPanel .market-card .pill {
  background: rgba(6,12,24,.58) !important;
  border-color: rgba(96,165,250,.22) !important;
  backdrop-filter: blur(6px);
}

#marketPanel .market-card .small,
#marketPanel .market-card div[style*="font-weight:800"] {
  text-shadow: 0 2px 10px rgba(2,8,23,.35);
}


/* === IMMOBILIER RÉALISTE === */
.loan-table{
  width:100%;
  border-collapse:collapse;
  margin-top:12px;
  font-size:13px;
}
.loan-table th,
.loan-table td{
  padding:10px 8px;
  text-align:right;
  border-bottom:1px solid rgba(148,163,184,.12);
}
.loan-table th:first-child,
.loan-table td:first-child{
  text-align:left;
}
.loan-table th{
  color:#cbd5e1;
  font-weight:700;
  background:rgba(255,255,255,.02);
}
.loan-table td{
  color:#e6eefc;
}
.loan-empty{
  margin-top:12px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.03);
  color:#cbd5e1;
}


/* === GUIDAGE DÉCISION EN ATTENTE === */
.tab-btn.attention-tab{
  position: relative;
  border-color: rgba(251,191,36,.45) !important;
  box-shadow: 0 0 0 1px rgba(251,191,36,.18) inset, 0 0 22px rgba(251,191,36,.18);
  animation: pendingTabPulse 1.2s ease-in-out infinite;
}
.tab-btn.attention-tab::after{
  content: "Décision";
  position: absolute;
  top: -10px;
  right: -8px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
  color: #111827;
  background: linear-gradient(90deg, #fbbf24, #fde68a);
  box-shadow: 0 8px 18px rgba(251,191,36,.24);
}
.pending-decision-banner{
  display:none;
  margin-top:12px;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(251,191,36,.34);
  background:linear-gradient(135deg, rgba(251,191,36,.16), rgba(245,158,11,.10));
  color:#fef3c7;
  box-shadow:0 16px 34px rgba(251,191,36,.10);
}
.pending-decision-banner.show{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.pending-decision-banner strong{
  color:#fff;
  display:block;
  margin-bottom:3px;
}
.pending-decision-banner .small{
  color:#fde68a !important;
}
.pending-decision-banner button{
  flex:0 0 auto;
}
@keyframes pendingTabPulse{
  0%,100%{ transform: translateY(0); box-shadow: 0 0 0 1px rgba(251,191,36,.14) inset, 0 0 16px rgba(251,191,36,.10); }
  50%{ transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(251,191,36,.26) inset, 0 0 28px rgba(251,191,36,.24); }
}


    .special-spotlight-overlay{
      position: fixed;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(2,8,23,.66);
      backdrop-filter: blur(6px);
      z-index: 12050;
    }
    .special-spotlight-overlay.show{
      display: flex;
      animation: overlayFadeIn .22s ease;
    }
    .special-spotlight-card{
      width: min(760px, 94vw);
      padding: 30px 28px 24px;
      border-radius: 28px;
      border: 1px solid rgba(148,163,184,.18);
      background: linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.92));
      box-shadow: 0 36px 100px rgba(2,8,23,.62);
      text-align: center;
      color: #f8fbff;
      transform: scale(.94) translateY(10px);
      animation: spotlightPop .26s cubic-bezier(.2,.8,.2,1) forwards;
    }
    .special-spotlight-card.game{
      border-color: rgba(251,191,36,.32);
      box-shadow: 0 36px 100px rgba(251,191,36,.16);
    }
    .special-spotlight-card.fun{
      border-color: rgba(96,165,250,.30);
      box-shadow: 0 36px 100px rgba(96,165,250,.16);
    }
    .special-spotlight-kicker{
      display: inline-block;
      padding: 7px 12px;
      border-radius: 999px;
      margin-bottom: 14px;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
      border: 1px solid rgba(148,163,184,.16);
      background: rgba(148,163,184,.08);
      color: #dbeafe;
    }
    .special-spotlight-card.game .special-spotlight-kicker{
      background: rgba(251,191,36,.12);
      border-color: rgba(251,191,36,.24);
      color: #fde68a;
    }
    .special-spotlight-card.fun .special-spotlight-kicker{
      background: rgba(96,165,250,.12);
      border-color: rgba(96,165,250,.24);
      color: #bfdbfe;
    }
    .special-spotlight-icon{
      font-size: 64px;
      line-height: 1;
      margin-bottom: 12px;
      filter: drop-shadow(0 0 18px rgba(255,255,255,.12));
    }
    .special-spotlight-title{
      font-size: 34px;
      font-weight: 900;
      margin-bottom: 10px;
      color: #ffffff;
    }
    .special-spotlight-text{
      font-size: 18px;
      line-height: 1.6;
      color: #dbeafe;
      white-space: pre-line;
    }
    @keyframes spotlightPop{
      from { opacity: 0; transform: scale(.90) translateY(14px); }
      to { opacity: 1; transform: scale(1) translateY(0); }
    }


/* === VENTE IMMOBILIÈRE === */
.sale-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
.sale-property-card{
  border:1px solid rgba(148,163,184,.16);
  border-radius:16px;
  padding:16px;
  background:linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.78));
  box-shadow:0 14px 34px rgba(2,8,23,.18);
}
.sale-property-title{
  font-size:18px;
  font-weight:800;
  color:#fff;
  margin-bottom:8px;
}
.sale-property-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 12px;
  margin-top:10px;
}
.sale-metric{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.03);
}
.sale-metric-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#94a3b8;
  margin-bottom:4px;
}
.sale-metric-value{
  font-size:16px;
  font-weight:800;
  color:#fff;
}
.sale-property-actions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin-top:14px;
  flex-wrap:wrap;
}
.sale-net-positive{ color:#22c55e; }
.sale-net-negative{ color:#ef4444; }
.sale-empty{
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(255,255,255,.03);
  color:#cbd5e1;
}
@media (max-width: 900px){
  .sale-grid{ grid-template-columns:1fr; }
}


/* Fix simple et ciblé pour les stats du haut */
.stat .value{
  font-size: 19px;
  font-weight: 800;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2px;
}
.stat .value .unit{
  font-size: 12px;
  opacity: .9;
}


.mobile-orientation-overlay{
  position:fixed;
  left:12px;
  right:12px;
  bottom:84px;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  text-align:center;
  z-index:12050;
  background:transparent;
  color:#fff;
  pointer-events:none;
}
.mobile-orientation-overlay.show{ display:flex; }
.mobile-orientation-card{
  max-width:560px;
  width:min(560px, calc(100vw - 24px));
  border-radius:18px;
  padding:14px 16px;
  background:linear-gradient(180deg, rgba(15,23,42,.96), rgba(15,23,42,.90));
  border:1px solid rgba(96,165,250,.22);
  box-shadow:0 18px 40px rgba(2,8,23,.34);
}
.mobile-orientation-title{
  font-size:16px;
  font-weight:800;
  margin-bottom:6px;
}
.mobile-orientation-text{
  color:#cbd5e1;
  font-size:12px;
  line-height:1.45;
}
@media (min-width: 901px){
  .mobile-orientation-overlay{ display:none !important; }
}



/* ---- css/modules/50-main-screen-fit.css ---- */
/* 50-main-screen-fit.css — Ajustements écran principal, responsive et fitting écran.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */


/* ==========================================================================
   PRO STEP 1 — Ajustement écran principal
   Objectif : supprimer le scroll de la page principale sans changer le design.
   Principe : on garde le design original et on ajuste uniquement l'échelle du
   conteneur principal. Les popups restent en position fixed et gardent leur
   propre scroll interne si leur contenu dépasse l'écran.
   ========================================================================== */

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#gameRoot {
  --game-scale: 1;
  transform: scale(var(--game-scale));
  transform-origin: top center;
  will-change: transform;
}

.intro-card,
.victory-card,
.month-event-modal,
.event-splash-card,
.special-spotlight-card {
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.month-event-modal,
.event-splash-card,
.special-spotlight-card {
  scrollbar-width: thin;
}


/* ==========================================================================
   PRO STEP 2 — Mise en page professionnelle sans miniaturisation
   Objectif : supprimer la réduction d'échelle et organiser le jeu comme une
   vraie interface d'application. Le fond, les couleurs, les composants et le
   gameplay restent inchangés ; seuls les flux d'affichage sont réorganisés.
   ========================================================================== */

html,
body {
  width: 100%;
  height: 100%;
  min-height: 100dvh;
  overflow: hidden;
}

body {
  font-size: 15px;
}

#gameRoot.container {
  --game-scale: 1 !important;
  transform: none !important;
  transform-origin: initial !important;
  width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  max-width: 1560px;
  margin: 0 auto;
  padding: clamp(10px, 1vw, 16px);
  display: grid;
  grid-template-rows: auto minmax(330px, 45vh) auto minmax(0, 1fr);
  gap: 10px;
  overflow: hidden;
}

#gameRoot > * {
  min-width: 0;
}

.topbar {
  margin-bottom: 0 !important;
  align-items: center;
}

h1 {
  margin-bottom: 4px;
  font-size: clamp(28px, 2.1vw, 34px);
  line-height: 1.05;
}

.subtitle {
  font-size: 14px;
  line-height: 1.25;
}

.badge {
  flex: 0 0 auto;
}

.layout {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(350px, .88fr);
  gap: 12px;
  overflow: hidden;
}

.layout > .card {
  min-height: 0;
  overflow: hidden;
  padding: 14px;
}

.layout > .card:first-child {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
  grid-auto-rows: max-content;
  align-content: start;
  gap: 10px 12px;
}

.layout > .card:first-child > .stats,
.layout > .card:first-child > .controls,
.layout > .card:first-child > .month-actions {
  grid-column: 1 / -1;
}

.stats {
  margin-bottom: 0;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.stat {
  padding: 11px 12px;
  min-height: 72px;
}

.stat .label {
  font-size: 12px;
  line-height: 1.2;
}

.stat .value {
  justify-content: flex-start !important;
  font-size: clamp(18px, 1.35vw, 22px) !important;
  line-height: 1.05;
  letter-spacing: -.5px;
}

.stat .value .unit {
  font-size: 13px;
}

.controls {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) repeat(2, minmax(150px, auto)) minmax(230px, 1.1fr) repeat(3, minmax(132px, auto));
  gap: 8px;
  align-items: end;
}

.controls > div:first-child {
  min-width: 0;
}

select,
button {
  min-height: 40px;
}

select {
  width: 100%;
  min-width: 0;
}

.controls button {
  padding: 9px 12px;
  white-space: nowrap;
}

.sticky-cta {
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;
}

.big-next-btn {
  padding: 11px 14px;
  min-height: 46px;
  border-radius: 15px;
}

.month-actions {
  margin-top: 0;
  gap: 8px;
}

.month-actions .pill {
  margin-bottom: 0;
}

#advisorBox {
  grid-column: 1;
  grid-row: auto;
  margin-top: 0 !important;
  min-height: 0;
}

.profile-card {
  grid-column: 2;
  margin-top: 0;
}

.onboard-dock {
  grid-column: 2;
  margin-top: 0;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: 142px;
  overflow: auto;
  padding-right: 2px;
}

.onboard-pill {
  padding: 10px 12px;
}

.journal {
  grid-column: 1;
  margin-top: 0;
  min-height: 108px;
  max-height: 178px;
  overflow: auto;
  align-self: stretch;
}

#statusBox {
  grid-column: 1;
  min-height: 0;
  overflow: auto;
}

.goals-grid {
  grid-column: 2;
  margin-top: 0;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: 180px;
  overflow: auto;
  padding-right: 2px;
}

.goal-card {
  padding: 12px;
}

.layout > .card:nth-child(2) {
  display: grid;
  grid-template-rows: auto repeat(5, auto) minmax(0, 1fr) auto;
  gap: 8px;
}

.layout > .card:nth-child(2) .section-title {
  margin-bottom: 0;
}

.progress-row {
  margin-bottom: 0;
}

.progress-head {
  font-size: 12px;
  margin-bottom: 5px;
}

.summary {
  padding: 12px;
  font-size: 13px;
  line-height: 1.35;
  overflow: auto;
  min-height: 0;
}

.summary .big {
  font-size: 28px;
}

.level-card {
  margin-top: 0;
  padding: 12px;
}

.conditions-grid {
  margin-top: 0;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  min-height: 0;
  overflow: hidden;
}

.condition-card {
  padding: 12px;
  min-height: 0;
  overflow: auto;
}

#tutorialWrap {
  display: none !important;
}

.tabs {
  min-height: 44px;
  margin: 0 !important;
  gap: 8px;
  align-items: center;
  overflow-x: auto;
  flex-wrap: nowrap;
  scrollbar-width: thin;
}

.tab-btn {
  flex: 0 0 auto;
  padding: 9px 13px;
  border-radius: 12px;
}

.pending-decision-banner {
  min-height: 0;
  margin: 0;
}

.panel {
  min-height: 0;
  height: 100%;
  overflow: auto;
  padding-right: 2px;
  scrollbar-width: thin;
}

.panel.active {
  display: block;
}

#actionsPanel.active,
#marketPanel.active,
#portfolioPanel.active,
#historyPanel.active,
#guidePanel.active {
  height: 100%;
}

.actions-grid {
  grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
  gap: 12px;
  align-content: start;
}

.action-card {
  padding: 14px;
}

.action-card h3,
.action-card h4 {
  margin-top: 0;
}

.market-grid,
.goals-grid,
.tutorial-grid,
.history-list {
  gap: 10px;
}

.market-grid {
  grid-template-columns: repeat(4, minmax(220px, 1fr));
}

.subgrid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

#portfolioPanel .card,
#guidePanel .card,
#actionsPanel > .card {
  overflow: auto;
}

#loanTableWrap {
  max-height: 230px;
  overflow: auto;
}

.intro-card,
.victory-card,
.month-event-modal,
.event-splash-card,
.special-spotlight-card {
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Scrollbar discrète, gardée dans l'esthétique bleue existante */
#gameRoot *::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

#gameRoot *::-webkit-scrollbar-track {
  background: rgba(148,163,184,.08);
  border-radius: 999px;
}

#gameRoot *::-webkit-scrollbar-thumb {
  background: rgba(96,165,250,.32);
  border-radius: 999px;
}

#gameRoot *::-webkit-scrollbar-thumb:hover {
  background: rgba(96,165,250,.46);
}

@media (max-width: 1280px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(330px, 48vh) auto minmax(0, 1fr);
  }

  .layout {
    grid-template-columns: minmax(0, 1.45fr) minmax(330px, .9fr);
  }

  .controls {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sticky-cta {
    grid-column: span 2;
  }

  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .stat {
    min-height: 66px;
  }
}

@media (max-width: 1024px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(360px, 50vh) auto minmax(0, 1fr);
  }

  .layout {
    grid-template-columns: 1fr;
  }

  .layout > .card:nth-child(2) {
    display: none;
  }

  .layout > .card:first-child {
    grid-template-columns: 1fr 1fr;
  }

  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .controls {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  body {
    padding-bottom: 0 !important;
  }

  #gameRoot.container {
    padding: 8px;
    grid-template-rows: auto minmax(260px, 52vh) auto minmax(0, 1fr);
    gap: 8px;
  }

  .topbar {
    flex-direction: row;
    gap: 8px;
  }

  h1 {
    font-size: 22px;
  }

  .subtitle,
  .badge,
  .mobile-hero,
  .onboard-dock {
    display: none !important;
  }

  .layout > .card:first-child {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .profile-card,
  #advisorBox,
  .journal,
  #statusBox,
  .goals-grid {
    grid-column: 1;
  }

  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .stat {
    padding: 8px;
    min-height: 58px;
  }

  .stat .label {
    font-size: 10px;
  }

  .stat .value {
    font-size: 16px !important;
  }

  .controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .controls button,
  select {
    min-height: 38px;
    padding: 8px 9px;
    font-size: 13px;
  }

  .month-actions,
  .profile-card,
  .journal,
  .goals-grid {
    display: none !important;
  }

  .tabs {
    display: none;
  }

  .mobile-bottom-nav {
    display: grid;
    position: static;
    grid-row: 3;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(148,163,184,.12);
    background: rgba(8,16,29,.92);
    padding-bottom: 0;
  }

  .mobile-bottom-nav button {
    min-height: 40px;
  }

  .actions-grid,
  .market-grid,
  .goals-grid,
  .subgrid,
  .history-list,
  .conditions-grid,
  .tutorial-grid,
  .choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) and (orientation: portrait) {
  #gameRoot.container {
    grid-template-rows: auto minmax(300px, 48vh) auto minmax(0, 1fr);
  }

  .actions-grid,
  .market-grid,
  .subgrid,
  .history-list,
  .conditions-grid,
  .tutorial-grid,
  .choices {
    grid-template-columns: 1fr;
  }
}

@media (max-height: 720px) and (min-width: 901px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(300px, 46vh) auto minmax(0, 1fr);
    gap: 8px;
  }

  .subtitle {
    display: none;
  }

  h1 {
    font-size: 26px;
  }

  .layout > .card {
    padding: 12px;
  }

  .controls button,
  select {
    min-height: 38px;
  }

  .journal {
    max-height: 130px;
  }

  .onboard-dock,
  .goals-grid {
    max-height: 128px;
  }
}



/* ---- css/modules/60-flow-and-toolbar.css ---- */
/* 60-flow-and-toolbar.css — Corrections de flux, toolbar, commandes principales.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* PRO STEP 2.1 — Corrections de flux : aucune zone fonctionnelle ne doit casser la grille */
#gameRoot > .topbar { grid-row: 1; }
#gameRoot > .layout { grid-row: 2; }
#gameRoot > .tabs { grid-row: 3; }
#gameRoot > .panel { grid-row: 4; }

.pending-decision-banner.show {
  position: fixed;
  left: 50%;
  bottom: 72px;
  width: min(720px, calc(100vw - 32px));
  transform: translateX(-50%);
  z-index: 15050;
  margin: 0 !important;
}

#tutorialWrap[style*="display: block"],
#tutorialWrap[style*="display:block"] {
  display: block !important;
  position: fixed !important;
  inset: 72px max(20px, calc((100vw - 1180px) / 2)) 72px !important;
  z-index: 15040;
  margin: 0 !important;
  max-height: calc(100dvh - 144px);
  overflow: auto;
}

#tutorialWrap[style*="display: none"],
#tutorialWrap[style*="display:none"] {
  display: none !important;
}

@media (max-width: 900px) {
  #gameRoot.container {
    padding-bottom: 62px;
  }

  .mobile-bottom-nav {
    display: grid;
    position: fixed !important;
    left: 8px;
    right: 8px;
    bottom: max(8px, env(safe-area-inset-bottom));
    z-index: 11000;
    grid-template-columns: repeat(6, 1fr);
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(148,163,184,.12);
    background: rgba(8,16,29,.96);
    padding-bottom: 0;
  }

  #tutorialWrap[style*="display: block"],
  #tutorialWrap[style*="display:block"] {
    inset: 12px 12px 72px 12px !important;
    max-height: calc(100dvh - 84px);
  }
}

/* ==========================================================================
   PRO STEP 3 — Base stable lisible + récupération d'espace
   Objectif : garder la Step 2 comme base, mais libérer la ligne de commandes
   sans miniaturiser le jeu. Les commandes audio passent dans le haut d'écran,
   le bouton tuto redondant est retiré de la zone principale, et la grille des
   commandes est simplifiée pour une lecture plus professionnelle.
   ========================================================================== */

.topbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center !important;
  gap: 14px;
}

.topbar-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}

.audio-dock {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,.14);
  background: rgba(15,23,42,.58);
  box-shadow: 0 10px 22px rgba(2,8,23,.16);
}

.utility-btn {
  min-height: 32px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

#gameRoot.container {
  grid-template-rows: auto minmax(390px, 52vh) auto minmax(0, 1fr);
}

.controls {
  grid-template-columns: minmax(220px, .9fr) minmax(145px, .55fr) minmax(260px, 1.15fr) minmax(145px, .55fr) !important;
  align-items: end;
}

.controls .sticky-cta {
  grid-column: auto !important;
}

.controls button,
.controls select {
  font-size: 14px;
}

.big-next-btn {
  min-height: 48px;
  font-size: 15px;
}

.layout > .card:first-child {
  grid-template-columns: minmax(0, 1.36fr) minmax(320px, .64fr);
}

#advisorBox,
.profile-card,
.journal,
.onboard-dock,
.goals-grid {
  border-radius: 16px;
}

#advisorBox .dynamic-objective-text {
  font-size: clamp(18px, 1.25vw, 22px);
  line-height: 1.15;
}

.journal {
  max-height: 210px;
}

.goals-grid {
  max-height: 210px;
}

.tabs {
  justify-content: center;
}

.tab-btn {
  min-width: 132px;
  text-align: center;
}

.panel {
  padding-bottom: 2px;
}

#actionsPanel > .card {
  padding: 14px;
}

@media (max-width: 1280px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(380px, 53vh) auto minmax(0, 1fr);
  }

  .controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .controls .sticky-cta {
    grid-column: span 2 !important;
  }
}

@media (max-width: 1024px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(380px, 52vh) auto minmax(0, 1fr);
  }

  .topbar {
    grid-template-columns: 1fr;
  }

  .topbar-tools {
    justify-content: space-between;
  }
}

@media (max-width: 900px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(285px, 52vh) auto minmax(0, 1fr);
  }

  .topbar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .topbar-tools {
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
  }

  .audio-dock {
    gap: 4px;
    padding: 3px;
  }

  .utility-btn {
    min-height: 28px !important;
    padding: 5px 8px !important;
    font-size: 11px !important;
  }

  .controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .controls .sticky-cta {
    grid-column: span 2 !important;
  }

  .controls button,
  .controls select {
    font-size: 13px;
  }
}

@media (max-height: 720px) and (min-width: 901px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(340px, 50vh) auto minmax(0, 1fr);
  }

  .journal,
  .goals-grid {
    max-height: 160px;
  }
}



/* ---- css/modules/70-commercial-layout.css ---- */
/* 70-commercial-layout.css — Interface commercialisable, objectifs dédiés et écran allégé.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* ==========================================================================
   PRO STEP 4 — Interface commercialisable : objectifs dédiés + écran allégé
   Objectif : récupérer de la place sans miniaturiser, déplacer les fonctions
   secondaires, clarifier les objectifs et donner un rendu plus produit fini.
   ========================================================================== */

#gameRoot.container {
  grid-template-rows: auto minmax(390px, 54vh) auto minmax(0, 1fr) !important;
}

.controls {
  grid-template-columns: minmax(230px, 1fr) minmax(160px, .55fr) minmax(280px, 1.25fr) !important;
  gap: 10px !important;
}

.controls .sticky-cta {
  grid-column: auto !important;
}

.layout {
  grid-template-columns: minmax(0, 1.66fr) minmax(340px, .84fr) !important;
}

.layout > .card:first-child {
  grid-template-columns: minmax(0, 1.42fr) minmax(310px, .58fr) !important;
  gap: 10px 12px !important;
}

#advisorBox {
  grid-column: 1 !important;
}

.objective-preview {
  grid-column: 1 !important;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(251,191,36,.22);
  background: linear-gradient(135deg, rgba(251,191,36,.12), rgba(96,165,250,.08));
  box-shadow: 0 14px 34px rgba(2,8,23,.20);
  min-height: 106px;
}

.objective-preview-title {
  font-size: clamp(18px, 1.15vw, 22px);
  font-weight: 900;
  color: #fff;
  line-height: 1.15;
}

.objective-preview-sub {
  margin-top: 5px;
  color: #cbd5e1;
  font-size: 13px;
}

.objective-open-btn {
  margin-top: 10px;
  min-height: 34px !important;
  padding: 7px 10px !important;
  font-size: 12px !important;
}

.profile-card {
  grid-column: 2 !important;
}

.command-center-card {
  grid-column: 2 !important;
  margin-top: 0;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(96,165,250,.18);
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.76));
  box-shadow: 0 14px 34px rgba(2,8,23,.22);
}

.command-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid rgba(148,163,184,.10);
}

.command-line:last-of-type {
  border-bottom: 0;
}

.command-line span {
  color: #94a3b8;
  font-size: 12px;
}

.command-line strong {
  color: #fff;
  text-align: right;
  font-size: 13px;
}

.journal {
  grid-column: 1 !important;
  max-height: 190px !important;
}

#statusBox {
  grid-column: 2 !important;
  max-height: 190px;
  overflow: auto;
}

#statusBox .alert {
  margin-top: 0;
}

.layout > .card:nth-child(2) {
  grid-template-rows: auto repeat(5, auto) minmax(0, 1fr) auto auto !important;
}

.risk-card {
  margin-top: 0;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(96,165,250,.16);
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.74));
  overflow: hidden;
}

.risk-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.risk-mini-grid > div,
.objective-kpi {
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,.12);
  background: rgba(148,163,184,.06);
  min-width: 0;
}

.risk-mini-grid span,
.objective-kpi span {
  display: block;
  color: #94a3b8;
  font-size: 11px;
  margin-bottom: 4px;
}

.risk-mini-grid strong,
.objective-kpi strong {
  color: #fff;
  font-size: 15px;
}

.tab-btn[data-tab="objectivesPanel"] {
  border-color: rgba(251,191,36,.22);
}

#objectivesPanel.active {
  height: 100%;
}

.objectives-pro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
  gap: 12px;
  min-height: 100%;
}

.objective-master-card,
.objective-rules-card {
  min-height: 0;
  overflow: auto;
}

.objectives-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.goals-grid-panel {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
  gap: 10px !important;
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

.pro-conditions-grid {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  overflow: visible !important;
}

.objective-note {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(96,165,250,.18);
  background: rgba(96,165,250,.08);
  color: #dbeafe;
  font-size: 13px;
  line-height: 1.45;
}

.guide-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(148,163,184,.12);
  background: rgba(15,23,42,.58);
}

.reset-btn {
  flex: 0 0 auto;
  border-color: rgba(239,68,68,.24) !important;
}

.guide-onboard-dock {
  margin: 0 0 12px 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  max-height: none !important;
  overflow: visible !important;
}

.mobile-bottom-nav {
  grid-template-columns: repeat(7, 1fr) !important;
}

.mobile-bottom-nav button {
  min-width: 0;
}

@media (max-width: 1280px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(380px, 55vh) auto minmax(0, 1fr) !important;
  }

  .controls {
    grid-template-columns: minmax(220px, 1fr) minmax(150px, .65fr) minmax(260px, 1.15fr) !important;
  }

  .objectives-kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .goals-grid-panel {
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  }
}

@media (max-width: 1024px) {
  .layout {
    grid-template-columns: 1fr !important;
  }

  .layout > .card:first-child {
    grid-template-columns: 1fr 1fr !important;
  }

  .objectives-pro-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(310px, 54vh) auto minmax(0, 1fr) !important;
  }

  .controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .controls .sticky-cta {
    grid-column: 1 / -1 !important;
  }

  .layout > .card:first-child {
    grid-template-columns: 1fr !important;
  }

  #advisorBox,
  .objective-preview,
  .profile-card,
  .command-center-card,
  .journal,
  #statusBox {
    grid-column: 1 !important;
  }

  .goals-grid-panel,
  .guide-onboard-dock {
    grid-template-columns: 1fr !important;
  }

  .objectives-kpi-row,
  .risk-mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mobile-bottom-nav button {
    font-size: 10.5px !important;
    padding-inline: 3px !important;
  }
}

@media (max-height: 720px) and (min-width: 901px) {
  #gameRoot.container {
    grid-template-rows: auto minmax(350px, 52vh) auto minmax(0, 1fr) !important;
  }

  .objective-preview {
    min-height: 96px;
  }

  .journal,
  #statusBox {
    max-height: 160px !important;
  }
}



/* ---- css/modules/80-new-game-and-pilotage.css ---- */
/* 80-new-game-and-pilotage.css — Sécurité nouvelle partie et onglet Pilotage.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* ==========================================================================
   PRO STEP 5 — Sécurité nouvelle partie + onglet Pilotage
   Objectif : supprimer la réinitialisation visible, protéger la progression,
   et déplacer le diagnostic stratégique hors de l'écran principal.
   ========================================================================== */

.confirm-overlay {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(2,8,23,.68);
  backdrop-filter: blur(6px);
  z-index: 22000;
}

.confirm-overlay.show {
  display: flex;
  animation: overlayFadeIn .22s ease;
}

.confirm-card {
  width: min(520px, calc(100vw - 32px));
  padding: 24px;
  border-radius: 24px;
  border: 1px solid rgba(239,68,68,.26);
  background: linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.91));
  box-shadow: 0 30px 90px rgba(2,8,23,.56);
  color: #eef4ff;
  text-align: center;
  animation: modalPop .28s cubic-bezier(.2,.8,.2,1) forwards;
}

.confirm-kicker {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(239,68,68,.12);
  border: 1px solid rgba(239,68,68,.22);
  color: #fecaca;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.confirm-card h2 {
  margin: 12px 0 8px;
  font-size: 28px;
  line-height: 1.1;
  color: #fff;
}

.confirm-card p {
  margin: 0;
  color: #cbd5e1;
  line-height: 1.55;
}

.confirm-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 18px;
}

.danger-btn {
  background: linear-gradient(180deg, rgba(239,68,68,.95), rgba(127,29,29,.95)) !important;
  border-color: rgba(248,113,113,.28) !important;
}

.tab-btn[data-tab="pilotagePanel"] {
  border-color: rgba(34,211,238,.22);
}

#pilotagePanel.active {
  height: 100%;
}

.pilotage-pro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: 12px;
  min-height: 100%;
  align-items: start;
}

.pilotage-main-column,
.pilotage-side-column {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
}

#pilotagePanel #advisorBox,
#pilotagePanel .profile-card,
#pilotagePanel .command-center-card,
#pilotagePanel .pilotage-help-card {
  grid-column: auto !important;
  margin-top: 0 !important;
}

#pilotagePanel #advisorBox,
#pilotagePanel .command-center-card,
#pilotagePanel .profile-card,
.pilotage-help-card {
  min-height: 0;
  overflow: auto;
}

#pilotagePanel #advisorBox .dynamic-objective-text {
  font-size: clamp(20px, 1.45vw, 26px);
}

#pilotagePanel .command-center-card {
  padding: 16px;
}

.pilotage-help-card {
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(96,165,250,.16);
  background: linear-gradient(180deg, rgba(15,23,42,.92), rgba(15,23,42,.74));
  box-shadow: 0 14px 34px rgba(2,8,23,.22);
}

.guide-toolbar {
  justify-content: flex-start;
}

.reset-btn {
  display: none !important;
}

@media (max-width: 1024px) {
  .pilotage-pro-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .confirm-actions {
    grid-template-columns: 1fr;
  }

  #mobileBottomNav.mobile-bottom-nav {
    grid-template-columns: repeat(7, 1fr) !important;
  }
}




/* ---- css/modules/90-objectives-and-progress.css ---- */
/* 90-objectives-and-progress.css — Objectif prioritaire, progression nettoyée, cartes objectifs.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* ========================================================================== 
   PRO STEP 6 — Objectif prioritaire déplacé dans l’onglet Objectifs
   Objectif : libérer l'écran central sans réduire les textes ni toucher au gameplay.
   ========================================================================== */

.objective-priority-panel {
  grid-column: 1 / -1 !important;
  margin-bottom: 12px;
  min-height: auto;
}

#objectivesPanel .objective-preview-title {
  font-size: clamp(20px, 1.35vw, 26px);
}

#objectivesPanel .objective-preview-sub {
  font-size: 14px;
}

.layout > .card:first-child {
  align-content: start !important;
}

.layout > .card:first-child .journal {
  margin-top: 0;
}

@media (max-height: 760px) and (min-width: 901px) {
  .layout > .card:first-child .journal {
    max-height: 220px !important;
  }
}

@media (max-width: 900px) {
  .objective-priority-panel {
    margin-bottom: 10px;
  }
}

/* ========================================================================== 
   PRO STEP 7 — Rendu commercialisable : progression nettoyée
   Objectif : une carte = une fonction. La carte Progression ne contient plus
   que les jauges joueur ; le diagnostic, le niveau et la santé financière sont
   déplacés dans Pilotage/Objectifs pour éviter l'effet carte imbriquée.
   ========================================================================== */

.layout {
  grid-template-columns: minmax(0, 1.72fr) minmax(320px, .78fr) !important;
}

.side-stack {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  overflow: auto;
  padding-right: 3px;
  scrollbar-width: thin;
}

.side-stack > .card {
  min-height: 0;
  overflow: hidden;
  padding: 16px;
}

.progression-clean-card {
  display: grid;
  gap: 10px;
  align-content: start;
}

.progression-clean-card .section-title,
.round-snapshot-card .section-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 2px;
}

.section-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: linear-gradient(90deg, #60a5fa, #93c5fd);
  box-shadow: 0 0 18px rgba(96,165,250,.45);
  flex: 0 0 auto;
}

.progression-clean-card .progress-row {
  margin: 0;
  padding: 10px 0 0;
  border-top: 1px solid rgba(148,163,184,.10);
}

.progression-clean-card .progress-row:first-of-type {
  border-top: 0;
}

.progression-clean-card .focus-row {
  padding: 11px 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(239,68,68,.18);
  background: linear-gradient(90deg, rgba(239,68,68,.06), rgba(15,23,42,.10));
}

.progression-clean-card .progress-head {
  font-size: 14px;
  margin-bottom: 7px;
}

.progression-clean-card .bar {
  height: 13px;
}

.round-snapshot-card {
  align-self: start;
}

.snapshot-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.snapshot-month {
  flex: 0 0 auto;
  padding: 10px 13px;
  border-radius: 14px;
  border: 1px solid rgba(96,165,250,.20);
  background: rgba(96,165,250,.10);
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -.4px;
}

.snapshot-subtitle {
  color: #94a3b8;
  font-size: 13px;
  margin-top: 4px;
}

.snapshot-note {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,.12);
  background: rgba(148,163,184,.06);
  color: #cbd5e1;
  font-size: 13px;
  line-height: 1.45;
}

#pilotagePanel #advisorBox {
  margin-top: 0 !important;
}

#pilotagePanel .strategy-summary-card,
#pilotagePanel .risk-card,
#pilotagePanel .pro-level-card,
#pilotagePanel .profile-card,
#pilotagePanel .pilotage-help-card,
#pilotagePanel .command-center-card,
#pilotagePanel #advisorBox {
  min-height: 0;
  overflow: hidden;
}

.strategy-summary-card {
  padding: 16px !important;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15,23,42,.94), rgba(15,23,42,.76)) !important;
}

.diagnostic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.diagnostic-grid > div {
  min-width: 0;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,.12);
  background: rgba(148,163,184,.06);
}

.diagnostic-grid span {
  display: block;
  color: #94a3b8;
  font-size: 11px;
  margin-bottom: 5px;
}

.diagnostic-grid strong {
  display: block;
  color: #fff;
  font-size: 15px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

#pilotagePanel .pro-level-card {
  margin-top: 0;
  padding: 16px;
  border-radius: 18px;
}

#pilotagePanel .risk-card {
  padding: 16px;
  border-radius: 18px;
}

.objectives-freedom-card {
  grid-column: 1 / -1;
  margin-bottom: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(251,191,36,.22);
  background: linear-gradient(135deg, rgba(251,191,36,.12), rgba(139,92,246,.10));
}

.freedom-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.freedom-title {
  margin-top: 4px;
  font-size: clamp(18px, 1.25vw, 24px);
  font-weight: 900;
  color: #fff;
  line-height: 1.15;
}

.freedom-objective-bar {
  height: 12px;
  margin-bottom: 8px;
}

.objectives-freedom-card #freedomText {
  color: #dbeafe !important;
}

@media (max-height: 760px) and (min-width: 901px) {
  .side-stack > .card {
    padding: 14px;
  }

  .progression-clean-card {
    gap: 7px;
  }

  .progression-clean-card .progress-row {
    padding-top: 8px;
  }

  .progression-clean-card .progress-head {
    font-size: 13px;
    margin-bottom: 5px;
  }

  .progression-clean-card .bar {
    height: 11px;
  }

  .snapshot-note {
    font-size: 12px;
  }
}

@media (max-width: 1100px) {
  .layout {
    grid-template-columns: minmax(0, 1.5fr) minmax(300px, .9fr) !important;
  }

  .diagnostic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .layout {
    grid-template-columns: 1fr !important;
  }

  .side-stack {
    overflow: visible;
    height: auto;
    grid-template-rows: none;
  }

  .diagnostic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .freedom-card-head,
  .snapshot-head {
    flex-direction: column;
    align-items: flex-start;
  }
}



/* ---- css/modules/100-tutorial-and-market-cleanup.css ---- */
/* 100-tutorial-and-market-cleanup.css — Notifications, décisions, guide, tutoriel et nettoyage marchés.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* PRO STEP 8 — Correctifs commercialisation : notifications, décisions, guide et choix */
.feedback-stack{
  top:72px !important;
  right:18px !important;
  z-index:23000 !important;
  max-width:min(430px, calc(100vw - 32px));
}
.toast{
  min-width:300px;
  max-width:430px;
  line-height:1.35;
  font-size:14px;
  animation: toastIn .28s ease, toastOut .5s ease 8.4s forwards !important;
  background:rgba(15,23,42,.96) !important;
  border-color:rgba(148,163,184,.28) !important;
}
.toast.pos{ border-color:rgba(34,197,94,.42) !important; }
.toast.neg{ border-color:rgba(239,68,68,.42) !important; }
.toast.info{ border-color:rgba(96,165,250,.42) !important; }

.choice-card-pro{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.52);
  min-width:0;
}
.choice-card-pro button{
  width:100%;
}
.choice-effect-preview{
  font-size:12px;
  line-height:1.4;
  color:#cbd5e1;
  padding:8px 9px;
  border-radius:12px;
  background:rgba(96,165,250,.08);
  border:1px solid rgba(96,165,250,.12);
}

#eventPanel .event-card{
  position:relative;
  z-index:1;
}

#guidePanel .section-title,
#guidePanel .pill{
  letter-spacing:.01em;
}
#guidePanel .pill{
  background:rgba(96,165,250,.10);
  border-color:rgba(96,165,250,.16);
}

@media (max-width:900px){
  .feedback-stack{
    top:12px !important;
    right:12px !important;
    left:12px !important;
    max-width:none;
  }
  .toast{
    min-width:0;
    max-width:none;
  }
  .choices{
    grid-template-columns:1fr !important;
  }
}


/* === STEP 9 — Nettoyage marchés + tutoriel guidé premium === */
#marketPanel .market-card::before{
  background-image:none !important;
  background:linear-gradient(135deg, rgba(255,255,255,.025), transparent 42%) !important;
  opacity:.55 !important;
}
#marketPanel .market-card{
  min-height:210px;
}
#marketPanel .market-card .mini-chart{
  position:relative;
  z-index:2;
  margin-top:12px;
}
#marketPanel .market-card .pill,
#marketPanel .market-card .small,
#marketPanel .market-card div[style*="font-weight:800"]{
  position:relative;
  z-index:2;
}

.intro-tutorial-choice{
  margin-top:16px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(96,165,250,.22);
  background:linear-gradient(135deg, rgba(96,165,250,.12), rgba(139,92,246,.10));
}
.intro-choice-kicker{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#93c5fd;
  font-weight:800;
  margin-bottom:6px;
}
.intro-choice-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px;
}

.guided-tutorial-panel{
  position:fixed;
  left:var(--tutorial-left, 18px);
  top:var(--tutorial-top, 72px);
  right:auto;
  bottom:auto;
  width:min(390px, calc(100vw - 36px));
  max-height:calc(100vh - 96px);
  z-index:17000;
  display:none;
  pointer-events:auto;
}
.guided-tutorial-panel.show{
  display:block;
  animation:guidedTutorIn .28s ease;
}
.guided-tutorial-card{
  border-radius:22px;
  border:1px solid rgba(96,165,250,.26);
  background:linear-gradient(180deg, rgba(15,23,42,.97), rgba(8,16,31,.94));
  box-shadow:0 26px 70px rgba(2,8,23,.55), 0 0 0 1px rgba(255,255,255,.025) inset;
  padding:18px;
  color:#eef4ff;
  max-height:calc(100vh - 96px);
  overflow:auto;
  overscroll-behavior:contain;
}
.guided-tutorial-topline{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin-bottom:8px;
}
.guided-tutorial-kicker,
.guided-tutorial-step{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#93c5fd;
  font-weight:900;
}
.guided-tutorial-step{
  color:#c4b5fd;
}
.guided-tutorial-title{
  font-size:22px;
  line-height:1.1;
  font-weight:900;
  color:#fff;
  margin-bottom:8px;
}
.guided-tutorial-body{
  font-size:14px;
  line-height:1.45;
  color:#dbeafe;
  margin-bottom:10px;
}
.guided-tutorial-checklist{
  margin:0 0 10px;
  padding:0;
  list-style:none;
  display:grid;
  gap:7px;
}
.guided-tutorial-checklist li{
  position:relative;
  padding-left:24px;
  color:#cbd5e1;
  font-size:13px;
  line-height:1.35;
}
.guided-tutorial-checklist li::before{
  content:"";
  position:absolute;
  left:0;
  top:2px;
  width:15px;
  height:15px;
  border-radius:50%;
  border:1px solid rgba(96,165,250,.42);
  background:rgba(96,165,250,.12);
  box-shadow:0 0 12px rgba(96,165,250,.12);
}
.guided-tutorial-checklist li.done::before{
  background:linear-gradient(135deg, #22c55e, #60a5fa);
  border-color:rgba(34,197,94,.75);
}
.guided-tutorial-checklist li.done::after{
  content:"✓";
  position:absolute;
  left:4px;
  top:0px;
  font-size:12px;
  font-weight:900;
  color:#fff;
}
.guided-tutorial-tip{
  padding:10px 11px;
  border-radius:14px;
  background:rgba(96,165,250,.10);
  border:1px solid rgba(96,165,250,.18);
  color:#bfdbfe;
  font-size:12px;
  line-height:1.35;
  margin-bottom:12px;
}
.guided-tutorial-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.guided-tutorial-actions button{
  min-height:38px;
  padding:9px 11px;
  border-radius:12px;
  font-size:13px;
}
.guided-guide-card{
  margin:12px 0 14px;
  padding:14px;
  border-radius:18px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  background:linear-gradient(135deg, rgba(96,165,250,.14), rgba(139,92,246,.12));
  border:1px solid rgba(96,165,250,.20);
}
.guided-guide-title{
  font-size:18px;
  font-weight:900;
  color:#fff;
  margin:4px 0 4px;
}
.guided-guide-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.tutorial-highlight{
  outline:2px solid rgba(96,165,250,.95) !important;
  box-shadow:0 0 0 6px rgba(96,165,250,.14), 0 18px 34px rgba(96,165,250,.20) !important;
  position:relative;
  z-index:5;
}
body.tutorial-active .guided-target-pulse{
  animation:tutorialPulse 1.2s ease-in-out infinite;
}

.guided-tutorial-panel.avoid-target{
  transition:left .18s ease, top .18s ease, transform .18s ease;
}
.guided-tutorial-card::-webkit-scrollbar{
  width:8px;
}
.guided-tutorial-card::-webkit-scrollbar-thumb{
  background:rgba(96,165,250,.35);
  border-radius:999px;
}
.guided-tutorial-note{
  margin-top:8px;
  color:#93c5fd;
  font-size:11px;
  line-height:1.35;
}

@keyframes guidedTutorIn{
  from{ opacity:0; transform:translateY(12px) scale(.98); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes tutorialPulse{
  0%,100%{ filter:brightness(1); }
  50%{ filter:brightness(1.18); }
}
@media (max-width:900px){
  .guided-tutorial-panel{
    left:var(--tutorial-left, 10px);
    top:var(--tutorial-top, 10px);
    right:auto;
    bottom:auto;
    width:min(340px, calc(100vw - 20px));
    max-height:calc(100vh - 90px);
  }
  .guided-tutorial-card{ padding:14px; }
  .guided-tutorial-title{ font-size:19px; }
  .intro-choice-actions,
  .guided-guide-card{
    grid-template-columns:1fr;
  }
  .guided-guide-actions{ justify-content:stretch; }
  .guided-guide-actions button{ width:100%; }
}



/* ---- css/modules/110-fullscreen-and-product-finish.css ---- */
/* 110-fullscreen-and-product-finish.css — Bouton plein écran, finition produit, écran de fin.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* ==========================================================================
   V1.0 RC — Correctif superposition + bouton plein écran
   ========================================================================== */
.fullscreen-btn{
  min-width: 118px !important;
  font-weight: 800 !important;
}
body.event-panel-active .pending-decision-banner,
#eventPanel.active ~ .pending-decision-banner{
  display: none !important;
  pointer-events: none !important;
}
.pending-decision-banner[aria-hidden="true"]{
  display: none !important;
  pointer-events: none !important;
}
@media (max-width: 900px){
  .fullscreen-btn{
    min-width: 96px !important;
    font-size: 11px !important;
    padding-inline: 8px !important;
  }
}


/* ==========================================================================
   V1.0 RC iOS Safe — correctifs Safari iPhone/iPad
   ========================================================================== */
:root{ --app-height: 100vh; }
*{ -webkit-tap-highlight-color: transparent; }
button, .tab-btn, .action-tab, .quick-btn, .advisor-btn, select{ touch-action: manipulation; }
button, .tab-btn, .action-tab, .quick-btn, .advisor-btn{ -webkit-user-select:none; user-select:none; }
html, body{ overscroll-behavior:none; }
body.ios-safe-mode{ min-height:var(--app-height) !important; height:var(--app-height) !important; -webkit-text-size-adjust:100%; }
body.ios-safe-mode #gameRoot.container{ height:var(--app-height) !important; max-height:var(--app-height) !important; }
body.ios-safe-mode .intro-overlay, body.ios-safe-mode .victory-overlay, body.ios-safe-mode .month-event-overlay{ min-height:var(--app-height) !important; height:var(--app-height) !important; }
body.ios-safe-mode .intro-card, body.ios-safe-mode .victory-card, body.ios-safe-mode .month-event-modal, body.ios-safe-mode .event-splash-card, body.ios-safe-mode .special-spotlight-card{ max-height:calc(var(--app-height) - 32px) !important; -webkit-overflow-scrolling:touch; }
body.ios-safe-mode .guided-tutorial-panel{ max-height:calc(var(--app-height) - 90px) !important; }
body.ios-safe-mode .guided-tutorial-card, body.ios-safe-mode .tab-content-shell, body.ios-safe-mode .panel.active, body.ios-safe-mode .actions-grid, body.ios-safe-mode .history-list, body.ios-safe-mode .portfolio-grid, body.ios-safe-mode .guide-scroll, body.ios-safe-mode .journal{ -webkit-overflow-scrolling:touch; }
body.ios-safe-mode .fullscreen-btn{ min-width:92px !important; }
@supports (-webkit-touch-callout: none){ html, body{ height:var(--app-height) !important; min-height:var(--app-height) !important; } #gameRoot.container{ height:var(--app-height) !important; max-height:var(--app-height) !important; } }


/* ==========================================================================
   Wealth Engine V1.1 — finition produit / commercialisable
   ========================================================================== */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.topbar-language{
  display:flex;
  align-items:center;
}
.language-select,
.challenge-select{
  min-width:auto;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(15,23,42,.85);
  color:#e6eefc;
  box-shadow:0 8px 20px rgba(2,8,23,.18);
}
.language-select.compact{
  width:125px;
}
.intro-card-pro{
  max-height:min(92vh, 760px);
  overflow:auto;
}
.intro-topline{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  margin-bottom:12px;
}
.intro-kicker,
.intro-choice-kicker{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#93c5fd;
  font-weight:800;
  margin-bottom:6px;
}
.intro-language-box{
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
  min-width:125px;
}
.intro-language-box label,
.intro-config-card label{
  font-size:12px;
  color:#cbd5e1;
  font-weight:800;
}
.intro-lead{
  font-size:15px;
  line-height:1.55;
  color:#e6eefc;
  padding:12px 14px;
  border-radius:16px;
  background:linear-gradient(135deg, rgba(96,165,250,.14), rgba(139,92,246,.12));
  border:1px solid rgba(96,165,250,.18);
}
.fire-principles-grid,
.intro-config-grid,
.guide-tools-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin:12px 0;
}
.fire-principle-card,
.intro-config-card{
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(15,23,42,.64);
}
.fire-principle-card strong{
  display:block;
  color:#fff;
  margin-bottom:4px;
}
.fire-principle-card span,
.challenge-desc{
  color:#cbd5e1;
  font-size:13px;
  line-height:1.4;
}
.challenge-select{
  width:100%;
  margin-top:6px;
}
.save-status-pill{
  border-color:rgba(34,197,94,.22)!important;
  color:#dcfce7!important;
}
.game-end-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(2,8,23,.84);
  backdrop-filter:blur(6px);
  z-index:22000;
  padding:20px;
}
.game-end-overlay.show{
  display:flex;
}
.game-end-card{
  width:min(760px,94vw);
  max-height:92vh;
  overflow:auto;
  padding:28px;
  border-radius:28px;
  color:#fff;
  border:1px solid rgba(251,191,36,.25);
  background:
    radial-gradient(circle at top left, rgba(251,191,36,.14), transparent 35%),
    linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.93));
  box-shadow:0 34px 90px rgba(0,0,0,.52);
}
.game-end-kicker{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#fbbf24;
  font-weight:900;
}
.game-end-title{
  margin:8px 0 8px;
  font-size:34px;
  line-height:1.05;
}
.game-end-text{
  color:#e2e8f0;
  line-height:1.6;
}
.game-end-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:16px 0;
}
.game-end-stat{
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(15,23,42,.74);
}
.game-end-stat span{
  display:block;
  font-size:12px;
  color:#94a3b8;
  margin-bottom:6px;
}
.game-end-stat strong{
  font-size:20px;
  color:#fff;
}
.game-end-advice{
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(96,165,250,.18);
  background:rgba(96,165,250,.10);
  color:#dbeafe;
  line-height:1.55;
}
.game-end-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:16px;
}
.badges-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-top:12px;
}
.badge-card{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.68);
}
.badge-card.locked{
  opacity:.55;
}
.badge-icon{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:rgba(96,165,250,.14);
  flex:0 0 auto;
}
.badge-name{
  font-weight:800;
  color:#fff;
}
.badge-desc{
  margin-top:3px;
  font-size:12px;
  color:#cbd5e1;
}
.challenge-progress{
  margin-top:10px;
  display:grid;
  gap:8px;
}
.challenge-progress-row{
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.58);
  color:#cbd5e1;
}
.challenge-progress-row strong{
  color:#fff;
}
.save-manager-card,
.teacher-mode-card{
  align-items:flex-start;
}
@media (max-width: 900px){
  .intro-topline,
  .game-end-actions{
    flex-direction:column;
  }
  .fire-principles-grid,
  .intro-config-grid,
  .guide-tools-grid,
  .badges-grid,
  .game-end-stats{
    grid-template-columns:1fr;
  }
  .language-select.compact{
    width:100%;
  }
}




/* ---- css/modules/120-cockpit-and-safari-safe.css ---- */
/* 120-cockpit-and-safari-safe.css — Correctifs cockpit, iOS/macOS Safari et safe areas.
   Fichier généré par la migration CSS V1.3.4. Ordre de cascade conservé. */

/* ========================================================================== 
   V1.2.2 — Correctif cockpit : indicateurs visibles + tour compact
   Objectif : garder les 5 indicateurs joueur visibles sans scroll parasite.
   ========================================================================== */
.side-stack {
  grid-template-rows: minmax(0, 1fr) auto !important;
  overflow: hidden !important;
  gap: 10px !important;
}

.side-stack > .card {
  min-height: 0;
}

.progression-clean-card {
  overflow: visible !important;
  gap: 8px !important;
}

.progression-clean-card .section-title {
  margin-bottom: 0 !important;
}

.progression-clean-card .progress-row {
  padding-top: 7px !important;
}

.progression-clean-card .progress-head {
  font-size: 13px !important;
  margin-bottom: 5px !important;
}

.progression-clean-card .bar {
  height: 11px !important;
}

.progression-clean-card .focus-row {
  padding: 9px 11px 10px !important;
}

.compact-turn-card {
  min-height: 62px !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  overflow: visible !important;
}

.compact-turn-card .dynamic-objective-title {
  margin: 0 !important;
  white-space: nowrap;
}

.compact-turn-card .snapshot-month {
  padding: 8px 14px !important;
  font-size: 23px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

.compact-turn-card .snapshot-subtitle,
.compact-turn-card .snapshot-note {
  display: none !important;
}

@media (max-height: 760px) and (min-width: 901px) {
  .progression-clean-card .section-title { font-size: 23px !important; }
  .progression-clean-card .progress-row { padding-top: 6px !important; }
  .progression-clean-card .progress-head { font-size: 12.5px !important; margin-bottom: 4px !important; }
  .progression-clean-card .bar { height: 10px !important; }
  .progression-clean-card .focus-row { padding: 8px 10px 9px !important; }
  .compact-turn-card { min-height: 56px !important; padding: 10px 14px !important; }
  .compact-turn-card .snapshot-month { font-size: 21px !important; }
}

/* ==========================================================================
   V1.2.3 — Compatibilité rendu iOS / macOS Safari
   Objectif : stabiliser le rendu sans toucher au gameplay.
   ========================================================================== */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
button, select, input, textarea{
  -webkit-tap-highlight-color: rgba(96,165,250,.18);
  touch-action: manipulation;
}
.card, .action-card, .history-item, .market-card, .goal-card, .event-card, .tutorial-card, .condition-card, .stat,
.intro-card, .month-event-modal, .game-end-card, .guided-tutorial-panel, .victory-card, .special-spotlight-card{
  -webkit-backdrop-filter: blur(8px);
}
/* Safari iOS gère mal les fonds fixed : on garde le fond bleu, mais on évite le blocage/flicker. */
@supports (-webkit-touch-callout: none){
  body{
    background-attachment: scroll !important;
    overscroll-behavior-y: none;
  }
  .container, #gameRoot.container{
    padding-left: max(10px, env(safe-area-inset-left));
    padding-right: max(10px, env(safe-area-inset-right));
  }
  .intro-overlay, .month-event-overlay, .victory-overlay, .game-end-overlay{
    padding-left: max(14px, env(safe-area-inset-left));
    padding-right: max(14px, env(safe-area-inset-right));
  }
}
/* macOS/Safari : évite les micro-scrollbars horizontales dues aux ombres et aux cartes larges. */
html, body{
  max-width:100%;
  overflow-x:hidden;
}


/* ---- css/modules/130-mobile-panel-navigation.css ---- */
/* ============================================================================
   130-centered-modal-panels.css — V1.5.4
   Navigation par vraies fenêtres modales centrées.
   Correction professionnelle : le panneau est déplacé dans une couche dédiée,
   seule la page arrière est floutée/assombrie, le contenu reste net et cliquable.
   ============================================================================ */

.game-panel-layer{
  position:fixed;
  inset:0;
  z-index:18000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:clamp(12px, 3vw, 34px);
  pointer-events:none;
}

.game-panel-layer.show{
  display:flex;
  pointer-events:auto;
}

.game-panel-backdrop{
  position:absolute;
  inset:0;
  z-index:0;
  background:rgba(2,8,23,.68);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.game-panel-window{
  position:relative;
  z-index:1;
  width:min(1120px, calc(100vw - 34px));
  max-height:min(780px, calc(var(--app-height, 100vh) - 34px));
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(148,163,184,.24);
  background:
    radial-gradient(circle at top left, rgba(96,165,250,.18), transparent 35%),
    linear-gradient(180deg, rgba(15,23,42,.99), rgba(15,23,42,.94));
  box-shadow:0 32px 100px rgba(2,8,23,.72);
  color:#e6eefc;
  pointer-events:auto;
  transform:translateY(0) scale(1);
  animation:gamePanelPop .18s cubic-bezier(.2,.8,.2,1);
}

@keyframes gamePanelPop{
  from{ opacity:.72; transform:translateY(10px) scale(.985); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

.game-panel-header{
  flex:0 0 auto;
  padding:16px 18px 14px;
  border-bottom:1px solid rgba(148,163,184,.14);
  background:linear-gradient(180deg, rgba(15,23,42,.99), rgba(15,23,42,.95));
}

.game-panel-kicker{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#93c5fd;
  margin-bottom:4px;
}

.game-panel-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.game-panel-title{
  color:#fff;
  font-size:24px;
  font-weight:900;
  letter-spacing:-.02em;
}

.game-panel-close{
  width:42px;
  height:42px;
  min-height:42px !important;
  padding:0 !important;
  border-radius:999px !important;
  background:rgba(15,23,42,.78) !important;
  border:1px solid rgba(148,163,184,.22) !important;
  box-shadow:none !important;
  color:#e2e8f0 !important;
  font-size:18px !important;
  line-height:1 !important;
  cursor:pointer;
}

.game-panel-close:hover{
  filter:brightness(1.12);
}

.game-panel-content{
  flex:1 1 auto;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:16px;
  min-height:0;
}

/* Les panneaux ne restent pas dans le flux de page : ils sont affichés uniquement
   quand WEPanelOverlay les déplace dans .game-panel-content. */
.panel{
  display:none !important;
}

.game-panel-content > .panel.active{
  display:block !important;
  position:static !important;
  width:auto !important;
  max-height:none !important;
  overflow:visible !important;
  transform:none !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.game-panel-open{
  overflow:hidden;
}

body.game-panel-open .mobile-bottom-nav{
  pointer-events:none;
}

@media (max-width: 900px){
  .tabs{ display:none !important; }

  .mobile-bottom-nav{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  #mobileBottomNav.mobile-bottom-nav{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  .mobile-bottom-nav button{
    min-height:42px !important;
    padding:7px 3px !important;
    font-size:11px !important;
    line-height:1.1 !important;
  }

  body{ padding-bottom:calc(104px + env(safe-area-inset-bottom)) !important; }

  .game-panel-layer{
    padding:max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
  }

  .game-panel-window{
    width:calc(100vw - 20px);
    max-height:calc(var(--app-height, 100vh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius:24px;
  }

  .game-panel-header{
    padding:14px 14px 12px;
  }

  .game-panel-content{
    padding:14px;
  }

  .game-panel-title{
    font-size:22px;
  }
}

@media (max-width: 900px) and (orientation: landscape){
  .mobile-bottom-nav,
  #mobileBottomNav.mobile-bottom-nav{
    grid-template-columns:repeat(8, minmax(0, 1fr)) !important;
  }

  .mobile-bottom-nav button{
    min-height:40px !important;
    font-size:10px !important;
  }

  body{ padding-bottom:calc(58px + env(safe-area-inset-bottom)) !important; }

  .game-panel-layer{
    padding:8px;
  }

  .game-panel-window{
    width:min(1100px, calc(100vw - 16px));
    max-height:calc(var(--app-height, 100vh) - 16px);
    border-radius:22px;
  }

  .game-panel-header{
    padding:10px 12px 9px;
  }

  .game-panel-content{
    padding:12px;
  }
}


/* ---- css/modules/140-intro-profile-selection.css ---- */
/* ========================================================================== 
   FIRE Quest V1.5.10 — sélection explicite du profil avant lancement
   ========================================================================== */
.intro-profile-choice{
  margin:14px 0;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(96,165,250,.22);
  background:linear-gradient(135deg, rgba(96,165,250,.12), rgba(139,92,246,.10));
}
.intro-profile-text{
  margin:0 0 10px;
  color:#cbd5e1 !important;
}
.intro-profile-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px;
}
.intro-profile-card{
  width:100%;
  min-height:112px;
  margin:0 !important;
  padding:13px 14px !important;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(15,23,42,.72);
  color:#e6eefc;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:6px;
  box-shadow:0 10px 24px rgba(2,8,23,.22);
}
.intro-profile-card strong{
  color:#fff;
  font-size:15px;
}
.intro-profile-card span{
  color:#cbd5e1;
  font-size:12px;
  line-height:1.35;
}
.intro-profile-card small{
  color:#93c5fd;
  font-size:11px;
  line-height:1.3;
}
.intro-profile-card.is-selected,
.intro-profile-card[aria-pressed="true"]{
  border-color:rgba(34,197,94,.46);
  background:linear-gradient(180deg, rgba(34,197,94,.20), rgba(15,23,42,.78));
  box-shadow:0 14px 30px rgba(34,197,94,.12), 0 0 0 1px rgba(34,197,94,.18) inset;
}
.intro-choice-actions button:disabled{
  opacity:.45;
  cursor:not-allowed;
  transform:none !important;
}
@media (max-width:760px){
  .intro-profile-grid{ grid-template-columns:1fr; }
  .intro-profile-card{ min-height:auto; }
}

/* V1.5.12 — accent visuel fort pour le profil sélectionné + briefing FIRE séparé */
.intro-profile-card{
  position:relative;
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.intro-profile-card.is-selected,
.intro-profile-card[aria-pressed="true"]{
  border-color:rgba(34,197,94,.85) !important;
  background:linear-gradient(135deg, rgba(34,197,94,.28), rgba(20,184,166,.16) 46%, rgba(15,23,42,.84)) !important;
  box-shadow:0 18px 38px rgba(34,197,94,.20), 0 0 0 2px rgba(34,197,94,.38) inset, 0 0 26px rgba(34,197,94,.12) !important;
  transform:translateY(-2px);
}
.intro-profile-card.is-selected strong,
.intro-profile-card[aria-pressed="true"] strong{
  color:#dcfce7;
}
.intro-profile-selected-label{
  display:none;
  align-self:flex-start;
  margin-top:auto;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(34,197,94,.22);
  border:1px solid rgba(34,197,94,.34);
  color:#dcfce7;
  font-size:11px;
  font-style:normal;
  font-weight:800;
  letter-spacing:.01em;
}
.intro-profile-card.is-selected .intro-profile-selected-label,
.intro-profile-card[aria-pressed="true"] .intro-profile-selected-label{
  display:inline-flex;
}
@media (max-width:760px){
}


/* Briefing FIRE affiché entre le choix du tutoriel et le début réel de la partie. */
.fire-briefing-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,8,23,.78);
  backdrop-filter:blur(6px);
  z-index:20500;
}
.fire-briefing-overlay.show{
  display:flex;
}
.fire-briefing-card{
  width:min(760px, calc(100vw - 32px));
  max-height:min(86vh, 760px);
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:26px;
  border-radius:26px;
  border:1px solid rgba(96,165,250,.24);
  background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.92));
  box-shadow:0 30px 90px rgba(2,8,23,.58);
  color:#eef4ff;
}
.fire-briefing-kicker{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#93c5fd;
  font-weight:800;
}
.fire-briefing-card h2{
  margin:0;
  font-size:28px;
  line-height:1.15;
  color:#fff;
}
.fire-briefing-text{
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding-right:4px;
}
.fire-briefing-text p{
  margin:0 0 8px;
  color:#dbeafe;
  font-size:14px;
  line-height:1.5;
}
.fire-briefing-text p:last-child{ margin-bottom:0; }
.fire-briefing-actions{
  display:flex;
  justify-content:flex-end;
  padding-top:6px;
}
.fire-briefing-actions button{
  min-width:210px;
  font-weight:800;
}
body.fire-briefing-open{
  overflow:hidden;
}
@media (max-width:760px){
  .fire-briefing-overlay{ padding:14px; align-items:center; }
  .fire-briefing-card{ width:calc(100vw - 24px); max-height:84vh; padding:20px; border-radius:22px; }
  .fire-briefing-card h2{ font-size:23px; }
  .fire-briefing-text p{ font-size:13px; }
  .fire-briefing-actions button{ width:100%; min-width:0; }
}


/* ---- css/modules/150-interface-tour.css ---- */
/* ============================================================================
   FIRE Quest V1.5.17 — Premium Tutorial UI
   Base stable V1.5.16 : tutoriel visible, non floutant, avec présentation des
   boutons et des actions. Cette version améliore uniquement le rendu visuel.
   ============================================================================ */
.interface-tour-overlay{
  position:fixed;
  inset:0;
  display:none;
  padding:0;
  background:radial-gradient(circle at 50% 50%, rgba(96,165,250,.10), rgba(2,8,23,.16) 46%, rgba(2,8,23,.24));
  z-index:20500;
  pointer-events:none;
}
.interface-tour-overlay.show{ display:block; }
.interface-tour-card{
  position:fixed;
  width:min(530px, calc(100vw - 28px));
  max-height:min(74vh, 500px);
  overflow:auto;
  border-radius:24px;
  border:1px solid rgba(147,197,253,.34);
  background:
    radial-gradient(circle at top left, rgba(96,165,250,.18), transparent 38%),
    radial-gradient(circle at bottom right, rgba(139,92,246,.14), transparent 42%),
    linear-gradient(180deg, rgba(15,23,42,.985), rgba(15,23,42,.955));
  box-shadow:
    0 26px 80px rgba(2,8,23,.56),
    0 0 0 1px rgba(255,255,255,.045) inset,
    0 0 42px rgba(96,165,250,.12);
  color:#eef4ff;
  padding:22px 22px 18px;
  text-align:left;
  pointer-events:auto;
  z-index:20510;
  animation:interfaceTourCardIn .22s cubic-bezier(.2,.8,.2,1);
}
@keyframes interfaceTourCardIn{
  from{ opacity:0; transform:translateY(8px) scale(.985); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}
.interface-tour-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:24px;
  background:linear-gradient(135deg, rgba(255,255,255,.05), transparent 36%);
  pointer-events:none;
}
.interface-tour-card::after{
  content:"";
  position:absolute;
  width:18px;
  height:18px;
  border:1px solid rgba(147,197,253,.30);
  background:linear-gradient(135deg, rgba(15,23,42,.985), rgba(30,41,59,.97));
  transform:rotate(45deg);
  pointer-events:none;
  z-index:0;
}
.interface-tour-card[data-placement="right"]::after{
  left:-10px;
  top:32px;
  border-right:0;
  border-top:0;
}
.interface-tour-card[data-placement="left"]::after{
  right:-10px;
  top:32px;
  border-left:0;
  border-bottom:0;
}
.interface-tour-card[data-placement="top"]::after{
  top:-10px;
  left:44px;
  border-right:0;
  border-bottom:0;
}
.interface-tour-card[data-placement="bottom"]::after{
  bottom:-10px;
  left:44px;
  border-left:0;
  border-top:0;
}
.interface-tour-card[data-placement="center"]::after{ display:none; }
.interface-tour-card > *{ position:relative; z-index:1; }
.interface-tour-close{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  width:36px;
  height:36px;
  border-radius:999px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  line-height:1;
  background:rgba(15,23,42,.78);
  border:1px solid rgba(148,163,184,.20);
  color:#e0ecff;
}
.interface-tour-close:hover{ border-color:rgba(147,197,253,.46); }
.interface-tour-topline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding-right:44px;
  margin-bottom:14px;
}
.interface-tour-kicker,
.interface-tour-progress{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  border:1px solid rgba(96,165,250,.25);
  background:rgba(96,165,250,.105);
  color:#bfdbfe;
  font-size:11px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
  padding:7px 10px;
}
.interface-tour-progress{
  color:#ddd6fe;
  border-color:rgba(139,92,246,.26);
  background:rgba(139,92,246,.11);
  white-space:nowrap;
}
.interface-tour-title{
  margin:0 0 9px;
  font-size:27px;
  line-height:1.08;
  color:#fff;
  letter-spacing:-.035em;
}
.interface-tour-body{
  margin:0;
  color:#dbeafe;
  font-size:15px;
  line-height:1.58;
}
.interface-tour-dots{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:17px 0 15px;
  max-height:42px;
  overflow:hidden;
}
.interface-tour-dots span{
  width:7px;
  height:7px;
  border-radius:999px;
  background:rgba(148,163,184,.25);
  border:1px solid rgba(148,163,184,.16);
  transition:width .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
}
.interface-tour-dots span.active{
  width:24px;
  background:linear-gradient(90deg, rgba(96,165,250,.98), rgba(139,92,246,.98));
  border-color:rgba(147,197,253,.50);
  box-shadow:0 0 18px rgba(96,165,250,.22);
}
.interface-tour-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:9px;
  margin-top:6px;
}
.interface-tour-actions button{
  min-height:42px;
  border-radius:14px;
}
#interfaceTourNextBtn{
  font-weight:900;
  background:linear-gradient(90deg, rgba(96,165,250,.96), rgba(139,92,246,.96));
  border:1px solid rgba(147,197,253,.38);
  box-shadow:0 14px 28px rgba(96,165,250,.18);
}
#interfaceTourPrevBtn,
#interfaceTourSkipBtn{
  background:rgba(15,23,42,.72);
}
body.interface-tour-open{ overflow:hidden; }
.interface-tour-highlight{
  position:relative !important;
  z-index:20600 !important;
  outline:3px solid rgba(147,197,253,.96) !important;
  outline-offset:4px !important;
  box-shadow:
    0 0 0 9px rgba(96,165,250,.18),
    0 0 0 1px rgba(255,255,255,.25) inset,
    0 0 38px rgba(96,165,250,.54) !important;
  animation:interfaceTourPulse 1.25s ease-in-out infinite;
}
@keyframes interfaceTourPulse{
  0%,100%{ filter:brightness(1); transform:translateZ(0); }
  50%{ filter:brightness(1.15); transform:translateZ(0) scale(1.012); }
}
@media (max-width: 760px){
  .interface-tour-card{
    width:min(92vw, 420px);
    max-height:54vh;
    border-radius:20px;
    padding:19px 16px 16px;
  }
  .interface-tour-topline{ align-items:flex-start; flex-direction:column; padding-right:40px; margin-bottom:12px; }
  .interface-tour-title{ font-size:24px; }
  .interface-tour-body{ font-size:14px; line-height:1.52; }
  .interface-tour-actions{ justify-content:stretch; }
  .interface-tour-actions button{ flex:1 1 100%; }
  .interface-tour-dots{ max-height:34px; margin:14px 0 13px; }
  .interface-tour-card::after{ display:none; }
}


/* V1.5.18 — transition entre découverte de l'interface et découverte des actions */
.interface-tour-card.transition-step{
  width:min(620px, calc(100vw - 28px));
  text-align:center;
  border-color:rgba(251,191,36,.34);
  box-shadow:0 26px 78px rgba(2,8,23,.50), 0 0 34px rgba(251,191,36,.08);
}
.interface-tour-card.transition-step .interface-tour-kicker{
  color:#fde68a;
  border-color:rgba(251,191,36,.28);
  background:rgba(251,191,36,.10);
}
.interface-tour-card.transition-step .interface-tour-title{
  background:linear-gradient(90deg,#ffffff,#fde68a,#bfdbfe);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.interface-tour-card.action-step .interface-tour-kicker{
  color:#bbf7d0;
  border-color:rgba(34,197,94,.25);
  background:rgba(34,197,94,.10);
}


/* ---- css/modules/170-multiplayer.css ---- */
/* ============================================================================
   FIRE Quest V1.7.0 — Interface multijoueur
   ============================================================================ */
.multiplayer-floating-btn{
  position:fixed;
  right:18px;
  bottom:calc(92px + env(safe-area-inset-bottom));
  z-index:15500;
  border-radius:999px;
  padding:12px 16px;
  font-weight:900;
  background:linear-gradient(90deg, rgba(34,211,238,.92), rgba(96,165,250,.92));
  border:1px solid rgba(96,165,250,.35);
  box-shadow:0 18px 40px rgba(2,8,23,.42), 0 0 26px rgba(34,211,238,.18);
}
.multiplayer-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,8,23,.62);
  backdrop-filter:blur(5px);
  z-index:24000;
}
.multiplayer-overlay.show{ display:flex; }
.multiplayer-card{
  position:relative;
  width:min(980px, calc(100vw - 28px));
  max-height:min(88vh, 780px);
  overflow:auto;
  padding:26px;
  border-radius:28px;
  border:1px solid rgba(96,165,250,.25);
  background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.92));
  box-shadow:0 32px 90px rgba(2,8,23,.60), 0 0 0 1px rgba(255,255,255,.035) inset;
  color:#eef4ff;
}
.multiplayer-card h2{ margin:0 0 8px; font-size:30px; color:#fff; }
.multiplayer-close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  padding:0;
  border-radius:999px;
}
.multiplayer-kicker{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  border:1px solid rgba(34,211,238,.22);
  background:rgba(34,211,238,.10);
  color:#a5f3fc;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:7px 11px;
  margin-bottom:12px;
}
.multiplayer-lead{ margin:0 44px 16px 0; color:#cbd5e1; line-height:1.55; }
.multiplayer-status{
  margin:10px 0 16px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(148,163,184,.08);
  color:#cbd5e1;
}
.multiplayer-status.ok{ border-color:rgba(34,197,94,.28); background:rgba(34,197,94,.10); color:#bbf7d0; }
.multiplayer-status.error{ border-color:rgba(239,68,68,.28); background:rgba(239,68,68,.10); color:#fecaca; }
.multiplayer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:12px 0;
}
.multiplayer-server-row{ grid-template-columns:1fr; }
.multiplayer-grid label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#cbd5e1;
  font-size:13px;
  font-weight:800;
}
.multiplayer-grid input,
.multiplayer-grid select,
#multiplayerRoomCodeInput{
  width:100%;
  padding:11px 12px;
  border-radius:13px;
  border:1px solid rgba(148,163,184,.20);
  background:rgba(15,23,42,.76);
  color:#eef4ff;
}
.multiplayer-actions-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:14px 0;
}
#multiplayerRoomCodeInput{ width:150px; text-transform:uppercase; font-weight:900; letter-spacing:.08em; }
.multiplayer-lobby{
  margin-top:16px;
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(96,165,250,.20);
  background:rgba(96,165,250,.07);
}
.multiplayer-room-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.multiplayer-room-label{ color:#93c5fd; font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:900; }
.multiplayer-room-code{ font-size:34px; font-weight:1000; letter-spacing:.14em; color:#fff; }
.multiplayer-room-meta{ display:flex; gap:10px; flex-wrap:wrap; margin:10px 0 12px; color:#cbd5e1; font-size:13px; }
.multiplayer-room-meta span{ padding:6px 9px; border-radius:999px; background:rgba(148,163,184,.10); border:1px solid rgba(148,163,184,.12); }
.multiplayer-player-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.multiplayer-player-line{
  padding:11px 12px;
  border-radius:14px;
  background:rgba(15,23,42,.66);
  border:1px solid rgba(148,163,184,.14);
}
.multiplayer-player-line.self{ border-color:rgba(34,211,238,.28); box-shadow:0 0 18px rgba(34,211,238,.08); }
.host-badge,.self-badge{
  display:inline-flex;
  margin-left:6px;
  padding:3px 7px;
  border-radius:999px;
  font-size:10px;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:.04em;
}
.host-badge{ background:rgba(251,191,36,.16); color:#fde68a; border:1px solid rgba(251,191,36,.25); }
.self-badge{ background:rgba(34,211,238,.13); color:#a5f3fc; border:1px solid rgba(34,211,238,.22); }
.multiplayer-note,.multiplayer-empty{ color:#cbd5e1; font-size:13px; margin-top:10px; }
.multiplayer-peers{ margin-top:16px; }
.multiplayer-peers h3{ margin:0 0 10px; color:#fff; }
.multiplayer-peer-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.multiplayer-peer-card{
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.16);
  background:linear-gradient(180deg, rgba(15,23,42,.80), rgba(15,23,42,.62));
}
.peer-top{ display:flex; justify-content:space-between; align-items:center; gap:10px; color:#fff; }
.peer-status{ color:#94a3b8; font-size:12px; margin:4px 0 10px; }
.peer-stats{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px; }
.peer-stats span{ padding:8px; border-radius:12px; background:rgba(148,163,184,.08); color:#cbd5e1; font-size:12px; }
.peer-stats b{ display:block; color:#fff; font-size:14px; margin-top:2px; }
.peer-bars{ display:grid; gap:7px; }
.peer-bar-head{ display:flex; justify-content:space-between; color:#cbd5e1; font-size:11px; margin-bottom:3px; }
.peer-bar-track{ height:8px; border-radius:999px; overflow:hidden; background:rgba(148,163,184,.14); border:1px solid rgba(148,163,184,.10); }
.peer-bar-track div{ height:100%; border-radius:999px; background:linear-gradient(90deg, rgba(96,165,250,.9), rgba(139,92,246,.9)); }
.peer-bar.stress .peer-bar-track div{ background:linear-gradient(90deg, rgba(245,158,11,.9), rgba(239,68,68,.9)); }
.peer-bar.skill .peer-bar-track div{ background:linear-gradient(90deg, rgba(34,197,94,.9), rgba(34,211,238,.9)); }
.multiplayer-mini-hud{
  position:fixed;
  left:16px;
  bottom:calc(86px + env(safe-area-inset-bottom));
  z-index:15400;
  max-width:min(420px, calc(100vw - 32px));
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(34,211,238,.22);
  background:rgba(15,23,42,.90);
  box-shadow:0 16px 36px rgba(2,8,23,.34);
  color:#cbd5e1;
  font-size:12px;
}
.multiplayer-mini-hud button{
  padding:7px 10px;
  border-radius:12px;
  font-size:12px;
  margin-bottom:6px;
}
@media (max-width: 820px){
  .multiplayer-overlay{ padding:12px; }
  .multiplayer-card{ padding:20px 16px; border-radius:22px; max-height:88vh; }
  .multiplayer-grid,.multiplayer-player-list,.multiplayer-peer-grid,.peer-stats{ grid-template-columns:1fr; }
  .multiplayer-actions-row{ align-items:stretch; }
  .multiplayer-actions-row button,#multiplayerRoomCodeInput{ width:100%; }
  .multiplayer-floating-btn{ right:12px; bottom:calc(82px + env(safe-area-inset-bottom)); padding:10px 12px; }
  .multiplayer-mini-hud{ left:10px; right:10px; bottom:calc(78px + env(safe-area-inset-bottom)); max-width:none; }
}

/* V1.7.3 — Chat de salle multijoueur */
.multiplayer-chat{
  margin-top:16px;
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(34,211,238,.18);
  background:rgba(34,211,238,.055);
}
.multiplayer-chat-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.multiplayer-chat-head h3{
  margin:0;
  color:#fff;
}
.multiplayer-chat-head span,
.multiplayer-chat-note{
  color:#94a3b8;
  font-size:12px;
}
.multiplayer-chat-messages{
  max-height:220px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.13);
  background:rgba(2,8,23,.26);
}
.multiplayer-chat-message{
  max-width:86%;
  align-self:flex-start;
  padding:9px 11px;
  border-radius:15px 15px 15px 5px;
  background:rgba(148,163,184,.10);
  border:1px solid rgba(148,163,184,.12);
}
.multiplayer-chat-message.mine{
  align-self:flex-end;
  border-radius:15px 15px 5px 15px;
  background:rgba(96,165,250,.16);
  border-color:rgba(96,165,250,.22);
}
.multiplayer-chat-meta{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:space-between;
  margin-bottom:3px;
  color:#cbd5e1;
  font-size:11px;
}
.multiplayer-chat-meta strong{ color:#fff; }
.multiplayer-chat-meta span{ color:#94a3b8; }
.multiplayer-chat-text{
  color:#eef4ff;
  font-size:13px;
  line-height:1.38;
  overflow-wrap:anywhere;
}
.multiplayer-chat-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  margin-top:10px;
}
.multiplayer-chat-form input{
  min-width:0;
  width:100%;
  padding:11px 12px;
  border-radius:13px;
  border:1px solid rgba(148,163,184,.20);
  background:rgba(15,23,42,.76);
  color:#eef4ff;
}
.multiplayer-chat-form button{
  border-radius:13px;
  padding:10px 14px;
}
@media (max-width: 820px){
  .multiplayer-chat-form{ grid-template-columns:1fr; }
  .multiplayer-chat-message{ max-width:100%; }
}

/* V1.7.5 — Connexion plus fiable et bouton Rejoindre clarifié */
.multiplayer-entry-panel{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:14px;
  margin:16px 0 12px;
}
.multiplayer-entry-card{
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(96,165,250,.18);
  background:linear-gradient(180deg, rgba(30,41,59,.58), rgba(15,23,42,.42));
}
.multiplayer-entry-title{
  color:#fff;
  font-weight:1000;
  font-size:16px;
  margin-bottom:6px;
}
.multiplayer-entry-card p{
  margin:0 0 12px;
  color:#cbd5e1;
  line-height:1.45;
  font-size:13px;
}
.multiplayer-primary-action,
.multiplayer-join-btn{
  min-height:52px;
  border-radius:16px;
  font-weight:1000;
  letter-spacing:.01em;
  box-shadow:0 14px 28px rgba(37,99,235,.22);
}
.multiplayer-primary-action{ width:100%; }
.multiplayer-join-row{
  display:grid;
  grid-template-columns:minmax(150px, .9fr) minmax(190px, 1fr);
  gap:10px;
  align-items:end;
}
.multiplayer-room-code-label{
  display:block;
  color:#a5f3fc;
  font-size:12px;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:6px;
}
#multiplayerRoomCodeInput{
  height:56px;
  display:block;
  position:relative;
  z-index:2;
  pointer-events:auto;
  user-select:text;
  -webkit-user-select:text;
  width:100%;
  text-align:center;
  font-size:20px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:1000;
  border-color:rgba(34,211,238,.28);
  background:rgba(2,8,23,.32);
  caret-color:#67e8f9;
}
#multiplayerRoomCodeInput::placeholder{ color:transparent; opacity:0; }
.multiplayer-code-help{
  margin-top:8px;
  color:#a5b4fc;
  font-size:12px;
  line-height:1.35;
}
#multiplayerRoomCodeInput:focus{
  outline:none;
  border-color:rgba(34,211,238,.72);
  box-shadow:0 0 0 3px rgba(34,211,238,.12);
}
.multiplayer-join-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  box-shadow:none;
}
.multiplayer-advanced{
  margin:8px 0 14px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.42);
  color:#cbd5e1;
}
.multiplayer-advanced summary{
  cursor:pointer;
  font-weight:900;
  color:#93c5fd;
}
.multiplayer-advanced label{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:10px;
  font-size:13px;
  font-weight:800;
}
.multiplayer-advanced input{
  width:100%;
  padding:11px 12px;
  border-radius:13px;
  border:1px solid rgba(148,163,184,.20);
  background:rgba(15,23,42,.76);
  color:#eef4ff;
}
.multiplayer-advanced-note{
  margin-top:7px;
  color:#94a3b8;
  font-size:12px;
}
.multiplayer-status.error{
  font-weight:800;
}
@media (max-width: 820px){
  .multiplayer-entry-panel,
  .multiplayer-join-row{
    grid-template-columns:1fr;
  }
}

/* V1.8.0 — polish professionnel du mode en ligne */
.multiplayer-room-head.polished{
  padding:14px;
  border-radius:20px;
  border:1px solid rgba(34,211,238,.16);
  background:linear-gradient(135deg, rgba(14,165,233,.12), rgba(79,70,229,.10));
}
.multiplayer-room-sub{
  margin-top:4px;
  color:#a5b4fc;
  font-size:12px;
  letter-spacing:0;
}
.copy-code-btn.copied{
  border-color:rgba(34,197,94,.45);
  background:rgba(34,197,94,.14);
  color:#bbf7d0;
}
.polished-meta span{
  border-color:rgba(96,165,250,.18);
  background:rgba(96,165,250,.10);
}
.polished-list{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.multiplayer-player-line{
  display:flex;
  align-items:center;
  gap:11px;
  position:relative;
  overflow:hidden;
}
.multiplayer-player-line::before,
.multiplayer-peer-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:rgba(96,165,250,.9);
}
.multiplayer-player-line.color-2::before,.multiplayer-peer-card.color-2::before{ background:rgba(34,197,94,.9); }
.multiplayer-player-line.color-3::before,.multiplayer-peer-card.color-3::before{ background:rgba(251,191,36,.95); }
.multiplayer-player-line.color-4::before,.multiplayer-peer-card.color-4::before{ background:rgba(244,114,182,.9); }
.multiplayer-player-line.color-5::before,.multiplayer-peer-card.color-5::before{ background:rgba(168,85,247,.9); }
.multiplayer-player-line.color-6::before,.multiplayer-peer-card.color-6::before{ background:rgba(20,184,166,.9); }
.player-avatar{
  flex:0 0 auto;
  width:38px;
  height:38px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:1000;
  letter-spacing:.04em;
  background:linear-gradient(135deg, rgba(96,165,250,.88), rgba(34,211,238,.78));
  box-shadow:0 10px 20px rgba(2,8,23,.24);
}
.small-avatar{ width:30px; height:30px; border-radius:11px; font-size:12px; }
.player-line-main{ min-width:0; }
.player-line-name{ color:#fff; margin-bottom:3px; }
.connection-dot{
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:999px;
  margin-right:4px;
  background:#94a3b8;
  box-shadow:0 0 0 3px rgba(148,163,184,.12);
}
.connection-dot.online{
  background:#22c55e;
  box-shadow:0 0 0 3px rgba(34,197,94,.15), 0 0 12px rgba(34,197,94,.35);
}
.connection-dot.offline{
  background:#ef4444;
  box-shadow:0 0 0 3px rgba(239,68,68,.12);
}
.polished-actions{
  padding-top:2px;
}
.multiplayer-start-button:not(:disabled){
  background:linear-gradient(90deg, rgba(34,197,94,.95), rgba(34,211,238,.88));
  box-shadow:0 18px 34px rgba(34,197,94,.20), 0 0 22px rgba(34,211,238,.12);
}
.multiplayer-peer-card{
  position:relative;
  overflow:hidden;
}
.multiplayer-peer-card .peer-top{
  justify-content:flex-start;
}
.multiplayer-notifications{
  position:fixed;
  right:18px;
  top:18px;
  z-index:26000;
  display:grid;
  gap:9px;
  width:min(360px, calc(100vw - 36px));
  pointer-events:none;
}
.multiplayer-notice{
  transform:translateY(-8px);
  opacity:0;
  padding:11px 13px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.20);
  background:rgba(15,23,42,.94);
  color:#eef4ff;
  box-shadow:0 18px 42px rgba(2,8,23,.42);
  font-size:13px;
  font-weight:800;
  transition:opacity .22s ease, transform .22s ease;
}
.multiplayer-notice.show{ transform:translateY(0); opacity:1; }
.multiplayer-notice.success{ border-color:rgba(34,197,94,.32); background:rgba(20,83,45,.94); color:#dcfce7; }
.multiplayer-notice.error{ border-color:rgba(239,68,68,.32); background:rgba(127,29,29,.94); color:#fee2e2; }
.multiplayer-notice.info{ border-color:rgba(96,165,250,.30); background:rgba(30,41,59,.96); color:#dbeafe; }
@media (max-width: 820px){
  .polished-list{ grid-template-columns:1fr; }
  .multiplayer-notifications{ left:12px; right:12px; top:12px; width:auto; }
}

/* V1.8.1 — entrée solo/en ligne, invitation, classement et documentation production */
.firequest-mode-chooser{
  margin:16px 0;
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(96,165,250,.24);
  background:linear-gradient(135deg, rgba(14,165,233,.11), rgba(79,70,229,.09));
  box-shadow:0 16px 42px rgba(2,8,23,.16);
}
.mode-chooser-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.mode-chooser-head h3{
  margin:4px 0 0;
  color:#fff;
  font-size:20px;
}
.mode-chooser-badge{
  padding:6px 10px;
  border-radius:999px;
  background:rgba(34,211,238,.12);
  border:1px solid rgba(34,211,238,.22);
  color:#a5f3fc;
  font-size:12px;
  font-weight:900;
}
.mode-chooser-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.mode-choice-card{
  text-align:left;
  border-radius:18px;
  padding:14px;
  min-height:96px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(15,23,42,.48);
  color:#e2e8f0;
  box-shadow:none;
}
.mode-choice-card strong{
  display:block;
  color:#fff;
  font-size:17px;
  margin-bottom:6px;
}
.mode-choice-card span{
  display:block;
  color:#cbd5e1;
  line-height:1.35;
  font-size:13px;
}
.mode-choice-card.active,
.mode-choice-card:hover{
  border-color:rgba(34,211,238,.46);
  background:linear-gradient(135deg, rgba(14,165,233,.20), rgba(37,99,235,.12));
  transform:translateY(-1px);
}
.mode-choice-card.online{
  border-color:rgba(34,197,94,.22);
}
.multiplayer-howto-card{
  margin:12px 0 14px;
  padding:13px 14px;
  border-radius:18px;
  border:1px solid rgba(34,211,238,.16);
  background:rgba(34,211,238,.065);
}
.multiplayer-howto-title{
  color:#fff;
  font-weight:1000;
  margin-bottom:7px;
}
.multiplayer-howto-card ol{
  margin:0;
  padding-left:18px;
  color:#cbd5e1;
  line-height:1.45;
  font-size:13px;
}
.multiplayer-room-buttons{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:190px;
}
.invite-code-btn.copied{
  border-color:rgba(34,197,94,.45);
  background:rgba(34,197,94,.14);
  color:#bbf7d0;
}
.multiplayer-ranking{
  margin:13px 0 6px;
  padding:13px;
  border-radius:18px;
  border:1px solid rgba(251,191,36,.18);
  background:linear-gradient(135deg, rgba(251,191,36,.10), rgba(14,165,233,.06));
}
.ranking-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:9px;
}
.ranking-head strong{ color:#fff; }
.ranking-head span{ color:#fef3c7; font-size:12px; }
.ranking-list{ display:grid; gap:7px; }
.ranking-row{
  display:grid;
  grid-template-columns:46px minmax(90px,.8fr) minmax(180px,1.4fr);
  gap:9px;
  align-items:center;
  padding:8px 10px;
  border-radius:13px;
  background:rgba(15,23,42,.48);
  border:1px solid rgba(148,163,184,.11);
  color:#cbd5e1;
  font-size:13px;
}
.ranking-row strong{ color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ranking-row.leader{
  border-color:rgba(251,191,36,.30);
  background:rgba(251,191,36,.10);
}
.ranking-place{
  color:#fde68a;
  font-weight:1000;
}
@media (max-width: 820px){
  .mode-chooser-grid,
  .ranking-row{ grid-template-columns:1fr; }
  .mode-chooser-head,
  .ranking-head,
  .multiplayer-room-head.polished{ align-items:stretch; flex-direction:column; }
  .multiplayer-room-buttons{ min-width:0; width:100%; }
}


/* V1.8.2 — corrections UX : choix solo en deux temps et lobby compact après création de salle */
body.firequest-awaiting-mode #introOverlay .intro-profile-choice,
body.firequest-awaiting-mode #introOverlay .intro-config-grid,
body.firequest-awaiting-mode #introOverlay .intro-tutorial-choice{
  display:none !important;
}
body.firequest-awaiting-mode .firequest-mode-chooser{
  border-color:rgba(34,211,238,.36);
  background:linear-gradient(135deg, rgba(14,165,233,.18), rgba(79,70,229,.12));
}
body.firequest-solo-mode-selected .firequest-mode-chooser{
  padding:12px 14px;
  background:rgba(34,211,238,.075);
}
body.firequest-solo-mode-selected .firequest-mode-chooser .mode-chooser-head{
  margin-bottom:8px;
}
body.firequest-solo-mode-selected .firequest-mode-chooser .mode-chooser-badge::after{
  content:' sélectionné';
}
.multiplayer-card.has-room{
  width:min(1040px, calc(100vw - 24px));
  padding:18px;
  max-height:min(94vh, 820px);
}
.multiplayer-card.has-room .multiplayer-lead,
.multiplayer-card.has-room .multiplayer-howto-card,
.multiplayer-card.has-room .multiplayer-grid,
.multiplayer-card.has-room .multiplayer-entry-panel,
.multiplayer-card.has-room .multiplayer-advanced{
  display:none !important;
}
.multiplayer-card.has-room h2{
  margin-bottom:4px;
  font-size:26px;
}
.multiplayer-card.has-room .multiplayer-kicker{
  margin-bottom:8px;
}
.multiplayer-card.has-room .multiplayer-status{
  margin:8px 0 10px;
  padding:8px 10px;
}
.multiplayer-card.has-room .multiplayer-lobby,
.multiplayer-card.has-room .multiplayer-chat,
.multiplayer-card.has-room .multiplayer-peers{
  margin-top:10px;
  padding:12px;
}
.multiplayer-card.has-room .multiplayer-room-code{
  font-size:28px;
}
.multiplayer-card.has-room .multiplayer-player-list,
.multiplayer-card.has-room .multiplayer-peer-grid{
  gap:8px;
}
.multiplayer-card.has-room .multiplayer-note{
  margin-top:8px;
  font-size:12px;
}
.multiplayer-card.has-room .multiplayer-chat-messages{
  max-height:132px;
}
.multiplayer-card.has-room .peer-bars{
  display:none;
}
.multiplayer-card.has-room .peer-stats{
  margin-bottom:0;
}
.ranking-row span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (min-width: 900px){
  .multiplayer-card.has-room .multiplayer-lobby,
  .multiplayer-card.has-room .multiplayer-chat,
  .multiplayer-card.has-room .multiplayer-peers{
    max-width:100%;
  }
}

/* V1.8.3 — sélection solo visible + formule de score lisible */
.mode-choice-card{
  position:relative;
  transition:border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.mode-choice-card.is-selected,
.mode-choice-card[aria-pressed="true"]{
  border-color:rgba(34,211,238,.88) !important;
  background:linear-gradient(135deg, rgba(34,211,238,.25), rgba(37,99,235,.22), rgba(15,23,42,.72)) !important;
  box-shadow:0 0 0 2px rgba(34,211,238,.14), 0 18px 40px rgba(14,165,233,.16);
  transform:translateY(-2px);
}
.mode-choice-card.is-selected strong,
.mode-choice-card[aria-pressed="true"] strong{
  color:#a5f3fc;
}
.mode-selected-label{
  display:none;
  margin-top:10px;
  width:max-content;
  max-width:100%;
  padding:5px 9px;
  border-radius:999px;
  border:1px solid rgba(34,211,238,.30);
  background:rgba(34,211,238,.12);
  color:#cffafe;
  font-style:normal;
  font-size:11px;
  font-weight:1000;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.mode-choice-card.is-selected .mode-selected-label,
.mode-choice-card[aria-pressed="true"] .mode-selected-label{
  display:inline-block;
}
.ranking-row{
  grid-template-columns:46px minmax(90px,.65fr) minmax(180px,1.35fr);
}
.ranking-score-detail{
  grid-column:3 / 4;
  color:#94a3b8;
  font-size:11px;
  line-height:1.25;
}
@media (max-width: 820px){
  .ranking-score-detail{ grid-column:auto; }
}

/* V1.8.4 — ergonomie une seule face + progression persistante sur l'écran principal */
.multiplayer-card.has-room{
  width:min(1120px, calc(100vw - 18px));
  max-height:min(96vh, 850px);
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr);
  grid-template-areas:
    "top top"
    "status status"
    "lobby chat"
    "peers peers";
  gap:8px 12px;
  padding:14px;
}
.multiplayer-card.has-room .multiplayer-close{ top:10px; right:10px; }
.multiplayer-card.has-room .multiplayer-kicker{ grid-area:top; width:max-content; margin:0; }
.multiplayer-card.has-room h2{ grid-area:top; margin:0 48px 0 178px; line-height:1.15; font-size:24px; align-self:center; }
.multiplayer-card.has-room .multiplayer-status{ grid-area:status; margin:0; padding:7px 10px; font-size:13px; }
.multiplayer-card.has-room .multiplayer-lobby{ grid-area:lobby; margin:0; padding:10px; min-height:0; }
.multiplayer-card.has-room .multiplayer-chat{ grid-area:chat; margin:0; padding:10px; min-height:0; }
.multiplayer-card.has-room .multiplayer-peers{ grid-area:peers; margin:0; padding:10px; min-height:0; border-radius:18px; border:1px solid rgba(96,165,250,.18); background:rgba(96,165,250,.045); }
.multiplayer-card.has-room .multiplayer-room-head.polished{ padding:10px; border-radius:16px; }
.multiplayer-card.has-room .multiplayer-room-code{ font-size:24px; line-height:1; }
.multiplayer-card.has-room .multiplayer-room-buttons{ min-width:150px; gap:6px; }
.multiplayer-card.has-room .multiplayer-room-buttons button{ min-height:36px; padding:7px 10px; font-size:12px; }
.multiplayer-card.has-room .multiplayer-room-meta{ margin:7px 0; gap:6px; }
.multiplayer-card.has-room .multiplayer-room-meta span{ padding:4px 7px; font-size:11px; }
.multiplayer-card.has-room .multiplayer-player-list{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.multiplayer-card.has-room .multiplayer-player-line{ padding:7px 8px; border-radius:12px; gap:7px; }
.multiplayer-card.has-room .player-avatar{ width:30px; height:30px; border-radius:11px; font-size:12px; }
.multiplayer-card.has-room .small{ font-size:10.5px; line-height:1.2; }
.multiplayer-card.has-room .multiplayer-actions-row{ margin:8px 0 0; gap:7px; }
.multiplayer-card.has-room .multiplayer-start-button,
.multiplayer-card.has-room #multiplayerLeaveBtn{ min-height:38px; padding:8px 11px; font-size:12px; }
.multiplayer-card.has-room .multiplayer-ranking{ margin:8px 0 0; padding:9px; border-radius:14px; }
.multiplayer-card.has-room .ranking-head{ margin-bottom:6px; }
.multiplayer-card.has-room .ranking-head span{ font-size:10.5px; }
.multiplayer-card.has-room .ranking-list{ gap:5px; }
.multiplayer-card.has-room .ranking-row{ padding:6px 8px; border-radius:11px; grid-template-columns:34px minmax(70px,.55fr) minmax(160px,1.45fr); font-size:11.5px; }
.multiplayer-card.has-room .ranking-score-detail{ display:none; }
.multiplayer-card.has-room .multiplayer-chat-head{ margin-bottom:6px; }
.multiplayer-card.has-room .multiplayer-chat-head h3{ font-size:15px; }
.multiplayer-card.has-room .multiplayer-chat-messages{ max-height:168px; padding:7px; gap:6px; }
.multiplayer-card.has-room .multiplayer-chat-message{ padding:7px 9px; }
.multiplayer-card.has-room .multiplayer-chat-form{ margin-top:7px; gap:7px; grid-template-columns:1fr auto; }
.multiplayer-card.has-room .multiplayer-chat-form input{ padding:9px 10px; }
.multiplayer-card.has-room .multiplayer-chat-form button{ padding:8px 11px; }
.multiplayer-card.has-room .multiplayer-chat-note{ display:none; }
.multiplayer-card.has-room .multiplayer-peers h3{ font-size:15px; margin-bottom:7px; }
.multiplayer-card.has-room .multiplayer-peer-grid.compact-peers{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.multiplayer-peer-card.compact{ padding:9px; border-radius:14px; }
.multiplayer-peer-card.compact .peer-top{ gap:6px; }
.multiplayer-peer-card.compact .peer-status{ margin:3px 0 6px; font-size:11px; }
.compact-stats{ grid-template-columns:1fr 1fr; gap:5px; }
.compact-stats span{ padding:6px; font-size:10.5px; }
.compact-stats b{ font-size:12px; }
.multiplayer-live-panel{
  position:fixed;
  right:12px;
  top:84px;
  z-index:15350;
  width:300px;
  max-height:calc(100vh - 106px);
  overflow:auto;
  padding:10px;
  border-radius:18px;
  border:1px solid rgba(34,211,238,.22);
  background:linear-gradient(180deg, rgba(15,23,42,.94), rgba(15,23,42,.84));
  box-shadow:0 22px 54px rgba(2,8,23,.45), 0 0 0 1px rgba(255,255,255,.035) inset;
  color:#e5edf9;
  backdrop-filter:blur(7px);
}
body.multiplayer-open .multiplayer-live-panel{ display:none !important; }
.live-panel-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.live-panel-head strong{ display:block; color:#fff; font-size:13px; line-height:1.15; }
.live-panel-head span{ display:block; color:#a5b4fc; font-size:10.5px; margin-top:2px; }
.live-panel-head button{ padding:6px 9px; border-radius:11px; font-size:11px; min-height:auto; }
.live-panel-list{ display:grid; gap:6px; }
.live-player-row{
  position:relative;
  overflow:hidden;
  padding:7px 8px 7px 10px;
  border-radius:13px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(15,23,42,.56);
}
.live-player-row::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:rgba(96,165,250,.9); }
.live-player-row.color-2::before{ background:rgba(34,197,94,.9); }
.live-player-row.color-3::before{ background:rgba(251,191,36,.95); }
.live-player-row.color-4::before{ background:rgba(244,114,182,.9); }
.live-player-row.color-5::before{ background:rgba(168,85,247,.9); }
.live-player-row.color-6::before{ background:rgba(20,184,166,.9); }
.live-player-row.self{ border-color:rgba(34,211,238,.34); background:rgba(34,211,238,.075); }
.live-player-main{ display:flex; align-items:center; gap:7px; min-width:0; }
.live-rank{ color:#fde68a; font-weight:1000; font-size:12px; min-width:24px; }
.tiny-avatar{ width:24px !important; height:24px !important; border-radius:9px !important; font-size:10px !important; }
.live-name{ min-width:0; flex:1; }
.live-name strong{ display:block; color:#fff; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-name small{ display:block; color:#cbd5e1; font-size:10.5px; margin-top:1px; }
.live-player-stats{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:4px; margin-top:6px; }
.live-player-stats span{ padding:4px 5px; border-radius:8px; background:rgba(148,163,184,.08); color:#dbeafe; font-size:10px; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.live-panel-foot{ margin-top:7px; color:#94a3b8; font-size:10px; line-height:1.25; }
.multiplayer-mini-hud{ display:none !important; }
@media (max-width: 1180px){
  .multiplayer-live-panel{ width:260px; top:auto; bottom:12px; max-height:42vh; }
}
@media (max-width: 900px){
  .multiplayer-card.has-room{ display:block; overflow:auto; max-height:92vh; }
  .multiplayer-card.has-room .multiplayer-peer-grid.compact-peers,
  .multiplayer-card.has-room .multiplayer-player-list{ grid-template-columns:1fr; }
  .multiplayer-live-panel{ left:10px; right:10px; bottom:10px; top:auto; width:auto; max-height:38vh; }
  .live-player-stats{ grid-template-columns:1fr 1fr; }
}

/* V1.8.5 — Ergonomie : écrans compacts et panneau progression intégré */
body.firequest-solo-mode-selected #introOverlay .intro-topline,
body.firequest-online-mode-selected #introOverlay .intro-topline,
body.firequest-solo-mode-selected #introOverlay .intro-lead,
body.firequest-online-mode-selected #introOverlay .intro-lead,
body.firequest-solo-mode-selected #introOverlay .fire-principles-grid,
body.firequest-online-mode-selected #introOverlay .fire-principles-grid{
  display:none !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-card,
body.firequest-online-mode-selected #introOverlay .intro-card{
  width:min(1040px, calc(100vw - 24px));
  max-height:calc(100vh - 22px);
  overflow:hidden;
  padding:18px 20px;
}
body.firequest-solo-mode-selected #introOverlay .firequest-mode-chooser,
body.firequest-online-mode-selected #introOverlay .firequest-mode-chooser{
  margin:0 0 12px;
  padding:12px;
}
body.firequest-solo-mode-selected #introOverlay .mode-chooser-head,
body.firequest-online-mode-selected #introOverlay .mode-chooser-head{
  margin-bottom:8px;
}
body.firequest-solo-mode-selected #introOverlay .mode-chooser-head h3,
body.firequest-online-mode-selected #introOverlay .mode-chooser-head h3{
  font-size:18px;
}
body.firequest-solo-mode-selected #introOverlay .mode-choice-card,
body.firequest-online-mode-selected #introOverlay .mode-choice-card{
  min-height:70px;
  padding:11px 12px;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-choice,
body.firequest-solo-mode-selected #introOverlay .intro-config-grid,
body.firequest-solo-mode-selected #introOverlay .intro-tutorial-choice{
  margin-top:10px;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-grid{
  gap:8px;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-card{
  padding:10px 12px;
  min-height:auto;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-card span,
body.firequest-solo-mode-selected #introOverlay .intro-profile-card small{
  line-height:1.22;
}
body.firequest-solo-mode-selected #introOverlay .intro-config-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.multiplayer-card:not(.has-room){
  width:min(1120px, calc(100vw - 20px));
  max-height:calc(100vh - 20px);
  overflow:hidden;
  padding:16px;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:
    "head head"
    "status status"
    "identity identity"
    "create join";
  gap:10px 14px;
}
.multiplayer-card:not(.has-room) .multiplayer-close{ top:10px; right:10px; }
.multiplayer-card:not(.has-room) .multiplayer-kicker,
.multiplayer-card:not(.has-room) #multiplayerTitle,
.multiplayer-card:not(.has-room) .multiplayer-lead,
.multiplayer-card:not(.has-room) .multiplayer-howto-card{
  grid-area:head;
}
.multiplayer-card:not(.has-room) .multiplayer-kicker{ margin:0; width:max-content; }
.multiplayer-card:not(.has-room) #multiplayerTitle{ margin:30px 44px 2px 0; font-size:26px; line-height:1.1; }
.multiplayer-card:not(.has-room) .multiplayer-lead{ margin:62px 44px 0 0; font-size:13px; line-height:1.28; }
.multiplayer-card:not(.has-room) .multiplayer-howto-card{
  justify-self:end;
  align-self:start;
  width:min(420px, 42vw);
  margin:0 46px 0 0;
  padding:10px 12px;
}
.multiplayer-card:not(.has-room) .multiplayer-howto-title{ margin-bottom:4px; font-size:14px; }
.multiplayer-card:not(.has-room) .multiplayer-howto-card ol{ font-size:12px; line-height:1.25; }
.multiplayer-card:not(.has-room) .multiplayer-status{ grid-area:status; margin:0; padding:8px 10px; }
.multiplayer-card:not(.has-room) .multiplayer-grid{ grid-area:identity; margin:0; }
.multiplayer-card:not(.has-room) .multiplayer-entry-panel{
  display:contents;
}
.multiplayer-card:not(.has-room) .multiplayer-create-card{ grid-area:create; }
.multiplayer-card:not(.has-room) .multiplayer-join-card{ grid-area:join; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card{ padding:13px; border-radius:18px; }
.multiplayer-card:not(.has-room) .multiplayer-entry-title{ font-size:15px; margin-bottom:4px; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card p{ font-size:12px; line-height:1.28; margin-bottom:9px; }
.multiplayer-card:not(.has-room) .multiplayer-primary-action,
.multiplayer-card:not(.has-room) .multiplayer-join-btn{ min-height:44px; border-radius:14px; }
.multiplayer-card:not(.has-room) .multiplayer-join-row{ grid-template-columns:minmax(160px,.8fr) minmax(180px,1fr); }
.multiplayer-card:not(.has-room) #multiplayerRoomCodeInput{ height:46px; font-size:18px; }
.multiplayer-card:not(.has-room) .multiplayer-code-help{ font-size:11px; line-height:1.25; margin-top:6px; }
.multiplayer-card:not(.has-room) .multiplayer-advanced{ display:none !important; }

.multiplayer-live-panel.in-main-sidebar{
  position:static !important;
  z-index:auto;
  width:auto;
  max-height:none;
  overflow:visible;
  margin:0;
  padding:10px;
  border-radius:18px;
}
body.multiplayer-open .multiplayer-live-panel.in-main-sidebar{
  display:none !important;
}
.multiplayer-live-panel.in-main-sidebar .live-panel-head{ margin-bottom:6px; }
.multiplayer-live-panel.in-main-sidebar .live-panel-list{ gap:5px; }
.multiplayer-live-panel.in-main-sidebar .live-player-row{ padding:6px 7px 6px 10px; }
.multiplayer-live-panel.in-main-sidebar .live-player-stats{ gap:3px; }
.multiplayer-live-panel.in-main-sidebar .live-panel-foot{ display:none; }
body.multiplayer-live-panel-visible .side-stack .progression-clean-card .progress-row{ margin-bottom:7px; }
body.multiplayer-live-panel-visible .side-stack .progression-clean-card .bar{ height:7px; }
body.multiplayer-live-panel-visible .side-stack .round-snapshot-card{ padding-top:10px; padding-bottom:10px; }

@media (max-width: 900px){
  body.firequest-solo-mode-selected #introOverlay .intro-card,
  body.firequest-online-mode-selected #introOverlay .intro-card,
  .multiplayer-card:not(.has-room){
    overflow:auto;
    max-height:calc(100vh - 18px);
  }
  .multiplayer-card:not(.has-room){
    display:block;
  }
  .multiplayer-card:not(.has-room) .multiplayer-howto-card{
    width:auto;
    margin:8px 0;
  }
  body.firequest-solo-mode-selected #introOverlay .intro-config-grid{
    grid-template-columns:1fr;
  }
}

/* V1.8.6 — Correction urgence ergonomie lobby : lancement toujours accessible */
.multiplayer-card:not(.has-room){
  height:auto !important;
  min-height:auto !important;
  max-height:min(94vh, 680px) !important;
  overflow:visible !important;
  grid-template-columns:1fr 1fr !important;
  grid-template-areas:
    "head status"
    "identity identity"
    "create join" !important;
  align-content:start !important;
  gap:8px 14px !important;
  padding:14px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-kicker,
.multiplayer-card:not(.has-room) #multiplayerTitle,
.multiplayer-card:not(.has-room) .multiplayer-lead{
  grid-area:head !important;
}
.multiplayer-card:not(.has-room) .multiplayer-kicker{ margin:0 !important; }
.multiplayer-card:not(.has-room) #multiplayerTitle{ margin:28px 0 0 !important; font-size:24px !important; line-height:1.05 !important; }
.multiplayer-card:not(.has-room) .multiplayer-lead{ margin:60px 0 0 !important; font-size:12px !important; line-height:1.2 !important; max-width:520px !important; }
.multiplayer-card:not(.has-room) .multiplayer-howto-card{ display:none !important; }
.multiplayer-card:not(.has-room) .multiplayer-status{ grid-area:status !important; align-self:end !important; margin:0 48px 0 0 !important; padding:8px 10px !important; font-size:12px !important; }
.multiplayer-card:not(.has-room) .multiplayer-grid{ gap:10px 14px !important; }
.multiplayer-card:not(.has-room) .multiplayer-grid label{ font-size:13px !important; }
.multiplayer-card:not(.has-room) .multiplayer-grid input,
.multiplayer-card:not(.has-room) .multiplayer-grid select{ min-height:42px !important; padding:9px 12px !important; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card{ padding:12px !important; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card p{ margin:0 0 8px !important; }
.multiplayer-card:not(.has-room) .multiplayer-primary-action,
.multiplayer-card:not(.has-room) .multiplayer-join-btn{ min-height:42px !important; }

.multiplayer-card.has-room{
  height:auto !important;
  max-height:min(96vh, 720px) !important;
  overflow:visible !important;
  grid-template-columns:minmax(0,1fr) minmax(300px,.82fr) !important;
  grid-template-areas:
    "top status"
    "lobby chat" !important;
  gap:8px 10px !important;
  align-content:start !important;
  padding:12px !important;
}
.multiplayer-card.has-room .multiplayer-kicker{ display:none !important; }
.multiplayer-card.has-room h2{ grid-area:top !important; margin:0 !important; font-size:22px !important; }
.multiplayer-card.has-room .multiplayer-status{ grid-area:status !important; align-self:center !important; margin:0 46px 0 0 !important; padding:7px 10px !important; font-size:12px !important; }
.multiplayer-card.has-room .multiplayer-lobby{ padding:9px !important; }
.multiplayer-card.has-room .multiplayer-chat{ padding:9px !important; }
.multiplayer-card.has-room .multiplayer-room-head.polished{ padding:8px !important; gap:8px !important; }
.multiplayer-card.has-room .multiplayer-room-code{ font-size:21px !important; }
.multiplayer-card.has-room .multiplayer-room-sub{ display:none !important; }
.multiplayer-card.has-room .multiplayer-room-buttons{ min-width:172px !important; gap:5px !important; }
.multiplayer-card.has-room .multiplayer-room-buttons button{ min-height:32px !important; padding:6px 9px !important; font-size:11px !important; }
.multiplayer-card.has-room .top-start{ order:-2; background:linear-gradient(135deg,#2563eb,#38bdf8) !important; color:white !important; font-weight:1000 !important; }
.multiplayer-card.has-room .multiplayer-room-meta{ margin:6px 0 !important; }
.multiplayer-card.has-room .multiplayer-room-meta span{ padding:3px 6px !important; font-size:10.5px !important; }
.multiplayer-card.has-room .multiplayer-player-list{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:5px !important; }
.multiplayer-card.has-room .multiplayer-player-line{ padding:6px 7px !important; }
.multiplayer-card.has-room .multiplayer-actions-row.lobby-actions{ display:none !important; }
.multiplayer-card.has-room .multiplayer-ranking{ margin-top:6px !important; padding:7px !important; }
.multiplayer-card.has-room .ranking-head{ margin-bottom:4px !important; }
.multiplayer-card.has-room .ranking-head span{ display:none !important; }
.multiplayer-card.has-room .ranking-row{ padding:5px 7px !important; font-size:11px !important; grid-template-columns:30px minmax(65px,.55fr) minmax(155px,1.45fr) !important; }
.multiplayer-card.has-room .multiplayer-chat-messages{ max-height:118px !important; min-height:74px !important; }
.multiplayer-card.has-room .multiplayer-chat-head span{ display:none !important; }
.multiplayer-card.has-room .multiplayer-chat-form input{ min-height:38px !important; }
.multiplayer-card.has-room .multiplayer-chat-form button{ min-height:38px !important; }
.multiplayer-card.has-room .multiplayer-peers{ display:none !important; }

/* Le panneau permanent ne doit jamais recouvrir le jeu : il reste dans la colonne latérale quand elle existe. */
.multiplayer-live-panel:not(.in-main-sidebar){
  right:auto !important;
  left:12px !important;
  top:auto !important;
  bottom:12px !important;
  width:280px !important;
  max-height:34vh !important;
}

@media (max-width: 900px){
  .multiplayer-card:not(.has-room),
  .multiplayer-card.has-room{
    display:block !important;
    max-height:94vh !important;
    overflow:auto !important;
  }
  .multiplayer-card.has-room .multiplayer-actions-row.lobby-actions{ display:flex !important; }
}

/* V1.8.7 — vraie correction ergonomique : écran solo et lobby en une face */
body.firequest-solo-mode-selected #introOverlay .intro-card{
  width:min(1100px, calc(100vw - 24px)) !important;
  max-height:calc(100vh - 18px) !important;
  overflow:hidden !important;
  padding:14px 16px !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-topline,
body.firequest-solo-mode-selected #introOverlay .intro-lead,
body.firequest-solo-mode-selected #introOverlay .fire-principles-grid,
body.firequest-solo-mode-selected #introOverlay .firequest-mode-chooser{
  display:none !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-choice{
  margin:0 !important;
  padding:10px 12px !important;
  border-radius:16px !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-text{
  display:none !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-choice-kicker{
  margin-bottom:6px !important;
  font-size:11px !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:8px !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-card{
  min-height:86px !important;
  padding:10px 11px !important;
  gap:3px !important;
  border-radius:14px !important;
  transform:none !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-profile-card strong{ font-size:14px !important; }
body.firequest-solo-mode-selected #introOverlay .intro-profile-card span{ font-size:11.5px !important; line-height:1.22 !important; }
body.firequest-solo-mode-selected #introOverlay .intro-profile-card small{ font-size:10.5px !important; line-height:1.18 !important; }
body.firequest-solo-mode-selected #introOverlay .intro-profile-selected-label{ font-size:9px !important; padding:3px 6px !important; }
body.firequest-solo-mode-selected #introOverlay .intro-config-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  margin:8px 0 0 !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-config-card{
  padding:9px 10px !important;
  border-radius:14px !important;
}
body.firequest-solo-mode-selected #introOverlay .challenge-select,
body.firequest-solo-mode-selected #introOverlay .intro-config-card button{
  min-height:38px !important;
  padding:8px 10px !important;
  margin-top:5px !important;
}
body.firequest-solo-mode-selected #introOverlay .challenge-desc,
body.firequest-solo-mode-selected #introOverlay .intro-config-card .small,
body.firequest-solo-mode-selected #introOverlay .intro-config-card p{
  font-size:11.5px !important;
  line-height:1.24 !important;
  margin:4px 0 0 !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-tutorial-choice{
  margin-top:8px !important;
  padding:10px 12px !important;
  border-radius:16px !important;
}
body.firequest-solo-mode-selected #introOverlay #tutorialChoiceText{
  margin:0 !important;
  font-size:12px !important;
  line-height:1.28 !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-choice-actions{
  margin-top:8px !important;
  gap:8px !important;
}
body.firequest-solo-mode-selected #introOverlay .intro-choice-actions button{
  min-height:42px !important;
  padding:9px 10px !important;
  margin:0 !important;
}

/* Multijoueur avant salle : aucun scroll nécessaire sur écran desktop standard. */
.multiplayer-card:not(.has-room){
  width:min(1040px, calc(100vw - 24px)) !important;
  max-height:calc(100vh - 20px) !important;
  overflow:hidden !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  grid-template-areas:
    "status status"
    "identity identity"
    "create join" !important;
  gap:10px 14px !important;
  align-content:start !important;
}
.multiplayer-card:not(.has-room) .multiplayer-kicker,
.multiplayer-card:not(.has-room) #multiplayerTitle,
.multiplayer-card:not(.has-room) .multiplayer-lead,
.multiplayer-card:not(.has-room) .multiplayer-howto-card{
  display:none !important;
}
.multiplayer-card:not(.has-room) .multiplayer-status{
  grid-area:status !important;
  margin:0 46px 0 0 !important;
  padding:8px 10px !important;
  font-size:12px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-grid{
  grid-area:identity !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  margin:0 !important;
}
.multiplayer-card:not(.has-room) .multiplayer-grid input,
.multiplayer-card:not(.has-room) .multiplayer-grid select{
  min-height:40px !important;
  padding:8px 11px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-entry-panel{ display:contents !important; }
.multiplayer-card:not(.has-room) .multiplayer-create-card{ grid-area:create !important; }
.multiplayer-card:not(.has-room) .multiplayer-join-card{ grid-area:join !important; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card{
  padding:12px !important;
  border-radius:16px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-entry-title{ font-size:15px !important; margin:0 0 4px !important; }
.multiplayer-card:not(.has-room) .multiplayer-entry-card p{ font-size:12px !important; line-height:1.25 !important; margin:0 0 8px !important; }
.multiplayer-card:not(.has-room) .multiplayer-primary-action,
.multiplayer-card:not(.has-room) .multiplayer-join-btn{
  min-height:42px !important;
  margin:0 !important;
}
.multiplayer-card:not(.has-room) .multiplayer-join-row{
  grid-template-columns:minmax(130px,.72fr) minmax(180px,1fr) !important;
  gap:10px !important;
}
.multiplayer-card:not(.has-room) #multiplayerRoomCodeInput{
  height:42px !important;
  min-height:42px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-code-help{
  font-size:10.8px !important;
  line-height:1.2 !important;
  margin-top:5px !important;
}
.multiplayer-card:not(.has-room) .multiplayer-advanced{ display:none !important; }

/* Salle créée : bouton lancer/code/chat/classement visibles sans aller chercher en bas. */
.multiplayer-card.has-room{
  width:min(1120px, calc(100vw - 24px)) !important;
  max-height:calc(100vh - 20px) !important;
  overflow:hidden !important;
  padding:12px !important;
  display:grid !important;
  grid-template-columns:minmax(0, 1.12fr) minmax(320px, .88fr) !important;
  grid-template-areas:
    "status status"
    "lobby chat" !important;
  gap:10px !important;
  align-content:start !important;
}
.multiplayer-card.has-room .multiplayer-kicker,
.multiplayer-card.has-room #multiplayerTitle,
.multiplayer-card.has-room .multiplayer-lead,
.multiplayer-card.has-room .multiplayer-howto-card{
  display:none !important;
}
.multiplayer-card.has-room .multiplayer-status{
  grid-area:status !important;
  margin:0 46px 0 0 !important;
  padding:7px 10px !important;
  font-size:12px !important;
}
.multiplayer-card.has-room .multiplayer-lobby{ grid-area:lobby !important; margin:0 !important; padding:9px !important; }
.multiplayer-card.has-room .multiplayer-chat{ grid-area:chat !important; margin:0 !important; padding:9px !important; }
.multiplayer-card.has-room .multiplayer-room-head.polished{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto !important;
  gap:8px !important;
  padding:8px !important;
}
.multiplayer-card.has-room .multiplayer-room-code{ font-size:22px !important; line-height:1 !important; }
.multiplayer-card.has-room .multiplayer-room-sub{ display:none !important; }
.multiplayer-card.has-room .multiplayer-room-buttons{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:5px !important; min-width:250px !important; }
.multiplayer-card.has-room .multiplayer-room-buttons .top-start{ grid-column:1 / -1 !important; min-height:36px !important; }
.multiplayer-card.has-room .multiplayer-room-buttons button{ min-height:31px !important; padding:5px 8px !important; font-size:11px !important; }
.multiplayer-card.has-room .multiplayer-room-meta{ margin:6px 0 !important; display:flex !important; flex-wrap:wrap !important; gap:4px !important; }
.multiplayer-card.has-room .multiplayer-room-meta span{ font-size:10.5px !important; padding:3px 6px !important; }
.multiplayer-card.has-room .multiplayer-player-list{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:5px !important; }
.multiplayer-card.has-room .multiplayer-player-line{ padding:6px 7px !important; }
.multiplayer-card.has-room .player-avatar{ width:30px !important; height:30px !important; font-size:11px !important; }
.multiplayer-card.has-room .player-line-name strong{ font-size:12px !important; }
.multiplayer-card.has-room .player-line-main .small{ font-size:10.5px !important; }
.multiplayer-card.has-room .multiplayer-ranking{ margin-top:6px !important; padding:7px !important; }
.multiplayer-card.has-room .ranking-row{ padding:5px 7px !important; font-size:11px !important; }
.multiplayer-card.has-room .ranking-score-detail{ display:none !important; }
.multiplayer-card.has-room .multiplayer-chat-messages{ min-height:80px !important; max-height:130px !important; }
.multiplayer-card.has-room .multiplayer-chat-note{ display:none !important; }
.multiplayer-card.has-room .multiplayer-peers{ display:none !important; }
.multiplayer-card.has-room .lobby-actions{ display:none !important; }

/* Progression en ligne : jamais flottante par-dessus le jeu. */
.multiplayer-live-panel{
  position:static !important;
  inset:auto !important;
  width:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
.multiplayer-live-panel:not(.in-main-sidebar){ display:none !important; }
.multiplayer-live-panel.in-main-sidebar{
  margin-top:10px !important;
  padding:9px !important;
  border-radius:16px !important;
}
.multiplayer-live-panel.in-main-sidebar .live-player-row{ padding:5px 6px 5px 9px !important; }
.multiplayer-live-panel.in-main-sidebar .live-player-stats{ grid-template-columns:1fr 1fr !important; }
.multiplayer-live-panel.in-main-sidebar .live-player-stats span:nth-child(3){ grid-column:1 / -1 !important; }

@media (max-width: 1050px){
  body.firequest-solo-mode-selected #introOverlay .intro-profile-grid{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
  body.firequest-solo-mode-selected #introOverlay .intro-card{ overflow:auto !important; }
  .multiplayer-card:not(.has-room),
  .multiplayer-card.has-room{ overflow:auto !important; display:block !important; }
}

/* V1.8.8 — Affichage multijoueur : zéro superposition, progression intégrée proprement */
.multiplayer-card.has-room .multiplayer-player-line,
.multiplayer-card.has-room .multiplayer-peer-card,
.multiplayer-card.has-room .ranking-row,
.multiplayer-live-panel .live-player-row{
  min-width:0 !important;
}
.multiplayer-card.has-room .player-line-main,
.multiplayer-card.has-room .live-name,
.multiplayer-card.has-room .peer-top,
.multiplayer-card.has-room .peer-stats,
.multiplayer-card.has-room .ranking-row > *{
  min-width:0 !important;
}
.multiplayer-card.has-room .player-line-name{
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  flex-wrap:wrap !important;
  line-height:1.15 !important;
}
.multiplayer-card.has-room .player-line-name strong{
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.multiplayer-card.has-room .host-badge,
.multiplayer-card.has-room .self-badge{
  margin-left:0 !important;
  flex:0 0 auto !important;
}
.multiplayer-card.has-room .player-line-main .small{
  display:block !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.multiplayer-card.has-room .ranking-row{
  grid-template-columns:28px minmax(0,.72fr) minmax(0,1.45fr) !important;
  gap:6px !important;
  align-items:center !important;
}
.multiplayer-card.has-room .ranking-row strong,
.multiplayer-card.has-room .ranking-row span:last-child{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.multiplayer-card.has-room .ranking-row span:last-child{
  font-size:10.5px !important;
}

/* La progression en ligne entre dans la carte “Indicateurs joueur”, jamais par-dessus. */
.multiplayer-live-panel.in-player-indicators{
  position:relative !important;
  inset:auto !important;
  z-index:1 !important;
  width:100% !important;
  max-height:none !important;
  overflow:hidden !important;
  margin-top:8px !important;
  padding:8px !important;
  border-radius:14px !important;
  border:1px solid rgba(34,211,238,.20) !important;
  background:linear-gradient(180deg, rgba(15,23,42,.78), rgba(15,23,42,.56)) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.multiplayer-open .multiplayer-live-panel.in-player-indicators{
  display:none !important;
}
body.multiplayer-live-panel-visible .side-stack{
  overflow:hidden !important;
}
body.multiplayer-live-panel-visible .progression-clean-card{
  gap:5px !important;
  overflow:hidden !important;
  padding:12px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .section-title{
  font-size:21px !important;
  margin-bottom:2px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .progress-row{
  padding-top:5px !important;
  margin-bottom:0 !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .progress-head{
  font-size:11.5px !important;
  margin-bottom:3px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .bar{
  height:6px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .focus-row{
  padding:6px 8px 7px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head{
  margin-bottom:6px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head strong{
  font-size:12px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head span{
  font-size:10px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head button{
  padding:5px 8px !important;
  font-size:10px !important;
  border-radius:10px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-list{
  display:grid !important;
  gap:4px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-row{
  padding:5px 6px 5px 8px !important;
  border-radius:10px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-main{
  gap:5px !important;
}
.multiplayer-live-panel.in-player-indicators .live-rank{
  min-width:20px !important;
  font-size:10.5px !important;
}
.multiplayer-live-panel.in-player-indicators .tiny-avatar{
  width:20px !important;
  height:20px !important;
  border-radius:8px !important;
  font-size:9px !important;
}
.multiplayer-live-panel.in-player-indicators .live-name strong{
  font-size:11px !important;
  max-width:100% !important;
}
.multiplayer-live-panel.in-player-indicators .live-name small{
  font-size:9.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats{
  display:grid !important;
  grid-template-columns:1fr 1fr 1fr !important;
  gap:3px !important;
  margin-top:4px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats span{
  padding:3px 4px !important;
  font-size:9px !important;
  border-radius:7px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-foot{
  display:none !important;
}

@media (max-width: 1180px){
  .multiplayer-live-panel.in-player-indicators .live-player-stats{
    grid-template-columns:1fr 1fr !important;
  }
  .multiplayer-live-panel.in-player-indicators .live-player-stats span:nth-child(3){
    grid-column:1 / -1 !important;
  }
}

/* V1.8.10 — multijoueur : cartes anti-superposition et panneau intégré */
.multiplayer-card.has-room *{ box-sizing:border-box; }
.multiplayer-card.has-room{
  grid-template-columns:minmax(0,1fr) minmax(300px,.86fr);
  grid-template-rows:auto auto minmax(0,1fr) auto;
}
.multiplayer-card.has-room .multiplayer-lobby,
.multiplayer-card.has-room .multiplayer-chat,
.multiplayer-card.has-room .multiplayer-peers{
  overflow:hidden;
}
.multiplayer-card.has-room .multiplayer-player-line,
.multiplayer-card.has-room .multiplayer-peer-card,
.live-player-row{
  min-width:0;
}
.player-line-main,
.peer-top.compact strong,
.live-name{
  min-width:0;
  overflow:hidden;
}
.player-line-name,
.peer-top.compact strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.multiplayer-card.has-room .multiplayer-player-list{
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
}
.multiplayer-card.has-room .multiplayer-peer-grid.compact-peers{
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
}
.multiplayer-card.has-room .compact-stats{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.compact-stats span,
.live-player-stats span,
.peer-stats span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.multiplayer-live-panel.in-player-indicators,
.multiplayer-live-panel.in-main-sidebar{
  position:static;
  width:100%;
  max-height:none;
  margin-top:12px;
  overflow:visible;
  box-shadow:0 14px 30px rgba(2,8,23,.24), 0 0 0 1px rgba(255,255,255,.035) inset;
}
.multiplayer-live-panel.in-player-indicators .live-panel-list,
.multiplayer-live-panel.in-main-sidebar .live-panel-list{
  display:grid;
  grid-template-columns:1fr;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats,
.multiplayer-live-panel.in-main-sidebar .live-player-stats{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px){
  .multiplayer-card.has-room{ display:block; overflow:auto; }
  .multiplayer-card.has-room .multiplayer-lobby,
  .multiplayer-card.has-room .multiplayer-chat,
  .multiplayer-card.has-room .multiplayer-peers{ margin-top:10px; }
}
@media (max-width: 520px){
  .multiplayer-card.has-room .multiplayer-room-head.polished{ display:block; }
  .multiplayer-card.has-room .multiplayer-room-buttons{ margin-top:10px; }
  .multiplayer-card.has-room .compact-stats,
  .multiplayer-live-panel.in-player-indicators .live-player-stats,
  .multiplayer-live-panel.in-main-sidebar .live-player-stats{ grid-template-columns:1fr; }
}


/* ---- css/modules/180-visual-lighten-and-dashboard-cleanup.css ---- */
/* V1.8.9 — Éclaircissement léger de l'identité visuelle sans changer le fond bleu. */
.card,
.action-card,
.history-item,
.market-card,
.goal-card,
.event-card,
.tutorial-card,
.condition-card,
.stat {
  background: linear-gradient(180deg, rgba(30, 41, 59, .91), rgba(15, 23, 42, .76)) !important;
  border-color: rgba(191, 219, 254, .24) !important;
}

.command-center-card,
.risk-card,
.progression-clean-card,
.round-snapshot-card,
.profile-card,
.goals-grid-panel,
#actionsPanel > .card,
#portfolioPanel .card,
#guidePanel .card {
  background: linear-gradient(180deg, rgba(30, 41, 59, .93), rgba(15, 23, 42, .78)) !important;
}

.small,
.action-limit,
.choice-hint,
.progress-head,
.snapshot-label {
  color: rgba(226, 232, 240, .88) !important;
}

.pill {
  background: rgba(96, 165, 250, .18) !important;
  border-color: rgba(147, 197, 253, .24) !important;
}


/* ---- css/modules/190-feedback-clarity-polish.css ---- */
/* V1.8.11 — clarté pédagogique : score bancaire, feedback actions, événements narratifs, panneaux légèrement éclaircis */
.metric-help{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  margin-left:5px;
  border-radius:999px;
  border:1px solid rgba(147,197,253,.45);
  background:rgba(59,130,246,.18);
  color:#dbeafe;
  font-size:11px;
  font-weight:900;
  cursor:help;
  vertical-align:middle;
}
.metric-explain{
  margin:3px 0 6px;
  color:#cbd5e1;
  font-size:11px;
  line-height:1.25;
  opacity:.92;
}

#journalText .journal-feedback{
  display:grid;
  gap:7px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(15,23,42,.34);
}
#journalText .journal-main{
  font-weight:750;
  color:#f8fbff;
}
#journalText .journal-impact{
  display:inline-flex;
  width:fit-content;
  max-width:100%;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(96,165,250,.13);
  border:1px solid rgba(96,165,250,.22);
  color:#dbeafe;
  font-size:12px;
  font-weight:750;
  line-height:1.25;
}
#journalText .journal-narrative{
  color:#cbd5e1;
  font-size:12px;
  line-height:1.35;
}
#journalText .journal-success{
  border-color:rgba(34,197,94,.23);
  background:linear-gradient(135deg, rgba(34,197,94,.10), rgba(15,23,42,.36));
}
#journalText .journal-warning{
  border-color:rgba(251,191,36,.26);
  background:linear-gradient(135deg, rgba(251,191,36,.11), rgba(15,23,42,.36));
}
#journalText .journal-neutral{
  border-color:rgba(96,165,250,.20);
}
.event-narrative-text{
  margin:8px 0 10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(96,165,250,.18);
  background:rgba(30,64,175,.12);
  color:#dbeafe;
  line-height:1.45;
  font-size:13px;
}
.choice-effect-preview{
  margin-top:7px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(15,23,42,.30);
  border:1px solid rgba(148,163,184,.13);
  color:#dbeafe;
  line-height:1.35;
}

/* Éclaircissement doux : on garde le bleu profond, mais les surfaces fatiguent moins les yeux. */
.panel,
.card,
.action-card,
.event-card,
.market-card,
.goal-card,
.history-item,
.stat,
.side-card,
.objective-preview,
.dynamic-objective-card{
  background-color:rgba(20,32,58,.74) !important;
  border-color:rgba(148,163,184,.22) !important;
}
.panel::before,
.card::before,
.action-card::before,
.event-card::before,
.market-card::before{
  opacity:.92;
}
.small,
.muted,
.action-limit,
.choice-hint{
  color:#d1d9e8 !important;
}
.pill{
  background:rgba(59,130,246,.16) !important;
  border-color:rgba(147,197,253,.25) !important;
  color:#e5f1ff !important;
}
button.secondary,
.tab-btn{
  background:rgba(30,64,175,.28);
  border-color:rgba(147,197,253,.25);
}


/* ---- css/./modules/200-annual-portfolio-help-balance.css ---- */
/* FIRE Quest V1.8.12 — bilan annuel, portefeuille lisible, aides et équilibre TQQQ */
.portfolio-overview-card{
  margin-bottom:12px;
  background:rgba(21, 45, 84, .92);
  border:1px solid rgba(125, 176, 255, .26);
}
.portfolio-summary-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
  margin-top:10px;
}
.portfolio-summary-grid > div,
.portfolio-line{
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  padding:10px 12px;
}
.portfolio-summary-grid span,
.portfolio-line span{
  display:block;
  color:rgba(226,238,255,.78);
  font-size:12px;
  margin-bottom:4px;
}
.portfolio-summary-grid strong,
.portfolio-line strong{
  color:#f8fbff;
  font-size:16px;
}
.portfolio-breakdown-card{
  background:rgba(18, 42, 78, .9);
}
.portfolio-breakdown-card .portfolio-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin:7px 0;
}
.portfolio-breakdown-card .portfolio-line span{
  margin:0;
}
.portfolio-risk-note{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(96,165,250,.12);
  border:1px solid rgba(96,165,250,.22);
  color:rgba(235,245,255,.92);
  font-size:13px;
  line-height:1.35;
}
.journal-feedback .journal-main:first-letter{
  text-transform:uppercase;
}
.history-list .history-item strong,
.history-list strong{
  color:#f8fbff;
}
@media (max-width: 860px){
  .portfolio-summary-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
  .portfolio-summary-grid{ grid-template-columns:1fr; }
  .portfolio-breakdown-card .portfolio-line{ align-items:flex-start; flex-direction:column; }
}


/* ---- css/modules/210-multiplayer-sidebar-and-next-button.css ---- */
/* ========================================================================
   FIRE Quest V1.8.14 — Tour actuel sous statut + panneau multijoueur fixe
   ======================================================================== */

/* Le bouton d'avancement reste dans les contrôles principaux. */
.controls{
  grid-template-columns:minmax(260px, 1fr) minmax(180px, auto) minmax(260px, 1fr) !important;
  align-items:end !important;
}
.controls .sticky-cta{ display:block !important; }
.controls .sticky-cta .big-next-btn{
  width:100% !important;
}

/* Le tour actuel passe sous le bloc Situation stable / Alerte. */
#statusBox{
  grid-column:2 !important;
  max-height:150px !important;
  overflow:visible !important;
}
#statusBox .alert{
  min-height:82px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
.turn-under-status-card{
  grid-column:2 !important;
  margin-top:8px !important;
  min-height:56px !important;
  padding:10px 14px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  background:linear-gradient(180deg, rgba(30,45,72,.92), rgba(17,28,49,.78)) !important;
}
.turn-under-status-card .dynamic-objective-title{
  margin:0 !important;
  font-size:12px !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}
.turn-under-status-card .snapshot-month{
  font-size:24px !important;
  line-height:1 !important;
}

/* La carte indicateurs devient le vrai tableau de bord latéral en multijoueur. */
.side-stack{
  grid-template-rows:minmax(0, 1fr) auto !important;
  min-height:0 !important;
}
.progression-clean-card{
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
}
body.multiplayer-live-panel-visible .progression-clean-card{
  padding:16px !important;
  gap:8px !important;
  overflow:hidden !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .section-title{
  font-size:23px !important;
  margin-bottom:4px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .progress-row{
  padding-top:7px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .progress-head{
  font-size:12.5px !important;
  margin-bottom:4px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .bar{
  height:7px !important;
}
body.multiplayer-live-panel-visible .progression-clean-card .focus-row{
  padding:8px 10px 9px !important;
}

/* Panneau permanent des autres joueurs, intégré sous les jauges du joueur. */
.multiplayer-live-panel.in-player-indicators{
  position:relative !important;
  inset:auto !important;
  z-index:1 !important;
  width:100% !important;
  flex:1 1 auto !important;
  min-height:150px !important;
  max-height:none !important;
  overflow:hidden !important;
  margin-top:10px !important;
  padding:12px !important;
  border-radius:16px !important;
  border:1px solid rgba(96,165,250,.26) !important;
  background:linear-gradient(180deg, rgba(20,36,66,.88), rgba(13,24,45,.72)) !important;
  box-shadow:0 14px 30px rgba(2,8,23,.22), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head{
  margin-bottom:8px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head strong{
  font-size:13px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head span{
  font-size:10.5px !important;
  color:#bfdbfe !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-list{
  display:grid !important;
  gap:7px !important;
  max-height:100% !important;
  overflow:auto !important;
  padding-right:2px !important;
  scrollbar-width:thin !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-row{
  padding:8px 9px !important;
  border-radius:13px !important;
  background:rgba(15,23,42,.62) !important;
  border-color:rgba(148,163,184,.18) !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-main{
  gap:7px !important;
}
.multiplayer-live-panel.in-player-indicators .live-name strong{
  font-size:12px !important;
  max-width:170px !important;
}
.multiplayer-live-panel.in-player-indicators .live-name small{
  font-size:10px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:4px !important;
  margin-top:6px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats span{
  padding:5px 6px !important;
  font-size:9.5px !important;
  border-radius:8px !important;
  background:rgba(30,41,59,.65) !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-foot{
  display:block !important;
  margin-top:8px !important;
  color:#93c5fd !important;
  font-size:10px !important;
}
.live-panel-empty{
  padding:12px !important;
  border-radius:12px !important;
  color:#cbd5e1 !important;
  background:rgba(15,23,42,.56) !important;
  border:1px dashed rgba(148,163,184,.28) !important;
  font-size:12px !important;
  text-align:center !important;
}

@media (max-width: 900px){
  .controls{ grid-template-columns:1fr !important; }
  .turn-under-status-card,
  #statusBox{ grid-column:1 !important; }
  .turn-under-status-card .snapshot-month{ font-size:21px !important; }
}


/* ---- css/modules/220-multiplayer-layout-repair.css ---- */
/* ========================================================================
   FIRE Quest V1.8.15 — Réparation layout multijoueur
   Objectif : tour actuel stable sous le statut + autres joueurs visibles.
   ======================================================================== */

/* Le bloc Situation + Tour devient une seule cellule de grille : il ne descend
   plus sous la navigation et ne peut plus être coupé en multijoueur. */
.status-turn-stack{
  grid-column:2 !important;
  display:grid !important;
  grid-template-rows:auto auto !important;
  gap:8px !important;
  min-width:0 !important;
  min-height:0 !important;
  align-self:start !important;
  overflow:visible !important;
}
.status-turn-stack #statusBox{
  grid-column:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
.status-turn-stack #statusBox .alert{
  min-height:78px !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
.status-turn-stack .turn-under-status-card{
  grid-column:auto !important;
  margin:0 !important;
  min-height:52px !important;
  padding:10px 14px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  overflow:visible !important;
  background:linear-gradient(180deg, rgba(30,45,72,.96), rgba(17,28,49,.82)) !important;
  border:1px solid rgba(96,165,250,.22) !important;
}
.status-turn-stack .turn-under-status-card .dynamic-objective-title{
  margin:0 !important;
  font-size:12px !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}
.status-turn-stack .turn-under-status-card .snapshot-month{
  font-size:24px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

/* Neutralise les anciennes règles V1.8.14 qui ciblaient directement #statusBox. */
#statusBox{ max-height:none !important; }
.turn-under-status-card{ max-height:none !important; }

/* En multijoueur, la colonne droite reste un vrai tableau de bord permanent. */
body.multiplayer-room-active .side-stack,
body.multiplayer-live-panel-visible .side-stack{
  min-height:430px !important;
  height:100% !important;
  overflow:visible !important;
}
body.multiplayer-room-active .progression-clean-card,
body.multiplayer-live-panel-visible .progression-clean-card{
  min-height:430px !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  padding:16px !important;
  gap:8px !important;
}
body.multiplayer-room-active .progression-clean-card .section-title,
body.multiplayer-live-panel-visible .progression-clean-card .section-title{
  flex:0 0 auto !important;
}
body.multiplayer-room-active .progression-clean-card .progress-row,
body.multiplayer-live-panel-visible .progression-clean-card .progress-row{
  flex:0 0 auto !important;
}

/* Panneau autres joueurs : toujours visible dans la carte, jamais sous les jauges. */
.multiplayer-live-panel.in-player-indicators{
  position:relative !important;
  inset:auto !important;
  z-index:2 !important;
  display:block;
  width:100% !important;
  flex:1 1 auto !important;
  min-height:145px !important;
  max-height:none !important;
  overflow:hidden !important;
  margin-top:10px !important;
  padding:12px !important;
  border-radius:16px !important;
  border:1px solid rgba(96,165,250,.34) !important;
  background:linear-gradient(180deg, rgba(20,36,66,.96), rgba(13,24,45,.84)) !important;
  box-shadow:0 14px 30px rgba(2,8,23,.24), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:10px !important;
  margin-bottom:8px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head strong{
  display:block !important;
  color:#eaf2ff !important;
  font-size:13px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head span{
  display:block !important;
  color:#bfdbfe !important;
  font-size:10.5px !important;
  margin-top:2px !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-head button{
  min-height:28px !important;
  padding:5px 9px !important;
  font-size:10px !important;
  border-radius:10px !important;
  flex:0 0 auto !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-list{
  display:grid !important;
  gap:7px !important;
  max-height:190px !important;
  overflow:auto !important;
  padding-right:2px !important;
  scrollbar-width:thin !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-row{
  padding:8px 9px !important;
  border-radius:13px !important;
  background:rgba(15,23,42,.70) !important;
  border:1px solid rgba(148,163,184,.20) !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-main{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  min-width:0 !important;
}
.multiplayer-live-panel.in-player-indicators .live-rank{
  min-width:22px !important;
  color:#93c5fd !important;
  font-size:10px !important;
  font-weight:900 !important;
}
.multiplayer-live-panel.in-player-indicators .live-name{
  min-width:0 !important;
}
.multiplayer-live-panel.in-player-indicators .live-name strong{
  display:block !important;
  max-width:180px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#f8fafc !important;
  font-size:12px !important;
}
.multiplayer-live-panel.in-player-indicators .live-name small{
  display:block !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#cbd5e1 !important;
  font-size:10px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:4px !important;
  margin-top:6px !important;
}
.multiplayer-live-panel.in-player-indicators .live-player-stats span{
  padding:5px 6px !important;
  border-radius:8px !important;
  background:rgba(30,41,59,.72) !important;
  color:#dbeafe !important;
  font-size:9.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-empty{
  padding:12px !important;
  border-radius:12px !important;
  color:#cbd5e1 !important;
  background:rgba(15,23,42,.64) !important;
  border:1px dashed rgba(148,163,184,.32) !important;
  font-size:12px !important;
  text-align:center !important;
}
.multiplayer-live-panel.in-player-indicators .live-panel-foot{
  display:block !important;
  margin-top:8px !important;
  color:#93c5fd !important;
  font-size:10px !important;
}

@media (max-width: 900px){
  .status-turn-stack{ grid-column:1 !important; }
  .status-turn-stack .turn-under-status-card .snapshot-month{ font-size:21px !important; }
  body.multiplayer-room-active .progression-clean-card,
  body.multiplayer-live-panel-visible .progression-clean-card{ min-height:360px !important; }
}


/* ========================================================================
   FIRE Quest V1.8.16 — correctif réel sidebar autres joueurs
   Le panneau est monté en dur dans Indicateurs joueur et rendu visible dès
   qu'une salle existe ou qu'une partie multijoueur locale est lancée.
   ======================================================================== */
#multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  flex:0 0 auto !important;
  width:100% !important;
  margin-top:14px !important;
  padding:12px !important;
  border-radius:16px !important;
  border:1px solid rgba(96,165,250,.38) !important;
  background:linear-gradient(180deg, rgba(22,39,70,.98), rgba(12,24,46,.90)) !important;
  box-shadow:0 16px 30px rgba(2,8,23,.24), inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow:hidden !important;
}
#multiplayerLivePanel[hidden]{
  display:none !important;
}
body.multiplayer-room-active #multiplayerLivePanel,
body.multiplayer-live-panel-visible #multiplayerLivePanel{
  display:block !important;
}
body.multiplayer-room-active .progression-clean-card,
body.multiplayer-live-panel-visible .progression-clean-card{
  min-height:520px !important;
  max-height:calc(100vh - 135px) !important;
  overflow:hidden !important;
}
body.multiplayer-room-active .layout,
body.multiplayer-live-panel-visible .layout{
  align-items:start !important;
}
#multiplayerLivePanel .live-panel-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  margin-bottom:9px !important;
}
#multiplayerLivePanel .live-panel-head strong{
  display:block !important;
  font-size:14px !important;
  color:#f8fafc !important;
}
#multiplayerLivePanel .live-panel-head span{
  display:block !important;
  margin-top:2px !important;
  color:#bfdbfe !important;
  font-size:11px !important;
}
#multiplayerLivePanel .live-panel-head button{
  min-height:28px !important;
  padding:5px 10px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
}
#multiplayerLivePanel .live-panel-list{
  display:grid !important;
  gap:7px !important;
  max-height:210px !important;
  overflow:auto !important;
  padding-right:3px !important;
  scrollbar-width:thin !important;
}
#multiplayerLivePanel .live-player-row{
  padding:8px 9px !important;
  border-radius:13px !important;
  background:rgba(15,23,42,.72) !important;
  border:1px solid rgba(148,163,184,.22) !important;
}
#multiplayerLivePanel .live-player-main{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  min-width:0 !important;
}
#multiplayerLivePanel .live-rank{
  color:#93c5fd !important;
  font-size:10px !important;
  font-weight:900 !important;
  min-width:22px !important;
}
#multiplayerLivePanel .tiny-avatar{
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  font-size:10px !important;
}
#multiplayerLivePanel .live-name{ min-width:0 !important; }
#multiplayerLivePanel .live-name strong{
  display:block !important;
  max-width:210px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:12.5px !important;
  color:#ffffff !important;
}
#multiplayerLivePanel .live-name small{
  display:block !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:10px !important;
  color:#cbd5e1 !important;
}
#multiplayerLivePanel .live-player-stats{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:4px !important;
  margin-top:7px !important;
}
#multiplayerLivePanel .live-player-stats span{
  padding:5px 6px !important;
  border-radius:8px !important;
  background:rgba(30,41,59,.75) !important;
  color:#dbeafe !important;
  font-size:9.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
#multiplayerLivePanel .live-panel-empty{
  padding:12px !important;
  border-radius:12px !important;
  color:#dbeafe !important;
  background:rgba(15,23,42,.64) !important;
  border:1px dashed rgba(147,197,253,.34) !important;
  font-size:12px !important;
  text-align:center !important;
}
#multiplayerLivePanel .live-panel-foot{
  margin-top:8px !important;
  color:#93c5fd !important;
  font-size:10px !important;
}


/* ---- css/modules/230-ergonomy-scroll-multiplayer-visible.css ---- */
/* ========================================================================
   FIRE Quest V1.8.17 — Ergonomie panneaux + multijoueur visible
   Objectif : empêcher les contenus coupés dans le cockpit principal et rendre
   la liste des autres joueurs accessible dans la colonne indicateurs.
   ======================================================================== */

/* Le cockpit garde la logique “un écran”, mais les deux grandes zones peuvent
   désormais scroller en interne si leur contenu dépasse. Cela évite les cartes
   coupées par la barre d’onglets, en solo comme en multijoueur. */
#gameRoot.container{
  grid-template-rows:auto minmax(420px, calc(100dvh - 220px)) auto minmax(0, 1fr) !important;
}

.layout{
  min-height:0 !important;
  height:100% !important;
  overflow:visible !important;
  align-items:stretch !important;
}

.layout > .card:first-child{
  min-height:0 !important;
  height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:28px !important;
  scrollbar-width:thin !important;
  overscroll-behavior:contain !important;
}

/* Le journal ne doit plus couper brutalement les lignes du bas : si le texte est
   long, c’est le journal qui scrolle doucement, pas la page entière. */
.journal{
  min-height:118px !important;
  max-height:clamp(150px, 26vh, 230px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:14px !important;
  scrollbar-width:thin !important;
}

#journalText,
#monthlyNarrative,
#monthlyInsight{
  overflow:visible !important;
}

.status-turn-stack{
  position:relative !important;
  z-index:1 !important;
  margin-bottom:4px !important;
}

.status-turn-stack .turn-under-status-card{
  flex-shrink:0 !important;
}

/* Colonne droite : elle devient un vrai panneau vertical avec scroll interne.
   Les autres joueurs ne peuvent plus être masqués sous les jauges. */
.side-stack{
  min-height:0 !important;
  height:100% !important;
  overflow:visible !important;
}

.side-stack .progression-clean-card{
  min-height:0 !important;
  height:100% !important;
  max-height:none !important;
  display:flex !important;
  flex-direction:column !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:18px !important;
  scrollbar-width:thin !important;
  overscroll-behavior:contain !important;
}

/* Les anciennes règles V1.8.15–1.8.16 forçaient overflow:hidden en mode multi :
   on les neutralise pour que la liste reste consultable jusqu’au dernier joueur. */
body.multiplayer-room-active .side-stack,
body.multiplayer-live-panel-visible .side-stack{
  min-height:0 !important;
  height:100% !important;
  overflow:visible !important;
}

body.multiplayer-room-active .progression-clean-card,
body.multiplayer-live-panel-visible .progression-clean-card{
  min-height:0 !important;
  height:100% !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

#multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  flex:1 1 auto !important;
  min-height:0 !important;
  max-height:none !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  margin-top:12px !important;
}

#multiplayerLivePanel[hidden]{
  display:none !important;
}

body.multiplayer-room-active #multiplayerLivePanel,
body.multiplayer-live-panel-visible #multiplayerLivePanel{
  display:flex !important;
}

#multiplayerLivePanel .live-panel-head,
#multiplayerLivePanel .live-panel-foot{
  flex:0 0 auto !important;
}

#multiplayerLivePanel .live-panel-list,
.multiplayer-live-panel.in-player-indicators .live-panel-list{
  flex:1 1 auto !important;
  min-height:96px !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
  scrollbar-width:thin !important;
}

/* Cartes joueurs plus compactes : les 3 adversaires tiennent mieux, tout en
   restant lisibles. Si l’espace manque, la liste scrolle. */
#multiplayerLivePanel .live-player-row{
  padding:7px 8px !important;
}

#multiplayerLivePanel .live-player-stats{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:4px !important;
}

#multiplayerLivePanel .live-player-stats span{
  font-size:9px !important;
  padding:4px 5px !important;
}

/* Petit confort visuel sur grands écrans : le bloc Situation + Tour garde assez
   d’espace sans pousser la navigation. */
@media (min-width: 1100px){
  .status-turn-stack #statusBox .alert{
    min-height:86px !important;
  }
  .status-turn-stack .turn-under-status-card{
    min-height:58px !important;
  }
}

@media (max-width: 900px){
  #gameRoot.container{
    grid-template-rows:auto auto auto minmax(0, 1fr) !important;
    overflow-y:auto !important;
  }
  .layout{
    overflow:visible !important;
  }
  .layout > .card:first-child,
  .side-stack .progression-clean-card{
    height:auto !important;
    max-height:none !important;
  }
}


/* ---- css/modules/240-responsive-and-main-chat.css ---- */
/* ========================================================================
   FIRE Quest V1.8.18 — Responsive unique + chat multijoueur principal
   Objectif : garder un seul jeu, avec une mise en page adaptée PC/tablette/
   smartphone, et rendre le chat accessible sans ouvrir le lobby.
   ======================================================================== */

/* Chat compact directement dans le tableau de bord de droite */
#mainMultiplayerChat.main-multiplayer-chat{
  flex:0 0 auto;
  width:100%;
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(34,211,238,.24);
  background:linear-gradient(180deg, rgba(14,165,233,.11), rgba(15,23,42,.82));
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:170px;
  max-height:260px;
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
#mainMultiplayerChat[hidden]{ display:none !important; }
body.multiplayer-room-active #mainMultiplayerChat,
body.multiplayer-main-chat-visible #mainMultiplayerChat{ display:flex !important; }
.main-chat-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.main-chat-head strong{ display:block; color:#fff; font-size:14px; line-height:1.1; }
.main-chat-head span{ display:block; margin-top:2px; color:#93c5fd; font-size:10px; text-transform:uppercase; letter-spacing:.07em; font-weight:900; }
.main-chat-head button{ min-height:auto !important; padding:6px 9px !important; border-radius:11px !important; font-size:11px !important; }
.main-chat-messages{
  flex:1 1 auto;
  min-height:58px;
  overflow-y:auto;
  overflow-x:hidden;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:8px;
  border-radius:13px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(2,8,23,.22);
  scrollbar-width:thin;
}
.main-chat-message{
  align-self:flex-start;
  max-width:92%;
  padding:7px 9px;
  border-radius:12px 12px 12px 4px;
  background:rgba(148,163,184,.10);
  border:1px solid rgba(148,163,184,.12);
}
.main-chat-message.mine{
  align-self:flex-end;
  border-radius:12px 12px 4px 12px;
  background:rgba(96,165,250,.18);
  border-color:rgba(96,165,250,.24);
}
.main-chat-meta{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:2px; font-size:10px; color:#94a3b8; }
.main-chat-meta strong{ color:#eaf2ff; max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.main-chat-text{ color:#eef4ff; font-size:12px; line-height:1.32; overflow-wrap:anywhere; }
.main-chat-empty{ color:#cbd5e1; font-size:12px; text-align:center; padding:8px; }
.main-chat-form{ flex:0 0 auto; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.main-chat-form input{
  min-width:0;
  width:100%;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.22);
  background:rgba(2,8,23,.34);
  color:#eef4ff;
  outline:none;
}
.main-chat-form input:focus{ border-color:rgba(34,211,238,.66); box-shadow:0 0 0 3px rgba(34,211,238,.10); }
.main-chat-form button{ min-height:auto !important; padding:9px 11px !important; border-radius:12px !important; font-size:12px !important; }

/* La colonne de droite devient vraiment exploitable en multijoueur : jauges,
   autres joueurs et chat se partagent un panneau scrollable. */
body.multiplayer-room-active .side-stack .progression-clean-card,
body.multiplayer-main-chat-visible .side-stack .progression-clean-card{
  gap:0 !important;
}
body.multiplayer-room-active #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators,
body.multiplayer-main-chat-visible #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  flex:1 1 160px !important;
  min-height:132px !important;
  max-height:220px !important;
}
body.multiplayer-room-active #multiplayerLivePanel .live-panel-list,
body.multiplayer-main-chat-visible #multiplayerLivePanel .live-panel-list{
  min-height:72px !important;
}

/* Tablette : même jeu, mais les colonnes se simplifient et les panneaux ont
   un scroll interne propre. */
@media (max-width: 1180px){
  #gameRoot.container{
    grid-template-rows:auto minmax(430px, calc(100dvh - 214px)) auto minmax(0, 1fr) !important;
    padding:10px !important;
  }
  .layout{ grid-template-columns:minmax(0,1.35fr) minmax(300px,.75fr) !important; gap:10px !important; }
  .stats{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
  .controls{ grid-template-columns:minmax(190px,1fr) minmax(150px,.55fr) minmax(210px,1fr) !important; }
  .tab-btn{ padding-left:12px !important; padding-right:12px !important; }
}

/* Smartphone et petite tablette : interface responsive verticale. Le gameplay
   reste identique ; on empile les blocs plutôt que de tout miniaturiser. */
@media (max-width: 900px){
  html, body{ overflow:auto !important; height:auto !important; min-height:100dvh !important; }
  body{ padding-bottom:calc(84px + env(safe-area-inset-bottom)) !important; }
  #gameRoot.container{
    height:auto !important;
    min-height:100dvh !important;
    max-height:none !important;
    overflow:visible !important;
    display:block !important;
    padding:10px !important;
  }
  .topbar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  h1{ font-size:clamp(24px, 8vw, 34px) !important; line-height:1.04 !important; }
  .subtitle{ font-size:13px !important; }
  .top-actions{ justify-content:flex-start !important; flex-wrap:wrap !important; }
  .stats{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; gap:8px !important; margin:10px 0 !important; }
  .stat{ min-height:72px !important; padding:10px 12px !important; }
  .stat .value{ font-size:clamp(22px, 7vw, 29px) !important; }
  .layout{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    height:auto !important;
    overflow:visible !important;
  }
  .layout > .card:first-child{
    display:grid !important;
    grid-template-columns:1fr !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    padding:12px !important;
  }
  .controls{ grid-template-columns:1fr !important; gap:8px !important; }
  .controls select,
  .controls button{ width:100% !important; min-height:46px !important; }
  .month-actions{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
  .month-actions .pill{ flex:1 1 160px !important; min-width:0 !important; }
  .journal{ max-height:210px !important; min-height:118px !important; }
  .status-turn-stack{ grid-column:1 !important; display:grid !important; grid-template-columns:1fr !important; gap:8px !important; }
  .status-turn-stack #statusBox .alert{ min-height:0 !important; }
  .status-turn-stack .turn-under-status-card{ min-height:56px !important; }
  .side-stack{ height:auto !important; min-height:0 !important; }
  .side-stack .progression-clean-card{
    height:auto !important;
    max-height:none !important;
    min-height:0 !important;
    overflow:visible !important;
    padding:14px !important;
  }
  #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators,
  #mainMultiplayerChat.main-multiplayer-chat{
    max-height:none !important;
  }
  #multiplayerLivePanel .live-panel-list{ max-height:220px !important; }
  .main-chat-messages{ max-height:190px !important; }
  .tabs{ margin-top:10px !important; }
}

/* Smartphone portrait : on garde le jeu jouable, mais on pousse une lecture par
   blocs. Le conseil de rotation reste utile, sans bloquer l'accès. */
@media (max-width: 620px) and (orientation: portrait){
  #gameRoot.container{ padding:8px !important; }
  .stats{ grid-template-columns:1fr 1fr !important; }
  .stat{ min-height:66px !important; }
  .stat .label{ font-size:10px !important; }
  .stat .value{ font-size:21px !important; }
  .section-title{ font-size:22px !important; }
  .progression-clean-card .progress-row{ padding-top:7px !important; }
  .main-chat-form{ grid-template-columns:1fr !important; }
  .multiplayer-floating-btn{
    right:10px !important;
    bottom:calc(74px + env(safe-area-inset-bottom)) !important;
    padding:10px 12px !important;
  }
}

/* Smartphone paysage : version dense, mais sans couper les panneaux. */
@media (max-width: 900px) and (orientation: landscape){
  body{ padding-bottom:calc(58px + env(safe-area-inset-bottom)) !important; }
  #gameRoot.container{ padding:8px !important; }
  .topbar{ grid-template-columns:minmax(0,1fr) auto !important; align-items:start !important; }
  h1{ font-size:23px !important; }
  .subtitle{ display:none !important; }
  .stats{ grid-template-columns:repeat(6, minmax(0,1fr)) !important; gap:6px !important; }
  .stat{ min-height:58px !important; padding:8px !important; }
  .stat .label{ font-size:9px !important; }
  .stat .value{ font-size:18px !important; }
  .layout{ grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr) !important; align-items:start !important; }
  .layout > .card:first-child{ max-height:calc(100dvh - 146px) !important; overflow-y:auto !important; }
  .side-stack .progression-clean-card{ max-height:calc(100dvh - 146px) !important; overflow-y:auto !important; }
  .controls{ grid-template-columns:1fr 0.6fr 1.05fr !important; }
  .controls button{ min-height:42px !important; }
  .journal{ max-height:132px !important; }
  .status-turn-stack .turn-under-status-card{ min-height:48px !important; }
  #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{ max-height:140px !important; min-height:96px !important; }
  #mainMultiplayerChat.main-multiplayer-chat{ min-height:136px !important; max-height:170px !important; }
  .main-chat-messages{ min-height:42px !important; }
}


/* ---- css/modules/250-floating-chat-layout.css ---- */
/* ========================================================================
   FIRE Quest V1.8.19 — Chat flottant + sidebar multijoueur respirante
   Objectif : sortir le chat du panneau indicateurs pour garder de la place
   aux jauges et aux autres joueurs, tout en laissant le chat accessible
   directement sur l'écran principal.
   ======================================================================== */

/* Le chat reste dans le DOM, mais il ne consomme plus la hauteur de la colonne droite. */
#mainMultiplayerChat.main-multiplayer-chat{
  position:fixed !important;
  right:18px !important;
  bottom:92px !important;
  z-index:80 !important;
  width:min(420px, calc(100vw - 36px)) !important;
  min-height:0 !important;
  height:auto !important;
  max-height:360px !important;
  margin:0 !important;
  padding:12px !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,8,23,.94)) !important;
  border:1px solid rgba(96,165,250,.36) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow:hidden !important;
}
body.multiplayer-room-active #mainMultiplayerChat,
body.multiplayer-main-chat-visible #mainMultiplayerChat{
  display:flex !important;
}

/* Le panneau de droite redevient prioritaire pour les indicateurs et les autres joueurs. */
body.multiplayer-room-active .side-stack .progression-clean-card,
body.multiplayer-main-chat-visible .side-stack .progression-clean-card{
  max-height:calc(100dvh - 154px) !important;
  overflow-y:auto !important;
  padding-bottom:16px !important;
  scrollbar-width:thin;
}
body.multiplayer-room-active #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators,
body.multiplayer-main-chat-visible #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  flex:1 1 auto !important;
  min-height:170px !important;
  max-height:none !important;
  overflow:visible !important;
}
body.multiplayer-room-active #multiplayerLivePanel .live-panel-list,
body.multiplayer-main-chat-visible #multiplayerLivePanel .live-panel-list{
  max-height:none !important;
  overflow:visible !important;
}

/* Chat compact mais utilisable : 3-4 messages visibles + champ d'envoi. */
#mainMultiplayerChat .main-chat-head{
  padding-bottom:8px !important;
  border-bottom:1px solid rgba(148,163,184,.16) !important;
}
#mainMultiplayerChat .main-chat-head strong{
  font-size:15px !important;
}
#mainMultiplayerChat .main-chat-messages{
  min-height:92px !important;
  max-height:190px !important;
  overflow-y:auto !important;
}
#mainMultiplayerChat .main-chat-form{
  margin-top:2px !important;
}
#mainMultiplayerChat .main-chat-form input{
  min-height:42px !important;
  font-size:14px !important;
}
#mainMultiplayerChat .main-chat-form button{
  min-height:42px !important;
  padding:9px 14px !important;
}

/* Évite que le chat cache le bouton Multijoueur fixe. */
body.multiplayer-room-active .mp-open-btn,
body.multiplayer-main-chat-visible .mp-open-btn{
  bottom:24px !important;
}

/* Tablette : chat flottant un peu plus bas et plus étroit. */
@media (max-width: 1180px){
  #mainMultiplayerChat.main-multiplayer-chat{
    right:14px !important;
    bottom:88px !important;
    width:min(380px, calc(100vw - 28px)) !important;
    max-height:330px !important;
  }
}

/* Smartphone : chat en tiroir bas, accessible sans écraser le tableau de bord. */
@media (max-width: 700px){
  #mainMultiplayerChat.main-multiplayer-chat{
    left:10px !important;
    right:10px !important;
    bottom:86px !important;
    width:auto !important;
    max-height:42dvh !important;
    padding:10px !important;
    border-radius:16px !important;
  }
  #mainMultiplayerChat .main-chat-messages{
    min-height:70px !important;
    max-height:calc(42dvh - 118px) !important;
  }
  #mainMultiplayerChat .main-chat-form{
    grid-template-columns:1fr auto !important;
  }
  #mainMultiplayerChat .main-chat-form input,
  #mainMultiplayerChat .main-chat-form button{
    min-height:40px !important;
  }
}

/* Très petit écran : garder le chat lisible sans masquer les onglets. */
@media (max-width: 420px){
  #mainMultiplayerChat.main-multiplayer-chat{
    bottom:78px !important;
    max-height:38dvh !important;
  }
  #mainMultiplayerChat .main-chat-head span{ display:none !important; }
  #mainMultiplayerChat .main-chat-form{ grid-template-columns:1fr !important; }
}


/* ---- css/modules/260-chat-under-journal-ergonomy.css ---- */
/* ========================================================================
   FIRE Quest V1.8.20 — Chat sous le journal + ergonomie multijoueur
   Objectif : retirer le chat flottant de la colonne de droite, libérer la
   liste des autres joueurs et rendre le champ de saisie toujours utilisable.
   ======================================================================== */

/* Le chat principal est désormais une vraie zone du cockpit, sous Journal /
   Situation / Tour. Il n'est plus flottant et ne peut plus masquer les joueurs. */
#mainMultiplayerChat.main-multiplayer-chat,
#mainMultiplayerChat.main-chat-under-journal{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  top:auto !important;
  z-index:2 !important;
  grid-column:1 / -1 !important;
  width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-height:none !important;
  height:auto !important;
  margin:0 !important;
  padding:10px 12px !important;
  border-radius:18px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  overflow:visible !important;
  background:linear-gradient(180deg, rgba(14,165,233,.10), rgba(15,23,42,.88)) !important;
  border:1px solid rgba(34,211,238,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#mainMultiplayerChat[hidden]{ display:none !important; }
body:not(.multiplayer-room-active):not(.multiplayer-main-chat-visible) #mainMultiplayerChat{
  display:none !important;
}
body.multiplayer-room-active #mainMultiplayerChat,
body.multiplayer-main-chat-visible #mainMultiplayerChat{
  display:flex !important;
}

/* Présentation horizontale compacte : messages à gauche, saisie à droite.
   Cela exploite le grand espace vide sous le journal sans prendre la sidebar. */
#mainMultiplayerChat .main-chat-head{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:0 0 2px 0 !important;
  border:0 !important;
}
#mainMultiplayerChat .main-chat-head strong{ font-size:15px !important; color:#fff !important; }
#mainMultiplayerChat .main-chat-head span{ font-size:10px !important; color:#93c5fd !important; }
#mainMultiplayerChat .main-chat-head button{
  min-height:30px !important;
  padding:6px 10px !important;
  border-radius:12px !important;
  font-size:11px !important;
}
#mainMultiplayerChat .main-chat-messages{
  min-height:58px !important;
  max-height:96px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:8px !important;
  border-radius:14px !important;
  background:rgba(2,8,23,.28) !important;
  border:1px solid rgba(148,163,184,.16) !important;
  scrollbar-width:thin !important;
}
#mainMultiplayerChat .main-chat-form{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto !important;
  gap:8px !important;
  margin:0 !important;
}
#mainMultiplayerChat .main-chat-form input{
  min-width:0 !important;
  width:100% !important;
  min-height:42px !important;
  padding:10px 12px !important;
  border-radius:13px !important;
  border:1px solid rgba(148,163,184,.26) !important;
  background:rgba(2,8,23,.42) !important;
  color:#eef4ff !important;
  outline:none !important;
  pointer-events:auto !important;
  user-select:text !important;
  -webkit-user-select:text !important;
}
#mainMultiplayerChat .main-chat-form input:focus{
  border-color:rgba(34,211,238,.75) !important;
  box-shadow:0 0 0 3px rgba(34,211,238,.12) !important;
}
#mainMultiplayerChat .main-chat-form button{
  min-height:42px !important;
  padding:9px 16px !important;
  border-radius:13px !important;
  font-size:12px !important;
}

/* La colonne de droite est libérée : elle ne contient plus que les indicateurs
   et les autres joueurs. Les derniers joueurs restent atteignables par scroll. */
body.multiplayer-room-active .side-stack .progression-clean-card,
body.multiplayer-main-chat-visible .side-stack .progression-clean-card{
  max-height:calc(100dvh - 150px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:18px !important;
}
body.multiplayer-room-active #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators,
body.multiplayer-main-chat-visible #multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  flex:1 1 auto !important;
  min-height:180px !important;
  max-height:none !important;
  overflow:hidden !important;
}
body.multiplayer-room-active #multiplayerLivePanel .live-panel-list,
body.multiplayer-main-chat-visible #multiplayerLivePanel .live-panel-list{
  flex:1 1 auto !important;
  min-height:110px !important;
  max-height:calc(100dvh - 500px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:3px !important;
  scrollbar-width:thin !important;
}

/* Le bouton d'ouverture du lobby redevient stable : le chat ne le masque plus. */
body.multiplayer-room-active .mp-open-btn,
body.multiplayer-main-chat-visible .mp-open-btn{
  bottom:24px !important;
}

/* Écrans moyens : chat plus compact pour conserver le principe “un écran”. */
@media (max-width: 1180px){
  #mainMultiplayerChat.main-multiplayer-chat{
    padding:9px !important;
  }
  #mainMultiplayerChat .main-chat-messages{
    max-height:82px !important;
  }
}

/* Mobile : le chat reste dans le flux, sous le journal, avec la saisie utilisable. */
@media (max-width: 900px){
  #mainMultiplayerChat.main-multiplayer-chat{
    grid-column:1 !important;
    width:100% !important;
    max-height:none !important;
  }
  #mainMultiplayerChat .main-chat-messages{
    max-height:150px !important;
  }
}

@media (max-width: 520px){
  #mainMultiplayerChat .main-chat-form{
    grid-template-columns:1fr !important;
  }
  #mainMultiplayerChat .main-chat-form button{
    width:100% !important;
  }
}


/* ---- css/modules/270-compact-multiplayer-dashboard.css ---- */
/* ========================================================================
   FIRE Quest V1.8.22 — Tableau de bord compact multijoueur
   Objectif : conserver l'écran principal lisible sans scroll inutile :
   - joueurs en tableau compact ;
   - journal résumé ;
   - situation + tour plus bas ;
   - chat opérationnel mais plus discret.
   ======================================================================== */

@media (min-width: 1000px){
  /* Le conteneur principal redevient un cockpit fixe : on évite les ascenseurs
     dans la zone centrale quand le chat est affiché. */
  #gameRoot.container{
    height:100dvh !important;
    max-height:100dvh !important;
    overflow:hidden !important;
    grid-template-rows:auto minmax(0, 1fr) auto !important;
    gap:10px !important;
    padding-top:10px !important;
    padding-bottom:8px !important;
  }

  .topbar{ margin-bottom:0 !important; }
  .topbar h1{ font-size:clamp(24px, 2.05vw, 34px) !important; line-height:1.02 !important; }
  .topbar .subtitle{ margin-top:2px !important; font-size:13px !important; }

  .layout{
    min-height:0 !important;
    height:100% !important;
    grid-template-columns:minmax(0, 2.18fr) minmax(360px, .92fr) !important;
    gap:12px !important;
    overflow:hidden !important;
  }

  .layout > .card:first-child{
    min-height:0 !important;
    height:100% !important;
    overflow:hidden !important;
    padding:12px 16px 10px !important;
    display:grid !important;
    grid-template-rows:auto auto auto minmax(0, 1fr) auto !important;
    gap:9px !important;
  }

  .stats{ gap:8px !important; }
  .stat{
    min-height:62px !important;
    padding:10px 12px !important;
    border-radius:14px !important;
  }
  .stat .label{ font-size:11px !important; letter-spacing:.14em !important; }
  .stat .value{ font-size:22px !important; line-height:1.04 !important; }
  .stat .value .unit{ font-size:13px !important; }

  .controls{
    gap:9px !important;
    align-items:end !important;
    grid-template-columns:minmax(250px, .95fr) minmax(150px, .44fr) minmax(270px, .9fr) !important;
  }
  .controls button,
  .controls select,
  .big-next-btn{ min-height:40px !important; }
  .month-actions{ gap:6px !important; overflow:hidden !important; white-space:nowrap !important; }
  .month-actions .pill{ padding:5px 10px !important; font-size:12px !important; }
  /* Redondant avec le bloc Tour actuel. On gagne de la place et on garde l'info
     dans la zone situation. */
  .month-actions .pill:nth-child(2){ display:none !important; }

  /* Grille centrale : journal à gauche, situation/tour à droite. */
  .journal{
    min-height:0 !important;
    max-height:none !important;
    height:auto !important;
    overflow:hidden !important;
    padding:12px 12px 10px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
  }
  .journal > strong{ flex:0 0 auto !important; font-size:15px !important; }
  #journalText{
    flex:0 0 auto !important;
    max-height:54px !important;
    overflow:hidden !important;
  }
  #journalText > div,
  #journalText .journal-entry,
  #journalText .alert,
  #journalText p{
    margin-top:0 !important;
    margin-bottom:4px !important;
  }
  #monthlyNarrative,
  #monthlyInsight{
    max-height:38px !important;
    overflow:hidden !important;
    padding:8px 10px !important;
    font-size:12px !important;
    line-height:1.22 !important;
  }

  .status-turn-stack{
    display:grid !important;
    grid-template-rows:minmax(76px, auto) 54px !important;
    gap:7px !important;
    min-height:0 !important;
    margin:0 !important;
  }
  .status-turn-stack #statusBox .alert{
    min-height:76px !important;
    padding:12px 16px !important;
    line-height:1.2 !important;
  }
  .status-turn-stack #statusBox .alert strong{ font-size:15px !important; }
  .turn-under-status-card{
    min-height:54px !important;
    padding:10px 14px !important;
    display:grid !important;
    grid-template-columns:1fr auto !important;
    align-items:center !important;
  }
  .turn-under-status-card .dynamic-objective-title{ margin:0 !important; font-size:11px !important; }
  .turn-under-status-card .snapshot-month{ font-size:26px !important; line-height:1 !important; }

  /* Le chat reste sur l'écran principal, mais en version compacte et stable. */
  #mainMultiplayerChat.main-multiplayer-chat{
    min-height:0 !important;
    padding:9px 10px !important;
    gap:7px !important;
    border-radius:15px !important;
  }
  #mainMultiplayerChat .main-chat-head{
    padding:0 !important;
    min-height:24px !important;
  }
  #mainMultiplayerChat .main-chat-head strong{ font-size:14px !important; }
  #mainMultiplayerChat .main-chat-head span{ font-size:10px !important; }
  #mainMultiplayerChat .main-chat-head button{ min-height:26px !important; padding:5px 9px !important; }
  #mainMultiplayerChat .main-chat-messages{
    min-height:34px !important;
    max-height:52px !important;
    padding:6px 8px !important;
    font-size:11px !important;
  }
  #mainMultiplayerChat .main-chat-message{ padding:2px 0 !important; }
  #mainMultiplayerChat .main-chat-meta{ margin-bottom:1px !important; font-size:10px !important; }
  #mainMultiplayerChat .main-chat-text{ line-height:1.18 !important; }
  #mainMultiplayerChat .main-chat-form input,
  #mainMultiplayerChat .main-chat-form button{
    min-height:36px !important;
    padding:8px 10px !important;
  }

  .tabs{ gap:8px !important; margin-top:0 !important; }
  .tab-btn{ min-height:42px !important; padding:9px 16px !important; }
}

/* Colonne droite : les joueurs passent en tableau compact. */
#multiplayerLivePanel.multiplayer-live-panel.in-player-indicators{
  margin-top:10px !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
#multiplayerLivePanel .live-panel-head.compact-head,
#multiplayerLivePanel .live-panel-head{
  flex:0 0 auto !important;
  margin-bottom:7px !important;
}
#multiplayerLivePanel .live-panel-table{
  flex:1 1 auto !important;
  min-height:0 !important;
  max-height:190px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:3px !important;
  scrollbar-width:thin !important;
}
#multiplayerLivePanel .live-panel-table-head,
#multiplayerLivePanel .live-player-table-row{
  display:grid !important;
  grid-template-columns:minmax(112px, 1.2fr) 34px minmax(70px,.8fr) minmax(58px,.7fr) 48px !important;
  gap:6px !important;
  align-items:center !important;
}
#multiplayerLivePanel .live-panel-table-head{
  position:sticky !important;
  top:0 !important;
  z-index:1 !important;
  padding:0 6px 5px !important;
  color:#93a4bd !important;
  font-size:9.5px !important;
  text-transform:uppercase !important;
  letter-spacing:.08em !important;
  background:rgba(15,23,42,.94) !important;
}
#multiplayerLivePanel .live-player-table-row{
  min-height:32px !important;
  margin-bottom:5px !important;
  padding:6px !important;
  border-radius:10px !important;
  border:1px solid rgba(148,163,184,.18) !important;
  background:rgba(15,23,42,.58) !important;
  color:#e5edf8 !important;
  font-size:11px !important;
}
#multiplayerLivePanel .live-table-name{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  overflow:hidden !important;
}
#multiplayerLivePanel .live-table-name em{
  flex:0 0 auto !important;
  font-style:normal !important;
  color:#93c5fd !important;
  font-size:10px !important;
}
#multiplayerLivePanel .live-table-name strong{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:11px !important;
}
#multiplayerLivePanel .stress-cell{ color:#fbbf24 !important; }
#multiplayerLivePanel .live-panel-foot{ display:none !important; }
#multiplayerLivePanel .table-empty{ grid-column:1 / -1 !important; }

@media (min-width:1000px){
  .side-stack .progression-clean-card{
    height:100% !important;
    max-height:none !important;
    overflow:hidden !important;
    padding:16px 14px 12px !important;
  }
  body.multiplayer-room-active .side-stack .progression-clean-card,
  body.multiplayer-main-chat-visible .side-stack .progression-clean-card{
    max-height:none !important;
    overflow:hidden !important;
  }
  .progression-clean-card .section-title{ margin-bottom:10px !important; }
  .progression-clean-card .progress-row{ margin-bottom:9px !important; }
  .progression-clean-card .bar{ height:5px !important; }
}

@media (max-width: 900px){
  #multiplayerLivePanel .live-panel-table{
    max-height:220px !important;
  }
  #multiplayerLivePanel .live-panel-table-head,
  #multiplayerLivePanel .live-player-table-row{
    grid-template-columns:minmax(100px, 1fr) 34px minmax(64px,.75fr) 48px !important;
  }
  #multiplayerLivePanel .live-panel-table-head span:nth-child(4),
  #multiplayerLivePanel .live-player-table-row span:nth-child(4){
    display:none !important;
  }
}


/* ---- css/modules/280-pc-finish-v1-8-23.css ---- */
/* ========================================================================
   FIRE Quest V1.8.23 — finition ergonomique PC
   Objectif : finaliser le cockpit PC sans retirer d'informations utiles :
   - chat encore plus compact ;
   - Lecture du mois réduite à une seule ligne ;
   - légère respiration retrouvée dans la zone centrale.
   ======================================================================== */

@media (min-width: 1000px){
  #gameRoot.container{
    gap:8px !important;
    padding-bottom:6px !important;
  }

  .layout > .card:first-child{
    padding:10px 14px 8px !important;
    gap:8px !important;
  }

  .stats{ gap:7px !important; }
  .stat{
    min-height:58px !important;
    padding:9px 12px !important;
  }
  .stat .value{ font-size:20px !important; }

  .controls{ gap:8px !important; }
  .controls button,
  .controls select,
  .big-next-btn{ min-height:38px !important; }

  .month-actions .pill{
    padding:4px 9px !important;
    font-size:11px !important;
  }

  .journal{
    padding:10px 11px 8px !important;
    gap:5px !important;
  }
  .journal > strong{ font-size:14px !important; }
  #journalText{
    max-height:50px !important;
  }

  #monthlyNarrative{
    max-height:30px !important;
    padding:6px 9px !important;
    font-size:11.5px !important;
    line-height:1.18 !important;
  }

  #monthlyInsight{
    max-height:28px !important;
    min-height:28px !important;
    padding:5px 9px !important;
    font-size:11px !important;
    line-height:1.15 !important;
    display:flex !important;
    align-items:center !important;
  }
  #monthlyInsight .monthly-insight-inline{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-width:0 !important;
    width:100% !important;
  }
  #monthlyInsight .monthly-insight-inline strong{
    flex:0 0 auto !important;
    font-size:10px !important;
    text-transform:uppercase !important;
    letter-spacing:.06em !important;
    color:#cbd5e1 !important;
  }
  #monthlyInsight .monthly-insight-inline span{
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .status-turn-stack{
    grid-template-rows:minmax(72px, auto) 50px !important;
    gap:6px !important;
  }
  .status-turn-stack #statusBox .alert{
    min-height:72px !important;
    padding:11px 14px !important;
  }
  .turn-under-status-card{
    min-height:50px !important;
    padding:8px 12px !important;
  }
  .turn-under-status-card .snapshot-month{ font-size:24px !important; }

  #mainMultiplayerChat.main-multiplayer-chat{
    padding:7px 9px !important;
    gap:6px !important;
    border-radius:14px !important;
  }
  #mainMultiplayerChat .main-chat-head{
    min-height:22px !important;
  }
  #mainMultiplayerChat .main-chat-head strong{ font-size:13px !important; }
  #mainMultiplayerChat .main-chat-head span{ font-size:9.5px !important; }
  #mainMultiplayerChat .main-chat-head button{
    min-height:24px !important;
    padding:4px 8px !important;
    font-size:11px !important;
  }
  #mainMultiplayerChat .main-chat-messages{
    min-height:30px !important;
    max-height:42px !important;
    padding:5px 7px !important;
    font-size:10.5px !important;
  }
  #mainMultiplayerChat .main-chat-message{ padding:1px 0 !important; }
  #mainMultiplayerChat .main-chat-meta{
    margin-bottom:1px !important;
    font-size:9.5px !important;
  }
  #mainMultiplayerChat .main-chat-text{
    line-height:1.14 !important;
    font-size:10.5px !important;
  }
  #mainMultiplayerChat .main-chat-form{
    gap:6px !important;
  }
  #mainMultiplayerChat .main-chat-form input,
  #mainMultiplayerChat .main-chat-form button{
    min-height:34px !important;
    padding:7px 10px !important;
    font-size:12px !important;
  }

  .tabs{ gap:8px !important; }
  .tab-btn{ min-height:40px !important; }
}


/* ---- css/modules/290-raise-bottom-desktop-v1-8-24.css ---- */
/* ========================================================================
   FIRE Quest V1.8.24 — remontée du bas sur PC
   Objectif : remonter légèrement toute la base de l'interface sur desktop
   pour éviter que les onglets soient trop collés au bord inférieur.
   ======================================================================== */

@media (min-width: 1000px){
  /* On réduit légèrement la hauteur totale du cockpit sur PC. Cela remonte
     naturellement la rangée d'onglets et réduit la sensation de panneau trop
     bas, sans retirer d'information. */
  #gameRoot.container{
    height:calc(100dvh - 56px) !important;
    max-height:calc(100dvh - 56px) !important;
    margin-bottom:0 !important;
    padding-bottom:4px !important;
  }

  /* On compense en serrant très légèrement encore le milieu. */
  .layout{ gap:10px !important; }
  .layout > .card:first-child{
    padding-bottom:6px !important;
  }
  .side-stack .progression-clean-card{
    padding-bottom:10px !important;
  }

  #mainMultiplayerChat.main-multiplayer-chat{
    margin-top:2px !important;
  }

  .tabs{
    margin-top:0 !important;
    padding-top:0 !important;
  }
}


/* ---- css/modules/300-motivation-v1-8-25.css ---- */
/* ========================================================================
   FIRE Quest V1.8.25 — motivation, objectifs et multijoueur vivant
   ======================================================================== */

.moment-objective-strip{
  border:1px solid rgba(96,165,250,.28);
  background:linear-gradient(135deg, rgba(37,99,235,.18), rgba(15,23,42,.48));
  border-radius:999px;
  padding:7px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  color:#dbeafe;
  min-width:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.moment-objective-strip strong{
  flex:0 0 auto;
  color:#93c5fd;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.moment-objective-strip span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:650;
}

#victoryConditions.clean{
  display:grid;
  gap:8px;
}
#victoryConditions .victory-condition-detail{
  list-style:none;
  padding:8px 9px;
  border-radius:12px;
  background:rgba(15,23,42,.42);
  border:1px solid rgba(148,163,184,.18);
}
#victoryConditions .victory-condition-detail.ok{
  border-color:rgba(34,197,94,.34);
  background:rgba(22,101,52,.14);
}
#victoryConditions .victory-condition-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  font-weight:800;
  font-size:12px;
}
#victoryConditions .victory-condition-line strong{ color:#93c5fd; }
#victoryConditions .victory-condition-sub{
  margin-top:3px;
  font-size:11px;
  color:#b6c5d8;
}
#victoryConditions .mini-condition-bar{
  height:5px;
  margin-top:6px;
  border-radius:999px;
  background:rgba(148,163,184,.18);
  overflow:hidden;
}
#victoryConditions .mini-condition-bar div{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, #60a5fa, #8b5cf6);
}
#victoryConditions .victory-condition-detail.ok .mini-condition-bar div{
  background:linear-gradient(90deg, #22c55e, #86efac);
}

.main-chat-message .main-chat-meta strong,
.multiplayer-chat-message .multiplayer-chat-meta strong{
  max-width:130px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.main-chat-message:has(.main-chat-meta strong:first-child),
.multiplayer-chat-message:has(.multiplayer-chat-meta strong:first-child){
  /* compatibilité : le style système reste discret même si :has n'est pas pris en charge */
}

.game-end-card{ max-width:760px !important; }
.game-end-stats{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; }
.game-end-stat strong{ font-size:18px !important; }

@media (min-width: 1000px){
  .layout > .card:first-child{
    grid-template-rows:auto auto auto auto minmax(0, 1fr) auto !important;
  }
  .moment-objective-strip{
    padding:5px 10px !important;
  }
}

@media (max-width: 800px){
  .moment-objective-strip{
    align-items:flex-start;
    border-radius:16px;
    flex-direction:column;
    gap:4px;
  }
  .moment-objective-strip span{ white-space:normal; }
  .game-end-stats{ grid-template-columns:1fr 1fr !important; }
}

.main-chat-message.system,
.multiplayer-chat-message.system{
  border-left:3px solid rgba(96,165,250,.7);
  padding-left:7px !important;
  background:rgba(59,130,246,.10);
  border-radius:10px;
}
.main-chat-message.system .main-chat-meta strong,
.multiplayer-chat-message.system .multiplayer-chat-meta strong{
  color:#93c5fd;
}


/* ---- css/modules/300-annual-review-modal-v1-8-26.css ---- */
/* ========================================================================
   FIRE Quest V1.8.26 — bilan annuel en plein écran
   Objectif : rendre le bilan annuel impossible à manquer, sans le noyer dans
   le journal. Le bilan reste aussi conservé dans l'historique.
   ======================================================================== */

.annual-review-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:radial-gradient(circle at 50% 20%, rgba(59,130,246,.22), rgba(2,6,23,.78) 42%, rgba(2,6,23,.92));
  backdrop-filter:blur(8px);
  z-index:22000;
}
.annual-review-overlay.show{
  display:flex;
  animation:annualOverlayIn .22s ease-out;
}
.annual-review-modal{
  width:min(760px, 94vw);
  max-height:calc(100dvh - 44px);
  overflow-y:auto;
  border-radius:28px;
  padding:28px;
  color:#eef6ff;
  border:1px solid rgba(147,197,253,.34);
  background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(15,23,42,.92));
  box-shadow:0 32px 100px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04) inset;
  text-align:left;
  animation:annualModalPop .26s cubic-bezier(.2,.9,.2,1) both;
}
.annual-review-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
  border-radius:999px;
  color:#bfdbfe;
  background:rgba(59,130,246,.16);
  border:1px solid rgba(147,197,253,.22);
  font-size:13px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.annual-review-modal h2{
  margin:14px 0 6px;
  font-size:clamp(28px, 4vw, 46px);
  line-height:1;
}
.annual-review-subtitle{
  margin:0 0 20px;
  color:#cbd5e1;
  font-size:16px;
}
.annual-review-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
  margin:18px 0;
}
.annual-review-stat{
  min-height:92px;
  padding:14px 12px;
  border-radius:18px;
  background:rgba(15,23,42,.68);
  border:1px solid rgba(148,163,184,.18);
}
.annual-review-stat span{
  display:block;
  color:#94a3b8;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.09em;
  margin-bottom:9px;
}
.annual-review-stat strong{
  display:block;
  font-size:clamp(20px, 2.5vw, 28px);
  line-height:1;
}
.annual-review-stat.positive strong{ color:#22c55e; }
.annual-review-stat.negative strong{ color:#f87171; }
.annual-review-stat.neutral strong{ color:#e5eefb; }
.annual-review-analysis{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:14px 0;
}
.annual-review-analysis > div{
  padding:14px;
  border-radius:18px;
  background:rgba(30,41,59,.62);
  border:1px solid rgba(148,163,184,.16);
}
.annual-review-analysis span{
  display:block;
  color:#93c5fd;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
  margin-bottom:5px;
}
.annual-review-analysis strong{
  font-size:17px;
}
.annual-review-advice{
  margin-top:12px;
  padding:16px 18px;
  border-radius:20px;
  background:linear-gradient(135deg, rgba(34,197,94,.16), rgba(59,130,246,.12));
  border:1px solid rgba(34,197,94,.22);
}
.annual-review-advice strong{
  color:#bbf7d0;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.annual-review-advice p{
  margin:8px 0 0;
  color:#e2e8f0;
  font-size:16px;
  line-height:1.35;
}
.annual-review-close{
  width:100%;
  margin-top:18px;
  min-height:48px;
  border-radius:16px;
  background:linear-gradient(135deg, #2563eb, #3b82f6);
  color:white;
  font-weight:900;
}
@keyframes annualOverlayIn{ from{ opacity:0; } to{ opacity:1; } }
@keyframes annualModalPop{ from{ opacity:0; transform:translateY(18px) scale(.97); } to{ opacity:1; transform:translateY(0) scale(1); } }
@media (max-width:760px){
  .annual-review-modal{ padding:20px; border-radius:22px; }
  .annual-review-grid{ grid-template-columns:1fr 1fr; }
  .annual-review-analysis{ grid-template-columns:1fr; }
}


/* ---- css/modules/320-graphite-balanced-v1-8-28.css ---- */
/* ========================================================================
   FIRE Quest V1.8.28 — graphite équilibré
   Objectif : conserver le fond graphite/argenté, mais le ramener vers
   un rendu plus premium, plus lisible et moins voilé.
   ======================================================================== */

body{
  background:
    linear-gradient(180deg, rgba(8,14,28,0.22) 0%, rgba(8,14,28,0.24) 34%, rgba(8,14,28,0.30) 100%),
    linear-gradient(180deg, rgba(96,165,250,0.03) 0%, rgba(15,23,42,0.00) 35%, rgba(8,14,28,0.12) 100%),
    url("assets/firequest_background_graphite_balanced.webp") center center / cover no-repeat fixed !important;
}

/* Renforcer légèrement la lisibilité de l'en-tête sans changer l'identité. */
#appTitle,
#introKicker,
#introTitle{
  text-shadow: 0 2px 10px rgba(2,8,23,0.48), 0 0 1px rgba(2,8,23,0.65) !important;
}

#appSubtitle,
.subtitle{
  text-shadow: 0 1px 8px rgba(2,8,23,0.32) !important;
}

/* Les cartes restent sombres, mais se marient mieux au nouveau fond. */
.card,
.side-stack .card,
.journal,
.stat,
#mainMultiplayerChat.main-multiplayer-chat{
  box-shadow: 0 10px 24px rgba(2,8,23,0.18), inset 0 1px 0 rgba(255,255,255,0.02) !important;
}

/* Rendre le motif bleu du bas un peu plus discret sous les onglets. */
.tabs{
  background: linear-gradient(180deg, rgba(8,14,28,0.02), rgba(8,14,28,0.08)) !important;
  border-radius: 20px;
}

/* Règle conservée après nettoyage : les panneaux gardent une bonne lisibilité
   sur le fond graphite actif. */
.card,
.side-stack .card,
.journal,
.stat,
#mainMultiplayerChat.main-multiplayer-chat{
  backdrop-filter: blur(10px) saturate(1.08) !important;
}


/* ---- css/modules/330-golden-title-v1-8-29.css ---- */
/* ========================================================================
   FIRE Quest V1.8.29 — titre doré
   Objectif : mieux détacher le titre principal sur le fond graphite,
   avec un doré premium lisible et cohérent avec l'univers du jeu.
   ======================================================================== */

#appTitle{
  background: linear-gradient(90deg, #fff8de 0%, #f8e8a6 18%, #fbbf24 48%, #f59e0b 74%, #fde68a 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow: 0 2px 12px rgba(2,8,23,.38), 0 0 1px rgba(251,191,36,.18) !important;
  filter: drop-shadow(0 1px 0 rgba(2,8,23,.35));
}

/* On laisse le sous-titre plus sobre pour ne pas entrer en concurrence. */
#appSubtitle{
  color: rgba(226,232,240,.92) !important;
  text-shadow: 0 1px 8px rgba(2,8,23,.24) !important;
}

/* Le titre d'intro peut aussi profiter d'un ton plus chaud, mais plus discret. */
#introTitle{
  background: linear-gradient(90deg, #fff9e3 0%, #f8e8a6 35%, #fbbf24 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow: 0 2px 12px rgba(2,8,23,.30) !important;
}

#introKicker{
  color: #f3d37a !important;
  text-shadow: 0 1px 10px rgba(2,8,23,.22) !important;
}


/* ---- css/modules/350-custom-solo-profile-v1-8-30.css ---- */
/* ========================================================================
   FIRE Quest V1.8.30 — profil solo personnalisé simple
   ======================================================================== */
.custom-profile-card{ border-color: rgba(251,191,36,.34) !important; background: linear-gradient(135deg, rgba(251,191,36,.11), rgba(96,165,250,.07)) !important; }
.custom-profile-card strong{ color:#fde68a; }
.custom-profile-overlay{ position:fixed; inset:0; z-index:10080; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(2,8,23,.72); backdrop-filter: blur(10px); }
.custom-profile-overlay.show{ display:flex; }
.custom-profile-modal{ width:min(760px, 94vw); max-height:92vh; overflow:auto; position:relative; border-radius:28px; border:1px solid rgba(251,191,36,.28); background:linear-gradient(180deg, rgba(15,23,42,.98), rgba(8,16,31,.95)); box-shadow:0 28px 80px rgba(2,8,23,.52), 0 0 42px rgba(251,191,36,.08); padding:28px; color:#e5edf8; }
.custom-profile-close{ position:absolute; right:16px; top:14px; width:36px; height:36px; border-radius:999px; background:rgba(148,163,184,.14); color:#fff; font-size:22px; line-height:1; }
.custom-profile-kicker{ display:inline-flex; padding:6px 11px; border-radius:999px; background:rgba(251,191,36,.12); border:1px solid rgba(251,191,36,.20); color:#fde68a; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.custom-profile-modal h2{ margin:14px 0 8px; font-size:clamp(26px, 3vw, 42px); color:#fff7d6; }
.custom-profile-lead{ margin:0 0 20px; color:#cbd5e1; line-height:1.45; }
.custom-profile-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; }
.custom-profile-grid label{ display:grid; gap:7px; color:#cbd5e1; font-size:13px; font-weight:700; }
.custom-profile-grid input{ width:100%; box-sizing:border-box; min-height:46px; border-radius:14px; border:1px solid rgba(148,163,184,.30); background:rgba(15,23,42,.82); color:#fff; padding:10px 12px; font-size:16px; }
.custom-profile-grid input:focus{ outline:none; border-color:rgba(251,191,36,.70); box-shadow:0 0 0 3px rgba(251,191,36,.12); }
.custom-profile-summary{ margin-top:18px; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.custom-profile-summary div{ border:1px solid rgba(148,163,184,.16); background:rgba(15,23,42,.58); border-radius:16px; padding:12px; }
.custom-profile-summary span{ display:block; font-size:11px; color:#93a4bd; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; }
.custom-profile-summary strong{ color:#e5edf8; font-size:17px; }
.custom-profile-summary strong.positive{ color:#86efac; }
.custom-profile-summary strong.negative{ color:#fca5a5; }
.custom-profile-warning{ margin-top:12px; border-radius:14px; padding:11px 13px; background:rgba(251,191,36,.12); border:1px solid rgba(251,191,36,.28); color:#fde68a; font-weight:700; font-size:13px; }
.custom-profile-actions{ margin-top:18px; display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; }
.custom-profile-actions button{ min-height:42px; }
@media (max-width:700px){ .custom-profile-modal{ padding:22px; } .custom-profile-grid, .custom-profile-summary{ grid-template-columns:1fr; } }

/* Correctif V1.8.31 : le panneau ne s'affiche jamais sans classe .show. */
.custom-profile-overlay[aria-hidden="true"]{ display:none !important; }
.custom-profile-overlay:not(.show){ display:none !important; }
.intro-profile-card.custom-profile-card.is-selected,
.intro-profile-card.custom-profile-card[aria-pressed="true"]{
  border-color: rgba(251,191,36,.78) !important;
  box-shadow: 0 0 0 2px rgba(251,191,36,.18), 0 16px 36px rgba(2,8,23,.22) !important;
}


/* ---- css/modules/360-custom-profile-modal-layer-fix-v1-8-33.css ---- */
/* ========================================================================
   FIRE Quest V1.8.33 — correctif affichage du profil personnalisé
   Problème corrigé : la modale était bien ouverte par le JS, mais son z-index
   était inférieur à celui de l'écran d'introduction. Elle restait donc cachée.
   ======================================================================== */

.custom-profile-overlay{
  z-index: 30000 !important;
}

.custom-profile-overlay.show,
.custom-profile-overlay[aria-hidden="false"]{
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.custom-profile-overlay.show .custom-profile-modal{
  position: relative;
  z-index: 30001 !important;
}

/* Tant que la modale personnalisée est ouverte, elle doit passer au-dessus
   de l'introduction, du choix tutoriel et des couches multijoueur. */
body.custom-profile-modal-open .intro-overlay{
  pointer-events: none;
}

body.custom-profile-modal-open .custom-profile-overlay{
  pointer-events: auto;
}


/* ---- css/modules/350-guide-onboarding-v1-8-35.css ---- */
/* ========================================================================
   FIRE Quest V1.8.35 — guide et explication initiale
   Objectif : rendre l'onboarding plus clair, plus court et plus orienté joueur.
   ======================================================================== */

.fire-briefing-text-v1835 p,
.fire-briefing-text p{
  line-height: 1.45;
}

.fire-briefing-text p strong{
  color:#f8d36d;
}

.guide-grid-v1835{
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}

.guide-card-primary{
  border-color: rgba(251,191,36,.32) !important;
  background: linear-gradient(135deg, rgba(251,191,36,.13), rgba(15,23,42,.78)) !important;
}

.guide-grid-v1835 .tutorial-card .pill{
  margin-bottom: 7px;
}

.guide-grid-v1835 .tutorial-card .small{
  line-height: 1.42;
}


/* ---- css/modules/370-startup-layout-stability-v1-8-66.css ---- */
/* ==========================================================================
   FIRE Quest V1.8.66 — stabilité du layout au démarrage
   Objectif : éviter le flash visuel où la fenêtre d’introduction apparaît
   trop grande avant que le mode solo/multijoueur ne soit initialisé.
   Aucun gameplay modifié.
   ========================================================================== */

body.firequest-layout-booting #introOverlay .intro-card{
  width:min(1040px, calc(100vw - 24px)) !important;
  max-height:calc(100dvh - 22px) !important;
  overflow:hidden !important;
  padding:18px 20px !important;
  transform:none !important;
  transition:none !important;
}

body.firequest-layout-booting #introOverlay .intro-profile-choice,
body.firequest-layout-booting #introOverlay .intro-config-grid,
body.firequest-layout-booting #introOverlay .intro-tutorial-choice{
  display:none !important;
}

body.firequest-layout-booting #introOverlay .intro-card,
body.firequest-layout-booting #introOverlay .intro-card *{
  transition:none !important;
}

#introOverlay .intro-card{
  contain:layout paint;
}

.fire-briefing-card,
.month-event-modal,
.special-spotlight-card,
.interface-tour-card{
  contain:layout paint;
}


/* ---- css/modules/380-monetization-placeholders-v1-8-72.css ---- */
/* FIRE Quest V1.8.77 — production affiliate panel.
   Network interstitials are rendered by the approved H5 ad provider, not by a fake local overlay. */
.fq-end-affiliate-slot[hidden]{display:none!important}
.fq-end-affiliate-slot{margin-top:14px;border:1px solid rgba(140,255,193,.28);background:rgba(140,255,193,.07);border-radius:20px;padding:14px;color:#f7fbff}
.fq-end-affiliate-slot strong{display:block;font-size:15px;margin-bottom:5px}
.fq-end-affiliate-slot p{margin:0 0 10px;color:rgba(247,251,255,.74);font-size:13px;line-height:1.45}
.fq-end-affiliate-links{display:flex;flex-wrap:wrap;gap:8px}
.fq-end-affiliate-links a{border-radius:999px;padding:9px 12px;text-decoration:none;font-weight:900;color:#061126;background:linear-gradient(135deg,#62d2ff,#8cffc1)}
.fq-affiliate-disclosure{margin-top:9px!important;font-size:11px!important;opacity:.82}
@media(max-width:760px){.fq-end-affiliate-links a{flex:1;text-align:center}}

.legal-footer{display:flex;justify-content:center;align-items:center;gap:10px;padding:18px 16px calc(84px + env(safe-area-inset-bottom));color:rgba(247,251,255,.62);font-size:12px}
.legal-footer a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.legal-footer a:hover{color:#8cffc1}
@media(min-width:900px){.legal-footer{padding-bottom:24px}}


/* ---- css/modules/390-mobile-touch-notifications-v1-8-76.css ---- */
/* FIRE Quest V1.8.77 — smartphone, événements variés et notifications propres. */

.journal-main-compact,
.journal-full-details{ display:none; }

.toast{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  padding:12px 10px 12px 14px !important;
}
.toast-text{ flex:1 1 auto; min-width:0; }
.toast-close{
  flex:0 0 34px;
  width:34px !important;
  min-width:34px !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 !important;
  border-radius:999px !important;
  background:rgba(148,163,184,.12) !important;
  border:1px solid rgba(148,163,184,.18) !important;
  box-shadow:none !important;
  color:#e2e8f0 !important;
  font-size:20px !important;
  line-height:1 !important;
}

.month-event-actions{ display:flex; justify-content:center; gap:9px; margin-top:18px; }
.month-event-actions button{ min-height:44px; padding:10px 14px; }

[data-tab="historyPanel"]{ position:relative; }
[data-tab="historyPanel"].has-unread::after{
  content:attr(data-unread-count);
  position:absolute;
  top:3px;
  right:3px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  font-size:9px;
  font-weight:900;
  line-height:1;
  box-shadow:0 0 0 2px #0f172a;
}
.notification-center{ min-height:320px; }
.notification-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
}
.notification-filter-row{ display:flex; flex-wrap:wrap; gap:7px; }
.notification-filter,
#markNotificationsReadBtn{ min-height:40px; padding:8px 12px; border-radius:12px; }
.notification-filter.active{ background:linear-gradient(135deg,#60a5fa,#8b5cf6) !important; color:#fff !important; }
.notification-summary{
  margin:0 0 12px;
  padding:9px 11px;
  border-radius:12px;
  background:rgba(96,165,250,.08);
  border:1px solid rgba(96,165,250,.14);
  color:#bfdbfe;
  font-size:12px;
}
.notification-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.notification-item{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:7px;
  min-width:0;
  padding:14px !important;
  border-radius:16px !important;
  background:rgba(15,23,42,.72) !important;
  border:1px solid rgba(148,163,184,.16) !important;
}
.notification-item.unread{ border-color:rgba(96,165,250,.48) !important; box-shadow:0 0 0 1px rgba(96,165,250,.12) inset; }
.notification-item.unread::before{
  content:"";
  position:absolute;
  top:12px;
  right:12px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#60a5fa;
  box-shadow:0 0 14px rgba(96,165,250,.8);
}
.notification-item-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding-right:12px; }
.notification-type{ margin:0 !important; font-size:10px !important; }
.notification-month{ color:#94a3b8; font-size:11px; white-space:nowrap; }
.notification-title{ color:#fff; font-size:15px; line-height:1.25; }
.notification-message{ color:#cbd5e1; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.notification-details{ color:#bfdbfe; font-size:12px; }
.notification-details summary{ cursor:pointer; min-height:32px; display:flex; align-items:center; font-weight:800; }
.notification-details > div{ color:#cbd5e1; line-height:1.45; padding:7px 9px; border-radius:10px; background:rgba(2,8,23,.34); }
.special-spotlight-overlay{ z-index:24000 !important; }
.special-spotlight-continue{ min-width:150px; min-height:44px; margin-top:18px; }

@media (max-width:900px){
  html{
    min-height:100%;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    scroll-padding-bottom:76px;
    -webkit-text-size-adjust:100%;
  }
  body{
    width:100%;
    min-height:100dvh !important;
    height:auto !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
    overscroll-behavior-y:none;
    touch-action:pan-y pinch-zoom;
    padding-bottom:calc(66px + env(safe-area-inset-bottom)) !important;
  }
  #rotateDeviceOverlay{ display:none !important; }
  #gameRoot.container{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:100dvh !important;
    max-height:none !important;
    overflow:visible !important;
    padding:8px !important;
  }
  .layout,
  .layout > .card:first-child,
  .side-stack,
  .side-stack .progression-clean-card{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
  .layout > .card:first-child{ padding:11px !important; }
  .stats{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .controls{ grid-template-columns:1fr !important; }
  .controls .sticky-cta{ grid-column:1 !important; position:static !important; }
  input, select, textarea{ font-size:16px !important; }
  button, [role="button"], select, input{ min-height:44px; }
  .journal{
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
  #journalText{ max-height:none !important; overflow:visible !important; }
  .journal-main-full{ display:none !important; }
  .journal-main-compact{ display:block !important; }
  .journal-full-details{ display:block; margin-top:7px; color:#93c5fd; font-size:12px; }
  .journal-full-details summary{ min-height:32px; display:flex; align-items:center; font-weight:800; }
  .journal-full-details > div{ padding:8px; border-radius:10px; background:rgba(2,8,23,.28); color:#cbd5e1; }
  .journal-narrative{ display:none !important; }

  .mobile-bottom-nav,
  #mobileBottomNav.mobile-bottom-nav{
    display:flex !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    height:auto !important;
    min-height:58px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    grid-template-columns:none !important;
    gap:0 !important;
    padding:0 4px max(6px, env(safe-area-inset-bottom)) !important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    touch-action:pan-x;
    -webkit-overflow-scrolling:touch;
  }
  .mobile-bottom-nav::-webkit-scrollbar{ display:none; }
  .mobile-bottom-nav button{
    flex:0 0 88px !important;
    width:88px !important;
    min-width:88px !important;
    min-height:52px !important;
    padding:8px 5px !important;
    font-size:11px !important;
    line-height:1.12 !important;
    white-space:normal !important;
    scroll-snap-align:center;
    touch-action:manipulation;
  }
  [data-tab="historyPanel"].has-unread::after{ top:4px; right:5px; }

  .game-panel-layer{
    padding:0 !important;
    align-items:stretch !important;
    touch-action:pan-y pinch-zoom;
  }
  .game-panel-window{
    width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    border-radius:0 !important;
    border-left:0 !important;
    border-right:0 !important;
  }
  .game-panel-header{ padding:max(10px,env(safe-area-inset-top)) 12px 10px !important; }
  .game-panel-title{ font-size:20px !important; }
  .game-panel-close{ width:44px !important; height:44px !important; min-height:44px !important; }
  .game-panel-content{
    min-height:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    touch-action:pan-y pinch-zoom;
    -webkit-overflow-scrolling:touch;
    padding:12px 10px calc(22px + env(safe-area-inset-bottom)) !important;
  }
  .game-panel-content > .panel.active{ overflow:visible !important; touch-action:pan-y pinch-zoom; }
  body.game-panel-open{ overflow:hidden !important; height:100dvh !important; }
  body.game-panel-open .mobile-bottom-nav{ display:none !important; }
  .action-tabs,
  #actionTabs{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:7px !important;
    padding:2px 2px 8px !important;
    scroll-snap-type:x proximity;
    touch-action:pan-x;
    -webkit-overflow-scrolling:touch;
  }
  #actionTabs .action-tab{ flex:0 0 auto !important; min-width:104px; scroll-snap-align:start; }
  .actions-grid,
  .market-grid,
  .goals-grid,
  .subgrid,
  .conditions-grid,
  .tutorial-grid{ grid-template-columns:1fr !important; }
  #loanTableWrap{ width:100%; overflow-x:auto; touch-action:pan-x; -webkit-overflow-scrolling:touch; }
  .loan-table{ min-width:680px; }

  .notification-toolbar{ align-items:stretch; flex-direction:column; }
  .notification-filter-row{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:4px;
    touch-action:pan-x;
    -webkit-overflow-scrolling:touch;
  }
  .notification-filter{ flex:0 0 auto; }
  #markNotificationsReadBtn{ width:100%; }
  .notification-list{ grid-template-columns:1fr; gap:8px; }
  .notification-item{ padding:12px !important; }

  .feedback-stack{
    top:max(8px, env(safe-area-inset-top)) !important;
    left:8px !important;
    right:8px !important;
    width:auto !important;
    pointer-events:none;
  }
  .toast{ width:100% !important; min-width:0 !important; pointer-events:auto; font-size:13px !important; }

  .month-event-overlay{
    align-items:flex-start !important;
    justify-content:center !important;
    padding:max(8px, env(safe-area-inset-top)) 8px 0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    pointer-events:none;
  }
  .month-event-modal{
    width:min(520px,100%) !important;
    padding:12px !important;
    border-radius:16px !important;
    text-align:left !important;
    pointer-events:auto;
    box-shadow:0 16px 46px rgba(2,8,23,.62) !important;
  }
  .month-event-icon{ display:none !important; }
  .month-event-title{ font-size:18px !important; margin-bottom:5px !important; }
  .month-event-subtitle{ font-size:13px !important; line-height:1.35 !important; }
  .month-event-actions{ justify-content:flex-start; margin-top:10px; }
  .month-event-actions button{ flex:1 1 auto; min-height:40px !important; padding:8px 10px !important; font-size:12px !important; }

  .special-spotlight-overlay{ padding:8px !important; }
  .special-spotlight-card{ width:100% !important; max-height:calc(100dvh - 16px) !important; overflow-y:auto !important; padding:20px 16px !important; border-radius:20px !important; }
  .special-spotlight-icon{ font-size:44px !important; }
  .special-spotlight-title{ font-size:24px !important; }
  .special-spotlight-text{ font-size:14px !important; line-height:1.45 !important; }
  .special-spotlight-continue{ width:100%; }

  .guided-tutorial-panel.compact-mobile{
    position:fixed !important;
    left:8px !important;
    right:8px !important;
    top:auto !important;
    bottom:calc(64px + env(safe-area-inset-bottom)) !important;
    width:auto !important;
    max-height:46dvh !important;
    z-index:20000 !important;
  }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-card{
    max-height:46dvh !important;
    overflow-y:auto !important;
    padding:12px !important;
    border-radius:17px !important;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
  }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-topline{ margin-bottom:5px; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-title{ font-size:17px !important; margin-bottom:5px; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-body{ font-size:12.5px; line-height:1.35; margin-bottom:7px; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-checklist{ margin-bottom:8px; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-checklist li{ font-size:12px; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-tip{ display:none; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-actions{
    position:sticky;
    bottom:-12px;
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:8px 0 12px;
    background:linear-gradient(180deg,transparent 0,rgba(8,16,31,.98) 22%);
  }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-actions button{ min-height:42px; font-size:12px; }
  .guided-tutorial-panel.compact-mobile #tutorialDisableBtn{ display:none; }
  body.game-panel-open #guidedTutorialPanel{ display:none !important; }

  .interface-tour-card[data-placement="mobile"]{
    width:auto !important;
    max-width:none !important;
    max-height:calc(100dvh - 78px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    overflow:hidden !important;
    padding:13px !important;
    border-radius:17px !important;
  }
  .interface-tour-card[data-placement="mobile"] .interface-tour-topline{
    flex-direction:row !important;
    align-items:center !important;
    padding-right:40px !important;
    margin-bottom:7px !important;
  }
  .interface-tour-card[data-placement="mobile"] .interface-tour-kicker,
  .interface-tour-card[data-placement="mobile"] .interface-tour-progress{ padding:5px 8px; font-size:9px; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-title{ font-size:19px !important; margin-bottom:5px; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-body{ max-height:76px; overflow-y:auto; font-size:12.5px !important; line-height:1.35 !important; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-dots{ margin:8px 0; max-height:12px; flex-wrap:nowrap; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-actions{ display:grid; grid-template-columns:1fr 1fr; gap:7px; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-actions button{ min-height:40px; font-size:12px; padding:7px 8px; }
  .interface-tour-card[data-placement="mobile"] #interfaceTourSkipBtn{ grid-column:1/-1; }
  .interface-tour-highlight{ outline-width:2px !important; outline-offset:2px !important; }

  .intro-card,
  .fire-briefing-card,
  .custom-profile-modal,
  .game-end-card,
  .annual-review-modal{
    width:calc(100vw - 16px) !important;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    touch-action:pan-y pinch-zoom;
    -webkit-overflow-scrolling:touch;
  }
}

@media (max-width:900px) and (orientation:landscape){
  body{ padding-bottom:calc(62px + env(safe-area-inset-bottom)) !important; }
  .layout{ grid-template-columns:1fr !important; }
  .layout > .card:first-child,
  .side-stack .progression-clean-card{
    max-height:none !important;
    overflow:visible !important;
  }
  .stats{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .guided-tutorial-panel.compact-mobile{ max-height:58dvh !important; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-card{ max-height:58dvh !important; }
}


/* ---- css/modules/400-player-experience-v1-8-78.css ---- */
/* FIRE Quest V1.8.78 — lisibilité, simplicité tactile et densité maîtrisée. */

@media (max-width:900px){
  html{ scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom)); }
  body{ padding-bottom:calc(108px + env(safe-area-inset-bottom)) !important; }

  :is(#gameRoot,
      .intro-overlay,
      .fire-briefing-overlay,
      .custom-profile-overlay,
      .guided-tutorial-panel,
      .interface-tour-overlay,
      .month-event-overlay,
      .special-spotlight-overlay) :is(button,[role="button"]){
    min-width:44px !important;
    min-height:44px !important;
    font-size:13px !important;
    touch-action:manipulation !important;
  }
  :is(#gameRoot,.intro-overlay,.custom-profile-overlay) :is(input,select,textarea){
    min-height:44px !important;
    font-size:16px !important;
  }

  /* Les huit destinations restent visibles : aucun onglet caché derrière un
     geste horizontal que le joueur doit deviner. */
  .mobile-bottom-nav,
  #mobileBottomNav.mobile-bottom-nav{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    min-height:98px !important;
    overflow:visible !important;
    padding:4px 4px max(6px,env(safe-area-inset-bottom)) !important;
    touch-action:manipulation !important;
  }
  .mobile-bottom-nav button{
    width:auto !important;
    min-width:0 !important;
    min-height:46px !important;
    padding:6px 3px !important;
    font-size:12.5px !important;
    line-height:1.15 !important;
  }

  /* Les catégories et filtres deviennent des grilles lisibles au premier
     regard, sans second défilement tactile dans le panneau. */
  .action-tabs,
  #actionTabs{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    overflow:visible !important;
    gap:7px !important;
    padding:2px 2px 10px !important;
    touch-action:pan-y pinch-zoom !important;
  }
  #actionTabs .action-tab{
    width:100% !important;
    min-width:0 !important;
    min-height:46px !important;
    padding:7px 5px !important;
    white-space:normal !important;
    font-size:12.5px !important;
    line-height:1.16 !important;
  }
  .notification-filter-row{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    overflow:visible !important;
    gap:7px !important;
    padding:0 !important;
    touch-action:pan-y pinch-zoom !important;
  }
  .notification-filter{
    width:100% !important;
    min-height:44px !important;
    font-size:13px !important;
  }

  /* Taille Apple recommandée pour toutes les cibles importantes, y compris
     les règles anciennes plus spécifiques. */
  .toast-close,
  .month-event-actions button,
  .guided-tutorial-panel.compact-mobile .guided-tutorial-actions button,
  .interface-tour-card[data-placement="mobile"] .interface-tour-actions button,
  .custom-profile-close,
  #customProfileCloseBtn,
  #markNotificationsReadBtn,
  .notification-details summary{
    min-width:44px !important;
    min-height:44px !important;
  }
  .toast-close{
    flex-basis:44px !important;
    width:44px !important;
    height:44px !important;
  }

  /* Aucun texte utile sous 12 px sur téléphone. */
  #gameRoot .small,
  #gameRoot .muted,
  #gameRoot .tiny{ font-size:13px !important; line-height:1.45 !important; }
  .stat .label{ font-size:12px !important; line-height:1.2 !important; letter-spacing:.06em !important; }
  .stat .value{ font-size:20px !important; line-height:1.18 !important; }
  .notification-title{ font-size:16px !important; line-height:1.3 !important; }
  .notification-message{ font-size:14px !important; line-height:1.5 !important; }
  .notification-type,
  .notification-month,
  .notification-summary,
  .notification-details{ font-size:12px !important; }
  .month-event-subtitle{ font-size:14px !important; line-height:1.45 !important; }
  .month-event-actions button{ font-size:13px !important; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-body{ font-size:14px !important; line-height:1.45 !important; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-checklist li{ font-size:13.5px !important; line-height:1.4 !important; }
  .guided-tutorial-panel.compact-mobile .guided-tutorial-actions button{ font-size:13px !important; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-kicker,
  .interface-tour-card[data-placement="mobile"] .interface-tour-progress{ font-size:11px !important; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-body{ font-size:14px !important; line-height:1.45 !important; }
  .interface-tour-card[data-placement="mobile"] .interface-tour-actions button{ font-size:13px !important; }
  .choice-effect-preview{ font-size:13px !important; line-height:1.45 !important; }
  .intro-profile-selected-label,
  .custom-profile-summary span{ font-size:12px !important; line-height:1.3 !important; }
  #mainMultiplayerChat .main-chat-head span,
  #mainMultiplayerChat .main-chat-meta,
  .live-player-stats span,
  .live-panel-foot,
  .multiplayer-peer-card .peer-status,
  .multiplayer-room-meta span{ font-size:12px !important; line-height:1.35 !important; }
}

@media (max-width:360px){
  .action-tabs,
  #actionTabs{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

@media (max-width:900px) and (orientation:landscape){
  html{ scroll-padding-bottom:calc(64px + env(safe-area-inset-bottom)); }
  body{ padding-bottom:calc(62px + env(safe-area-inset-bottom)) !important; }
  .mobile-bottom-nav,
  #mobileBottomNav.mobile-bottom-nav{
    grid-template-columns:repeat(8,minmax(0,1fr)) !important;
    min-height:54px !important;
  }
  .mobile-bottom-nav button{
    min-height:46px !important;
    font-size:12px !important;
    padding:5px 2px !important;
  }
  .action-tabs,
  #actionTabs{ grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
  .stat .label{ font-size:11px !important; }
  .stat .value{ font-size:19px !important; }
}


/* ---- css/modules/420-onboarding-simplification-v1-9-1.css ---- */
/* V1.9.1 — Simplification de la prise en main mobile.
   Objectif : réduire le nombre d'écrans/décisions avant de jouer,
   sans casser l'ancrage DOM utilisé par le sélecteur de mode
   (js/multiplayer/multiplayerUI.js insère le chooser juste après
   .fire-principles-grid : on ne retire donc aucun de ces éléments
   du DOM, on les rend seulement plus compacts / secondaires). */

.intro-quick-start-block{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:10px 0 14px;
}

.intro-quick-start-btn{
  width:100%;
  min-height:48px;
  border-radius:12px;
  border:none;
  background:linear-gradient(135deg,#f59e0b,#f97316);
  color:#1a1206;
  font-weight:800;
  font-size:15px;
  letter-spacing:.2px;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(249,115,22,.35);
}

.intro-quick-start-btn:active{
  transform:translateY(1px);
  box-shadow:0 3px 10px rgba(249,115,22,.3);
}

.intro-quick-start-hint{
  margin:0;
  text-align:center;
  opacity:.75;
  font-size:12px;
}

/* Sur petit écran, la lecture longue passe avant l'action : on réduit
   fortement le paragraphe d'intro et on transforme les 4 cartes
   pédagogiques en bandeau compact scrollable plutôt qu'en 4 blocs
   empilés en pleine largeur. */
@media (max-width:600px){
  .intro-lead{
    font-size:12.5px !important;
    line-height:1.35 !important;
    opacity:.8;
    margin:0 0 10px !important;
  }

  .fire-principles-grid{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:8px !important;
    padding-bottom:4px !important;
    margin:0 0 12px !important;
    -webkit-overflow-scrolling:touch;
  }

  .fire-principle-card{
    flex:0 0 auto !important;
    min-width:132px !important;
    padding:8px 10px !important;
  }

  .fire-principle-card strong{
    font-size:12px !important;
  }

  .fire-principle-card span{
    font-size:10.5px !important;
    line-height:1.2 !important;
  }
}

/* V1.9.2 — Correction critique de navigation mobile.
   Avant ce correctif, ouvrir un panneau (Pilotage, Marchés, etc.) rendait la
   barre de navigation basse totalement non cliquable (pointer-events:none)
   tant que ce panneau n'était pas explicitement fermé au bouton ✕. Résultat
   concret : impossible de passer directement d'un onglet à un autre, il
   fallait fermer puis rouvrir à chaque fois. On restaure le comportement
   standard d'une appli mobile : la nav basse reste toujours cliquable et
   visible au-dessus du panneau, un tap sur un autre onglet bascule
   directement (WEPanelOverlay.open() gère déjà proprement le remplacement
   du contenu affiché, voir js/ui/gamePanelOverlay.js). */
body.game-panel-open .mobile-bottom-nav{
  pointer-events:auto !important;
  z-index:19000 !important;
}


/* ---- css/modules/410-retention-and-shared-world-v1-9-0.css ---- */
/* FIRE Quest V1.9.0 — parcours, bilan rejouable et monde multijoueur commun. */

.career-summary{
  display:flex; flex-direction:column; gap:3px; margin-top:10px; padding:10px 12px;
  border:1px solid rgba(251,191,36,.25); border-radius:12px; background:rgba(15,23,42,.34);
}
.career-summary strong{ color:#fbbf24; font-size:13px; }
.career-summary span{ color:#dbeafe; font-size:12px; line-height:1.4; }

.journey-pulse{
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin:10px 0;
  padding:11px 12px; border:1px solid rgba(96,165,250,.34); border-radius:14px;
  background:linear-gradient(120deg,rgba(30,64,175,.24),rgba(15,23,42,.76));
}
.journey-pulse[hidden]{ display:none !important; }
.journey-pulse>div{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.journey-pulse strong{ color:#f8fafc; font-size:14px; }
.journey-pulse span{ color:#bfdbfe; font-size:12px; line-height:1.35; }
.journey-pulse button{ flex:0 0 auto; min-height:44px; padding:8px 12px; }

.journey-card{ margin:12px 0; overflow:hidden; border-color:rgba(251,191,36,.3) !important; }
.journey-empty{ color:#cbd5e1; font-size:14px; }
.journey-head{ display:flex; justify-content:space-between; gap:18px; align-items:flex-start; }
.journey-head>div:first-child{ display:flex; flex-direction:column; gap:4px; }
.journey-head span{ color:#fbbf24; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.journey-head strong{ color:#f8fafc; font-size:20px; }
.journey-head small{ color:#cbd5e1; font-size:13px; line-height:1.45; }
.journey-xp{ min-width:82px; padding:8px 10px; text-align:center; border-radius:12px; background:rgba(251,191,36,.1); }
.journey-xp b{ display:block; color:#fbbf24; font-size:20px; }
.journey-xp span{ font-size:10px; letter-spacing:.03em; }
.journey-chapter-track{ display:grid; grid-template-columns:repeat(5,1fr); gap:7px; margin:14px 0; }
.journey-chapter-track span{ display:grid; place-items:center; min-height:30px; border-radius:999px; color:#94a3b8; background:rgba(51,65,85,.55); font-weight:900; }
.journey-chapter-track span.active{ color:#07152f; background:#fbbf24; box-shadow:0 0 0 4px rgba(251,191,36,.12); }
.journey-chapter-track span.done{ color:#052e16; background:#4ade80; }
.journey-checks{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.journey-check{ display:grid; grid-template-columns:24px 1fr; gap:7px; padding:10px; border:1px solid rgba(148,163,184,.18); border-radius:12px; background:rgba(15,23,42,.38); }
.journey-check>span{ color:#93c5fd; font-size:20px; line-height:1; }
.journey-check strong,.journey-check small{ display:block; }
.journey-check strong{ color:#e2e8f0; font-size:12px; line-height:1.35; }
.journey-check small{ color:#94a3b8; margin-top:4px; font-size:11px; }
.journey-check.done{ border-color:rgba(74,222,128,.3); background:rgba(20,83,45,.2); }
.journey-check.done>span{ color:#4ade80; }
.journey-mini-bar,.team-quest-progress{ height:5px; overflow:hidden; margin-top:8px; border-radius:99px; background:rgba(148,163,184,.16); }
.journey-mini-bar i,.team-quest-progress i{ display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#60a5fa,#fbbf24); }

.big-next-btn.ready-to-advance{
  background:linear-gradient(135deg,#fbbf24,#f59e0b) !important; color:#111827 !important;
  box-shadow:0 0 0 4px rgba(251,191,36,.16),0 10px 28px rgba(245,158,11,.24);
}

.game-end-story{ margin:12px 0; padding:12px 14px; border-left:3px solid #fbbf24; border-radius:8px; background:rgba(251,191,36,.08); color:#e2e8f0; line-height:1.55; }
.game-end-comparison{ margin:10px 0; }
.end-comparison-title{ margin-bottom:7px; color:#bfdbfe; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.end-comparison-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.end-comparison-grid>div,.end-comparison-first{ padding:10px; border-radius:11px; background:rgba(30,41,59,.72); }
.end-comparison-grid span,.end-comparison-grid strong{ display:block; }
.end-comparison-grid span{ color:#94a3b8; font-size:11px; }
.end-comparison-grid strong{ margin-top:3px; color:#f8fafc; font-size:14px; }
.end-comparison-first{ color:#dbeafe; font-size:13px; }
.game-end-actions button[hidden]{ display:none !important; }

.team-quest-card{ margin:12px 0; padding:12px; border:1px solid rgba(34,211,238,.26); border-radius:14px; background:linear-gradient(130deg,rgba(8,145,178,.13),rgba(15,23,42,.78)); }
.team-quest-head{ display:flex; justify-content:space-between; gap:8px; margin-bottom:6px; color:#67e8f9; font-size:12px; font-weight:800; text-transform:uppercase; }
.team-quest-card>strong,.team-quest-card>small{ display:block; }
.team-quest-card>strong{ color:#f8fafc; font-size:15px; }
.team-quest-card>small{ margin-top:3px; color:#cbd5e1; font-size:12px; line-height:1.4; }
.team-quest-foot{ display:flex; justify-content:space-between; gap:10px; margin-top:7px; color:#bfdbfe; font-size:11px; }
.team-quest-foot .warn{ color:#fbbf24; font-weight:800; }
.team-quest-card.compact{ margin:8px 0; padding:9px; }
.team-quest-card.compact>small{ display:none; }
.team-quest-card.complete{ border-color:rgba(74,222,128,.35); background:rgba(20,83,45,.22); }
.room-highlights{ margin-top:12px; }
.room-highlights>strong{ color:#f8fafc; font-size:14px; }
.room-highlights>div{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:7px; }
.room-highlights span{ padding:9px; border-radius:10px; background:rgba(30,41,59,.68); color:#cbd5e1; font-size:11px; }
.room-highlights b{ display:block; margin-top:4px; color:#f8fafc; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width:760px){
  .journey-pulse{ align-items:stretch; }
  .journey-pulse button{ min-width:108px; }
  .journey-head{ gap:8px; }
  .journey-head strong{ font-size:17px; }
  .journey-checks{ grid-template-columns:1fr; }
  .journey-check{ min-height:62px; }
  .end-comparison-grid,.room-highlights>div{ grid-template-columns:1fr; }
  .game-end-card{ max-height:calc(100dvh - 20px); overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .game-end-actions{ display:grid !important; grid-template-columns:1fr !important; }
  .game-end-actions button,.journey-pulse button{ min-height:48px !important; font-size:14px !important; }
  .team-quest-foot{ flex-direction:column; gap:3px; }
}

@media (max-width:420px){
  .journey-pulse{ flex-direction:column; }
  .journey-pulse button{ width:100%; }
  .journey-chapter-track{ gap:4px; }
  .journey-chapter-track span{ min-height:28px; font-size:12px; }
}


/* ---- css/modules/430-mobile-minimal-v1-9-6.css ---- */
/* FIRE Quest V1.9.6 — Mobile simplification, second pass.
   Goal: reuse the existing desktop DOM, remove clutter on phones, add no decorative symbols.
   Desktop is intentionally untouched. */

/* Regular portrait/mobile widths. Large landscape phones are handled by the coarse-pointer rule below. */
@media (max-width: 900px) {
  body.game-started #gameRoot.container {
    padding: 6px 8px calc(122px + env(safe-area-inset-bottom)) !important;
  }

  /* Once play has started, the title/settings bar and onboarding banner no longer consume the viewport. */
  body.game-started .topbar,
  body.game-started .mobile-hero {
    display: none !important;
  }

  body.game-started .layout {
    display: block !important;
  }

  body.game-started .layout > .card:first-child {
    padding: 8px !important;
    border-radius: 12px !important;
  }

  /* Four essential financial values only. We reuse the existing desktop stats, no duplicate HUD. */
  body.game-started .stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 5px !important;
    margin-bottom: 6px !important;
  }
  body.game-started .stats .stat {
    min-height: 0 !important;
    padding: 7px 8px !important;
    border-radius: 10px !important;
  }
  body.game-started .stats .stat:nth-child(3),
  body.game-started .stats .stat:nth-child(6) {
    display: none !important; /* revenu total, mensualités: accessibles dans Pilotage/Portfolio */
  }
  body.game-started .stats .label {
    font-size: 9px !important;
    line-height: 1.05 !important;
    margin-bottom: 2px !important;
  }
  body.game-started .stats .value {
    font-size: 17px !important;
    line-height: 1.05 !important;
  }

  /* The profile/new-game controls disappear during play. Only the month action stays here. */
  body.game-started .controls {
    display: block !important;
    margin: 0 !important;
  }
  body.game-started .controls > div:first-child,
  body.game-started #startBtn {
    display: none !important;
  }
  body.game-started .controls .sticky-cta {
    display: block !important;
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: calc(64px + env(safe-area-inset-bottom)) !important;
    z-index: 10950 !important;
    margin: 0 !important;
  }
  body.game-started #nextMonthBtn {
    width: 100% !important;
    min-height: 48px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    font-size: 0 !important; /* mobile label without the legacy arrow glyph */
  }
  body.game-started #nextMonthBtn::after {
    content: attr(data-mobile-label);
    font-size: 15px;
    font-weight: 850;
  }

  /* Keep only the two pieces needed to understand the turn: actions and month. */
  body.game-started .month-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
    margin: 0 0 6px !important;
  }
  body.game-started .month-actions .pill {
    min-width: 0 !important;
    padding: 5px 7px !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
    justify-content: center !important;
  }
  body.game-started .month-actions .pill:nth-child(3),
  body.game-started .month-actions .pill:nth-child(4) {
    display: none !important;
  }

  /* One-line priority, not another large card. */
  body.game-started #momentObjectiveStrip {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    border-radius: 9px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }
  body.game-started #momentObjectiveStrip strong {
    flex: 0 0 auto !important;
    font-size: 9px !important;
  }
  body.game-started #momentObjectiveText {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 10px !important;
  }

  /* These remain available in panels/history, but do not occupy the main phone screen. */
  body.game-started #journeyPulse,
  body.game-started .journal,
  body.game-started .status-turn-stack,
  body.game-started #mainMultiplayerChat,
  body.game-started .legal-footer {
    display: none !important;
  }

  /* Player indicators: stress only on the home screen. Other indicators stay in Pilotage. */
  body.game-started .side-stack {
    display: block !important;
    margin-top: 5px !important;
  }
  body.game-started .side-stack .progression-clean-card {
    display: block !important;
    padding: 6px 8px !important;
    min-height: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }
  body.game-started .side-stack .section-title,
  body.game-started .side-stack .progress-row:not(.focus-row),
  body.game-started #multiplayerLivePanel {
    display: none !important;
  }
  body.game-started .side-stack .focus-row {
    margin: 0 !important;
  }
  body.game-started .side-stack .progress-head {
    margin-bottom: 3px !important;
    font-size: 10px !important;
  }
  body.game-started .side-stack .bar {
    height: 5px !important;
  }

  /* Five plain-text primary buttons. Secondary destinations open above them only after tapping Plus. */
  body.game-started #mobileBottomNav.mobile-bottom-nav {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    overflow: visible !important;
    min-height: 58px !important;
    padding: 0 max(4px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left)) !important;
  }
  body.game-started #mobileBottomNav button {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    flex: none !important;
    min-height: 52px !important;
    padding: 7px 2px !important;
    font-size: 10.5px !important;
    white-space: nowrap !important;
  }
  body.game-started #mobileBottomNav .mobile-more-menu {
    display: none !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu {
    display: grid !important;
    position: fixed !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    right: max(6px, env(safe-area-inset-right)) !important;
    bottom: calc(118px + env(safe-area-inset-bottom)) !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 6px !important;
    padding: 6px !important;
    z-index: 10980 !important;
    border: 1px solid rgba(148,163,184,.22) !important;
    background: rgba(12,24,43,.98) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 30px rgba(2,8,23,.45) !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-extra {
    display: block !important;
    position: static !important;
    width: auto !important;
    min-height: 44px !important;
    border-radius: 9px !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-multiplayer {
    grid-column: 1 / -1 !important;
  }

  /* Multiplayer stays available through Plus without covering the month CTA. */
  body.game-started .multiplayer-floating-btn {
    display: none !important;
  }
}

/* Large phones in landscape can be wider than 900px. Touch/coarse pointer prevents this rule from affecting PCs. */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  body.game-started .topbar,
  body.game-started .mobile-hero,
  body.game-started #journeyPulse,
  body.game-started .journal,
  body.game-started .status-turn-stack,
  body.game-started #mainMultiplayerChat,
  body.game-started .legal-footer { display:none !important; }

  body.game-started #gameRoot.container { padding:4px 8px calc(108px + env(safe-area-inset-bottom)) !important; }
  body.game-started .layout { display:grid !important; grid-template-columns:minmax(0,1fr) 180px !important; gap:6px !important; }
  body.game-started .layout > .card:first-child { padding:6px !important; }
  body.game-started .stats { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:4px !important; margin-bottom:4px !important; }
  body.game-started .stats .stat:nth-child(3), body.game-started .stats .stat:nth-child(6) { display:none !important; }
  body.game-started .stats .stat { padding:5px 6px !important; min-height:0 !important; }
  body.game-started .stats .label { font-size:8px !important; }
  body.game-started .stats .value { font-size:14px !important; }
  body.game-started .controls > div:first-child, body.game-started #startBtn { display:none !important; }
  body.game-started .controls .sticky-cta { position:fixed !important; left:max(8px,env(safe-area-inset-left)) !important; right:max(8px,env(safe-area-inset-right)) !important; bottom:calc(57px + env(safe-area-inset-bottom)) !important; z-index:10950 !important; }
  body.game-started #nextMonthBtn { min-height:42px !important; font-size:0 !important; }
  body.game-started #nextMonthBtn::after { content:attr(data-mobile-label); font-size:14px; font-weight:850; }
  body.game-started .month-actions { display:grid !important; grid-template-columns:1fr 1fr !important; gap:4px !important; margin:0 0 4px !important; }
  body.game-started .month-actions .pill:nth-child(3), body.game-started .month-actions .pill:nth-child(4) { display:none !important; }
  body.game-started #momentObjectiveStrip { padding:4px 6px !important; margin:0 !important; min-height:0 !important; white-space:nowrap !important; overflow:hidden !important; }
  body.game-started .side-stack { display:block !important; margin:0 !important; }
  body.game-started .side-stack .progression-clean-card { display:block !important; padding:6px !important; min-height:0 !important; }
  body.game-started .side-stack .section-title, body.game-started .side-stack .progress-row:not(.focus-row), body.game-started #multiplayerLivePanel { display:none !important; }
  body.game-started #mobileBottomNav.mobile-bottom-nav { display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; overflow:visible !important; padding-left:max(4px,env(safe-area-inset-left)) !important; padding-right:max(4px,env(safe-area-inset-right)) !important; }
  body.game-started #mobileBottomNav button { display:block !important; width:auto !important; min-width:0 !important; min-height:46px !important; font-size:10px !important; }
  body.game-started #mobileBottomNav .mobile-more-menu { display:none !important; }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu {
    display:grid !important; position:fixed !important;
    left:max(8px,env(safe-area-inset-left)) !important; right:max(8px,env(safe-area-inset-right)) !important;
    bottom:calc(105px + env(safe-area-inset-bottom)) !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:5px !important; padding:5px !important;
    z-index:10980 !important; border:1px solid rgba(148,163,184,.22) !important;
    background:rgba(12,24,43,.98) !important; border-radius:9px !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-extra {
    display:block !important; position:static !important; width:auto !important; min-height:40px !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-multiplayer { grid-column:auto !important; }
  body.game-started .multiplayer-floating-btn { display:none !important; }
}


/* ---- css/modules/432-trade-republic-referral-v1-9-6.css ---- */
/* FIRE Quest V1.9.6 — Trade Republic closed-beta referral
   Discreet contextual monetization. No popups, no gameplay interruption. */

.fq-referral-card[hidden]{display:none!important}
.fq-referral-card{
  margin-top:14px;
  border:1px solid rgba(222,184,86,.32);
  background:linear-gradient(135deg,rgba(222,184,86,.075),rgba(34,54,83,.34));
  border-radius:18px;
  padding:14px 15px;
  color:#f6f8fb;
}
.fq-referral-title{display:block;font-size:15px;font-weight:900;margin-bottom:5px;color:#f0cf73}
.fq-referral-text{margin:0 0 10px;color:rgba(246,248,251,.76);font-size:13px;line-height:1.45}
.fq-referral-cta{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;
  padding:9px 14px;border-radius:12px;text-decoration:none;font-weight:900;
  color:#10151d;background:linear-gradient(135deg,#f0cf73,#d6aa42);
  box-shadow:0 8px 22px rgba(0,0,0,.16);
}
.fq-referral-cta:hover,.fq-referral-cta:focus{filter:brightness(1.05);transform:translateY(-1px)}
.fq-referral-disclosure{display:block;margin-top:8px;color:rgba(246,248,251,.55);font-size:10.5px;line-height:1.35}
.fq-referral-investment{margin:12px 0 0}
.fq-referral-investment .fq-referral-title{display:inline;margin-right:10px}
.fq-referral-investment .fq-referral-cta{min-height:36px;padding:7px 12px;font-size:12px}
.fq-referral-investment .fq-referral-disclosure{margin-top:7px}
.fq-mobile-referral-link{color:#f0cf73!important;text-decoration:none!important}

@media(max-width:900px), (hover:none) and (pointer:coarse) and (orientation:landscape){
  .fq-referral-card{margin-top:10px;padding:11px 12px;border-radius:14px}
  .fq-referral-title{font-size:13px;margin-bottom:4px}
  .fq-referral-text{font-size:11px;margin-bottom:8px}
  .fq-referral-cta{width:100%;min-height:38px;padding:8px 10px;font-size:12px}
  .fq-referral-disclosure{font-size:9px;margin-top:6px}
  #mobileBottomNav.more-open .fq-mobile-referral-link{display:flex!important;align-items:center;justify-content:center}
}


/* ---- css/modules/431-mobile-premium-v1-9-6.css ---- */
/* FIRE Quest V1.9.6 — Mobile Premium.
   Visual-only hardening layered on top of 430-mobile-minimal-v1-9-6.css.
   Desktop (>900px, non-coarse landscape) is intentionally untouched. */

@media (max-width: 900px), (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
  :root{
    --fq-mobile-gold:#f2c85f;
    --fq-mobile-text:#f7fbff;
    --fq-mobile-muted:#9fb0c8;
    --fq-mobile-card:linear-gradient(145deg,rgba(17,39,68,.94),rgba(10,26,48,.96));
    --fq-mobile-border:rgba(130,166,213,.22);
    --fq-mobile-shadow:0 10px 28px rgba(1,7,18,.26);
  }

  body.game-started{
    overflow-x:hidden !important;
    padding-bottom:0 !important;
  }

  body.game-started #gameRoot.container{
    width:100% !important;
    max-width:none !important;
    min-height:100dvh !important;
    box-sizing:border-box !important;
    padding:10px max(10px,env(safe-area-inset-right)) calc(88px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left)) !important;
  }

  /* Small brand line: premium identity without bringing the desktop top bar back. */
  body.game-started #gameRoot.container::before{
    content:'FIRE QUEST';
    display:block;
    margin:0 2px 10px;
    color:var(--fq-mobile-gold);
    font-size:18px;
    line-height:1;
    font-weight:900;
    letter-spacing:.08em;
    text-shadow:0 2px 12px rgba(242,200,95,.16);
  }

  body.game-started .topbar,
  body.game-started .mobile-hero,
  body.game-started #journeyPulse,
  body.game-started .journal,
  body.game-started .status-turn-stack,
  body.game-started #mainMultiplayerChat,
  body.game-started .legal-footer,
  body.game-started .multiplayer-floating-btn{
    display:none !important;
  }

  /* Flatten desktop wrappers so the existing data can be reordered as a true mobile dashboard. */
  body.game-started .layout{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:10px !important;
    align-content:start !important;
    margin:0 !important;
  }
  body.game-started .layout > .card:first-child,
  body.game-started .side-stack{
    display:contents !important;
  }

  /* 4 financial KPIs. No emoji/icon font: accents are pure CSS. */
  body.game-started .stats{
    grid-column:1 / -1 !important;
    order:1 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin:0 !important;
  }
  body.game-started .stats .stat{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-height:78px !important;
    padding:13px 14px !important;
    border:1px solid var(--fq-mobile-border) !important;
    border-radius:17px !important;
    background:var(--fq-mobile-card) !important;
    box-shadow:var(--fq-mobile-shadow) !important;
    overflow:hidden !important;
  }
  body.game-started .stats .stat:nth-child(3),
  body.game-started .stats .stat:nth-child(6){ display:none !important; }
  body.game-started .stats .stat::after{
    content:'';
    position:absolute;
    right:13px;
    top:13px;
    width:8px;
    height:8px;
    border-radius:999px;
    background:#61d69a;
    box-shadow:0 0 0 5px rgba(97,214,154,.10);
  }
  body.game-started .stats .stat:nth-child(4)::after{ background:#a78bfa; box-shadow:0 0 0 5px rgba(167,139,250,.10); }
  body.game-started .stats .stat:nth-child(5)::after{ background:#f08a8a; box-shadow:0 0 0 5px rgba(240,138,138,.10); }
  body.game-started .stats .label{
    max-width:calc(100% - 20px) !important;
    margin:0 0 7px !important;
    color:var(--fq-mobile-muted) !important;
    font-size:10.5px !important;
    font-weight:750 !important;
    letter-spacing:.12em !important;
    line-height:1.08 !important;
    text-transform:uppercase !important;
  }
  body.game-started .stats .value{
    color:var(--fq-mobile-text) !important;
    font-size:23px !important;
    font-weight:900 !important;
    line-height:1 !important;
    letter-spacing:-.02em !important;
  }
  body.game-started .stats .stat.main .value,
  body.game-started #cashStat,
  body.game-started #netWorthStat{ color:#4fdb8d !important; }

  /* Stress gets a real card and sits beside the turn summary. */
  body.game-started .side-stack .progression-clean-card{
    grid-column:1 !important;
    order:2 !important;
    display:block !important;
    min-height:88px !important;
    padding:13px 14px !important;
    margin:0 !important;
    border:1px solid rgba(235,130,130,.22) !important;
    border-radius:17px !important;
    background:var(--fq-mobile-card) !important;
    box-shadow:var(--fq-mobile-shadow) !important;
    overflow:hidden !important;
  }
  body.game-started .side-stack .section-title,
  body.game-started .side-stack .progress-row:not(.focus-row),
  body.game-started #multiplayerLivePanel{ display:none !important; }
  body.game-started .side-stack .focus-row{
    margin:0 !important;
    padding:0 !important;
  }
  body.game-started .side-stack .progress-head{
    margin:0 0 12px !important;
    color:#c8d5e6 !important;
    font-size:12px !important;
    font-weight:750 !important;
  }
  body.game-started .side-stack .progress-head span:last-child{
    color:#65d49a !important;
    font-weight:850 !important;
  }
  body.game-started .side-stack .bar{
    height:8px !important;
    overflow:hidden !important;
    border-radius:999px !important;
    background:rgba(69,100,141,.30) !important;
  }
  body.game-started .side-stack .fill{
    border-radius:999px !important;
    box-shadow:0 0 12px rgba(80,217,151,.22) !important;
  }

  /* Actions/month are compact status tiles rather than pills floating in whitespace. */
  body.game-started .month-actions{
    grid-column:2 !important;
    order:3 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    margin:0 !important;
  }
  body.game-started .month-actions .pill{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    min-width:0 !important;
    min-height:40px !important;
    padding:9px 11px !important;
    border:1px solid var(--fq-mobile-border) !important;
    border-radius:13px !important;
    background:linear-gradient(145deg,rgba(18,39,67,.90),rgba(11,28,49,.95)) !important;
    color:#b9c7da !important;
    font-size:10.5px !important;
    font-weight:700 !important;
    line-height:1.15 !important;
    box-shadow:0 7px 20px rgba(1,7,18,.16) !important;
  }
  body.game-started .month-actions .pill span{
    color:#f5f8ff !important;
    font-size:12px !important;
    font-weight:900 !important;
  }
  body.game-started .month-actions .pill:nth-child(3),
  body.game-started .month-actions .pill:nth-child(4){ display:none !important; }

  body.game-started #momentObjectiveStrip{
    grid-column:1 / -1 !important;
    order:4 !important;
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) !important;
    align-items:center !important;
    gap:9px !important;
    min-height:56px !important;
    margin:0 !important;
    padding:12px 14px !important;
    border:1px solid rgba(242,200,95,.52) !important;
    border-radius:17px !important;
    background:linear-gradient(135deg,rgba(48,40,20,.34),rgba(15,28,45,.92)) !important;
    box-shadow:0 10px 26px rgba(1,7,18,.18) !important;
    overflow:hidden !important;
    white-space:normal !important;
  }
  body.game-started #momentObjectiveStrip strong{
    color:var(--fq-mobile-gold) !important;
    font-size:10px !important;
    font-weight:900 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
  }
  body.game-started #momentObjectiveText{
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    color:#e9eef7 !important;
    font-size:11px !important;
    font-weight:650 !important;
  }

  /* Primary action is in normal flow: always visible without creating the giant dead zone seen in the previous build. */
  body.game-started .controls{
    grid-column:1 / -1 !important;
    order:5 !important;
    display:block !important;
    margin:0 !important;
  }
  body.game-started .controls > div:first-child,
  body.game-started #startBtn{ display:none !important; }
  body.game-started .controls .sticky-cta{
    position:static !important;
    display:block !important;
    inset:auto !important;
    margin:0 !important;
    z-index:auto !important;
  }
  body.game-started #nextMonthBtn{
    position:relative !important;
    width:100% !important;
    min-height:58px !important;
    padding:14px 16px !important;
    border:1px solid rgba(125,184,255,.38) !important;
    border-radius:17px !important;
    background:linear-gradient(115deg,#245ee7,#348df2) !important;
    box-shadow:0 12px 28px rgba(36,94,231,.28), inset 0 1px 0 rgba(255,255,255,.16) !important;
    color:white !important;
    font-size:0 !important;
    font-weight:900 !important;
    letter-spacing:-.01em !important;
  }
  body.game-started #nextMonthBtn::after{
    content:attr(data-mobile-label) !important;
    color:#fff !important;
    font-size:17px !important;
    font-weight:900 !important;
  }
  body.game-started #nextMonthBtn:disabled{
    opacity:.46 !important;
    filter:saturate(.55) !important;
  }

  /* Premium bottom navigation: one glass dock, no five giant blue blocks. */
  body.game-started #mobileBottomNav.mobile-bottom-nav{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    position:fixed !important;
    left:max(10px,env(safe-area-inset-left)) !important;
    right:max(10px,env(safe-area-inset-right)) !important;
    bottom:max(7px,env(safe-area-inset-bottom)) !important;
    width:auto !important;
    min-height:60px !important;
    padding:5px !important;
    gap:2px !important;
    overflow:visible !important;
    z-index:10960 !important;
    border:1px solid rgba(128,161,205,.22) !important;
    border-radius:20px !important;
    background:rgba(8,22,41,.94) !important;
    backdrop-filter:blur(18px) saturate(125%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(125%) !important;
    box-shadow:0 14px 36px rgba(1,7,18,.44) !important;
  }
  body.game-started #mobileBottomNav > button{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:0 !important;
    min-height:48px !important;
    padding:6px 2px !important;
    border:0 !important;
    border-radius:14px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#9facbf !important;
    font-size:10.5px !important;
    font-weight:750 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  body.game-started #mobileBottomNav > button.active{
    background:linear-gradient(180deg,rgba(51,123,239,.16),rgba(42,96,184,.08)) !important;
    color:#6fb4ff !important;
  }
  body.game-started #mobileBottomNav > button.active::before{
    content:'';
    position:absolute;
    top:2px;
    left:32%;
    right:32%;
    height:2px;
    border-radius:99px;
    background:#65aaff;
    box-shadow:0 0 10px rgba(101,170,255,.65);
  }

  /* Plus is a compact vertical sheet aligned to the dock. */
  body.game-started #mobileBottomNav .mobile-more-menu{ display:none !important; }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu{
    display:grid !important;
    position:fixed !important;
    right:max(12px,env(safe-area-inset-right)) !important;
    left:auto !important;
    bottom:calc(76px + env(safe-area-inset-bottom)) !important;
    width:min(250px,calc(100vw - 24px)) !important;
    grid-template-columns:1fr !important;
    gap:3px !important;
    padding:7px !important;
    z-index:10980 !important;
    border:1px solid rgba(128,161,205,.24) !important;
    border-radius:18px !important;
    background:rgba(8,22,41,.98) !important;
    box-shadow:0 18px 46px rgba(1,7,18,.56) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-extra{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    position:static !important;
    width:100% !important;
    min-height:42px !important;
    padding:9px 12px !important;
    border:0 !important;
    border-radius:11px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#d8e2f0 !important;
    font-size:12px !important;
    font-weight:750 !important;
    text-align:left !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-extra:hover,
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-extra:focus{
    background:rgba(62,121,205,.15) !important;
  }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu .mobile-nav-multiplayer{
    grid-column:auto !important;
  }

  /* Panels become premium mobile sheets; desktop modal styles are unchanged. */
  body.game-panel-open .game-panel-layer{
    align-items:flex-end !important;
    justify-content:center !important;
    padding:0 !important;
  }
  body.game-panel-open .game-panel-window{
    width:100vw !important;
    max-width:100vw !important;
    max-height:min(91dvh,900px) !important;
    border-width:1px 0 0 !important;
    border-radius:26px 26px 0 0 !important;
    background:linear-gradient(180deg,rgba(14,32,55,.995),rgba(7,20,38,.995)) !important;
    box-shadow:0 -20px 60px rgba(1,7,18,.48) !important;
  }
  body.game-panel-open .game-panel-header{
    padding:13px 15px 11px !important;
    background:rgba(9,24,43,.94) !important;
  }
  body.game-panel-open .game-panel-kicker{ display:none !important; }
  body.game-panel-open .game-panel-title{ font-size:20px !important; }
  body.game-panel-open .game-panel-close{
    width:36px !important;
    height:36px !important;
    min-height:36px !important;
    font-size:16px !important;
  }
  body.game-panel-open .game-panel-content{
    padding:12px 12px max(16px,env(safe-area-inset-bottom)) !important;
  }
}

/* Landscape phone: same hierarchy, denser presentation, never the desktop cockpit. */
@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse){
  body.game-started #gameRoot.container{
    padding-top:6px !important;
    padding-bottom:calc(68px + env(safe-area-inset-bottom)) !important;
  }
  body.game-started #gameRoot.container::before{
    margin-bottom:6px !important;
    font-size:14px !important;
  }
  body.game-started .layout{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  body.game-started .stats{
    grid-column:1 / -1 !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  body.game-started .stats .stat{
    min-height:54px !important;
    padding:8px 10px !important;
    border-radius:13px !important;
  }
  body.game-started .stats .label{ font-size:8px !important; margin-bottom:4px !important; }
  body.game-started .stats .value{ font-size:16px !important; }
  body.game-started .side-stack .progression-clean-card{ grid-column:1 / 2 !important; min-height:62px !important; padding:9px 10px !important; }
  body.game-started .month-actions{ grid-column:2 / 3 !important; gap:4px !important; }
  body.game-started .month-actions .pill{ min-height:29px !important; padding:5px 8px !important; font-size:8px !important; }
  body.game-started #momentObjectiveStrip{ grid-column:3 / 4 !important; min-height:62px !important; padding:8px 10px !important; display:block !important; }
  body.game-started #momentObjectiveStrip strong{ display:block !important; margin-bottom:4px !important; font-size:8px !important; }
  body.game-started #momentObjectiveText{ display:block !important; font-size:9px !important; }
  body.game-started .controls{ grid-column:4 / 5 !important; }
  body.game-started #nextMonthBtn{ min-height:62px !important; border-radius:14px !important; padding:8px !important; }
  body.game-started #nextMonthBtn::after{ font-size:13px !important; }
  body.game-started #mobileBottomNav.mobile-bottom-nav{
    min-height:50px !important;
    bottom:max(4px,env(safe-area-inset-bottom)) !important;
  }
  body.game-started #mobileBottomNav > button{ min-height:40px !important; font-size:9px !important; }
  body.game-started #mobileBottomNav.more-open .mobile-more-menu{
    bottom:calc(62px + env(safe-area-inset-bottom)) !important;
  }
}

/* ==========================================================================
   FIRE Quest V1.8.29 — Feuille de style principale
   Version nettoyée : les modules actifs sont conservés, les anciens fonds
   obsolètes et fichiers de test ont été retirés de la distribution.
   ========================================================================== */