/* Panneaux latéraux génériques (Pairs sans serveur, Carrière, Distributeur) — même langage visuel que #soc-panel */
.xpanel{position:absolute;right:8px;top:96px;bottom:8px;width:400px;background:#141225f2;backdrop-filter:blur(8px);border:1px solid #ffffff22;border-radius:14px;z-index:7;display:flex;flex-direction:column;color:#fff;font:14px system-ui,sans-serif;box-shadow:0 10px 40px #000a;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(18px);transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear .26s}
.xpanel.on{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.xpanel>header{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid #ffffff1a;font-weight:700}
.xpanel>header .x{margin-left:auto;background:#ffffff1a}
.xpanel .xb{flex:1;overflow:auto;padding:10px 12px}
.xpanel section{margin:0 0 12px;padding:10px;border:1px solid #ffffff14;border-radius:10px;background:#ffffff08}
.xpanel h4{margin:0 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#ffd27a}
.xpanel .row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:6px 0}
.xpanel input,.xpanel textarea,.xpanel select{box-sizing:border-box;border:0;border-radius:8px;padding:8px;background:#ffffff1a;color:#fff;font:13px system-ui,sans-serif}
.xpanel input[type=file]{background:none;padding:0}
.xpanel textarea{width:100%;min-height:62px;resize:vertical;font:11px ui-monospace,monospace;word-break:break-all}
.xpanel .note{font-size:12px;color:#cfc8e8;line-height:1.4;margin:4px 0}
.xpanel .warn{background:#ffb74a1a;border-left:3px solid #ffb74a;padding:6px 8px;border-radius:6px}
.xpanel .ok{color:#7dffa8}.xpanel .ko{color:#ff7d7d}.xpanel .mut{color:#aaa;font-size:12px}
.xpanel canvas.qr{display:block;margin:6px auto;background:#fff;border-radius:8px;image-rendering:pixelated;max-width:100%}
.xpanel .chat{max-height:170px;overflow:auto;display:flex;flex-direction:column;gap:4px;margin-bottom:6px}
.xpanel .chat .m{align-self:flex-start;background:#ffffff14;border-radius:10px;padding:5px 9px;max-width:85%;overflow-wrap:anywhere}
.xpanel .chat .m.me{align-self:flex-end;background:#6a4cff66}
.xpanel progress{width:100%;height:10px}
.xpanel video{width:48%;border-radius:8px;background:#000;aspect-ratio:4/3}
.xpanel table{width:100%;border-collapse:collapse;font-size:12px}.xpanel td,.xpanel th{padding:4px;border-bottom:1px solid #ffffff12;text-align:left}
.xpanel .kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.xpanel .kpi div{background:#ffffff0d;border-radius:8px;padding:6px;text-align:center}.xpanel .kpi b{display:block;font-size:16px}
.xpanel .bar{height:8px;border-radius:4px;background:linear-gradient(90deg,#6a4cff,#ffb74a)}
.xpanel .steps{display:flex;gap:4px;flex-wrap:wrap}.xpanel .steps span{padding:3px 8px;border-radius:10px;background:#ffffff12;font-size:12px}.xpanel .steps span.on{background:#ffb74a;color:#221}.xpanel .steps span.done{background:#2e7d4f}
.xpanel.wide{width:560px}
.dist{background:linear-gradient(180deg,#101c2c,#0c1220)!important}
.dist .brand{font-weight:800;letter-spacing:.06em}
.xpanel svg{display:block;width:100%;height:auto}
@media (max-width:760px),(pointer:coarse){.xpanel,.xpanel.wide{left:0;right:0;top:auto;bottom:0;width:auto;height:72vh;border-radius:16px 16px 0 0;transform:translateY(24px)}.xpanel.on{transform:none}}
@media (prefers-reduced-motion:reduce){.xpanel{transition:none!important;transform:none!important}}
/* Carrière : sélecteurs de choix contraints à la colonne, coûts sur une ligne */
#car-panel select{max-width:100%;text-overflow:ellipsis}
#car-panel td select{width:100%;min-width:0}
#car-panel td:nth-child(2){white-space:nowrap}
#car-panel table{table-layout:auto}
#car-panel .car-tab{padding:6px 10px}
#car-panel label{display:inline-flex;align-items:center;gap:4px;margin-right:6px}
/* Onglets en ligne désactivés (ONLINE_ENABLED=false) : carte verre dépoli « Bientôt disponible » */
.soon-tab{position:relative}
.soon-tab::after{content:'bientôt';position:absolute;right:-4px;top:-7px;font:700 9px system-ui;letter-spacing:.04em;background:#ffd27a;color:#2a1838;border-radius:8px;padding:1px 5px}
.soon-bg{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#07061266;opacity:0;transition:opacity .22s ease}
.soon-bg.on{opacity:1}
.soon-bg[hidden]{display:none}
.soon-card{width:min(360px,86vw);padding:26px 24px 20px;text-align:center;color:#fff;font:14px system-ui,sans-serif;border-radius:20px;
 background:linear-gradient(160deg,#ffffff2e,#ffffff0d 55%,#ff8c3f14);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
 border:1px solid #ffffff40;box-shadow:0 0 0 1px #ffd27a22 inset,0 18px 60px #000b,0 0 40px #ffd27a26;transform:translateY(10px) scale(.97);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.soon-bg.on .soon-card{transform:none}
.soon-i{font-size:30px;color:#ffd27a;text-shadow:0 0 18px #ffd27aaa;margin-bottom:6px}
.soon-t{margin:0 0 6px;font:800 22px system-ui;letter-spacing:.02em;color:#ffe9b8;text-shadow:0 0 16px #ffb34766}
.soon-s{margin:0 0 10px;color:#ffd9a8;font-weight:600}
.soon-n{margin:0 0 16px;color:#d8d2ea;line-height:1.45;font-size:13px}
.soon-ok{background:linear-gradient(180deg,#ffd27a,#ff9f45);color:#2a1838;border:0;border-radius:12px;padding:9px 22px;font:700 14px system-ui;cursor:pointer;box-shadow:0 0 18px #ffb34766}
.soon-ok:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.soon-bg,.soon-card{transition:none}}