.login-box,.register-box{width:auto;min-width:200px;padding:10%;}
h1,h5{color:#fff;}
h1{padding:10px 0;font-weight:bold;letter-spacing:1px;text-shadow:2px 0 10px rgba(27,27,27,.1);font-size:calc(18px + 6 * ((100vw - 320px) / 680));}
.kehadiran-layout{display:flex;align-items:flex-start;justify-content:center;min-height:100vh;}
.form-left{position:relative;min-height:100vh;height:auto;background-size:cover;background-repeat:no-repeat;padding:10px 18px 80px 18px;overflow-x:hidden;overflow-y:auto;}
.kehadiran-brand{margin-bottom:4px;padding-right:285px;}
.kehadiran-brand h1,.kehadiran-brand h5{color:#222!important;text-shadow:none;}
.kehadiran-brand h1{margin-top:5px;margin-bottom:4px;padding:4px 0;line-height:1.15;}
.kehadiran-brand h5{margin-top:3px;margin-bottom:3px;}
.kehadiran-brand img{max-height:58px;width:auto;}
.status-panel{position:relative;margin-right:285px;padding:4px 0 8px 0;z-index:2;}
.status-panel-title{font-size:16px;font-weight:700;color:#fff;text-align:center;margin-bottom:7px;text-shadow:1px 1px 3px #333;}
.status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
.status-card{min-height:102px;background:rgba(255,255,255,.97);border-radius:7px;padding:7px;display:flex;align-items:center;box-shadow:0 2px 7px rgba(0,0,0,.25);}
.status-photo{width:54px;min-width:54px;margin-right:8px;text-align:center;}
.status-photo img{width:54px;height:54px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);}
.status-info{min-width:0;line-height:1.15;}
.status-name{font-size:13px;font-weight:700;color:#222;word-break:break-word;}
.status-job{font-size:10px;color:#555;margin:3px 0;word-break:break-word;}
.status-badge{display:inline-block;border-radius:12px;padding:3px 7px;font-size:9px;font-weight:700;background:#777;color:#fff;}
.status-hadir{background:#2e9d55;}.status-piket{background:#6f42c1;}.status-pulang{background:#d9534f;}.status-selesai{background:#777;}.status-belum{background:#e0a800;color:#222;}
.status-time{font-size:10px;color:#444;margin-top:4px;font-weight:600;white-space:nowrap;}
.status-empty{background:rgba(255,255,255,.9);padding:12px;text-align:center;color:#555;border-radius:6px;}
.callout{position:absolute;width:calc(100% - 36px);bottom:18px;left:18px;border-radius:0;border-left:5px solid #ffe000;color:#fff;font-weight:bold;padding:5px 20px 5px 15px;z-index:3;}
.callout h4{margin:0 0 4px 0;}.callout p{margin:0;}
.jam{width:250px;position:absolute;top:10px;right:18px;z-index:5;}
.jam h1{padding:0;}
.kehadiran-action-panel{padding-top:20px;}
@media(max-width:1199px){.status-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.status-panel,.kehadiran-brand{margin-right:275px;padding-right:0;}.status-card{min-height:92px;}.status-photo,.status-photo img{width:48px;height:48px;min-width:48px;}.status-name{font-size:12px;}.status-time{font-size:9px;}}
@media(max-width:900px){.jam{position:relative;top:auto;right:auto;width:100%;margin-top:8px;}.status-panel,.kehadiran-brand{margin-right:0;}.kehadiran-brand{padding-right:0;}.status-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}