
:root{--desk:#0a0f17;--win:#121925ee;--win2:#1a2332;--row:#0d141d;--line:#2a374e;--txt:#e6edf5;--dim:#8794aa;--faint:#2f3e56;--acc:#4fb3ff;--ok:#45d49a;--lock:#ff5f73;--wait:#ffbe55;--ia:#b996ff;--star:#ffd34d;--sans:"Segoe UI",system-ui,-apple-system,sans-serif;--mono:ui-monospace,"Cascadia Mono",Consolas,monospace}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:var(--desk);color:var(--txt);font:13px/1.45 var(--sans)}
button,input{font:inherit;color:inherit}
body.alert{--desk:#1a0a10;--acc:#ff7a7a}
body.mic-on-phone .comm .ptt{display:none}   /* le micro est sur le téléphone : pas de second bouton Parler ici */
/* barre de menu (haut) */
.desk{position:fixed;inset:0 0 48px 0;overflow:hidden;background:radial-gradient(ellipse at 70% 20%,#18304f 0,var(--desk) 62%)}
.desk::before{content:"SPECTRE";position:absolute;right:4%;top:8%;font:800 8vw/1 var(--mono);letter-spacing:.06em;color:#ffffff06;pointer-events:none}
body.glitch .desk{animation:gl .45s steps(2) 3}@keyframes gl{25%{transform:translate(-5px,2px);filter:hue-rotate(140deg)}75%{filter:invert(.2)}}
/* barre des tâches façon Windows, futuriste */
.taskbar{position:fixed;left:0;right:0;bottom:0;height:48px;display:flex;align-items:center;gap:4px;padding:0 8px;background:#0a1018ee;backdrop-filter:blur(14px);border-top:1px solid #4fb3ff40;z-index:550}
.taskbar::before{content:"";position:absolute;left:0;top:-1px;width:40%;height:1px;background:linear-gradient(90deg,var(--acc),transparent);box-shadow:0 0 8px var(--acc)}
.start{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px 0 8px;background:none;border:1px solid transparent;border-radius:4px;cursor:pointer;font:800 12px var(--mono);letter-spacing:.14em;color:var(--acc)}
.start svg{width:22px;height:22px}
.start:hover,.start.open{background:#ffffff12;border-color:#4fb3ff40}
.tb-apps{display:flex;gap:2px;align-items:center;height:100%}
.tb{position:relative;width:46px;height:40px;border:0;border-radius:4px;background:none;cursor:pointer;display:grid;place-items:center}
.tb svg{width:26px;height:26px}
.tb:hover,.tb:focus-visible{background:#ffffff14;outline:none}
.tb::after{content:"";position:absolute;bottom:2px;left:50%;width:0;height:3px;border-radius:2px;background:#8fa3b8;transform:translateX(-50%);transition:width .15s}
.tb.on::after{width:8px}.tb.foc{background:#ffffff10}.tb.foc::after{width:18px;background:var(--acc);box-shadow:0 0 6px var(--acc)}
.tb em{position:absolute;right:3px;top:2px;min-width:16px;height:16px;border-radius:8px;background:var(--lock);color:#fff;font:700 10px/16px var(--sans);font-style:normal;padding:0 4px}
.tb.new{animation:tbn 1s 3}@keyframes tbn{50%{background:#4fb3ff30}}
.tb .tt{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#0b1220;border:1px solid #4fb3ff50;padding:3px 8px;font:12px var(--sans);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}
.tb:hover .tt,.tb:focus-visible .tt{opacity:1}
.tray{margin-left:auto;display:flex;align-items:center;gap:10px;font:11px var(--mono);color:var(--dim)}
.tray b{color:var(--txt)}
.tray .test{background:#3a2c12;color:var(--wait);border-radius:3px;padding:2px 6px;font-weight:600}
.tray button{background:none;border:1px solid transparent;border-radius:4px;cursor:pointer;color:var(--dim);font:11px var(--mono);padding:4px 7px}
.tray button:hover{background:#ffffff12;color:var(--txt)}
.flux{display:flex;align-items:center;gap:6px}.flux i{width:8px;height:8px;border-radius:50%;background:#55606e}
.flux.live i{background:var(--ok);box-shadow:0 0 6px var(--ok)}.flux.wait i{background:var(--wait)}
.comm{display:flex;align-items:center;gap:6px;margin-right:6px}
.lis{display:grid;place-items:center;width:30px;height:30px;border-radius:4px;color:#55606e}
.lis svg{width:20px;height:20px}.lis.on{color:var(--ok);filter:drop-shadow(0 0 4px #45d49a88)}
.ptt{display:flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border:1px solid #4fb3ff70;background:#0f1a2a;color:var(--txt);cursor:pointer;font:600 12px var(--sans);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);user-select:none;touch-action:none}
.ptt svg{width:18px;height:18px}
.ptt:hover:not(:disabled){background:#16263d}
.ptt:disabled{opacity:.45;cursor:not-allowed}
.ptt.on{background:#e81123;border-color:#ff6b78;color:#fff;box-shadow:0 0 16px #e8112388}
.ptt.on .wave i{animation:wv .5s infinite alternate}
.ptt .wave{display:inline-flex;gap:2px;align-items:center;height:14px}.ptt .wave i{width:2px;height:4px;background:currentColor}
.ptt .wave i:nth-child(2){animation-delay:.15s}.ptt .wave i:nth-child(3){animation-delay:.3s}@keyframes wv{to{height:14px}}
.comm small{display:none!important}
.comm #live-audio-status:not([hidden]){display:block!important;position:fixed;right:16px;bottom:62px;z-index:700;max-width:min(380px,calc(100vw - 32px));padding:12px 14px;border:1px solid #ffb44f99;background:#101722f5;color:#ffe0ad;font:13px/1.45 system-ui,sans-serif;box-shadow:0 8px 28px #0009}
.comm .lis{display:none}
.comm #live-audio-mic-off{display:none!important}
.clk{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2;padding:0 4px}.clk small{font-size:10px}
.startmenu{position:fixed;left:8px;bottom:56px;width:360px;background:#0b1220f5;backdrop-filter:blur(16px);border:1px solid #4fb3ff50;z-index:560;padding:14px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.startmenu[hidden]{display:none}
.startmenu .k{font:600 10px var(--mono);letter-spacing:.14em;color:var(--acc);margin-bottom:8px}
.startmenu button{display:grid;grid-template-columns:30px 1fr;gap:2px 10px;align-items:center;width:100%;background:none;border:0;border-radius:4px;padding:7px 8px;cursor:pointer;text-align:left}
.startmenu button:hover{background:#ffffff12}
.startmenu button svg{width:26px;height:26px;grid-row:span 2}
.startmenu button b{font-weight:600}.startmenu button small{color:var(--dim);font-size:11px}
.startmenu .row{display:flex;gap:6px;margin-top:10px;border-top:1px solid #ffffff14;padding-top:10px}
/* tutoriel */
.tuto{position:fixed;inset:0;z-index:2200;pointer-events:none}
.tuto[hidden]{display:none}
.tuto .hole{position:absolute;border:1px solid var(--acc);box-shadow:0 0 0 2px #4fb3ff55,0 0 24px #4fb3ff88;border-radius:4px;transition:all .3s;pointer-events:none;animation:tuto-target-pulse 1.25s ease-in-out infinite}
@keyframes tuto-target-pulse{0%,100%{box-shadow:0 0 0 2px #4fb3ff40,0 0 12px #4fb3ff55}50%{box-shadow:0 0 0 5px #4fb3ffb0,0 0 28px #4fb3ffcc}}
@media(prefers-reduced-motion:reduce){.tuto .hole{animation:none}}
.tuto .card{position:absolute;box-sizing:border-box;pointer-events:auto;max-height:calc(100% - 16px);overflow:auto;width:min(430px,calc(100% - 32px));background:#0b1220f8;border:1px solid #4fb3ff70;padding:16px 18px;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);transition:all .3s}
body.tutorial-active .win[data-id="plans"]{left:16px!important;top:64px!important;width:min(720px,calc(100vw - 32px))!important;height:min(500px,calc(100vh - 128px))!important;min-width:0!important;min-height:0!important}
/* Lorsque la caméra d'exercice s'ouvre, garder le plan, l'image et le guide lisibles ensemble. */
body.tutorial-active .win[data-id="training-camera"]{left:752px!important;top:12px!important;width:min(calc(38vw - 44px),560px)!important;height:min(260px,36vh)!important;min-width:0!important;min-height:0!important}
body.tutorial-active .training-camera{overflow:hidden!important}
body.tutorial-active .training-camera img{position:absolute;inset:0;min-width:0;min-height:0}
@media(max-width:700px){body.tutorial-active .win[data-id="plans"]{left:8px!important;top:8px!important;width:calc(100vw - 16px)!important;height:calc(100vh - 64px)!important}body.tutorial-active .win[data-id="training-camera"]{left:52vw!important;top:12px!important;width:calc(48vw - 20px)!important;height:min(240px,32vh)!important}}
body.player-waiting.spectre-pre-game-wait:not(.tutorial-active) .win[data-id="plans"]{left:50%!important;top:calc((100vh - 48px)/2)!important;transform:translate(-50%,-50%)!important;width:min(720px,calc(100vw - 32px))!important;height:min(500px,calc(100vh - 92px))!important;min-width:0!important;min-height:0!important}
body.tutorial-active #poste-wait-state,body.spectre-pre-game-wait #poste-wait-state{display:none!important}
.media-consent{position:fixed;inset:0;z-index:2300;display:grid;place-items:center;background:#02070dcc;padding:16px}.media-consent[hidden]{display:none}.media-consent-card{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#0b1220;border:1px solid #4fb3ff70;padding:22px;box-shadow:0 20px 70px #000b}.media-consent-card h2{font:600 20px var(--mono);margin:0 0 10px}.media-consent-card p{color:var(--dim);line-height:1.5}.media-consent-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}.media-consent-error{color:var(--wait)!important;min-height:1.3em}.media-checks-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.media-check{min-width:0;padding:10px;background:#ffffff08;border:1px solid #ffffff18}.media-check h3{font:600 12px var(--mono);margin:0 0 8px}.media-check button{margin:3px 3px 3px 0}.media-check video{display:block;width:100%;max-height:150px;object-fit:contain;background:#000;margin-top:8px}.media-check-status{min-height:2.5em;padding:5px 7px;color:#ffb1ad;background:#451e25;border:1px solid #d95656;font-size:12px;line-height:1.4}.media-check-status[data-result="ok"]{color:#b9f7cf;background:#123b2c;border-color:#3fbd78}.media-check-status[data-result="pending"]{color:#ffe0a3;background:#473515;border-color:#d9a536}.media-check-meter{height:5px;background:#ffffff20;margin:6px 0}.media-check-meter i{display:block;height:100%;width:0;background:var(--acc)}.media-step[hidden]{display:none}@media(max-width:620px){.media-checks-grid{grid-template-columns:1fr}}
.tuto .card .k{font:600 10px var(--mono);letter-spacing:.14em;color:var(--acc)}
.tuto .card h3{margin:6px 0 6px;font-size:18px}
.tuto .card p{margin:0 0 12px;color:#c7d3e2;line-height:1.5}
.tuto .card .nav{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tuto .card .nav .sp{flex:1}
.tuto-hold{margin:0 0 12px}.tuto-hold i{display:block;height:6px;border-radius:3px;background:var(--acc);width:0;margin-bottom:6px}.tuto-hold span{font-size:14px;color:var(--dim)}.tuto-hold b{display:inline-block;padding:0;border-radius:0;background:transparent;color:var(--txt);font-weight:800;animation:tuto-two-seconds .8s ease-in-out infinite}@keyframes tuto-two-seconds{0%,100%{opacity:1;transform:scale(1.08)}50%{opacity:.35;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.tuto-hold b{animation:none}}
.tuto .dots{display:flex;gap:4px}.tuto .dots i{width:14px;height:3px;background:#2f3e56}.tuto .dots i.on{background:var(--acc)}
/* fenêtres */
.win{position:absolute;background:var(--win);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 46px #000b;display:flex;flex-direction:column;overflow:hidden}
.win[hidden]{display:none}
.win.focus{border-color:#45608e}
.win.full{left:0!important;top:0!important;width:100%!important;height:100%!important;border-radius:0;border:0}
.win header{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--win2);cursor:move;user-select:none;font-size:12px;flex:none}
.win header .ic{display:none}
.win header b{font-weight:600}.win header small{color:var(--dim)}
.win header .ic{display:inline-flex!important;width:16px;height:16px}.win header .ic svg{width:16px;height:16px}
.win header small{margin-right:auto}
.win header .mn,.win header .mx,.win header .x{width:38px;height:28px;margin:-6px 0;border:0;background:none;color:var(--txt);cursor:pointer;font:14px var(--sans);display:grid;place-items:center}
.win header .mn:hover,.win header .mx:hover{background:#ffffff1a}
.win header .x{margin-right:-10px}.win header .x:hover{background:#e81123;color:#fff}
.win header .ic+b{margin-left:4px}
.win .body{flex:1;overflow:auto;min-height:0;padding:12px}
.win .grip{position:absolute;right:0;bottom:0;width:13px;height:13px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,#ffffff30 50%)}
.win.full .grip{display:none}
.btn{background:#1d2a40;border:1px solid #31456a;border-radius:6px;padding:6px 12px;cursor:pointer}
.btn:hover:not(:disabled){background:#26375a}.btn:disabled{opacity:.45;cursor:default}
.btn.pri{background:var(--acc);border-color:var(--acc);color:#04121f;font-weight:600}
.btn.test{background:#3a2c12;border-color:#6a5020;color:var(--wait)}
.note{color:var(--dim);font-size:12px}
/* caméras */
.cams{display:grid;grid-template-rows:1fr auto;gap:8px;height:100%;padding:0!important}
.training-camera{position:relative;background:#040807;display:grid;place-items:center;overflow:hidden}.training-camera img{width:100%;height:100%;object-fit:contain}.training-camera span{position:absolute;left:10px;bottom:8px;padding:4px 7px;background:#07100de0;color:#a9c7b7;font:10px var(--mono);letter-spacing:.08em}
.cams .main{position:relative;background:#000;min-height:0}
.cams .main canvas{width:100%;height:100%;display:block}
.cams.mosaic{grid-template-rows:minmax(0,1fr)!important}
.win.full.mosaic-window[data-id="cams"]{left:0!important;top:0!important;width:100%!important;height:100%!important;border-radius:0!important;border:0!important}
.cams .camera-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-auto-rows:minmax(0,1fr);gap:8px;padding:8px}
.cams .camera-tile{position:relative;min-width:0;min-height:0;background:#000;border:1px solid var(--line);border-radius:5px;overflow:hidden;cursor:pointer;color:var(--txt)}
.cams .camera-tile>span{position:absolute;left:8px;bottom:6px;z-index:3;padding:3px 6px;background:#000b;font:12px var(--mono)}
.cams .slot{position:absolute;inset:0}
.cams .main .camera-feed,.cams .th .camera-feed{position:absolute;inset:0}
.cams .main:fullscreen{background:#000}
.cams .tools{position:absolute;right:10px;top:10px;display:flex;gap:6px}
.cams .tools button{background:#000b;border:1px solid #ffffff40;border-radius:5px;padding:5px 10px;cursor:pointer;font:600 11px var(--mono);color:#fff}
.cams .th{display:flex;gap:6px;padding:0 8px 8px;overflow-x:auto}
.cams .th>*{position:relative;flex:none;width:126px;height:72px;padding:0;border:1px solid var(--line);border-radius:5px;background:#000;cursor:pointer;overflow:hidden;color:var(--txt);font:10px var(--mono)}
.cams .th>.sel{border-color:var(--acc)}
.cams .th canvas{width:100%;height:100%;display:block}
.cams .th span{position:absolute;left:5px;bottom:3px;text-shadow:0 0 3px #000;z-index:3}
.cams .th .rt{position:absolute;right:4px;top:3px;font:9px var(--mono);z-index:3;color:var(--ok)}
.cams .th .lk{border-style:dashed;border-color:#5a2230;display:grid;place-items:center;text-align:center;line-height:1.35}
.cams .th .lost{opacity:.4;border-style:dashed;display:grid;place-items:center;width:84px;cursor:default}
.win.full .cams .th{padding-bottom:16px}
.fqo{position:absolute;inset:0;background:#000e;padding:14px;display:grid;grid-template-rows:auto 1fr;gap:8px}
.fqo header{display:flex;justify-content:space-between;align-items:center;font:600 12px var(--mono);color:var(--acc)}
.empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--dim);text-align:center}.empty b{display:block;color:var(--txt);font-size:15px;margin-bottom:4px}
/* appareils */
.devs{display:grid;grid-template-columns:minmax(220px,50%) 1fr;height:100%;padding:0!important}
.win .body.spectre-host{display:grid;grid-template-columns:minmax(0,1fr);padding:0;overflow:hidden}
.body.spectre-host.tutorial-practice{grid-template-columns:minmax(0,1fr) 300px}
.spbubble{position:absolute;z-index:6;width:236px;max-width:calc(100% - 16px);padding:10px 12px 12px;background:rgba(9,19,31,.97);border:1px solid #2f5577;border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.55);font-size:13px;line-height:1.4;color:#dce9f5}
.spbubble>b{display:block;font-size:13px;padding-right:20px}
.spbubble .sub{font-size:12px;opacity:.78;margin:3px 0 8px}
.spbubble .row{display:flex;gap:6px;align-items:center}.spbubble .row .btn{flex:1;min-height:34px}
.spbubble input{flex:1;min-width:0;padding:6px 8px;background:#0b1622;border:1px solid #2f5577;border-radius:5px;color:inherit;font:inherit;text-transform:uppercase}
.spbubble .x{position:absolute;top:2px;right:4px;width:26px;height:26px;background:none;border:0;color:inherit;cursor:pointer;opacity:.7}
@keyframes cybertrax-unlock{from{transform:scaleX(0)}to{transform:scaleX(1)}}
#defibar,.spbubble .bar i{transform-origin:left}
.spbubble .bar{height:4px;margin-top:8px;background:#1b3045;border-radius:2px;overflow:hidden}.spbubble .bar i{display:block;height:100%;width:0;background:#4fb3ff}
.spnet{position:absolute;right:12px;top:10px;z-index:5;padding:6px 10px;background:rgba(9,19,31,.85);border:1px solid #2f5577;border-radius:6px;color:#bcd3e8;font-size:12px;cursor:pointer}
.spnet:hover{border-color:#4fb3ff;color:#fff}
.cabin-alerts{position:absolute;left:230px;bottom:14px;z-index:30;display:flex;flex-direction:column;gap:10px;max-width:calc(100% - 246px)}
.cabin-alert{position:relative;width:268px;max-width:100%;padding:12px 14px 14px;background:rgba(28,16,6,.97);border:2px solid #ffb079;border-radius:8px;box-shadow:0 0 0 1px #000,0 12px 34px rgba(0,0,0,.65),0 0 26px rgba(255,176,121,.4);color:#ffe9d6;font-size:13px;line-height:1.4;animation:cabin-alert-in .35s ease-out,cabin-alert-glow 2.2s ease-in-out .35s infinite}
.cabin-alert:before{content:"";position:absolute;left:-10px;bottom:26px;width:16px;height:16px;background:inherit;border-left:2px solid #ffb079;border-bottom:2px solid #ffb079;transform:rotate(45deg)}
.cabin-alert small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#ffb079;margin-bottom:2px}
.cabin-alert>b{display:block;font-size:17px;padding-right:22px}
.cabin-alert .sub{font-size:12px;opacity:.8;margin:4px 0 10px}.cabin-alert .sub:empty{display:none}
.cabin-alert .row{display:block}.cabin-alert .btn{width:100%;min-height:38px;font-size:14px;font-weight:600}
.cabin-alert .bar{height:4px;margin-top:8px;background:#3a2514;border-radius:2px;overflow:hidden}.cabin-alert .bar i{display:block;height:100%;width:0;background:#ffb079}
.cabin-alert .x{position:absolute;top:3px;right:5px;width:26px;height:26px;background:none;border:0;color:inherit;cursor:pointer;opacity:.7}
@keyframes cabin-alert-in{from{opacity:0;transform:translateX(-14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes cabin-alert-glow{0%,100%{box-shadow:0 0 0 1px #000,0 12px 34px rgba(0,0,0,.65),0 0 18px rgba(255,176,121,.3)}50%{box-shadow:0 0 0 1px #000,0 12px 34px rgba(0,0,0,.65),0 0 34px rgba(255,176,121,.65)}}
@media(prefers-reduced-motion:reduce){.cabin-alert{animation:none}}
.spectre-host .mapcol{min-width:0;min-height:0;position:relative}.spectre-host iframe{width:100%;height:100%;border:0;display:block}
.sp-panel.devs{display:flex;flex-direction:column;grid-template-columns:none;min-width:0;min-height:0;overflow:hidden;border-left:1px solid var(--line,#2a374e)}
.sp-panel .news{flex:none;max-height:34%;overflow:auto;padding:4px 8px 8px;border-bottom:1px solid var(--line,#2a374e);overscroll-behavior:contain;scrollbar-width:none}
.sp-panel .news::-webkit-scrollbar,.sp-panel .tree::-webkit-scrollbar,.sp-panel .det::-webkit-scrollbar{display:none}
.sp-panel .news .ng{margin:4px 0 8px}.sp-panel .news .ng>b{display:block;font-size:12px}
.sp-panel .tree{flex:1 1 38%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:none}
.sp-panel .det{flex:1 1 38%;min-height:0;overflow:auto;overscroll-behavior:contain;border-top:1px solid var(--line,#2a374e);scrollbar-width:none}
.lvls{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 4px}.lvls .chip{padding:2px 8px;font-size:11.5px;border-radius:10px}.lvls .tag{border:1px solid #2a374e;color:#8794aa;display:inline-block}
.nw{color:#4fb3ff;font-size:11px;font-family:monospace}
@media(max-width:760px){.win .body.spectre-host{grid-template-columns:1fr;grid-template-rows:minmax(0,52%) minmax(0,48%)}.sp-panel.devs{border-left:0;border-top:1px solid var(--line,#2a374e)}}
.tree{border-right:1px solid var(--line);overflow:auto;padding:8px 6px}
.tree .g{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;padding:5px 6px;font-weight:600;text-align:left}
.tree .g small{margin-left:auto;color:var(--dim);font-weight:400}
.tree .n,.news .n{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;width:100%;background:none;border:0;padding:4px 6px 4px 24px;cursor:pointer;text-align:left;border-radius:4px;position:relative}
.tree .n::before{content:"";position:absolute;left:12px;top:0;bottom:50%;width:8px;border-left:1px solid var(--faint);border-bottom:1px solid var(--faint)}
.tree .n:hover,.news .n:hover{background:#ffffff08}.tree .sel{background:#4fb3ff1f!important}
.tree .nm,.news .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tree .st,.news .st{font:10px var(--mono);color:var(--dim);white-space:nowrap}
.tree .unlocked .st{color:var(--ok)}.tree .detected .st{color:var(--lock)}.tree .pending .st{color:var(--wait)}.tree .ia .st{color:var(--ia)}
.tree .lost,.tree .revoked{opacity:.4}
.det{padding:14px;overflow:auto}
.det .k{font:600 10px var(--mono);letter-spacing:.12em;color:var(--dim)}
.det h3{margin:4px 0 8px;font-size:16px}
.det .box{border:1px solid var(--line);border-radius:8px;padding:10px;margin-top:10px;background:var(--row)}
.det .box.lk{border-color:#5a2230}
.det .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center}
.det input{flex:1;min-width:110px;background:#070b11;border:1px solid var(--faint);border-radius:5px;padding:6px 9px;font:600 14px var(--mono);text-transform:uppercase}
.det input:focus{outline:none;border-color:var(--acc)}
.dec{height:4px;background:var(--faint);overflow:hidden;margin-top:8px;border-radius:2px}.dec i{display:block;height:100%;width:30%;background:var(--wait);animation:dec 1.6s ease-in-out infinite}@keyframes dec{0%{transform:translateX(-100%)}100%{transform:translateX(340%)}}
.force{height:4px;background:var(--faint);border-radius:2px;margin-top:8px;overflow:hidden}.force i{display:block;height:100%;width:0;background:var(--ok);transition:width 1.4s linear}
/* messagerie */
.mail{display:grid;grid-template-columns:160px minmax(220px,36%) 1fr;height:100%;padding:0!important}
.mail .f{border-right:1px solid var(--line);padding:8px 6px;display:flex;flex-direction:column;gap:2px}
.mail .f button{display:flex;justify-content:space-between;background:none;border:0;border-radius:6px;padding:6px 9px;cursor:pointer;text-align:left}
.mail .f button.sel{background:#1d2a40}.mail .f b{color:var(--acc);font-weight:600}
.mail .l{border-right:1px solid var(--line);overflow:auto}
.mi{display:grid;grid-template-columns:18px 1fr auto;gap:2px 6px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:8px 8px 8px 6px;cursor:pointer;align-items:start}
.mi.sel{background:#1b2740}
.mi .star{background:none;border:0;padding:0;cursor:pointer;color:var(--faint);font-size:14px;line-height:1}
.mi .star.on{color:var(--star)}
.mi .w{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mi .t{font:10px var(--mono);color:var(--dim)}
.mi .s{grid-column:2/4;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mi.unread .w,.mi.unread .s{font-weight:700;color:#fff}
.mi.unread{box-shadow:inset 3px 0 0 var(--acc)}
.mi.read{opacity:.55}.mi.read.sel{opacity:.8}
.mail .r{overflow:auto;padding:14px 18px}
.mail .r .ban{font:10px var(--mono);letter-spacing:.06em;color:var(--acc);border:1px solid var(--faint);padding:5px 8px;margin-bottom:10px;border-radius:4px}
.mail .r h3{margin:0 0 8px;font-size:16px}.mail .r p{margin:0 0 9px}
.mail .r .acts{display:flex;gap:6px;margin-bottom:12px}
.secret{color:var(--wait);font-family:var(--mono);background:#ffbe5518;padding:0 3px;border-radius:2px}
.paper{background:#efe3b0;color:#3a3420;padding:12px;transform:rotate(-2deg);font:14px/1.4 "Segoe Print","Comic Sans MS",cursive;max-width:230px}.paper .secret{color:#7a4a00;background:none}
table.csv{border-collapse:collapse;font:11px var(--mono)}table.csv td{border:1px solid var(--line);padding:2px 6px}
.files{display:grid;grid-template-columns:220px 1fr;height:100%;padding:0!important}
.files .l{border-right:1px solid var(--line);overflow:auto;padding:6px 0}
.files .d{font:600 10px var(--mono);letter-spacing:.1em;color:var(--dim);padding:8px 10px 3px}
.files .l button{display:block;width:100%;text-align:left;background:none;border:0;padding:4px 10px 4px 18px;cursor:pointer;font:12px var(--mono)}
.files .l button.sel{background:#1b2740}.files .l button.read{opacity:.55}
.files .r{overflow:auto;padding:14px}
.jr{font:12px/1.7 var(--mono)}.jr div{border-bottom:1px solid #ffffff08}.jr b{color:var(--dim);font-weight:400;margin-right:8px}
.chat p{background:#1f1830;border:1px solid #5b4690;border-radius:9px;padding:7px 10px;margin:0 0 6px;color:#e8dcff}.chat p.cor{opacity:.45;text-decoration:line-through}
/* notifications façon macOS (en haut à droite) */
.toasts{position:fixed;right:12px;top:38px;display:flex;flex-direction:column;gap:8px;width:320px;z-index:560}
.toast{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;background:#1c2534e6;backdrop-filter:blur(14px);border:1px solid #ffffff1c;border-radius:12px;padding:9px 11px;box-shadow:0 10px 28px #0009;cursor:pointer;animation:tin .3s}
.toast{border-radius:0!important;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);border-color:#4fb3ff40!important}
.toast .ti{width:34px;height:34px;display:grid;place-items:center;background:#0e1724;color:#9fd8ff;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.toast .ti svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.toast .ti.lost{color:var(--lock)}.toast .ti.ia{color:#d2b6ff}.toast .ti.ok{color:var(--ok)}
.toast b{display:block;font-size:12px}.toast span{font-size:12px;color:#c5cfdc}
@keyframes tin{from{transform:translateX(30px);opacity:0}}
.rg{bottom:58px!important}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.tray .comm,.tray #fluxbtn,#level-indicator{display:none}body.player-admitted .tray .comm{display:flex}body.player-admitted .tray #fluxbtn{display:inline-flex}
body.player-waiting .taskbar>*:not(#help):not(#replay):not(.tray){pointer-events:none;opacity:.35}body.player-waiting #help,body.player-waiting #replay{pointer-events:auto;opacity:1}body.player-waiting .tray>*:not(.comm){pointer-events:none;opacity:.35}body.player-waiting .tray .comm{display:flex;pointer-events:auto;opacity:1}body.player-waiting.tutorial-active .taskbar>#dock,body.player-waiting.tutorial-active #dock *{pointer-events:auto;opacity:1}
.tutorial-practice{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);overflow:auto;background:#08111b}
.spectre-standby-view,.spectre-empty{height:100%;min-height:0;display:grid;place-items:center;text-align:center;background:radial-gradient(ellipse at 50% 35%,#10212d,#080e16 70%);color:var(--dim);padding:24px}.spectre-standby-view small{font:600 10px var(--mono);letter-spacing:.16em;color:var(--acc)}.spectre-standby-view h2{font:600 clamp(16px,2vw,22px) var(--mono);color:var(--txt);margin:12px 0 6px}.spectre-standby-view p{margin:0;color:var(--dim)}
.practice-building{min-height:100%;padding:clamp(16px,3vw,34px);background:radial-gradient(ellipse at 50% 0,#172a40,#09111b 72%);color:var(--txt)}
.practice-head{display:flex;justify-content:space-between;align-items:center;max-width:680px;margin:0 auto}.practice-head small,.practice-foot{font:10px var(--mono);letter-spacing:.08em;color:var(--dim)}.practice-head h3{font:600 22px var(--mono);margin:8px 0}.practice-head>b{font:10px var(--mono);color:var(--wait);border:1px solid #ffbe5540;padding:6px 8px}.practice-building>p{max-width:680px;margin:10px auto 18px;color:var(--dim)}.practice-floors{max-width:680px;margin:auto;display:flex;flex-direction:column;gap:8px}.practice-floor{position:relative;display:grid;grid-template-columns:48px 1fr auto;grid-template-rows:auto auto;gap:2px 12px;align-items:center;text-align:left;padding:14px 18px;background:#111d2b;border:1px solid #2a3b53;color:var(--txt);cursor:pointer}.practice-floor:disabled{opacity:.42;cursor:not-allowed}.practice-floor:not(:disabled):hover,.practice-floor.selected{border-color:var(--acc);background:#12263a;box-shadow:inset 3px 0 var(--acc)}.practice-floor>span{grid-row:span 2;font:18px var(--mono);color:var(--acc)}.practice-floor>b{font-size:13px}.practice-floor>small{font-size:10px;color:var(--dim)}.practice-floor>i{grid-column:3;grid-row:1/3;color:var(--acc);font:20px var(--mono);font-style:normal}.practice-foot{max-width:680px;margin:18px auto 0;display:flex;justify-content:space-between;font-size:8px}
.practice-panel-head{display:flex;justify-content:space-between;align-items:center;padding:10px;border-bottom:1px solid var(--line);font:10px var(--mono)}.practice-panel-head span{color:var(--wait);font-size:8px}.practice-dev{padding:8px}.practice-camera{width:100%;display:flex;align-items:center;gap:9px;text-align:left;padding:9px;background:var(--row);border:1px solid var(--line);color:var(--txt);margin-bottom:5px;cursor:pointer}.practice-camera:disabled{opacity:.45}.practice-camera.selected{border-color:var(--acc)}.practice-camera>span:first-child{font-size:18px;color:var(--acc)}.practice-camera b,.practice-camera small{display:block}.practice-camera b{font:10px var(--mono)}.practice-camera small{font-size:9px;color:var(--dim);margin-top:3px}.practice-camera em{margin-left:auto;color:var(--lock);font:8px var(--mono);font-style:normal}.practice-camera.selected em{color:var(--ok)}.practice-actions{display:flex;gap:6px;padding:8px}.practice-actions .btn{font-size:10px;flex:1}.practice-empty,.practice-note{margin:8px;padding:10px;background:var(--row);border:1px solid var(--line);font-size:10px;color:var(--dim)}.practice-image{position:relative;min-height:125px;margin:8px;background:linear-gradient(145deg,#1a2b3a,#0a121c);border:1px solid #34485a;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#97aabc;font:9px var(--mono);overflow:hidden}.practice-image.locked{background:linear-gradient(145deg,#101a25,#0a121c);color:#718196}.practice-image small{margin-top:5px;color:var(--wait);font:8px var(--mono)}.practice-image-lines{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,#7da4c01a 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#7da4c01a 50%,transparent 50.2%);background-size:24px 24px}.practice-note{border:0;background:none;text-align:center;font-size:9px}
@media(max-width:700px){.tutorial-practice{grid-template-columns:1fr;overflow:auto}.practice-building{min-height:auto;padding:15px}.practice-head h3{font-size:17px}.practice-floor{padding:11px 13px}.practice-foot{gap:10px;flex-wrap:wrap}.practice-panel-head{font-size:9px}}
.cams .th button.new{outline:2px solid #4fb3ff;outline-offset:-2px;animation:camnew 1.1s ease-in-out 3}
@keyframes camnew{50%{box-shadow:0 0 18px 4px rgba(79,179,255,.75)}}

/* Aucune fenêtre ni nouveauté de la mission pendant l'exercice ; la géométrie reste mémorisée. */
body.tutorial-active .win:not([data-id="training-camera"]):not(:has(iframe[data-training="true"])),body.tutorial-active #toasts,body.tutorial-active .spnet,body.tutorial-active .tray>*:not(.comm),body.tutorial-active .dock .badge{visibility:hidden!important}
body.tutorial-active .win[data-id="plans"] .sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-height:560px) and (min-width:701px){body.tutorial-active .win[data-id="training-camera"]{height:150px!important}body.tutorial-active .tuto .card{padding:12px 14px;font-size:13px}body.tutorial-active .tuto .card h3{font-size:16px}}
/* Every room camera uses a 16:9 presentation, including fullscreen/mosaic.
   Size-container units fit the frame inside its slot without cropping a source. */
.cams .slot{container-type:size}
.cams .slot>.camera-feed{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100cqw,177.777778cqh);height:min(100cqh,56.25cqw);aspect-ratio:16/9}
.cams .camera-feed>canvas,.cams .camera-feed>img,.cams .camera-feed>video{object-fit:fill}
.cams .main:not(.camera-grid) .camera-top{right:150px}

/* Le nom est déjà indiqué sous la vue ; pas de référence ni de doublon sur l’image. */
.cams .camera-name,.cams .camera-id{display:none}
.cams .camera-bottom{justify-content:flex-end}
