:root{--blue:#00239c;--yellow:#f7e36a;--red:#b00000;--green:#174E2F;--light:#f7f7ef;--border:#ddd}
*{box-sizing:border-box}
body{font-family:Arial,Helvetica,sans-serif;background:#f4f6f4;margin:0;color:#111}
header{background:linear-gradient(90deg,var(--blue),#00145e);color:white;padding:10px 18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}
.header-logo{height:76px;width:auto;background:white;border-radius:8px;padding:4px}
header h1{margin:0;font-size:22px}
header small{color:var(--yellow)}
.event-title{font-size:15px;color:#fff;margin-top:4px;font-weight:bold}
.header-clockbox{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.clock-card{background:#ffffff18;border:1px solid #ffffff55;border-radius:8px;padding:7px 10px;text-align:center;min-width:95px}
.clock-card b{display:block;font-size:16px;color:#fff}
.clock-card span{font-size:11px;color:var(--yellow)}
.user-card{text-align:right;font-size:12px}
nav{background:var(--yellow);padding:9px 18px;position:sticky;top:0;z-index:10;border-bottom:2px solid var(--blue)}
nav a{display:inline-block;margin:3px;padding:8px 12px;background:white;border:1px solid var(--blue);border-radius:6px;color:var(--blue);text-decoration:none;font-weight:bold}
main{padding:18px}
.card{background:white;border:1px solid var(--border);border-radius:8px;padding:16px;margin-bottom:16px;box-shadow:0 1px 2px #ccc}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.formgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kpi{text-align:center}.kpi h2{font-size:34px;color:var(--blue);margin:0}.kpi p{font-weight:bold;margin:4px 0}
h2{margin-top:0;color:var(--blue)}
table{border-collapse:collapse;width:100%;font-size:13px;background:white}
th{background:var(--blue);color:white}
th,td{border:1px solid #ddd;padding:7px;text-align:center}
td.left{text-align:left}
input,select,textarea{width:100%;padding:8px;border:1px solid #aaa;border-radius:5px;background:white}
label{font-weight:bold}
button,.btn{background:var(--blue);color:white;border:0;border-radius:6px;padding:10px 14px;cursor:pointer;text-decoration:none;display:inline-block}
.btn2{background:#eee;color:#111;border:1px solid #999}
.danger{background:var(--red)}
.ok{background:#d9ead3;padding:10px;border-radius:6px}.warn{background:#fff2cc;padding:10px;border-radius:6px}.bad{background:#f4cccc;padding:10px;border-radius:6px}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.toolbar select,.toolbar input{width:auto}
.searchbox{max-width:360px;margin-bottom:12px}
.chartBox{height:220px;display:flex;align-items:end;gap:8px;border-left:1px solid #999;border-bottom:1px solid #999;padding:8px;overflow-x:auto;background:#fff}
.barChartItem{min-width:42px;text-align:center;font-size:11px}
.barChartBar{background:var(--blue);border:1px solid #00145e;margin:auto;width:28px;border-radius:4px 4px 0 0}
.barChartLabel{writing-mode:vertical-rl;transform:rotate(180deg);height:80px;overflow:hidden;margin:auto}
.modal{display:none;position:fixed;z-index:999;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.45)}
.modal-content{background:white;margin:5% auto;padding:18px;border-radius:8px;max-width:900px;box-shadow:0 0 20px #111}
tr.dblclickable{cursor:pointer}
tr.dblclickable:hover{background:#fff2cc}
@media(max-width:900px){header{grid-template-columns:1fr}.header-clockbox{justify-content:flex-start}.grid,.grid2,.formgrid{grid-template-columns:1fr}nav a{display:block}}
@media print{nav,.noPrint,button,.btn{display:none!important}body{background:white}.card{box-shadow:none}}


/* === ARSB v2.0 compact header overrides === */
header{padding:6px 14px!important;min-height:78px!important;gap:12px!important}
.header-logo{height:64px!important;max-width:130px!important;object-fit:contain!important;padding:3px!important;border-radius:6px!important}
header h1{font-size:20px!important;line-height:1.1!important}
header small{font-size:11px!important}
.event-title{font-size:13px!important;margin-top:3px!important}
.clock-card{padding:5px 8px!important;min-width:82px!important;border-radius:6px!important}
.clock-card b{font-size:14px!important;line-height:1!important}
.clock-card span{font-size:10px!important}
.user-card{font-size:11px!important;min-width:80px!important}
nav{padding:6px 14px!important}
nav a{padding:6px 9px!important;margin:2px!important;font-size:12px!important}
main{padding:14px!important}
.version-pill{display:inline-block;background:#eef;border:1px solid var(--blue);padding:3px 7px;border-radius:20px;font-size:11px;color:var(--blue);font-weight:bold}