:root{font-family:Inter,system-ui,sans-serif;color:#173e46;background:#173e46}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{min-height:100%}#hydro-lab{--stage-width: 1600px;--stage-height: 900px;position:relative;width:100vw;height:100vh;overflow:hidden;background:#173e46}#simulation-stage{position:absolute;width:var(--stage-width);height:var(--stage-height);transform-origin:0 0;overflow:hidden}#world-canvas{display:block;width:1600px;height:900px}.topbar{position:absolute;inset:28px 42px auto;display:flex;align-items:center;gap:22px;pointer-events:none}.topbar strong{color:#2f6e4f;letter-spacing:.12em;font-size:22px}.topbar span{font-size:30px;font-weight:800}.view-tools{position:fixed;top:25px;right:42px;display:flex;gap:10px;pointer-events:auto}.view-tools button{width:48px;height:48px;border:2px solid rgba(255,255,255,.8);border-radius:16px;color:#f7faef;background:#173e46e6;font:inherit;font-size:22px;font-weight:900;cursor:pointer}.view-tools button:hover,.view-tools button:focus-visible,.view-tools button[aria-pressed=true]{outline:4px solid rgba(255,211,90,.5);background:#255b63}.world-note{position:absolute;top:92px;left:44px;margin:0;padding:10px 16px;border-radius:18px;background:#f7faefe0;font-weight:700}.readout{position:absolute;display:grid;gap:2px;min-width:148px;padding:10px 15px;border-radius:18px;color:#f7faef;background:#173e46e0;box-shadow:0 8px 24px #14363829;pointer-events:none}.readout strong{font-size:18px}.readout span{font-size:15px;color:#d8f0d0}.reservoir-readout{left:220px;top:340px}.spillway-readout{left:740px;top:250px}.turbine-readout{left:770px;top:630px}.city-readout{right:70px;top:430px}.process-pill{position:absolute;transform:translate(-50%,-50%);min-height:48px;padding:0 16px;border:2px solid rgba(255,255,255,.78);border-radius:999px;color:#f7faef;background:#173e46e6;box-shadow:0 8px 22px #14363838;font:inherit;font-size:15px;font-weight:900;letter-spacing:.025em;cursor:pointer}.process-pill:hover,.process-pill:focus-visible{outline:4px solid rgba(255,211,90,.5);background:#255b63}#process-dialog{width:500px;padding:30px 34px;border:0;border-radius:28px;color:#173e46;background:#f8f5df;box-shadow:0 24px 80px #0820265c}#process-dialog::backdrop{background:#102c326b}#process-dialog h2{margin:4px 0 14px;font-size:30px}#process-dialog p{font-size:18px;line-height:1.5}#process-dialog .dialog-kicker{margin:0;color:#2f6e4f;font-size:14px;font-weight:900;letter-spacing:.12em}#process-dialog .cause{padding:12px 15px;border-radius:15px;background:#dcefd3;font-weight:700}#process-dialog .prompt{margin-bottom:0;color:#765820;font-weight:800}.dialog-close{position:absolute;top:16px;right:18px;width:44px;height:44px;border:0;border-radius:50%;color:#173e46;background:#ffd35a;font-size:30px;cursor:pointer}.control-dock{position:absolute;left:44px;bottom:34px;display:flex;align-items:end;gap:22px;padding:16px 20px;border-radius:24px;color:#f7faef;background:#173e46eb;box-shadow:0 14px 35px #14363838}.control-dock label{display:grid;gap:8px;width:210px;font-size:16px;font-weight:800}.control-dock input{width:100%;accent-color:#ffd35a;cursor:pointer}.control-dock button{min-width:92px;min-height:46px;padding:0 18px;border:0;border-radius:16px;color:#173e46;background:#ffd35a;font:inherit;font-weight:900;cursor:pointer}