:root{color-scheme:dark;--ink:#f6f0db;--muted:#aaa5b2;--panel:#21182d;--panel2:#17111f;--line:#554667;--amber:#f4a62a;--red:#ff4d4d;--green:#72e06c;--purple:#a36bf2}
*{box-sizing:border-box}
html{min-height:100%;background:#0c0910}
body{margin:0;min-height:100%;color:var(--ink);font-family:"Courier New",Courier,monospace;background:radial-gradient(circle at 20% 0,#34203d 0,transparent 36rem),linear-gradient(135deg,#100b16,#09070c);font-size:16px}
button,select,input{font:inherit}
button,select{min-height:44px}
button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}
.app-shell{width:min(1180px,calc(100% - 28px));margin:auto;padding:28px 0 40px}
.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:20px}
.kicker,.verdict-label{margin:0 0 5px;color:var(--amber);font-size:.74rem;font-weight:700;letter-spacing:.15em}
h1,h2,h3,p{margin-top:0}
h1{margin-bottom:7px;font-family:Impact,"Arial Black",sans-serif;font-size:clamp(2.7rem,7vw,5.8rem);line-height:.86;letter-spacing:.025em;text-transform:uppercase;text-shadow:4px 4px 0 #000}
h1 span{color:var(--amber)}
.lede{max-width:690px;margin-bottom:0;color:#d3cddd;font-family:system-ui,sans-serif;font-size:1.05rem}
.system-badge{flex:0 0 auto;padding:10px 13px;border:1px solid var(--line);background:#120d18;box-shadow:4px 4px 0 #000;font-size:.75rem;font-weight:700}
.badge-light{display:inline-block;width:10px;height:10px;margin-right:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.console{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);border:1px solid var(--line);box-shadow:10px 10px 0 #050306}
.monitor-panel,.controls-panel,.event-panel{padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--panel)}
.monitor-panel{border-right:1px solid var(--line)}
.controls-panel{background-color:var(--panel2)}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.panel-heading h2{margin:0;font-size:1rem;text-transform:uppercase;letter-spacing:.09em}
.status-pill,.tiny-label{margin:0;padding:5px 8px;border:1px solid #746583;color:#c8c0ce;background:#0e0a12;font-size:.7rem;font-weight:700}
.status-pill.armed{border-color:var(--green);color:var(--green)}
.vault{position:relative;min-height:330px;overflow:hidden;border:2px inset #5b5063;background:linear-gradient(rgba(125,101,146,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(125,101,146,.07) 1px,transparent 1px),radial-gradient(circle at 50% 45%,#32223f,#100c16 70%);background-size:28px 28px,28px 28px,auto;isolation:isolate}
.vault::after{content:"";position:absolute;inset:12px;border:1px solid #4c4055;pointer-events:none}
.glass{position:absolute;left:50%;bottom:44px;width:118px;height:150px;transform:translateX(-50%);border:5px solid #d7d3e1;border-top-width:3px;border-radius:3px 3px 24px 24px;box-shadow:inset 10px 0 rgba(255,255,255,.09),0 18px 32px #000;z-index:2}
.bourbon{position:absolute;left:5px;right:5px;bottom:5px;height:78%;border-radius:0 0 16px 16px;background:linear-gradient(90deg,#7e330a,#d77b16 55%,#8b3a0b);box-shadow:inset 0 13px rgba(255,217,123,.22)}
.ice{position:absolute;width:38px;height:35px;border:2px solid #f8edc9;background:rgba(255,250,218,.35);transform:rotate(11deg)}
.ice-one{left:14px;top:22px}.ice-two{right:12px;top:38px;transform:rotate(-16deg)}
.tripwire{position:absolute;left:0;right:0;height:1px;background:var(--red);box-shadow:0 0 8px var(--red);opacity:.65}
.tripwire-one{top:43%;transform:rotate(7deg)}.tripwire-two{top:58%;transform:rotate(-8deg)}
.sensor{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--red);box-shadow:0 0 13px var(--red)}
.sensor-one{left:10%;top:34%}.sensor-two{right:10%;top:70%}
.vault-label{position:absolute;left:24px;bottom:15px;margin:0;color:#c9bfd0;font-size:.72rem;letter-spacing:.1em}.vault-label small{color:#857b8b;letter-spacing:0}
.scanner-line{position:absolute;left:0;right:0;top:0;height:3px;background:var(--green);box-shadow:0 0 18px var(--green);opacity:0;z-index:4}
.vault[data-state="scanning"] .scanner-line{opacity:.9;animation:scan 1.1s ease-in-out 2 alternate}
.vault[data-state="alarm"]{animation:alarm .26s linear 4;background-color:#4a0b13}
.vault[data-state="safe"] .sensor{background:var(--green);box-shadow:0 0 13px var(--green)}
@keyframes scan{to{top:100%}}@keyframes alarm{50%{filter:brightness(1.7)}}
.meter-wrap{margin:18px 0}.meter-label{display:flex;justify-content:space-between;margin-bottom:7px;font-size:.78rem;text-transform:uppercase}.meter{height:17px;border:1px solid #645871;background:#09070c;padding:3px}.meter span{display:block;width:0;height:100%;background:var(--green);transition:width .35s ease,background .35s ease}
.primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.arm-button,.patrol-button,.scan-button{border:0;color:#120c05;background:var(--amber);font-weight:900;text-transform:uppercase;box-shadow:3px 3px 0 #000;cursor:pointer}.patrol-button{color:var(--ink);background:#59436e}.arm-button[aria-pressed="true"]{background:var(--red);color:#fff}.patrol-button[aria-pressed="true"]{background:var(--green);color:#081006}
form{display:grid;gap:11px}label,legend{font-size:.8rem;font-weight:700;color:#d8cedc}select{width:100%;padding:8px;border:1px solid #70627c;color:var(--ink);background:#0d0911}input[type="range"]{width:100%;accent-color:var(--amber)}fieldset{display:grid;gap:9px;margin:4px 0 0;padding:13px;border:1px solid var(--line)}.check{display:flex;align-items:flex-start;gap:8px;font-weight:400}.check input{flex:0 0 auto;width:18px;height:18px;margin:0;accent-color:var(--amber)}.scan-button{margin-top:4px;padding:10px}
.verdict{margin-top:18px;padding:15px;border-left:5px solid var(--purple);background:#0e0a13}.verdict h3{margin-bottom:5px;font-size:1rem}.verdict p:last-child{margin:0;color:var(--muted);font-family:system-ui,sans-serif;font-size:.86rem}.verdict.danger{border-color:var(--red)}.verdict.safe{border-color:var(--green)}
.event-panel{margin-top:18px;border:1px solid var(--line);box-shadow:7px 7px 0 #050306}.event-panel .panel-heading{margin-bottom:10px}.text-button{border:0;color:var(--amber);background:transparent;text-decoration:underline;cursor:pointer}.event-log{display:grid;gap:1px;margin:0;padding:0;list-style:none}.event-log li{display:grid;grid-template-columns:72px 1fr auto;gap:12px;padding:10px;background:#120d18;font-family:system-ui,sans-serif;font-size:.85rem}.event-log time{color:var(--purple);font-family:"Courier New",monospace;font-weight:700}.event-log strong{color:var(--green);font-family:"Courier New",monospace;font-size:.72rem}.event-log li.alert strong{color:var(--red)}
footer{padding:23px 4px 0;color:#958d9b;font-family:system-ui,sans-serif;font-size:.82rem}footer p{margin:0}a{color:#f5b957}
@media(max-width:780px){.app-shell{width:min(100% - 18px,600px);padding-top:16px}.hero{display:block}.system-badge{display:inline-block;margin-top:16px}.console{grid-template-columns:1fr}.monitor-panel{border-right:0;border-bottom:1px solid var(--line)}.vault{min-height:270px}.event-log li{grid-template-columns:60px 1fr}.event-log strong{grid-column:2}.primary-actions{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}