/* =========================================
   ELEVATOR RESCUE — ENGINEERING GAME UI
   ========================================= */
:root{--navy:#101b2f;--panel:#17243a;--panel-2:#1d2d46;--line:#334866;--ink:#ecf5ff;--muted:#9cb0c8;--cyan:#45d8e9;--blue:#4b8dff;--orange:#ffae4c;--green:#45d38b;--red:#ff6475;--yellow:#f6d56a}*{box-sizing:border-box}html{background:#0b1423}body{min-width:320px;min-height:100vh;margin:0;color:var(--ink);background:radial-gradient(circle at 50% -20%,#274b70 0,#111d31 43%,#09111e 100%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans Thai",sans-serif}button,a,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #fff;outline-offset:3px}.game-shell{width:min(1280px,100%);margin:auto;padding:17px clamp(11px,2.7vw,32px) 32px}.game-header{display:grid;grid-template-columns:minmax(110px,1fr) auto minmax(110px,1fr) auto;align-items:center;gap:14px;margin-bottom:16px}.back-link{display:inline-flex;gap:7px;width:max-content;color:#a9bfd8;text-decoration:none;font-size:.82rem;font-weight:800}.back-link:hover{color:#fff}.brand{display:flex;align-items:center;gap:9px}.brand>span{display:grid;width:42px;height:42px;place-items:center;border:1px solid #477395;border-radius:12px;background:#1b3650;box-shadow:0 0 17px rgba(75,185,219,.18);font-size:1.4rem}.brand h1{margin:0;font-family:Georgia,"Noto Serif Thai",serif;font-size:clamp(1.15rem,2vw,1.45rem)}.brand p{margin:1px 0 0;color:var(--muted);font-size:.69rem}.hud{display:flex;justify-content:flex-end;gap:6px}.hud>div{min-width:62px;padding:5px 7px;border:1px solid var(--line);border-radius:9px;background:rgba(15,27,46,.68);text-align:center}.hud span{display:block;color:#8fa4bd;font-size:.52rem;font-weight:900;letter-spacing:.06em}.hud strong{color:#f1f8ff;font-size:.88rem;font-variant-numeric:tabular-nums}.icon-button{display:grid;width:38px;height:38px;place-items:center;padding:0;border:1px solid var(--line);border-radius:9px;color:#fff;background:#182942}
/* Main workspace */.workspace{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(330px,.76fr);gap:16px}.simulation-panel,.engineering-panel,.toolbox{border:1px solid var(--line);border-radius:19px;background:linear-gradient(150deg,rgba(28,45,70,.95),rgba(15,27,46,.97));box-shadow:0 18px 38px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.04)}.simulation-panel,.engineering-panel{padding:17px}.panel-title,.mission-heading,.toolbox-heading,.analysis-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.eyebrow{margin:0 0 3px;color:var(--cyan);font-size:.6rem;font-weight:900;letter-spacing:.13em}.simulation-panel h2,.engineering-panel h2,.toolbox h2{margin:0;font-family:Georgia,"Noto Serif Thai",serif;font-size:1.18rem}.system-light{display:flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid #435772;border-radius:99px;color:#9fb1c7;background:#142238;font-size:.63rem;font-weight:800}.system-light i{width:7px;height:7px;border-radius:50%;background:#899bad;box-shadow:0 0 7px #899bad}.system-light.ready i{background:var(--yellow);box-shadow:0 0 9px var(--yellow)}.system-light.success i{background:var(--green);box-shadow:0 0 10px var(--green)}.system-light.failure i{background:var(--red);box-shadow:0 0 10px var(--red)}
/* Cutaway building */.building-scene{position:relative;min-height:462px;margin-top:13px;border:1px solid #2e4a68;border-radius:15px;overflow:hidden;background:linear-gradient(180deg,#18314e 0 67%,#13253a 67%);isolation:isolate}.building-scene::before{position:absolute;z-index:-2;inset:0;content:"";opacity:.55;background-image:radial-gradient(circle at 13% 17%,#bdeaff 0 1px,transparent 1.5px),radial-gradient(circle at 75% 11%,#fff 0 1px,transparent 1.4px),radial-gradient(circle at 42% 29%,#a7e6ff 0 1px,transparent 1.5px);background-size:150px 115px,193px 147px,223px 161px}.city-skyline{position:absolute;z-index:-1;right:0;bottom:0;left:0;height:35%;opacity:.5;background:linear-gradient(90deg,#0c1726 0 8%,transparent 8% 11%,#102036 11% 24%,transparent 24% 27%,#0d1a2b 27% 38%,transparent 38% 41%,#0c1726 41% 58%,transparent 58% 61%,#102036 61% 77%,transparent 77% 81%,#0c1726 81%)}.building-cutaway{position:relative;width:min(420px,74%);height:410px;margin:17px auto 0;border:3px solid #6c8297;border-bottom:0;background:rgba(7,15,27,.84);box-shadow:0 0 28px rgba(83,160,193,.13)}.floor-lines{position:absolute;inset:55px 0 0}.floor-lines i{display:block;height:59px;border-bottom:2px solid #3c5067}.machine-room{position:absolute;top:0;right:0;left:0;height:56px;border-bottom:2px solid #6c8297;background:#162944}.motor-visual{position:absolute;top:10px;left:18%;display:grid;width:44px;height:34px;place-items:center;border:3px solid #e49747;border-radius:6px;color:#ffc46f;background:#523821;font-size:.65rem;font-weight:900}.motor-visual.running{animation:motor-vibrate .12s linear infinite}.pulley-cluster{position:absolute;top:8px;right:22%;display:flex;gap:3px}.pulley-cluster i{display:block;width:33px;height:33px;border:5px solid #96aabd;border-radius:50%;background:#263d57;box-shadow:inset 0 0 0 3px #132339}.pulley-cluster i:nth-child(n+2){display:none}.pulley-cluster.ma-2 i:nth-child(-n+2),.pulley-cluster.ma-4 i{display:block}.pulley-cluster.spinning i{animation:pulley-spin .45s linear infinite}.shaft{position:absolute;top:56px;right:11%;bottom:0;width:41%;border-right:1px solid #394d65;border-left:1px solid #394d65;background:linear-gradient(90deg,rgba(73,92,110,.1),rgba(20,34,52,.7))}.rope{position:absolute;top:0;left:31%;width:3px;height:89%;background:repeating-linear-gradient(#d3b16e 0 5px,#71502e 5px 8px);box-shadow:40px 0 #c8a767}.rope.moving{animation:rope-move .2s linear infinite}.lift-cab{position:absolute;right:4%;bottom:12px;display:grid;width:78%;height:76px;place-items:center;border:3px solid #8399ad;border-radius:4px;color:#7f96aa;background:linear-gradient(90deg,#263d55,#16283d 48%,#263d55 50%);box-shadow:inset 0 0 0 4px #101e30;transition:bottom .5s}.lift-cab::before{position:absolute;top:-12px;left:50%;width:44px;height:12px;border:3px solid #8095a8;border-bottom:0;content:"";transform:translateX(-50%)}.lift-cab span{position:absolute;right:5px;bottom:4px;font-size:.43rem;font-weight:900;letter-spacing:.08em}.victims{font-size:1.55rem;animation:victim-wave 1.6s ease-in-out infinite}.lift-cab.rising{animation:elevator-rise 3.2s ease-in-out forwards}.lift-cab.failed{animation:cab-shake .42s ease}.counterweight{position:absolute;right:79%;bottom:50px;display:grid;width:34px;height:66px;place-items:center;border:3px solid #8a9aa8;color:#c5d1dc;background:#364b5d;font-size:.47rem;font-weight:800;transition:height .3s}.counterweight::before{position:absolute;top:-56px;width:3px;height:56px;content:"";background:#c8a767}.counterweight.moving{animation:counter-fall 3.2s ease-in-out forwards}.floor-labels{position:absolute;top:58px;right:3px;bottom:0;display:flex;flex-direction:column-reverse;justify-content:space-around;color:#8297ac;font-size:.5rem;font-weight:800}.float-score{position:absolute;top:31%;left:50%;z-index:5;opacity:0;color:#ffe47a;font-size:1.8rem;font-weight:900;text-shadow:0 2px #6c3912,0 0 12px #ffc95a;transform:translateX(-50%)}.float-score.active{animation:score-float 1.2s ease both}.scene-message{position:absolute;right:12px;bottom:10px;left:12px;padding:7px 10px;border:1px solid rgba(99,176,203,.26);border-radius:8px;color:#cceaf1;background:rgba(7,20,35,.8);text-align:center;font-size:.69rem;font-weight:700}.formula-strip{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}.formula-strip span{padding:4px 7px;border:1px solid #304a65;border-radius:6px;color:#91a9c0;background:#13233a;font-size:.57rem}
/* Engineering data */.mission-heading h2 span{color:#ffbf63}.mission-story{min-height:42px;margin:9px 0;color:#a9bbce;font-size:.75rem;line-height:1.5}.timer-box{padding:5px 8px;border:1px solid #da6f77;border-radius:7px;color:#ffadb6;background:#482235;font-size:.7rem}.timer-box.danger{animation:timer-danger .55s ease-in-out infinite alternate}.event-card{margin:9px 0;padding:8px 10px;border:1px solid #e19b58;border-radius:8px;color:#ffce91;background:#432e23;font-size:.68rem;font-weight:700}.mission-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin:10px 0}.mission-facts>div{padding:7px;border:1px solid #2f4661;border-radius:8px;background:#15253b}.mission-facts dt{color:#8197af;font-size:.55rem}.mission-facts dd{margin:2px 0 0;color:#edf7ff;font-size:.72rem;font-weight:800}.analysis-card{padding:13px;border:1px solid #38516e;border-radius:12px;background:#111f33}.analysis-heading{align-items:center;margin-bottom:6px}.analysis-heading h3{margin:0;font-size:.78rem}.analysis-heading span{padding:3px 6px;border-radius:5px;color:#0b3140;background:#54d5dc;font-size:.52rem;font-weight:900}.metric{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid #273b53;color:#91a6bd;font-size:.66rem}.metric strong{color:#f1f7fd;font-variant-numeric:tabular-nums}.metric strong.good{color:#65e8a6}.metric strong.bad{color:#ff8795}.safety-meter{margin-top:9px}.safety-meter>div:first-child{display:flex;justify-content:space-between;color:#a4b6c9;font-size:.65rem}.safety-meter>div:last-child{height:7px;margin-top:4px;overflow:hidden;border-radius:99px;background:#293a50}.safety-meter i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--red),var(--orange),var(--green));transition:width .4s}.engineering-hint{min-height:30px;margin:8px 0 0;color:#7edbe5;font-size:.63rem;line-height:1.45}.test-button{width:100%;margin-top:10px;padding:11px;border:1px solid #73ddea;border-radius:9px;color:#052e3a;background:linear-gradient(135deg,#64e4e7,#55aef2);font-weight:900;box-shadow:0 7px 17px rgba(50,183,222,.2)}.test-button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-2px)}.test-button:disabled{cursor:not-allowed;opacity:.55}.physics-explanation{min-height:55px;margin:10px 0 0;padding:8px 9px;border-left:3px solid #4a87c4;color:#a6b8ca;background:#132238;font-size:.66rem;line-height:1.48}
/* Continuous rigging diagram */.pulley-cluster{display:none}.rope-sensor{display:none}.rigging-visual{position:absolute;z-index:3;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.rig-rope{fill:none;stroke:#d8b878;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2px rgba(255,218,145,.42))}.rig-drive{fill:none;stroke:#d38c47;stroke-width:5;stroke-linecap:round}.rig-pulley-wheel{fill:#243c55;stroke:#9fb2c5;stroke-width:5;transform-box:fill-box;transform-origin:center}.rig-pulley-hub{fill:#dce8ef;stroke:#40546a;stroke-width:2}.rig-anchor{fill:#f3c978;stroke:#684b27;stroke-width:2}.rigging-visual.moving .rig-rope{stroke-dasharray:8 5;animation:rig-rope-flow .25s linear infinite}.rigging-visual.moving .rig-pulley-wheel{animation:pulley-spin .45s linear infinite}.lift-cab,.counterweight{will-change:transform}.counterweight{top:72px;bottom:auto}.counterweight::before{display:none}@keyframes rig-rope-flow{to{stroke-dashoffset:-13}}
/* Toolbox */.toolbox{margin-top:16px;padding:17px}.mode-switch{display:flex;gap:4px}.mode-switch button{padding:5px 9px;border:1px solid #3a526f;color:#91a6bd;background:#132238;font-size:.62rem;font-weight:800}.mode-switch button:first-child{border-radius:7px 0 0 7px}.mode-switch button:last-child{border-radius:0 7px 7px 0}.mode-switch button.active{border-color:#56cedc;color:#092e39;background:#54d8df}.tool-groups{display:grid;grid-template-columns:1fr 1fr 1fr 1.25fr;gap:11px;margin-top:12px}fieldset{min-width:0;margin:0;padding:10px;border:1px solid #344c67;border-radius:10px}legend{padding:0 5px;color:#9fb2c5;font-size:.65rem;font-weight:800}.tool-options{display:grid;gap:6px}.tool-button{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;width:100%;padding:7px;border:1px solid #354c67;border-radius:7px;color:#dceaf5;background:#15253a;text-align:left}.tool-button:hover,.tool-button.selected{border-color:#49c6d8;background:#1d3b52}.tool-button span{font-size:1rem}.tool-button b{font-size:.64rem}.tool-button small{color:#ffca78;font-size:.53rem}.slider-group label:not(.brake-check){display:flex;justify-content:space-between;margin:4px 0;color:#a4b6c8;font-size:.62rem}.slider-group label b{color:#edf6ff;font-variant-numeric:tabular-nums}.slider-group input[type=range]{width:100%;accent-color:#4ecbda}.brake-check{display:flex;align-items:center;gap:6px;margin-top:7px;color:#bacbdd;font-size:.62rem}.upgrade-shop{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding-top:12px;border-top:1px solid #30445e}.upgrade-shop h3{margin:0;font-size:.82rem}.upgrade-list{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}.upgrade-button{padding:6px 8px;border:1px solid #51627a;border-radius:7px;color:#c9d7e3;background:#182b43;font-size:.58rem}.upgrade-button:hover:not(:disabled){border-color:#ffc56c;color:#fff}.upgrade-button:disabled{cursor:not-allowed;opacity:.48}.achievements{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}.achievement{padding:4px 7px;border:1px solid #3c4d62;border-radius:99px;color:#6f8298;background:#132238;font-size:.55rem;filter:grayscale(1)}.achievement.unlocked{border-color:#d5ae4f;color:#ffe38b;background:#413923;filter:none;animation:badge-pop .45s ease}
/* Modal */.modal{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:18px;opacity:0;pointer-events:none;background:rgba(4,10,20,.77);backdrop-filter:blur(7px);transition:opacity .25s}.modal.visible{opacity:1;pointer-events:auto}.modal-card{width:min(450px,100%);padding:27px;border:1px solid #496783;border-radius:20px;background:linear-gradient(145deg,#223a56,#111f33);box-shadow:0 23px 65px rgba(0,0,0,.55);text-align:center}.modal-icon{font-size:3rem}.modal-card h2{margin:5px 0 9px;font-family:Georgia,"Noto Serif Thai",serif}.modal-card>p:not(.eyebrow){margin:0;color:#aec0d2;font-size:.84rem;line-height:1.62}.modal-result{display:flex;justify-content:center;gap:7px;margin-top:14px}.result-chip{padding:6px 8px;border:1px solid #50657b;border-radius:7px;color:#dcecff;background:#15253b;font-size:.68rem;font-weight:800}.modal-actions{display:flex;justify-content:center;gap:7px;margin-top:18px}.modal-actions button,.modal-actions a{min-width:140px;padding:10px 15px;border-radius:8px;text-decoration:none;font-weight:800}.modal-actions button{border:1px solid #72dfe8;color:#082e39;background:#5bd7e0}.modal-actions a{border:1px solid #4f6279;color:#c6d4e0;background:#17283d}
@keyframes motor-vibrate{50%{transform:translateX(2px)}}@keyframes pulley-spin{to{transform:rotate(360deg)}}@keyframes rope-move{to{background-position-y:8px}}@keyframes victim-wave{50%{transform:rotate(-4deg) translateY(-2px)}}@keyframes elevator-rise{0%{bottom:12px}12%{bottom:12px}88%,100%{bottom:278px}}@keyframes counter-fall{to{bottom:260px}}@keyframes cab-shake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}@keyframes score-float{15%{opacity:1;transform:translate(-50%,0) scale(1.12)}100%{opacity:0;transform:translate(-50%,-70px)}}@keyframes timer-danger{to{box-shadow:0 0 10px var(--red)}}@keyframes badge-pop{50%{transform:scale(1.1)}}
@media(max-width:980px){.game-header{grid-template-columns:1fr auto;gap:8px}.brand{order:-1}.hud{grid-column:1/-1;grid-row:2;justify-content:center}.icon-button{grid-column:2;grid-row:1}.workspace{grid-template-columns:1fr}.tool-groups{grid-template-columns:repeat(2,1fr)}}@media(max-width:590px){.game-shell{padding:10px 8px 23px}.back-link span{display:none}.hud>div{min-width:54px;padding:4px 5px}.simulation-panel,.engineering-panel,.toolbox{padding:12px;border-radius:14px}.building-scene{min-height:380px}.building-cutaway{width:88%;height:330px}.floor-lines i{height:45px}.shaft{top:56px}.lift-cab{height:62px}.lift-cab.rising{animation-name:elevator-rise-mobile}.formula-strip span{flex:1 1 40%;text-align:center}.mission-facts{grid-template-columns:repeat(2,1fr)}.tool-groups{grid-template-columns:1fr}.upgrade-shop{display:block}.upgrade-list{justify-content:flex-start;margin-top:8px}.toolbox-heading{align-items:flex-start;flex-direction:column}.modal-card{padding:23px 16px}}@keyframes elevator-rise-mobile{0%{bottom:12px}12%{bottom:12px}88%,100%{bottom:214px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}