:root{color-scheme:dark;--bg:#0c141c;--panel:#141f29;--line:#2a3b47;--muted:#91a5b3;--text:#e1eaf0;--cyan:#53c9c0;--amber:#e4b45e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 system-ui,sans-serif}header{height:82px;padding:0 36px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:#111c26}.brand{display:flex;align-items:center;gap:15px;font-size:19px;font-weight:750;letter-spacing:2px}.logo{border:1px solid var(--cyan);color:var(--cyan);padding:9px;font:700 20px monospace}.brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:2px}.header-right{display:flex;gap:16px;align-items:center;font:13px monospace;color:var(--muted)}#clock{font-size:20px;color:var(--text);margin-left:20px}.dot{width:7px;height:7px;background:var(--cyan);border-radius:50%}main{max-width:1600px;margin:auto;padding:30px 36px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.eyebrow{font:12px monospace;letter-spacing:2px;color:var(--cyan)}h1{font-size:32px;margin:7px 0}p{color:var(--muted);margin:8px 0 18px}.intro p{margin:0}.operator{font:12px/2 monospace;color:var(--muted);text-align:right}.operator strong{font-size:14px;color:var(--text);font-weight:400}.toolbar{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:18px}.toolbar>div{display:flex;gap:12px;align-items:center}button,select,input{font:inherit;border:1px solid #39515e;border-radius:4px;background:#1a2a35;color:var(--text);padding:9px 13px}button{cursor:pointer}button:hover{background:#273f4b}button:focus-visible,input:focus-visible,select:focus-visible,tr:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}button:disabled{opacity:.55;cursor:default}.primary{background:#56c9bd;color:#072722;border-color:#56c9bd;font-weight:700}.primary:hover{background:#7cddd3}.badge{font:12px monospace;letter-spacing:1px;border:1px solid #2a625b;color:#69d4be;padding:7px 10px;background:#16332f}.badge.warning{color:var(--amber);border-color:#806530;background:#332b1d}.badge.danger{color:#ff9a97;background:#392426;border-color:#894448}#timeLabel{font:13px monospace;color:var(--muted)}.workspace{display:grid;grid-template-columns:1.8fr 1fr;gap:18px}.panel{min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden}.panel-title{min-height:53px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line)}h2{font-size:15px;font-weight:600;letter-spacing:.4px;margin:0}.panel-title>span,.panel-title label{font:12px monospace;color:var(--muted)}.panel-title select{font-size:13px;padding:5px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);padding:20px 24px 8px;gap:15px}.metrics small{font:11px monospace;color:var(--muted);display:block;letter-spacing:.6px}.metrics strong{font:30px/1.7 monospace}.metrics em{font-size:15px;font-style:normal;color:var(--muted)}#pump{font-size:19px;color:var(--cyan)}svg{display:block;width:100%;max-height:345px}svg text{fill:#a6bcc8;font:13px monospace}svg .tiny{font-size:10px}svg .tank-label{font-size:22px;fill:#d9edf1}.equipment{fill:#182732;stroke:#88a0ad;stroke-width:2}.process-footer{padding:12px 20px;display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);font:11px monospace;color:var(--muted)}.process-footer>span:first-child{color:var(--cyan)}.legend{display:flex;flex-wrap:wrap;gap:17px;font:12px monospace;padding:22px 20px 10px}.cyan{color:var(--cyan)}.amber{color:var(--amber)}canvas{display:block;width:calc(100% - 30px);height:220px;margin:0 15px}.hint{font-size:13px;padding:0 20px;margin-top:12px}.event-summary{margin:20px;padding:16px;background:#0f1922;border-left:2px solid var(--cyan)}.event-summary small{font:11px monospace;letter-spacing:1px;color:var(--muted)}.event-summary p{margin:8px 0 0;font-size:14px;color:var(--text)}nav{display:flex;gap:5px;margin-top:24px;border-bottom:1px solid var(--line)}.tab{border:none;background:transparent;color:var(--muted);border-radius:0;padding:15px 20px;border-bottom:2px solid transparent}.tab.active{color:var(--cyan);border-color:var(--cyan);background:#14232c}.tab span{font:10px monospace;margin-left:8px}.tab-content{margin-top:14px;min-height:290px}[hidden]{display:none!important}.capture-layout{display:grid;grid-template-columns:2.1fr 1fr}.table-scroll{height:310px;overflow:auto}table{border-collapse:collapse;width:100%;font:13px/1.5 monospace;text-align:left}th{position:sticky;top:0;background:#192832;color:var(--muted);font-size:12px;font-weight:400}th,td{padding:10px 12px;border-bottom:1px solid #263640;white-space:nowrap}tbody tr{cursor:pointer}tbody tr:hover{background:#203541}.write{color:var(--amber);background:#302b21}aside{padding:22px;border-left:1px solid var(--line);background:#101b24;min-width:0}aside small{font:11px monospace;color:var(--muted);letter-spacing:1px}h3{font-size:15px}aside p{font:13px/1.9 monospace;white-space:pre-line;overflow-wrap:anywhere}pre{white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;background:#080f16;color:var(--cyan);font:14px/1.8 monospace}.docs-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:28px}.docs-grid p{font-size:15px}.docs-grid table{font-size:12px}.docs-grid td{white-space:normal}.event-list{max-height:340px;overflow:auto;padding:10px 20px}.event{padding:13px 0;border-bottom:1px solid var(--line);font:14px monospace}.critical{color:#ff9995}form{padding:24px}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}label{display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:14px}input,select{width:100%;min-width:0;color:var(--text)}.submit-row{margin-top:24px;display:flex;gap:24px;align-items:center}output{font-size:15px;color:var(--amber)}output.success{color:var(--cyan)}footer{display:flex;justify-content:space-between;gap:15px;margin:25px 0 0;color:#708795;font:11px monospace;letter-spacing:1px}
/* Lisibilité du poste de conduite. */
body{font-size:17px}h1{font-size:34px}h2,h3{font-size:18px}.brand small,.eyebrow{font-size:12px}.hint{font-size:15px}.metrics small{font-size:12px}.metrics strong{font-size:27px}.panel-title>span,.panel-title label{font-size:13px}.process svg{max-height:none}.process svg text{font-size:16px}.process svg .tiny{font-size:12px}.pipe{fill:none;stroke:#53c9c0;stroke-width:8;stroke-dasharray:13 7}.pipe.idle{stroke:#647c89;stroke-dasharray:none}.signal{stroke:#a5b8c5;stroke-width:1.5;stroke-dasharray:5 4;fill:none}.pumping .pipe:not(.idle){animation:flow 1s linear infinite}.pumping #rotorA{transform-origin:185px 105px;animation:spin 1.4s linear infinite}@keyframes flow{to{stroke-dashoffset:-20}}@keyframes spin{to{transform:rotate(360deg)}}.legend{font-size:14px}.setpoint{color:#b2b8ee}canvas{height:240px}.docs-grid p{font-size:17px}.docs-grid table,table{font-size:14px}th{font-size:13px}.docs-grid td{min-width:90px}.doc-table{overflow:auto}.work-order{border:1px solid #405463;border-left:3px solid #9baeb8;padding:18px;margin:22px 0}.work-order small{color:#c4d2da;font:14px monospace}.work-order h3{margin:10px 0}.work-order p{margin-bottom:0}.event{font-size:15px}.event-list{max-height:510px}label{font-size:16px}.frame-link{padding:3px 7px;font:inherit;color:#e1eaf0;background:transparent}.frame-link:hover{background:#304652}.table-scroll{height:360px}aside p{font-size:14px}nav{overflow:auto}.tab{font-size:16px;white-space:nowrap}.process-footer{font-size:13px}footer{font-size:12px}.controls{flex-wrap:wrap}.header-right{font-size:12px}#clock{white-space:nowrap}main{max-width:1680px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}button,input,select{min-height:44px}pre{font-size:15px}.frame-link{min-height:38px}.docs-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}


@media(prefers-reduced-motion:reduce){*{animation:none!important}}

.diagram{overflow:auto}.diagram:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}

body:not(.pumping) .pipe:not(.idle){stroke:#647c89}.diagram-hint{display:none}
.docs-grid>article{min-width:0}.doc-table{max-width:100%}

/* Mise en page unique, sans règles conditionnées par la largeur d’écran. */
header{height:auto;min-height:82px;padding:18px clamp(12px,2.5vw,36px);flex-wrap:wrap;gap:18px}.brand{letter-spacing:1px}.brand small{letter-spacing:1px}.header-right{margin-left:auto}main{padding:28px clamp(12px,2.5vw,36px)}.intro{flex-wrap:wrap;gap:18px}.operator{text-align:left}.toolbar{flex-wrap:wrap}.toolbar>div{flex-wrap:wrap}.workspace{display:flex;flex-wrap:wrap;gap:18px}.process{flex:1.8 1 620px}.trends{flex:1 1 360px}.metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,205px),1fr))}.metrics strong{white-space:nowrap}.diagram svg{min-width:780px}.diagram-hint{display:block;font-size:14px;padding:0 15px}.process-footer{flex-wrap:wrap}.docs-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,470px),1fr));padding:clamp(16px,2vw,28px);gap:30px}.docs-grid>article{min-width:0}.capture-layout{display:flex;flex-wrap:wrap}.capture-layout>.table-scroll{flex:2.1 1 680px;min-width:0}.capture-layout>aside{flex:1 1 320px;min-width:0}.form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}.submit-row,footer{flex-wrap:wrap}.panel-title{flex-wrap:wrap}.panel-title label{min-width:180px}.tab{white-space:nowrap}.event-list{overflow:auto}form{padding:clamp(16px,2vw,24px)}.form-grid label{min-width:0}.brand{font-size:clamp(15px,1.4vw,19px)}h1{font-size:clamp(28px,2.4vw,34px)}
/* MIXING-32 */
.diagram svg{min-width:0;max-height:none}.metrics em{display:block}.metrics strong{display:block}.metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}#safety{font-size:20px}.running #rotor{transform-origin:380px 253px;animation:mix 1s ease-in-out infinite alternate}@keyframes mix{to{transform:scaleX(.25)}}.diagram{padding:12px}.docs-grid table{font-family:inherit}.docs-grid td{white-space:normal;overflow-wrap:anywhere;min-width:0}.selected{outline:2px solid var(--cyan);outline-offset:-2px}#connection:empty{display:none}#connection{color:var(--amber);padding:0}#detail{scroll-margin-top:20px}.table-scroll td button{font:inherit}.metrics strong{font-size:28px}.chart-caption{padding:0 20px}.process svg text{font-size:16px}.process svg .tiny{font-size:12px}

/* Poste de conduite destiné à un écran d’ordinateur. */
body{min-width:1180px}.workspace{display:grid;grid-template-columns:minmax(640px,1.6fr) minmax(400px,1fr)}.docs-grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:repeat(3,minmax(0,1fr))}