:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#182522;background:#e8ece5;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;min-width:0;isolation:isolate}
/* Local photograph, original proportions and only a light white veil. */
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(#ffffff26,#ffffff26),url('/static/chernobyl.jpg') center center/cover no-repeat;pointer-events:none}
main{width:100%;max-width:1020px;margin:auto;padding:24px clamp(14px,4vw,32px) 32px}
header{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:42px}
small{background:#fffffff0;border:1px solid #ffffffc9;border-radius:8px;padding:10px 12px;color:#35433d;letter-spacing:.1em;font-size:10px;font-weight:750}
.hero{text-align:center;padding:clamp(24px,5vw,60px) 0 14px}
h1{font-size:clamp(28px,5vw,48px);line-height:1.12;letter-spacing:-.035em;margin:0 auto 34px;max-width:800px;color:#13241e;text-wrap:balance;text-shadow:0 2px 3px white,0 0 18px white,0 0 36px white}
h2{font-size:20px;margin-top:0}p{line-height:1.5}section{background:#ffffffed;border:1px solid #ffffff;border-radius:18px;padding:clamp(18px,3vw,26px);margin:24px 0;box-shadow:0 6px 24px #18252216}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:14px}
.machine,.job{background:#f6f8f3;border:1px solid #d5ddd4;padding:18px;border-radius:12px;margin:10px 0;min-width:0;overflow-wrap:anywhere}
.machine h3{margin:0 0 10px}.machine p{margin:6px 0;color:#43534a}.badge{display:inline-block;margin-top:8px;color:#274d67;font-weight:650}
label{display:block;margin:18px 0;font-weight:600}input{display:block;width:100%;min-width:0;margin-top:8px;padding:13px;border:1px solid #86998a;border-radius:8px;background:#fff;color:#17261e;font-size:16px}
button{border:1px solid #839487;background:#f8fbf5;color:#1d3025;padding:12px 20px;border-radius:9px;font:inherit;cursor:pointer;touch-action:manipulation}
button:disabled{opacity:.55;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid #075fbd;outline-offset:5px}
.primary{background:#203e30;color:white;width:100%;font-weight:700}#login{max-width:440px;margin:18px auto 30px}#login>p{color:#4b5b50;font-size:14px}
.action{display:flex;flex-direction:column;align-items:center;text-align:center}
/* Yellow safety base remains stationary while the red mushroom head travels. */
#shutdown{position:relative;display:grid;place-items:center;width:clamp(206px,40vw,272px);height:clamp(142px,28vw,184px);padding:0;margin:12px auto 24px;border:2px solid #bb8d08;border-radius:50%;background:linear-gradient(155deg,#fff282 0%,#ffe14b 35%,#f7c719 70%,#d59b08 100%);box-shadow:0 9px 0 #b27b05,0 13px 0 #735115,0 20px 24px #33280640;isolation:isolate;-webkit-tap-highlight-color:transparent}
#shutdown::before{content:"";position:absolute;width:49%;height:60%;border-radius:50%;background:linear-gradient(90deg,#63090d,#ad1b22 40%,#640b10);transform:translateY(-12px);box-shadow:0 5px 5px #65111b55}
.button-head{position:relative;display:grid;place-items:center;width:83%;height:86%;border:2px solid #ff7474;border-radius:50%;background:radial-gradient(ellipse at 35% 18%,#ff6464 0%,#e82a32 35%,#ca111c 72%,#a80510 100%);box-shadow:inset 0 5px 5px #ffb0a775,inset 0 -4px 7px #83041180,0 12px 0 #930c16,0 17px 0 #6a0d13,0 21px 12px #610a1255;transform:translateY(-30px);transition:transform .13s ease,box-shadow .13s ease;color:#fff;font-size:clamp(48px,10vw,68px);font-weight:900;letter-spacing:.03em;text-shadow:0 2px 2px #79050d;user-select:none}
#shutdown:enabled:hover .button-head{background:radial-gradient(ellipse at 35% 18%,#ff8181,#ee3540 40%,#bc0a16 100%)}
#shutdown:enabled:active .button-head{transform:translateY(-13px);box-shadow:inset 0 3px 5px #ffb0a760,inset 0 -3px 6px #83041180,0 5px 0 #930c16,0 8px 0 #6a0d13,0 10px 8px #610a1233}
#shutdown:disabled{opacity:1;cursor:not-allowed}#shutdown:disabled .button-head{filter:saturate(.85)}
#action-description{font-size:clamp(17px,3vw,21px);font-weight:750;margin:6px 0 0;padding:8px 15px;border-radius:10px;background:#fffffff0;color:#24372b}
.action-note{font-size:13px;margin:8px 0 0;padding:5px 10px;background:#ffffffe0;border-radius:6px;color:#415347;max-width:100%}
.notice{border-left:4px solid #b27704;border-radius:5px;background:#fff8e6f5;padding:16px;color:#654307}
#message:empty{display:none}#message:not(:empty){padding:14px;background:#fff0ec;border:1px solid #e7b2a2;border-radius:10px;color:#8f2c20}
dialog{width:min(540px,calc(100% - 24px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #a0ac9f;border-radius:16px;padding:clamp(18px,4vw,28px);background:#fffffc;color:#182522;box-shadow:0 20px 70px #28312333}
dialog::backdrop{background:#ffffff80;backdrop-filter:blur(3px)}
.buttons{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px}.danger{background:#b52632;color:white;border-color:#96232c}li{margin:10px 0;overflow-wrap:anywhere}.error,.uncertain,.ha{color:#a23713}.off,.skipped{color:#216440}
footer{text-align:center;font-size:13px;margin:30px auto 0;padding:12px;background:#ffffffe8;border-radius:10px;width:fit-content;max-width:100%;color:#435046}
[hidden]{display:none!important}
@media(max-width:480px){main{padding-top:14px}.hero{padding-top:32px}header small{font-size:9px;letter-spacing:.04em}header button{padding:9px 12px}h1{max-width:330px;margin-bottom:32px}.buttons button{flex:1 1 120px}body::before{background-position:46% center}}
@media(prefers-reduced-motion:reduce){.button-head{transition:none}}