:root{--navy:#0c1c39;--accent:#0ea5e9;--bg:#0b1220;--ink:#e7eef7}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink)}
.v-center{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.8rem;padding:1.5rem;text-align:center}
.v-center h1{margin:0;font-size:1.5rem}
#code{font-size:2rem;letter-spacing:.5rem;text-align:center;width:9rem;padding:.6rem;border-radius:12px;border:1px solid #33415a;background:#0f1a2e;color:var(--ink)}
label[for=code]{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:#8aa0bd}
button{font:inherit;border:0;border-radius:12px;padding:.8rem 1.2rem;background:var(--accent);color:#04121f;font-weight:800;cursor:pointer}
.v-err{color:#fca5a5;font-size:.9rem}
#call{position:fixed;inset:0;background:#000}
#remote{width:100%;height:100%;object-fit:cover}
.v-pip{position:absolute;top:12px;right:12px;width:28vw;max-width:140px;border-radius:12px;border:2px solid #ffffff55;object-fit:cover}
.v-controls{position:fixed;left:0;right:0;bottom:calc(16px + env(safe-area-inset-bottom));display:flex;gap:1rem;justify-content:center}
.v-controls button{width:56px;height:56px;border-radius:50%;background:#ffffff22;color:#fff;font-size:1.3rem;padding:0;backdrop-filter:blur(6px)}
.v-controls .on{background:var(--accent);color:#04121f}
.v-controls .off{background:#ef444488}
.v-controls .v-hang{background:#ef4444}

/* ── Console technicien ───────────────────────────────────────────────── */
.visio-console select,.visio-console #client{font:inherit;padding:.7rem;border-radius:12px;border:1px solid #33415a;background:#0f1a2e;color:var(--ink);min-width:min(90vw,340px)}
.v-ac{position:relative;min-width:min(90vw,340px)}
.v-aclist{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#0f1a2e;border:1px solid #33415a;border-radius:12px;overflow:hidden;z-index:5;text-align:left}
.v-aclist button{display:block;width:100%;text-align:left;background:transparent;color:var(--ink);border-radius:0;padding:.6rem .8rem;font-weight:500}
.v-aclist button:hover{background:#1e2b45}
.v-chip{font-size:.85rem;color:#8aa0bd}
.v-code{font-size:2.4rem;font-weight:900;letter-spacing:.4rem;color:var(--accent)}
.v-shot{background:#fff;color:#000;font-size:1.6rem}
.v-shots{position:fixed;left:8px;bottom:calc(84px + env(safe-area-inset-bottom));display:flex;gap:6px}
.v-shots img{width:54px;height:54px;object-fit:cover;border-radius:8px;border:2px solid #fff}
#catmodal{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10}
.v-modal{background:#0f1a2e;padding:1.2rem;border-radius:16px;display:flex;flex-direction:column;gap:.5rem;min-width:240px}
.v-modal button{background:#1e2b45;color:var(--ink)}
.v-modal .v-cancel{background:transparent;color:#8aa0bd}
.v-note{position:fixed;top:16px;left:50%;transform:translateX(-50%);background:#0f1a2e;padding:.6rem 1rem;border-radius:10px;z-index:20}
