/* Layout : tableau de marque de stade — colonne matchs à gauche, fiche match au centre, flux agent en lecture seule à droite */
:root{
  --bg:#EEF1EC; --surface:#FFFFFF; --surface-2:#F5F7F3; --line:#D8DED5;
  --fg:#16211B; --muted:#5D6B62;
  --pitch:#0E6B47; --pitch-soft:#DCEFE5;
  --value:#C98A06; --value-soft:#FBF0D6;
  --bad:#B4372E; --tg:#2AABEE;
  --f-display:"Barlow Condensed","Arial Narrow",sans-serif;
  --f-body:"IBM Plex Sans",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0D1411; --surface:#141E19; --surface-2:#1A2620; --line:#26352D;
  --fg:#E6EDE8; --muted:#94A39A; --pitch:#3FBF86; --pitch-soft:#173327;
  --value:#E9B23A; --value-soft:#3A2D0E; --bad:#E06A60; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0D1411; --surface:#141E19; --surface-2:#1A2620; --line:#26352D;
  --fg:#E6EDE8; --muted:#94A39A; --pitch:#3FBF86; --pitch-soft:#173327;
  --value:#E9B23A; --value-soft:#3A2D0E; --bad:#E06A60; color-scheme:dark}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:14px;line-height:1.5}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--pitch);outline-offset:2px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
h1,h2,h3{font-family:var(--f-display);text-wrap:balance;margin:0;letter-spacing:.01em}

/* ---------- Connexion ---------- */
#login{min-height:100vh;display:grid;place-items:center;padding-inline:16px;padding-block:40px}
.login-card{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:32px 28px;display:grid;gap:22px}
.brand{display:flex;align-items:center;gap:10px}
.brand-mark{width:36px;height:36px;border-radius:8px;background:var(--pitch);display:grid;place-items:center}
.brand-name{font-family:var(--f-display);font-size:24px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.brand-name span{color:var(--pitch)}
.login-card h1{font-size:34px;line-height:1.05;text-transform:uppercase}
.login-card p{margin:0;color:var(--muted)}
.tg-btn{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--tg);color:#fff;border:0;border-radius:999px;padding:13px 18px;font-weight:600;font-size:15px}
.tg-btn:hover{filter:brightness(1.06)}
.login-points{display:grid;gap:8px;margin:0;padding:0;list-style:none;font-size:13px;color:var(--muted)}
.login-points li{display:flex;gap:8px}
.login-points li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--pitch);margin-top:7px;flex:none}
.fineprint{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}

/* ---------- App ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line);padding-inline:16px}
.topbar-in{max-width:1440px;margin:0 auto;display:flex;align-items:center;gap:16px;min-height:58px;flex-wrap:wrap;padding-block:8px}
.leagues{display:flex;gap:4px;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none}
.lg{border:1px solid transparent;background:none;border-radius:8px;padding:6px 12px;font-family:var(--f-display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);white-space:nowrap}
.lg[aria-pressed="true"]{background:var(--pitch-soft);color:var(--pitch);border-color:var(--pitch)}
.user{display:flex;align-items:center;gap:8px;font-size:13px}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--tg);color:#fff;display:grid;place-items:center;font-weight:600;font-size:12px}
.linkbtn{background:none;border:0;color:var(--muted);text-decoration:underline;font-size:12px;padding:0}

.layout{max-width:1440px;margin:0 auto;padding-inline:16px;padding-block:20px;display:grid;grid-template-columns:300px minmax(0,1fr) 360px;gap:20px;align-items:start}
.col-title{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.col-title h2{font-size:20px;text-transform:uppercase}

/* matchs */
.matches{display:grid;gap:6px}
.m{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.m[aria-current="true"]{border-color:var(--pitch);box-shadow:inset 3px 0 0 var(--pitch)}
.m-time{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.m-teams{min-width:0;font-weight:600;line-height:1.3}
.m-teams span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 7px;border-radius:999px;white-space:nowrap}
.chip.value{background:var(--value-soft);color:var(--value)}
.chip.wait{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.chip.ok{background:var(--pitch-soft);color:var(--pitch)}
.chip.no{background:transparent;color:var(--muted);border:1px dashed var(--line)}

/* fiche match */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px}
.match-head{padding:22px 22px 18px;border-bottom:1px solid var(--line);display:grid;gap:14px}
.scoreline{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
.team{display:grid;gap:4px}
.team.away{text-align:right}
.team-name{font-family:var(--f-display);font-size:30px;font-weight:800;text-transform:uppercase;line-height:1}
.team-meta{font-size:12px;color:var(--muted)}
.xg{text-align:center;display:grid;gap:2px}
.xg-val{font-family:var(--f-mono);font-size:22px;font-weight:700}
.meta-row{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;color:var(--muted)}
.meta-row b{color:var(--fg);font-weight:600}

.section{padding:18px 22px;border-bottom:1px solid var(--line);display:grid;gap:12px}
.section:last-child{border-bottom:0}
.section h3{font-size:17px;text-transform:uppercase}

.mkt{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600;text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.bar{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden;width:90px;display:inline-block;vertical-align:middle;margin-right:8px}
.bar i{display:block;height:100%;background:var(--pitch)}
.edge-pos{color:var(--value);font-weight:700}
.edge-neg{color:var(--muted)}

.adj{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.adj li{display:grid;grid-template-columns:62px minmax(0,1fr);gap:10px;font-size:13px;align-items:baseline}
.adj .d{font-family:var(--f-mono);font-weight:700;text-align:right}
.adj .d.up{color:var(--pitch)} .adj .d.down{color:var(--bad)}
.adj small{color:var(--muted)}

.lineups{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lu{background:var(--surface-2);border-radius:8px;padding:12px;font-size:13px;display:grid;gap:4px}
.lu .absent{color:var(--bad)}

/* agent */
.agent{position:sticky;top:calc(env(safe-area-inset-top,0px) + 78px);display:grid;gap:12px}
.agent-head{padding:16px 18px;border-bottom:1px solid var(--line);display:grid;gap:8px}
.agent-id{display:flex;align-items:center;gap:10px}
.pulse{width:9px;height:9px;border-radius:50%;background:var(--pitch);box-shadow:0 0 0 0 var(--pitch);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--pitch) 60%,transparent)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.pulse{animation:none}}
.agent-head h2{font-size:20px;text-transform:uppercase}
.readonly{font-size:12px;color:var(--muted);display:flex;gap:6px;align-items:center}

.bank{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.bank div{background:var(--surface);padding:12px 14px;display:grid;gap:2px}
.bank .v{font-family:var(--f-mono);font-weight:700;font-size:16px}
.bank .v.up{color:var(--pitch)}

.feed{display:grid;max-height:none}
.post{padding:14px 18px;border-bottom:1px solid var(--line);display:grid;gap:8px}
.post:last-child{border-bottom:0}
.post-top{display:flex;justify-content:space-between;gap:8px;align-items:center}
.post-time{font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.pick{background:var(--surface-2);border-radius:8px;padding:10px 12px;display:grid;gap:6px}
.pick-line{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.pick-mkt{font-weight:600}
.odd{font-family:var(--f-mono);font-weight:700;font-size:16px}
.kv{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted)}
.kv b{color:var(--fg);font-family:var(--f-mono);font-weight:700}
.why{margin:0;padding-left:16px;font-size:12.5px;color:var(--muted);display:grid;gap:2px}
.fun{border:1px dashed var(--value);background:var(--value-soft)}
.fun .legs{display:grid;gap:4px;font-size:13px}
.fun .legs div{display:flex;justify-content:space-between;gap:8px}
.event{font-size:13px}
.event b{font-weight:600}
.src{font-size:11px;color:var(--muted)}

.foot-note{max-width:1440px;margin:0 auto;padding-inline:16px;padding-block:8px 32px;font-size:12px;color:var(--muted)}

@media (max-width:1180px){
  .layout{grid-template-columns:280px minmax(0,1fr)}
  .agent{grid-column:1/-1;position:static}
}
@media (max-width:760px){
  .layout{grid-template-columns:minmax(0,1fr)}
  .matches{grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);overflow-x:auto;padding-bottom:4px}
  .team-name{font-size:24px}
  .lineups{grid-template-columns:1fr}
  .user .uname{display:none}
}

/* ---------- Production ---------- */
.brand-sm{font-size:20px}
form.inline{display:inline;margin:0}
.muted{color:var(--muted)} .small{font-size:12px}
.empty{padding:20px;color:var(--muted);font-size:13px}
.panel.empty{border-style:dashed}
.login-error{color:var(--bad);font-weight:600;margin:0}
.tg-widget{display:flex;justify-content:center;min-height:44px}
.chip.pick{background:var(--pitch);color:var(--surface)}
.chip.pending{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.chip.novalue{background:transparent;color:var(--muted);border:1px dashed var(--line)}
.chip.live{background:var(--bad);color:#fff}
.m-score{font-family:var(--f-mono);font-weight:700}
.floor{display:flex;justify-content:space-between;align-items:baseline;gap:8px;border-top:1px dashed var(--line);padding-top:6px;font-size:12.5px}
.floor b{font-family:var(--f-mono);font-size:15px;color:var(--value)}
.sg-note{font-size:12px;color:var(--muted)}
.feed a{color:inherit}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tab{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:4px 10px;font-size:12px;color:var(--muted)}
.tab[aria-pressed="true"]{border-color:var(--pitch);color:var(--pitch);background:var(--pitch-soft)}

/* ---------- Onglets centraux ---------- */
.center{display:grid;gap:10px;min-width:0}
.ctabs{display:flex;gap:4px;flex-wrap:wrap}
.ctab{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 12px;font-family:var(--f-display);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.ctab[aria-selected="true"]{border-color:var(--pitch);color:var(--pitch);background:var(--pitch-soft)}

/* ---------- Actu & récap ---------- */
.recap{padding:18px 22px;border-bottom:1px solid var(--line);display:grid;gap:10px}
.recap h3{font-size:20px;line-height:1.15}
.recap-pts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.recap-pts li{display:grid;grid-template-columns:10px minmax(0,1fr);gap:10px;font-size:13.5px}
.recap-pts .dot{width:8px;height:8px;border-radius:50%;margin-top:6px;background:var(--muted)}
.recap-pts .dot.high{background:var(--bad)} .recap-pts .dot.medium{background:var(--value)}
.recap-pts b{font-weight:600}
.watch{background:var(--value-soft);border-radius:8px;padding:10px 12px;font-size:13px;display:grid;gap:4px}
.news-list{list-style:none;margin:0;padding:0}
.news-list li{padding:10px 22px;border-bottom:1px solid var(--line);display:grid;gap:2px}
.news-list li:last-child{border-bottom:0}
.news-list a{color:var(--fg);text-decoration:none;font-weight:500}
.news-list a:hover{text-decoration:underline}

/* ---------- Générateur ---------- */
.gen-form{padding:18px 22px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;align-items:end}
.field{display:grid;gap:6px;min-width:0;border:0;margin:0;padding:0}
.gen-form select,.gen-form input{font:inherit;color:var(--fg);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-width:0;width:100%}
.stepper{display:grid;grid-template-columns:36px minmax(0,1fr) 36px}
.stepper button{border:1px solid var(--line);background:var(--surface-2);font-weight:700}
.stepper button:first-child{border-radius:8px 0 0 8px} .stepper button:last-child{border-radius:0 8px 8px 0}
.stepper input{border-radius:0;text-align:center;font-family:var(--f-mono)}
.range-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px;align-items:center}
.range-row input{font-family:var(--f-mono)}
.leagues-pick{grid-column:1/-1}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips label{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12.5px;cursor:pointer}
.chips input{width:auto;accent-color:var(--pitch)}
.btn-primary{grid-column:1/-1;justify-self:start;border:0;background:var(--pitch);color:var(--surface);border-radius:8px;padding:10px 22px;font-family:var(--f-display);font-weight:800;font-size:17px;text-transform:uppercase;letter-spacing:.04em}
.btn-primary:disabled{opacity:.6}
#genResult{display:grid}
.combo{padding:16px 22px;border-bottom:1px solid var(--line);display:grid;gap:10px}
.combo:last-child{border-bottom:0}
.combo-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.combo-head h3{font-size:18px}
.combo-legs{display:grid;gap:6px}
.leg{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;background:var(--surface-2);border-radius:8px;padding:8px 12px;font-size:13px}
.leg .sub{grid-column:1/-1;color:var(--muted);font-size:11.5px}
.ev-neg{color:var(--bad)} .ev-pos{color:var(--pitch)}
.honest{font-size:12px;color:var(--muted)}

/* ---------- Statut agent ---------- */
.status{padding:12px 18px;border-bottom:1px solid var(--line);display:grid;gap:4px;font-size:12px;color:var(--muted)}
.status .row{display:flex;justify-content:space-between;gap:8px}
.status .row b{color:var(--fg);font-weight:500;font-family:var(--f-mono);font-size:11.5px}
.status .ko b{color:var(--bad)}
.weekend .combo{padding:10px 0;border-bottom:1px dashed var(--line)}
.weekend .combo:last-child{border-bottom:0}
.gen-form{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.range-row input{padding-inline:8px}
.recap a,.status a{color:inherit}

.err-note{font-size:11px;color:var(--bad);font-family:var(--f-mono);word-break:break-word;margin:-2px 0 4px}

/* ---------- Pronostic IA ---------- */
.prono{display:grid;gap:12px}
.prono-hero{background:var(--pitch-soft);border:1px solid var(--pitch);border-radius:10px;padding:14px 16px;display:grid;gap:4px}
.prono-main{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-family:var(--f-display);font-weight:800;font-size:26px;text-transform:uppercase;color:var(--pitch)}
.prono-main .mono{font-size:22px}
.verdict{margin:6px 0 0;font-size:13.5px;line-height:1.5}
.prono-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}
.prono-card{background:var(--surface-2);border-radius:8px;padding:10px 12px;display:grid;gap:3px;min-width:0}
.prono-line{display:flex;justify-content:space-between;gap:8px;align-items:baseline;font-size:14px}

/* ---------- Actu du match ---------- */
#matchNews{display:grid;gap:14px}
.mnews-block{display:grid;gap:8px}
.mnews-list li{padding:8px 0}
.mnews-block a{color:inherit}

.live-score{font-size:30px;color:var(--fg)}
