/* Easynetic RMM — feuille de style sobre (aucun style inline : CSP stricte). */
:root { --fg:#1d2430; --muted:#6b7280; --bg:#f6f7f9; --card:#fff; --line:#e3e6ea; --accent:#1f5fbf;
  --ok:#147a3d; --okbg:#e3f5ea; --bad:#b42318; --badbg:#fdecea; --warn:#8a5a00; --warnbg:#fff4d6; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--fg); background:var(--bg); }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
header.top { display:flex; align-items:center; gap:1.5rem; padding:.6rem 1.2rem; background:#14213d; color:#fff; }
header.top a { color:#fff; } .brand { font-weight:700; }
header nav { display:flex; gap:1rem; flex:1; }
.logout { display:flex; gap:.6rem; align-items:center; margin:0; } .who { opacity:.85; }
main { max-width:1200px; margin:0 auto; padding:1rem 1.2rem 3rem; }
h1 { font-size:1.45rem; margin:.4rem 0 1rem; } h2 { font-size:1.1rem; margin:0 0 .6rem; }
.crumbs { color:var(--muted); margin:0; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1rem; margin:1rem 0; }
.card.narrow { max-width:420px; margin:3rem auto; } .card.highlight { border-color:var(--accent); }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); gap:1rem; }
.grid .card { margin:0; }
table.list { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:8px; }
table.list th, table.list td { text-align:left; padding:.45rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
table.list th { font-weight:600; color:var(--muted); font-size:.85rem; }
tr.muted td { color:var(--muted); }
dl { display:grid; grid-template-columns:max-content 1fr; gap:.25rem 1rem; margin:0; }
dt { color:var(--muted); } dd { margin:0; }
label { display:block; margin:.4rem 0; font-weight:500; }
input, select, textarea { font:inherit; padding:.4rem .5rem; border:1px solid #c9ced6; border-radius:6px; background:#fff; }
label input, label select, label textarea { display:block; width:100%; margin-top:.2rem; }
.row { display:flex; flex-wrap:wrap; gap:.8rem; align-items:flex-end; }
.row label { flex:0 1 auto; } .row label input, .row label select { width:auto; }
textarea { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; }
button { font:inherit; padding:.45rem .9rem; border-radius:6px; border:1px solid var(--accent); background:var(--accent); color:#fff; cursor:pointer; }
button.secondary { background:#fff; color:var(--accent); }
button.danger { background:#fff; color:var(--bad); border-color:var(--bad); }
button.link { background:none; border:none; padding:0; color:inherit; text-decoration:underline; }
button.link.danger { color:var(--bad); }
button:disabled { opacity:.5; cursor:not-allowed; }
form.inline { display:inline; } .actions { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.8rem; align-items:center; }
.badge { display:inline-block; padding:.05rem .45rem; border-radius:999px; font-size:.8rem; background:#eef1f5; color:var(--fg); }
.badge.ok { background:var(--okbg); color:var(--ok); } .badge.bad { background:var(--badbg); color:var(--bad); }
.badge.warn { background:var(--warnbg); color:var(--warn); } .badge.pending { background:#e8effb; color:var(--accent); }
.badge.muted { color:var(--muted); }
.flash { background:var(--okbg); color:var(--ok); padding:.6rem .8rem; border-radius:6px; }
.error { background:var(--badbg); color:var(--bad); padding:.6rem .8rem; border-radius:6px; }
.small { font-size:.82rem; color:var(--muted); }
pre.out { background:#0f172a; color:#e2e8f0; padding:.8rem; border-radius:6px; overflow:auto; max-height:480px; white-space:pre-wrap; word-break:break-word; font-size:12.5px; }
pre.out.err { color:#fecaca; } pre.copy { cursor:pointer; }
code.secret { font-size:1rem; letter-spacing:.08em; }
.qr img { image-rendering:pixelated; border:8px solid #fff; }
details summary { cursor:pointer; margin:.3rem 0; }
.viewer { display:flex; flex-direction:column; gap:.4rem; }
.vbar { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:8px; padding:.5rem; }
.vbar label { margin:0; display:flex; gap:.3rem; align-items:center; } .vbar label select { width:auto; display:inline-block; margin:0; }
.vclip textarea { width:100%; }
.vscreen { background:#000; border-radius:6px; overflow:auto; text-align:center; }
.vscreen canvas { max-width:100%; height:auto; cursor:none; outline:none; }
.vscreen canvas:focus { box-shadow:0 0 0 2px var(--accent); }
.vstack { position:relative; display:inline-block; max-width:100%; }
.vstack #v-canvas { display:block; }
.vstack #v-cursor { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; }