/* Styles propres aux écrans Terrain de la démo — même vocabulaire que l'application
   (onglets, tuiles, cartes, badges, frise). Tout en variables de brand.css. */
.onglets{display:flex;gap:8px;margin-bottom:14px}
.onglets a{padding:6px 12px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--txt);font-size:13px;text-decoration:none}
.onglets a.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-weight:600}
h1.t{font-family:var(--font-display);font-weight:600;font-size:22px;color:var(--strong);margin:0 0 4px}
p.sub{color:var(--mut);font-size:13.5px;margin:0 0 16px;max-width:900px}
.tuiles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}
.tuiles.six{grid-template-columns:repeat(6,1fr)}
.tuiles.quatre{grid-template-columns:repeat(4,1fr)}
.tuile{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.tuile .l{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);display:flex;justify-content:space-between;gap:6px}
.tuile .v{font-family:var(--font-display);font-weight:600;font-size:26px;color:var(--strong);line-height:1.15;margin-top:2px}
.tuile .d{font-size:12px;color:var(--mut);margin-top:3px}
.src{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;color:var(--mut);border:1px solid var(--line);border-radius:4px;padding:0 6px;white-space:nowrap;font-weight:400;text-transform:none;letter-spacing:0}
.src::before{content:"↻"}
.src.ia{color:var(--ia);border-color:var(--ia);background:var(--ia-bg)}
.src.ia::before{content:"✦"}
.bloc{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);margin-bottom:14px}
.bloc .hd{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.bloc .hd h2{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:0;font-weight:600}
.bloc .hd .hint{font-size:12px;color:var(--mut)}
.bloc .bd{padding:12px 14px}
.deux{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);gap:14px}
.deux.eg{grid-template-columns:1fr 1fr}
.badge{display:inline-block;font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:var(--panel2);color:var(--txt);white-space:nowrap}
.badge.ok{color:var(--ok);border-color:rgba(14,127,82,.35);background:var(--accent2-soft)}
.badge.warn{color:var(--warn);border-color:rgba(154,98,0,.35);background:rgba(154,98,0,.1)}
.badge.bad{color:var(--danger);border-color:rgba(193,54,44,.35);background:var(--danger-soft)}
.badge.eu{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft)}
.badge.seg{color:#fff;border:0}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:-1px}
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);font-weight:500}
table.t td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t td.r,table.t th.r{text-align:right}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.bars{display:flex;flex-direction:column;gap:6px}
.bar{display:grid;grid-template-columns:150px 1fr 64px;gap:8px;align-items:center;font-size:12px}
.bar .tr{height:10px;background:var(--panel2);border-radius:4px;overflow:hidden}
.bar .f{height:100%;border-radius:0 4px 4px 0;background:var(--accent)}
.bar .n{text-align:right;color:var(--mut)}
.btn{display:inline-block;border:1px solid var(--line);background:var(--panel2);border-radius:10px;padding:7px 14px;font-size:13px;color:var(--strong)}
.btn.pri{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.btn.ia{border-color:var(--ia);color:var(--ia);background:var(--ia-bg)}
.btn.rec{background:var(--danger);color:#fff;border-color:var(--danger)}
.note{font-size:12px;color:var(--mut);border-left:3px solid var(--line);padding:6px 10px;margin-top:10px}
/* Semaine */
.semaine{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.jour{background:var(--panel2);border-radius:12px;padding:10px;min-height:250px}
.jour h5{margin:0 0 8px;font-size:12.5px;color:var(--strong)}
.jour h5 small{color:var(--mut);font-weight:400;margin-left:4px}
.ev{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px;padding:7px 9px;font-size:12px;margin-bottom:8px}
.ev .h{font-family:var(--font-mono);font-size:11px;color:var(--mut)}
.ev b{display:block;color:var(--strong);font-weight:600;margin:2px 0}
.ev .o{color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev.fait{border-left-color:var(--ok)}.ev.dicter{border-left-color:var(--warn)}
/* Actions */
.actions li{list-style:none;display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);font-size:13px}
.actions li:last-child{border-bottom:0}
.actions .h{font-family:var(--font-mono);font-size:12px;color:var(--mut);width:56px}
.actions .h.late{color:var(--danger);font-weight:600}
.actions .q{flex:1;color:var(--strong)}
.actions .w{color:var(--mut);font-size:12px}
/* Dictée */
.mic{display:flex;align-items:center;gap:14px;padding:16px;border:1px dashed var(--line);border-radius:12px;background:var(--panel2)}
.mic .b{width:48px;height:48px;border-radius:50%;background:var(--danger);color:#fff;display:grid;place-items:center;font-size:18px;flex:none}
.mic .b.on{box-shadow:0 0 0 12px rgba(193,54,44,.18)}
.champ{margin-bottom:10px}
.champ label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin-bottom:4px}
.champ .val{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:13px;min-height:36px;white-space:pre-wrap}
.iabox{border:1px solid var(--ia);background:var(--ia-bg);border-radius:12px;padding:12px 14px}
.iabox .iah{font-size:12px;color:var(--ia);margin-bottom:8px}
.iabox .iah b{color:var(--strong)}
.iabox p{margin:6px 0;font-size:13.5px;line-height:1.5}
.raw{font-family:var(--font-mono);font-size:12px;background:var(--panel);border:1px dashed var(--line);border-radius:8px;padding:8px 10px}
.suite{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:6px;background:var(--panel);font-size:13px}
.suite b{color:var(--strong)}.suite small{display:block;color:var(--mut);font-size:12px}
.suite .btn{margin-left:auto;padding:4px 12px;font-size:12px}
/* Carte */
.carte{position:relative;background:#e9eef4;border-radius:0 0 var(--r) var(--r);overflow:hidden}
.carte svg{display:block;width:100%;height:auto;max-height:600px}
#carte svg{height:540px}
.land{fill:#dfe6ee;stroke:#b9c3d1;stroke-width:1.2}
.bub{stroke:#fff;stroke-width:2;opacity:.9}
.lbl{font-family:var(--font-mono);font-size:11px;fill:var(--mut)}
.legende{display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:12px;color:var(--mut);padding:8px 14px 12px;border-top:1px solid var(--line)}
.route{fill:none;stroke:var(--accent);stroke-width:4;stroke-linejoin:round;stroke-linecap:round}
.stop{fill:var(--strong);stroke:#fff;stroke-width:2}
.stopn{font-family:var(--font-mono);font-size:11px;font-weight:700;fill:#fff;text-anchor:middle}
/* Frise tournée */
.frise .it{display:grid;grid-template-columns:62px 22px 1fr auto;gap:10px;padding:7px 0;align-items:start;font-size:13px}
.frise .it .h{font-family:var(--font-mono);font-size:12px;color:var(--mut);padding-top:2px}
.frise .it .m i{display:block;width:20px;height:20px;border-radius:50%;background:var(--panel2);border:2px solid var(--line)}
.frise .it.v .m i{background:var(--strong);border-color:var(--strong);color:#fff;font:700 10px var(--font-mono);display:grid;place-items:center}
.frise .it.d .m i{width:12px;height:12px;margin:5px 0 0 4px;background:var(--panel);border-color:var(--mut)}
.frise .it.p .m i{background:var(--warn);border-color:var(--warn)}
.frise .it .w{font-weight:600;color:var(--strong)}
.frise .it.d .w{font-weight:400;color:var(--mut);font-size:12px}
.frise .it .y{font-size:12px;color:var(--mut)}
/* Impact */
.vs{display:grid;grid-template-columns:150px 1fr 64px;gap:8px;align-items:center;font-size:12.5px;margin:7px 0}
.vs .b{height:9px;border-radius:3px}
.vs .b.a{background:var(--mut2);opacity:.55;margin-bottom:3px}
.vs .b.p{background:var(--accent)}
.vs .t{text-align:right;color:var(--ok);font-weight:600}