:root{font-family:system-ui,-apple-system,sans-serif;color:#183b36;background:#f5f4ee;font-size:17px}*{box-sizing:border-box}body{margin:0}header{padding:22px 5%;background:#103e36;display:flex;justify-content:space-between;align-items:center;gap:20px}header a{color:white;text-decoration:none;font-weight:700}header span{font-weight:400;margin-left:15px}header a:last-child{font-size:14px}.test-banner{text-align:center;background:#f8df9b;padding:10px;font-weight:700;font-size:14px}main{max-width:1250px;margin:auto;padding:20px 24px 60px}#kiosk{max-width:650px;margin:25px auto}.intro{text-align:center}h1{font-size:clamp(27px,4vw,38px);letter-spacing:-1px}h2{font-size:22px}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:12px;font-weight:700}form{background:white;border:1px solid #dde3dc;border-radius:20px;padding:28px;margin:20px 0;box-shadow:0 6px 22px #153d3508}label{display:block;font-size:15px;font-weight:600;margin:16px 0}input,select,textarea{font:inherit;width:100%;padding:15px;border:1px solid #aebfb7;border-radius:10px;margin-top:7px;color:#183b36;background:white}input:focus,select:focus,textarea:focus{outline:3px solid #bbd9cb}button{font:inherit;border:0;background:#145b49;color:white;padding:18px 24px;border-radius:12px;cursor:pointer;font-weight:700;min-height:56px}button:disabled{opacity:.55;cursor:wait}.secondary{background:#e6ece8;color:#183b36}.clock-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}p{line-height:1.6;color:#53695f}#time{font-size:25px;font-variant-numeric:tabular-nums}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.grid form{margin:0}.bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.bar h1{margin-right:auto}.small{font-size:14px;padding:12px;min-height:44px}.stats{margin:15px 0 25px;padding:20px;background:#e5ece3;border-radius:12px}.table-wrap{overflow:auto;background:white;border-radius:12px;margin-bottom:24px}table{width:100%;border-collapse:collapse;font-size:14px;white-space:nowrap}th,td{text-align:left;padding:13px;border-bottom:1px solid #e8ece6}th{background:#eaf0e9}#message:not(:empty){position:sticky;top:10px;background:#dceee2;border:1px solid #93baa1;padding:20px;border-radius:12px;z-index:5;font-weight:600}#message.error{background:#ffebe5;border-color:#d89581;color:#7e2e1d}#login-form{max-width:480px;margin:50px auto}output{display:block;margin-top:20px;overflow-wrap:anywhere;font-size:20px;font-weight:700}footer{text-align:center;padding:25px;color:#607267;font-size:13px}[hidden]{display:none!important}@media(max-width:700px){.grid{grid-template-columns:1fr}main{padding:15px}form{padding:22px}.clock-actions{grid-template-columns:1fr}header span{display:none}}
:root input[type=checkbox]{width:auto;min-width:22px;min-height:22px;vertical-align:middle;margin-right:8px}

/* Original Hangari logo: preserve intrinsic ratio and white lettering. */
.hangari-logo{display:block;width:100%;height:auto;aspect-ratio:7757/2066;flex-shrink:0}
header{padding:14px 5%}header .brand-link{display:flex;align-items:center;gap:14px;min-width:0}header .brand-link .hangari-logo{width:clamp(220px,23vw,280px)}header .brand-caption{margin-left:0}.kiosk-logo{width:min(380px,90%);margin:0 auto 24px}.login-logo{width:min(260px,100%);margin:0 auto 20px}
@media(max-width:700px){header{padding:12px;gap:10px}header .brand-link .hangari-logo{width:clamp(140px,40vw,180px)}header a:last-child{font-size:12px}header .brand-caption{display:none}.kiosk-logo{width:min(330px,92%);margin-bottom:18px}}

/* Match the established Hangari green theme without changing logo pixels. */
.hangari-logo{isolation:isolate}
.hangari-logo rect{fill:#103e36}
.hangari-logo image{mix-blend-mode:lighten}
.kiosk-logo,.login-logo{border-radius:18px;overflow:hidden;box-shadow:0 8px 24px #103e3614}
header .brand-link .hangari-logo{box-shadow:none}

/* Use the original dark lettering on white surfaces. */
.hangari-logo-light{display:block;width:100%;height:auto;aspect-ratio:8322/2322;object-fit:contain;mix-blend-mode:normal;filter:none}
.kiosk-logo{background:#fff;padding:10px 12px;border:1px solid #e3e8e1;border-radius:18px;box-shadow:0 6px 20px #103e360a}
.login-logo{background:#fff;padding:0;border:0;border-radius:0;box-shadow:none;overflow:visible}
