@font-face{font-family:Bozon;src:url('../zones/assets/fonts/Bozon-Regular.otf') format('opentype');font-weight:400;font-display:swap}@font-face{font-family:Bozon;src:url('../zones/assets/fonts/Bozon-Demi-Bold.otf') format('opentype');font-weight:600 800;font-display:swap}body,button,input,select{font-family:Bozon,Arial,sans-serif}:focus-visible{outline:3px solid #ffb600;outline-offset:3px}button:disabled{opacity:.55;cursor:wait}.scopebar{display:flex;gap:12px;flex-wrap:wrap;padding:12px 24px;background:#effbf0}.scopebar label{display:grid;gap:4px}.scopebar select,.scopebar input{min-height:44px;font-size:16px}.sliderbox{padding:16px;background:#e4f7e4;border:2px solid #198c34;border-radius:12px;margin-top:14px}.sliderbox.out{background:#fff0e4;border-color:#ff6a00}.sliderbox input{width:100%;height:48px;accent-color:#198c34}.sliderbox.out input{accent-color:#ff6a00}.sliderbox button{min-height:48px;width:100%;font-size:18px}.notice{padding:12px;background:#fff3cd;color:#584600}.success-in{background:#e4f7e4}.success-out{background:#fff0e4}.right:focus{outline:0}.pinbox{font-size:40px}a{color:inherit}.kithead{min-height:48px}.field label{display:block}.step-label{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#e4f7e4;color:#126c27;font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.message.error{color:#9d1e16}@media(max-width:500px){.left,.right{padding:16px}.header{padding:12px;gap:10px;flex-wrap:wrap}.logo{max-width:90vw;width:260px}.titles h1{font-size:21px}.pinbox{width:58px;height:64px}.pinboxes{gap:8px}.left h2{font-size:25px}.zone .value{font-size:29px}.key{min-height:56px}}

.success-out h2{color:#aa4200}.success-in h2{color:#126c27}
.app{grid-template-rows:auto auto auto 1fr auto}.scopebar button,.scopebar a{min-height:44px;display:flex;align-items:center}.scopebar .notice{margin:0}

.outstanding{background:#fff1d6;border-left:4px solid #c77800;padding:10px}

/* Variable manager setup content must not consume an implicit grid track. */
.app{display:flex;flex-direction:column}.main{flex:1}.scopebar{align-items:center;flex-shrink:0}.scopebar button,.scopebar input,.scopebar select{height:auto;min-height:44px}

/* Option 2: event masthead and floating scope toolbar. */
.app{background:#f0f7f4;color:#073d2f}
.header{min-height:156px;padding:26px 36px 48px;gap:30px;background:linear-gradient(115deg,#075640,#003f32);border-radius:0 0 18px 18px}
.header .logo{width:285px;height:auto;max-width:30vw;object-fit:contain}
.titles{border-left:1px solid #8cb9a7;padding-left:30px}
.titles h1{font-size:34px;letter-spacing:-.5px}.titles p{color:#d4e7df;font-size:21px}
.operator-signout{margin-left:auto;border:1px solid #d8ede4;border-radius:999px;min-height:48px;padding:10px 22px;background:transparent;color:white;font:inherit;white-space:nowrap}
.operator-signout:hover{background:#ffffff18}
.scopebar{position:relative;margin:-28px 36px 24px;padding:20px 24px;display:grid;grid-template-columns:1.15fr 1.25fr 1fr;gap:24px;border-radius:16px;background:#fff;box-shadow:0 8px 28px #003f3210;align-items:end}
.scopebar label{font-size:14px;color:#52675e;min-width:0;gap:8px}
.scopebar select,.scopebar input,.scopebar output{width:100%;min-width:0;min-height:48px;border:1px solid #c7d6ce;border-radius:9px;background:white;padding:10px 12px;font-size:17px;color:#123b2c}
.scopebar output{display:flex;align-items:center;background:#f6faf8}
.scopebar select:disabled{opacity:1;background:#f6faf8;cursor:default}
.main{gap:20px;padding:0 36px 28px;grid-template-columns:1fr 1fr;align-items:start}
.left,.right{padding:26px 28px;border:0;border-radius:17px;background:#fff;box-shadow:0 4px 20px #003f3209;min-width:0}
.left h2{font-size:29px;text-align:left;margin:14px 0 24px}.right .message{min-height:390px}.right .message h2{font-size:28px}
.key{box-shadow:none;border-color:#d2ddd7;min-height:66px;font-weight:700}.key.small{background:#edf5f0}
.pinbox{border-width:1px;width:76px;height:76px;border-color:#c7d6ce}
.pin-submit{background:#00513e;box-shadow:none}.help{font-size:15px;color:#617369;line-height:1.5}
.footer{font-size:14px;background:#004b35}.notice[hidden]{display:none}.app > .notice{margin:0 36px 20px;border-radius:10px}.app > details{margin:0 36px 20px}
@media(max-width:1000px){.header{padding:22px 24px 48px;gap:20px}.titles{padding-left:20px}.titles h1{font-size:29px}.titles p{font-size:18px}.operator-signout{padding:10px 15px}.scopebar{margin-left:24px;margin-right:24px;gap:16px}.main{padding-left:24px;padding-right:24px;gap:16px}.left,.right{padding:22px}.pinboxes{gap:8px}.pinbox{width:60px;height:66px}}
@media(max-width:760px){.header{flex-wrap:wrap;gap:16px}.header .logo{max-width:44vw;width:230px;height:auto}.titles{flex:1}.titles h1{font-size:25px}.operator-signout{margin-left:0;min-height:44px}.scopebar{grid-template-columns:1fr 1fr;padding:18px}.scopebar label:first-child{grid-column:1/-1}.main{grid-template-columns:1fr}.right .message{min-height:180px}}
@media(max-width:460px){.header{padding:18px 16px 46px}.header .logo{max-width:none;width:210px}.titles{border:0;padding:0;min-width:100%}.scopebar{margin-left:12px;margin-right:12px;gap:14px;grid-template-columns:1fr}.scopebar label:first-child{grid-column:auto}.main{padding:0 12px 20px}.left,.right{padding:20px 16px}.app > .notice,.app > details{margin-left:12px;margin-right:12px}.pinbox{width:58px;height:64px}}