/* ============================================================
   AURORA — feuille de style de la direction B
   Sert de brouillon de design system : tokens + primitives.
   ============================================================ */
:root{
  --bg:#0B1224; --fg:#EDF1FC; --mut:#93A2C8; --dim:#6C7BA4;
  --line:rgba(160,185,255,.13); --line2:rgba(160,185,255,.26);
  --teal:#2EE6C5; --teal2:#2EC4B6; --orange:#FF8A2B; --violet:#9B7BF5; --blue:#5B8DEF;
  --pos:#41E39B; --neg:#FF7285; --amber:#FFC53D;
  --lim:#F2C14E; --rare:#E2574C; --sr:#4A90D9; --uni:#C9CBD8;
  --glass:linear-gradient(158deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.022) 42%,rgba(255,255,255,.012) 100%);
  --r:20px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:#070C18;color:var(--fg);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Poppins,Inter,sans-serif}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
img{display:block}

/* chrome de démo */
.demobar{position:sticky;top:0;z-index:99;display:flex;gap:8px;align-items:center;padding:10px 18px;background:#070C18;border-bottom:1px solid var(--line);font-size:13px;flex-wrap:wrap}
.demobar b{font-family:Poppins;font-weight:600;margin-right:8px}
.demobar a{padding:5px 12px;border:1px solid var(--line2);border-radius:99px;color:var(--mut)}
.demobar a.on{background:var(--teal);border-color:var(--teal);color:#04221C;font-weight:600}
.sectitle{max-width:1440px;margin:34px auto 12px;padding:0 24px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
.sectitle small{display:block;text-transform:none;letter-spacing:0;font-size:12.5px;color:#5C6A90;font-weight:400;margin-top:5px}
.stage{max-width:1440px;margin:0 auto 40px;padding:0 24px}
.frame{border:1px solid var(--line2);border-radius:18px;overflow:hidden}
.note{max-width:1440px;margin:0 auto 60px;padding:0 24px;color:var(--mut);font-size:13.5px;line-height:1.65}
.note b{color:var(--fg)}
.note code{background:rgba(160,185,255,.1);padding:1px 5px;border-radius:4px;font-size:12px}

/* fond aurora */
.app{position:relative;min-height:760px;background:var(--bg);overflow:hidden}
.app::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
   radial-gradient(720px 420px at 12% -8%, rgba(46,230,197,.20), transparent 62%),
   radial-gradient(620px 380px at 88% 4%, rgba(155,123,245,.20), transparent 60%),
   radial-gradient(760px 460px at 62% 106%, rgba(255,138,43,.15), transparent 62%);}
.app::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(160,185,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(160,185,255,.045) 1px,transparent 1px);
  background-size:52px 52px;mask-image:radial-gradient(900px 600px at 50% 0%,#000,transparent 78%)}
.z{position:relative;z-index:2}

/* header + nav */
.top{display:flex;align-items:center;gap:16px;padding:14px 28px}
.top img.logo{height:36px;width:auto}
.search{flex:1;max-width:400px;display:flex;align-items:center;gap:9px;height:40px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.045);backdrop-filter:blur(14px);color:var(--dim);font-size:13.5px}
.search svg{width:16px;height:16px}
.ico{width:40px;height:40px;display:grid;place-items:center;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.04);backdrop-filter:blur(14px);color:var(--mut);position:relative;flex:none}
.ico svg{width:18px;height:18px;stroke-width:1.9}
.dot{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:99px;background:var(--orange);box-shadow:0 0 10px var(--orange)}
.ava{width:40px;height:40px;border-radius:99px;background:linear-gradient(135deg,var(--teal),var(--violet));display:grid;place-items:center;font-size:13px;font-weight:700;color:#04140F;flex:none;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 8px 24px -8px rgba(46,230,197,.7)}
.navbar{display:flex;justify-content:center;padding:2px 24px 20px}
.navwrap{display:flex;gap:4px;padding:5px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.045);backdrop-filter:blur(18px);box-shadow:0 10px 34px -18px #000}
.nav{display:flex;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;font-size:13.5px;font-weight:500;color:var(--mut);transition:.18s}
.nav svg{width:16px;height:16px;stroke-width:1.9}
.nav:hover{color:var(--fg);background:rgba(255,255,255,.05)}
.nav.on{color:#05201B;font-weight:600;background:linear-gradient(135deg,var(--teal),var(--teal2));box-shadow:0 6px 22px -8px rgba(46,230,197,.85)}

/* primitives */
.glass{border-radius:var(--r);border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(20px);
  box-shadow:0 18px 44px -26px #000, inset 0 1px 0 rgba(255,255,255,.10);position:relative}
.glass.edge::after{content:"";position:absolute;inset:0;border-radius:var(--r);pointer-events:none;
  background:linear-gradient(140deg,rgba(255,255,255,.16),transparent 34%);
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px}
.lab{font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--mut);font-weight:600}
.big{font-weight:700;line-height:1.02;background:linear-gradient(100deg,#FFFFFF 8%,#C9F5EC 46%,#9BE7DA 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-family:Poppins}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 11px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--mut)}
.chip svg{width:13px;height:13px;stroke-width:2.4}
.chip.teal{color:var(--teal);border-color:rgba(46,230,197,.36);background:rgba(46,230,197,.10)}
.chip.amber{color:var(--amber);border-color:rgba(255,197,61,.36);background:rgba(255,197,61,.10)}
.chip.rose{color:var(--neg);border-color:rgba(255,114,133,.36);background:rgba(255,114,133,.10)}
.chip.pos{color:var(--pos);border-color:rgba(65,227,155,.36);background:rgba(65,227,155,.10);box-shadow:0 0 22px -10px rgba(65,227,155,.9)}
.chip.violet{color:#BBA6FF;border-color:rgba(155,123,245,.36);background:rgba(155,123,245,.12)}
.blip{width:7px;height:7px;border-radius:99px;background:#FF4D5E;box-shadow:0 0 10px #FF4D5E;animation:pulse 1.5s infinite;flex:none}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 20px;border-radius:14px;font-weight:600;font-size:13.5px;color:#fff;
  background:linear-gradient(135deg,#FF9F45,#F5721F);box-shadow:0 12px 32px -12px rgba(255,138,43,.85);border:none;cursor:pointer}
.btn svg{width:16px;height:16px;stroke-width:2.3}
.btn.ghost{background:rgba(255,255,255,.05);border:1px solid var(--line2);color:var(--fg);box-shadow:none}
.btn.teal{background:linear-gradient(135deg,var(--teal),var(--teal2));color:#05201B;box-shadow:0 12px 32px -12px rgba(46,230,197,.9)}
.chead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px 14px}
.chead h3{font-size:15px;font-weight:600}
.chead a{font-size:12.5px;color:var(--teal);font-weight:600}
.cbody{padding:0 22px 22px}
.seg{display:inline-flex;gap:3px;padding:4px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.045);backdrop-filter:blur(14px)}
.seg button{background:none;border:none;color:var(--mut);font:inherit;font-size:13px;font-weight:600;padding:8px 16px;border-radius:99px;cursor:pointer;display:flex;align-items:center;gap:7px}
.seg button.on{background:linear-gradient(135deg,var(--teal),var(--teal2));color:#05201B;box-shadow:0 6px 20px -8px rgba(46,230,197,.8)}
.seg .cnt{font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:99px;background:rgba(255,255,255,.14)}
.seg button.on .cnt{background:rgba(0,0,0,.18)}

/* ScoreBox (couleurs officielles SO5) */
.sb{display:inline-grid;place-items:center;min-width:34px;height:24px;padding:0 7px;border-radius:7px;font-weight:700;font-size:13px;font-variant-numeric:tabular-nums;font-family:Poppins}
.sb.legend{background:#FFFFFF;color:#000} .sb.excep{background:#00F3EB;color:#000}
.sb.excel{background:#25ED36;color:#000}  .sb.tbon{background:#B6FF1A;color:#000}
.sb.bon{background:#F0CE1D;color:#000}    .sb.moy{background:#FF7E34;color:#fff}
.sb.faible{background:#FF5A5A;color:#fff} .sb.nul{background:rgba(160,185,255,.12);color:var(--dim);font-weight:600}

/* StarterOddsBadge */
.so{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;padding:2px 6px;border-radius:6px}
.so svg{width:10px;height:10px}
.so.hi{background:#25ED36;color:#04220A} .so.mid{background:#F0CE1D;color:#221B00} .so.lo{background:#FF5A5A;color:#fff}

/* mobile */
.mstage{display:flex;gap:26px;flex-wrap:wrap;justify-content:center}
.pwrap{position:relative}
.phone{width:390px;border:1px solid var(--line2);border-radius:36px;overflow:hidden;position:relative;background:var(--bg);box-shadow:0 26px 70px -24px #000}
.phone .bgfx{position:absolute;inset:0;background:
   radial-gradient(420px 260px at 10% 0%, rgba(46,230,197,.20), transparent 60%),
   radial-gradient(420px 260px at 92% 8%, rgba(155,123,245,.18), transparent 58%),
   radial-gradient(420px 300px at 50% 104%, rgba(255,138,43,.14), transparent 60%)}
.mhead{display:flex;align-items:center;gap:10px;padding:15px 16px 12px;position:relative;z-index:2}
.mhead img{height:28px;width:auto}
.mbody{padding:2px 14px 96px;display:flex;flex-direction:column;gap:13px;height:660px;overflow:auto;position:relative;z-index:2}
.mbody::-webkit-scrollbar{width:0}
.tabs{position:absolute;bottom:10px;left:12px;right:12px;z-index:5;display:grid;grid-template-columns:repeat(5,1fr);
  border-radius:24px;border:1px solid var(--line);background:rgba(14,21,40,.72);backdrop-filter:blur(22px);padding:10px 4px 12px;box-shadow:0 18px 44px -18px #000}
.tab{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10px;color:var(--dim);font-weight:500}
.tab svg{width:20px;height:20px;stroke-width:1.9}
.tab.on{color:var(--teal)}
.tab.on svg{filter:drop-shadow(0 0 9px rgba(46,230,197,.9))}