:root{color:#1c2d45;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--primary:#163e75;--muted:#607086;--border:#dbe3ee;background:#f4f7fb;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}h1{letter-spacing:-.025em;margin:16px 0 8px;font-size:1.35rem;line-height:1.3}h2{margin:0 0 8px;font-size:1rem;line-height:1.4}h3{margin:0 0 6px;font-size:.95rem}p{margin:0 0 10px;line-height:1.5}.gate-page{min-height:100dvh;padding:max(20px, env(safe-area-inset-top)) 14px max(20px, env(safe-area-inset-bottom));place-items:center;display:grid}.auth-card{border:1px solid var(--border);background:#fff;border-radius:14px;width:100%;max-width:400px;padding:22px 18px}.mobile-gate{text-align:center}.mobile-qr{width:240px;max-width:100%;height:240px;margin:20px auto;display:block}.brand{align-items:center;gap:10px;text-decoration:none;display:flex}.brand strong{color:var(--primary);letter-spacing:-.03em;font-size:1.15rem;display:block}.brand-logo{object-fit:contain;flex-shrink:0}.eyebrow{letter-spacing:.045em;color:var(--muted);margin-bottom:4px;font-size:.65rem;font-weight:700}.muted{color:var(--muted);font-size:.82rem}.button{cursor:pointer;border:1px solid #0000;border-radius:7px;justify-content:center;align-items:center;gap:6px;min-height:34px;padding:5px 9px;font-size:.78rem;font-weight:650;line-height:1.3;text-decoration:none;transition:background .15s;display:inline-flex}.button-primary{background:var(--primary);color:#fff}.button-primary:hover:not(:disabled){background:#0e305e}.button-secondary{border-color:var(--border);color:var(--primary);background:#fff}.button-secondary:hover:not(:disabled){background:#f4f7fb}.button-danger{color:#a02727;background:#fff1f1;border-color:#f2d1d1}.button:disabled{opacity:.6;cursor:wait}.button:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline-offset:2px;outline:3px solid #7aaae4}.full-width{width:100%}.login-form,.submission-form,.presensi-form{gap:10px;display:grid}.login-form{margin-top:14px}.field{gap:4px;min-width:0;display:grid}label{font-size:.78rem;font-weight:650}input,select,textarea{color:#1c2d45;background:#fff;border:1px solid #cbd6e5;border-radius:7px;width:100%;min-width:0;min-height:36px;padding:5px 8px;font-size:16px;line-height:1.3}textarea{resize:vertical;line-height:1.4}input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border-color:#bd3030}input[type=file]{font-size:.8rem;overflow:hidden}.error,.notice{overflow-wrap:anywhere;border-radius:8px;padding:10px 12px;font-size:.82rem;line-height:1.5}.error{color:#a02727;background:#fff1f1;border:1px solid #f2d1d1}.notice{color:#375575;background:#edf3fb;border:1px solid #d8e5f5}.field-error{color:#a02727;font-size:.78rem}.form-footer{text-align:center;color:var(--muted);margin:16px 0 0;font-size:.78rem}.steps{margin:16px 0;padding-left:20px;font-size:.85rem;line-height:1.6}.steps li+li{margin-top:8px}.app-shell{min-height:100dvh}.app-header{z-index:20;min-height:52px;padding:max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) 6px max(6px, env(safe-area-inset-left));border-bottom:1px solid var(--border);background:#fff;align-items:center;gap:2px;display:flex;position:sticky;top:0}.header-title{min-width:0;color:var(--primary);text-overflow:ellipsis;white-space:nowrap;flex:1;margin:0 0 0 8px;font-size:1.05rem;overflow:hidden}.header-logo{object-fit:contain;flex:none;width:28px;height:28px;margin-left:6px}.header-button+.header-logo{margin-left:2px}.header-actions{flex-shrink:0;align-items:center;gap:2px;display:flex}.header-button{width:40px;height:40px;color:var(--primary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:8px;flex-shrink:0;place-items:center;padding:0;text-decoration:none;display:grid;position:relative}.header-button:hover:not(:disabled),.header-bell.router-link-active{background:#edf3fb}.header-button:disabled{opacity:.5;cursor:wait}.header-button .app-icon{width:20px;height:20px}.notification-count{color:#fff;text-align:center;background:#c52a3a;border-radius:12px;min-width:17px;padding:2px 4px;font-size:.6rem;font-weight:700;line-height:1.3;position:absolute;top:2px;right:1px}.app-nav{z-index:30;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);border-top:1px solid var(--border);background:#fff;grid-template-columns:repeat(5,minmax(0,1fr));display:grid;position:fixed;bottom:0;left:0;right:0}.app-nav a,.app-nav button{min-width:0;min-height:56px;color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:6px 2px;font-size:.68rem;font-weight:600;text-decoration:none;display:flex}.app-nav .app-icon{width:22px;height:22px}.app-nav .is-active{color:var(--primary)}.app-sheet-backdrop{z-index:25;padding-bottom:calc(56px + env(safe-area-inset-bottom));background:#101f3366;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.app-sheet{background:#fff;border-radius:14px 14px 0 0;width:100%;max-width:520px;max-height:calc(100dvh - 120px);padding:4px 14px 8px;overflow-y:auto}.list-link{color:#1c2d45;text-align:left;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #edf0f5;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 2px;font-size:.88rem;text-decoration:none;display:flex}.list-link:last-child{border-bottom:0}.list-link:disabled{opacity:.6;cursor:wait}.list-link .app-icon{width:20px;height:20px;color:var(--primary)}.list-link>span{overflow-wrap:anywhere;flex:1;min-width:0}.list-link>.badge{flex:none}.list-link>span+.app-icon{width:18px;height:18px;color:var(--muted)}.app-icon{vertical-align:middle;flex-shrink:0;width:16px;height:16px}.icon-heading{align-items:center;gap:6px;display:inline-flex}.account-page{max-width:520px;padding:12px 12px calc(72px + env(safe-area-inset-bottom));margin:0 auto}.account-card{border:1px solid var(--border);background:#fff;border-radius:12px;margin:12px 0;padding:12px}.account-identity{align-items:center;gap:12px;margin-bottom:14px;display:flex}.account-identity h2{overflow-wrap:anywhere}.avatar{width:48px;height:48px;color:var(--primary);background:#e6eef9;border-radius:12px;flex-shrink:0;place-items:center;font-size:1.1rem;font-weight:700;display:grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.avatar .app-icon{width:24px;height:24px}.badge{color:var(--primary);overflow-wrap:anywhere;background:#edf3fb;border-radius:5px;padding:3px 6px;font-size:.72rem;display:inline-block}.account-details{margin:0}.account-details>div{border-top:1px solid #edf0f5;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8px;padding:8px 0;font-size:.82rem;display:grid}dt{color:var(--muted)}dd{overflow-wrap:anywhere;white-space:pre-wrap;margin:0}.account-note{margin:8px 0 0;font-size:.75rem}.update-banner{z-index:10;padding:max(10px, env(safe-area-inset-top)) 12px 10px;background:#e6eef9;border-bottom:1px solid #c6d7ee;position:sticky;top:0}.update-banner p{margin:0 0 8px;font-size:.82rem}.update-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.presensi-times{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0;display:grid}.presensi-time{background:#f4f7fb;border:1px solid #e6edf6;border-radius:8px;flex-direction:column;gap:5px;min-width:0;padding:10px;display:flex}.presensi-time>span{color:var(--muted);font-size:.78rem}.presensi-time strong{color:var(--primary);letter-spacing:-.03em;font-size:1.12rem}.presensi-time small{color:var(--muted);font-size:.72rem}.presensi-time .status-warning{color:#8a520b}.presensi-form p{margin:0}.gps-details{color:var(--muted);overflow-wrap:anywhere;gap:4px;font-size:.78rem;display:grid}.presensi-form .field>.muted{font-size:.75rem}.summary-card:hover{border-color:#87a9d7}.filter-form{flex-wrap:wrap;align-items:end;gap:8px;margin:12px 0;display:flex}.filter-form .field{flex:1;min-width:90px}.filter-form .button{flex-shrink:0}.quota-card .filter-form{margin:0 0 8px}.quota-text{margin:0}.row-heading{flex-wrap:wrap;justify-content:space-between;align-items:start;gap:6px;margin-bottom:8px;display:flex}.row-heading h2{overflow-wrap:anywhere;margin:0}summary{cursor:pointer;color:var(--primary);min-height:34px;padding:7px 0;font-size:.78rem}.notification-row h2{overflow-wrap:anywhere;margin-top:8px}.notification-unread{background:#f4f8ff;border-color:#a9c4e7}.notification-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:12px 0;display:flex}.notification-toolbar p,.notification-toolbar .tabs{margin:0}.notification-body{white-space:pre-wrap;overflow-wrap:anywhere}.notification-warning{color:#684a12;background:#fff9e8;border:1px solid #ead29f;border-radius:10px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;margin:0 0 12px;padding:10px;display:grid}.notification-warning>.app-icon{width:20px;height:20px}.notification-warning p{margin:2px 0 0;font-size:.78rem}.notification-warning .error{margin-top:7px}.notification-prompt{z-index:40;padding:max(16px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));background:#101f338f;place-items:center;display:grid;position:fixed;inset:0}.notification-prompt-card{background:#fff;border-radius:12px;width:100%;max-width:360px;padding:16px;box-shadow:0 16px 44px #101f333d}.notification-prompt-card p{margin:0}.notification-prompt-card .update-actions{justify-content:flex-end}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:10px 0 16px;display:grid}.summary-card{border:1px solid var(--border);min-width:0;color:var(--muted);overflow-wrap:anywhere;background:#fff;border-radius:10px;flex-direction:column;gap:5px;padding:10px 7px;font-size:.72rem;text-decoration:none;display:flex}.summary-card strong{color:var(--primary);font-size:1.05rem}.summary-card small{font-size:.66rem;line-height:1.4}.announcements{scroll-margin-top:64px}.announcement-card h3{overflow-wrap:anywhere}.tabs{gap:4px;margin:10px 0;display:flex;overflow-x:auto}.tabs a,.tabs button{white-space:nowrap;min-height:34px;color:var(--primary);border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:7px;align-items:center;gap:5px;padding:5px 8px;font-size:.75rem;text-decoration:none;display:inline-flex}.tabs .router-link-exact-active,.tabs [aria-pressed=true]{background:var(--primary);color:#fff;border-color:var(--primary)}.signature-pad{touch-action:none;border:1px solid var(--border);background:#fff;border-radius:8px;width:100%;height:160px;display:block}.pdf-preview{border:1px solid var(--border);border-radius:8px;width:100%;height:60dvh;margin-top:10px}.score-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.print-sheet{background:#fff;padding:12px}.print-sheet table{border-collapse:collapse;width:100%;font-size:.75rem}.print-sheet th,.print-sheet td{border:1px solid var(--border);text-align:left;overflow-wrap:anywhere;padding:6px}@media (width<=359px){.account-details>div{grid-template-columns:1fr;gap:3px}.score-list{grid-template-columns:1fr}.notification-warning{grid-template-columns:auto minmax(0,1fr)}.notification-warning .button{grid-column:1/-1;width:100%}}@media print{.app-header,.app-nav,.app-sheet-backdrop,.tabs,.no-print,.update-banner,.notification-warning,.notification-prompt{display:none!important}.account-page{max-width:none;padding:0}body{background:#fff}.print-sheet{padding:0}}@media (prefers-reduced-motion:reduce){.button{transition:none}}