
:root{--dark:#004b35;--green:#24b34b;--orange:#ff6a00;--pale:#effbf0;--text:#073d2f;--muted:#6d7974;--warn:#fff3cd}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;font-family:Arial,sans-serif;background:#eef1f4;color:var(--text)}
.app{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;background:white}
.header{background:linear-gradient(90deg,#003e2e,#006244);color:#fff;padding:12px 24px;display:flex;align-items:center;gap:25px}
.logo{height:76px;width:360px;max-width:42vw;object-fit:contain;object-position:left center} .titles h1{margin:0;font-size:27px} .titles p{margin:4px 0 0;color:#a8f05d;font-size:18px}
.main{display:grid;grid-template-columns:1.15fr 1.3fr;min-height:0} .left,.right{padding:22px 28px} .right{border-left:1px solid #ddd;background:#fafafa}
h2{margin:4px 0 15px} .left h2{font-size:35px;text-align:center}
.pinboxes{display:flex;justify-content:center;gap:12px;margin-bottom:16px} .pinbox{width:86px;height:86px;border:2px solid #d6d6d6;border-radius:13px;display:grid;place-items:center;font-size:50px;font-weight:800} .pinbox.filled{border-color:#1e9c3c}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:590px;margin:auto} .key{min-height:66px;border:1px solid #cfd3d1;border-radius:13px;background:#fff;font-size:34px;color:var(--text);box-shadow:0 2px 5px #0002} .key.small{font-size:20px}
.help{text-align:center;margin-top:17px;font-size:17px}
.card{background:white;border-radius:14px;box-shadow:0 2px 12px #0002;overflow:hidden} .accepted{background:#159231;color:white;text-align:center;padding:12px;font-size:20px}
.person{padding:12px 16px;text-align:center} .person h2{font-size:31px;margin:0} .company{color:#808985;font-size:18px}
.info{padding:0 17px 16px} .row{padding:10px 6px;border-top:1px solid #e2e2e2} .label{font-size:13px;color:var(--muted)} .value{font-size:20px;font-weight:700}
.zone{margin:8px 0;background:#e7f7e7;border:2px solid #198c34;border-radius:14px;text-align:center;padding:10px} .zone .value{font-size:35px}
.modebar{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:8px 0 12px} .modebtn{padding:13px;border:2px solid #cdd7d2;border-radius:12px;background:white;font-size:17px;font-weight:700} .modebtn.active-in{background:#e4f7e4;border-color:#28a447;color:#126c27} .modebtn.active-out{background:#fff0e4;border-color:#ff6a00;color:#a33d00}
.kit{border:1px solid #d9e1dd;border-radius:13px;margin-top:9px;overflow:hidden} .kithead{width:100%;border:0;background:#eef6f1;padding:13px 14px;text-align:left;font-size:19px;font-weight:700;color:var(--text)} .kitbody{padding:12px}
.field{margin:9px 0} .field label{display:block;font-size:14px;font-weight:700;margin-bottom:5px} .field input[type=text]{width:100%;border:2px solid #cfd9d3;border-radius:10px;padding:12px;font-size:19px}
.radio-required{background:#fff3cd;border:3px solid #e5a000;border-radius:12px;padding:11px;margin:10px 0} .radio-required strong{font-size:19px;color:#7b4d00} .radio-not-required{background:#f1f3f2;border:1px solid #cbd2ce;border-radius:12px;padding:10px;margin:10px 0}
.checkrow{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid #e4e9e6;font-size:18px} .checkrow input{width:25px;height:25px} .itemnum{margin-left:auto;font-weight:700;color:#176b36}
.action{width:100%;border:0;border-radius:13px;color:white;padding:16px;font-size:21px;font-weight:800;margin-top:13px} .signin{background:#2eaf48} .signout{background:#ff6a00}
.returnsummary{background:#f5f7f6;border-radius:11px;padding:10px;margin:8px 0} .statuswarn{background:#fff3cd;border:2px solid #e0a000;padding:10px;border-radius:10px}
.message{display:grid;place-items:center;text-align:center;height:100%} .success h2{font-size:36px} .error{color:#9d1e16} .shift{display:block;width:100%;text-align:left;padding:13px;margin:9px 0;border:1px solid #ccc;border-radius:11px;background:#fff;font-size:16px}
.footer{background:#004b35;color:white;text-align:center;padding:12px;font-size:17px}
@media(max-width:900px){.main{grid-template-columns:1fr}.right{border-left:0;border-top:1px solid #ddd}.logo{height:48px}}

.pin-submit{display:block;width:100%;max-width:590px;margin:14px auto 0;border:0;border-radius:13px;padding:16px;background:#24b34b;color:#fff;font-size:23px;font-weight:800;box-shadow:0 2px 6px #0003}
.pin-submit:disabled{background:#9cad9f;color:#eef3ef;box-shadow:none}
.sia-badge{display:inline-block;margin:7px 0 5px;padding:7px 12px;border:1px solid #8fb5a0;border-radius:9px;background:#eef6f1;color:#073d2f;font-size:17px;font-weight:800;letter-spacing:.3px}
