.flight-dock{position:fixed;z-index:1320;left:50%;bottom:18px;transform:translateX(-50%);width:min(980px,calc(100vw - 28px));display:grid;grid-template-columns:50px minmax(170px,1fr) auto 160px auto auto;align-items:center;gap:12px;padding:11px 13px;border:1px solid #31718f;border-radius:16px;background:linear-gradient(145deg,#0c2436f7,#06121dfb);box-shadow:0 25px 80px #000b;backdrop-filter:blur(18px)}
.flight-dock.hidden{display:none}
.dock-plane{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#267fe9,#20d7eb);font-size:24px}
.dock-main small,.flight-dock label{display:block;font-family:var(--mono);font-size:6px;letter-spacing:1px;color:var(--cyan)}
.dock-main strong{display:block;font-size:14px;margin:3px 0}
.dock-main span{display:block;color:var(--muted);font-size:8px}
.dock-metrics{display:flex;gap:7px}
.dock-metrics b{padding:7px 9px;border-radius:8px;background:#102d43;font:7px var(--mono);white-space:nowrap}
.flight-dock select{display:block;width:100%;margin-top:4px;background:#102d43;color:#fff;border:1px solid #315b72;border-radius:7px;padding:5px;font-size:8px}
.flight-dock button{height:36px;border:1px solid #376782;border-radius:9px;background:#12344d;color:#fff;font-weight:800}
.flight-dock .danger{border-color:#7d3e4a;background:#351a24}
.compare-panel{position:fixed;z-index:1310;left:18px;bottom:18px;width:min(390px,calc(100vw - 36px));padding:14px;border:1px solid #814f99;border-radius:15px;background:#0a1b2af7;box-shadow:0 25px 70px #000b}
.compare-panel.hidden{display:none}
.compare-panel header,.e4-card header,.e4-hero{display:flex;justify-content:space-between;align-items:center}
.compare-panel header small,.e4-card header span,.e4-hero span{display:block;color:var(--cyan);font:6px var(--mono);letter-spacing:1.2px}
.compare-panel header strong,.e4-card header strong,.e4-hero strong{display:block;margin-top:4px}
.compare-panel header button{width:29px;height:29px;border-radius:8px}
.compare-head,.compare-row{display:grid;grid-template-columns:1fr 72px 1fr;gap:7px;text-align:center;align-items:center}
.compare-head{margin:13px 0 7px}
.compare-head b{font-size:11px}
.compare-head span,.compare-row span{color:var(--muted);font:6px var(--mono)}
.compare-row{padding:7px;border-top:1px solid var(--line)}
.compare-row b{font:8px var(--mono)}
.compare-distance{text-align:center;margin-top:9px;color:var(--muted);font-size:9px}
.e4-view{padding-bottom:35px}
.e4-hero{padding:18px;border:1px solid #2c6280;border-radius:14px;background:linear-gradient(120deg,#0d2940,#151f42)}
.e4-hero strong{font-size:20px}
.e4-hero b{font:34px var(--mono);color:#65e8ff}
.e4-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:11px}
.e4-card{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid var(--line);border-radius:13px;background:#091925}
.e4-card label{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:9px}
.e4-card select{min-width:135px;background:#102b40;color:#fff;border:1px solid #31566d;border-radius:8px;padding:7px}
.e4-card button{height:34px;border:1px solid #2d6784;border-radius:9px;background:#10344e;color:#eafaff;font-weight:700}
.e4-card small{color:var(--muted);font-size:8px;line-height:1.5}
.e4-card ul{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0;padding-left:17px;color:#b8cfdd;font-size:9px}
.daily-summary{min-height:42px;color:#9eb7c7;font-size:9px;line-height:1.6}
.daily-summary b{color:#fff}
.pwa-checklist{display:grid;gap:6px}
.pwa-checklist div{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;background:#142536}
.pwa-checklist i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-style:normal}
.pwa-checklist .ok i{background:#174a3b;color:#56efbb}
.pwa-checklist .warn i{background:#513b19;color:#ffd16e}
.switch-label input{accent-color:var(--cyan)}
.replay-profile{display:block;width:100%;height:58px;margin-top:6px}
.replay-profile line{stroke:#35566c}
.replay-profile polyline{fill:none;stroke:#22d3ee;stroke-width:2}
.replay-profile text{fill:#7896a9;font:7px var(--mono)}
.playback-panel.expanded{inset:70px 18px 18px 18px;transform:none;width:auto;display:flex;flex-direction:column;justify-content:center}
.playback-panel.expanded .replay-profile{height:35vh}
.smart-declutter .network-canvas{image-rendering:auto}
@media(max-width:800px){.flight-dock{grid-template-columns:38px 1fr auto;bottom:8px;gap:7px;padding:9px}
.dock-plane{width:36px;height:36px}
.dock-metrics{grid-column:1/4;justify-content:center}
.flight-dock label{grid-column:1/3}
.flight-dock button{min-width:54px}
.e4-grid{grid-template-columns:1fr}
.compare-panel{bottom:150px}
.playback-panel:not(.expanded){bottom:8px}
.flight-dock:has(+.compare-panel:not(.hidden)){display:none}
}
@media(max-width:520px){.dock-main span{max-width:185px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock-metrics b{font-size:6px;padding:6px}
.e4-hero strong{font-size:16px}
}

/* Volledige lichte modus voor alle onderdelen die in 4.0 zijn toegevoegd. */
.light .flight-dock{background:linear-gradient(145deg,#fffffff8,#edf5f9fb);border-color:#8fb7ca;box-shadow:0 24px 65px #17354d38;color:#17364d}
.light .dock-main strong,.light .compare-panel strong,.light .e4-hero strong,.light .e4-card strong,.light .daily-summary b{color:#13354d}
.light .dock-metrics b,.light .flight-dock select{background:#fff;border:1px solid #b8cfdb;color:#17364d}
.light .flight-dock button,.light .e4-card button{background:#087da5;border-color:#087394;color:#fff}
.light .flight-dock .danger{background:#b33b4c;border-color:#9b2e3e;color:#fff}
.light .compare-panel{background:#fff;border-color:#b89bc8;box-shadow:0 24px 65px #17354d38;color:#17364d}
.light .compare-panel header button{background:#f1f6f9;border:1px solid #b7cbd7;color:#17364d}
.light .compare-row{border-color:#d2dfe7}
.light .e4-hero{background:linear-gradient(120deg,#eef9fc,#f1effd);border-color:#9cc7d8;color:#17364d}
.light .e4-hero b{color:#087da5}
.light .e4-card{background:#fff;border-color:#bfd2de;color:#17364d;box-shadow:0 8px 22px #17354d12}
.light .e4-card label,.light .e4-card small,.light .daily-summary,.light .compare-distance,.light .compare-head span,.light .compare-row span{color:#526f83}
.light .e4-card select{background:#f7fbfd;border-color:#b7cdd9;color:#17364d}
.light .e4-card ul{color:#36576d}
.light .pwa-checklist div{background:#edf4f8;color:#24465d}
.light .pwa-checklist .ok i{background:#d8f3e9;color:#176b50}
.light .pwa-checklist .warn i{background:#fff0cd;color:#8a5a00}
.light .replay-profile line{stroke:#9eb7c6}.light .replay-profile text{fill:#4f6f84}