:root{--text:#4b5563;--text-h:#0f172a;--bg:#f3faf8;--card-bg:#fff;--border:#dbe7e4;--accent:#16b3ac;--accent-h:#0d9189;--accent-2:#2cccc4;--accent-bg:#16b3ac1a;--error:#dc2626;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{min-height:100svh;margin:0}h1{color:var(--text-h);margin:0 0 4px;font-size:24px}p{margin:0}.muted{color:var(--text);font-size:14px}.spinner{border:3px solid var(--accent-bg);border-top-color:var(--accent);vertical-align:middle;border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin;display:inline-block}.spinner-sm{border-width:2px;width:16px;height:16px}.spinner-lg{border-width:4px;width:40px;height:40px}.spinner-light{border-color:#fff #ffffff73 #ffffff73}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:1.6s}}.loader{color:var(--text);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:48px 16px;display:flex}.loader p{font-size:14px}.btn-loading{justify-content:center;align-items:center;gap:8px;display:inline-flex}.brand{align-items:center;gap:10px;display:inline-flex}.brand-logo{width:auto;height:28px;display:block}.brand-suffix{color:var(--accent);border-left:1.5px solid var(--border);padding-left:10px;font-size:15px;font-weight:700;line-height:1}.brand-lg .brand-logo{height:40px}.brand-lg .brand-suffix{padding-left:12px;font-size:19px}.auth-shell{background:#fff;place-items:center;min-height:100svh;padding:24px;display:grid;position:relative;overflow:hidden}.waves{z-index:0;pointer-events:none;width:100%;height:340px;max-height:45svh;position:fixed;bottom:0;left:0}.waves-subtle{opacity:.55;height:240px;max-height:30svh}.auth-shell .card{z-index:1;text-align:center;border:none;position:relative;box-shadow:0 24px 50px -28px #0d918966}.auth-shell .card h1{color:var(--accent)}.auth-shell .card label{text-align:left}.brand-row{justify-content:center;margin-bottom:20px;display:flex}.card{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;flex-direction:column;width:100%;max-width:360px;padding:32px;display:flex;box-shadow:0 10px 15px -3px #0000000f}.card label{color:var(--text-h);margin:16px 0 6px;font-size:13px;font-weight:600}.card input{font:inherit;border:1px solid var(--border);background:var(--bg);border-radius:8px;padding:10px 12px}.card input:focus{border-color:var(--accent);outline:none}button{font:inherit;cursor:pointer;color:#fff;background:linear-gradient(90deg, var(--accent-2), var(--accent-h));border:none;border-radius:8px;margin-top:24px;padding:11px 16px;font-weight:600}button:hover:not(:disabled){filter:brightness(.96)}button:disabled{opacity:.6;cursor:not-allowed}button.ghost{color:var(--text-h);border:1px solid var(--border);background:0 0;margin:0}button.ghost:hover:not(:disabled){background:var(--bg)}a.button.ghost{color:var(--text-h);border:1px solid var(--border);background:0 0;border-radius:8px;padding:11px 16px;font-weight:600;text-decoration:none;display:inline-block}a.button.ghost:hover{background:var(--bg)}.error{color:var(--error);margin-top:16px;font-size:14px}.page{z-index:1;max-width:720px;margin:0 auto;padding:32px 24px;position:relative}.page-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.page-header .spacer{margin-left:auto;margin-right:12px}.page-body{margin-top:8px}.page-body>*{margin-inline:auto}.page-body>*+*{margin-top:16px}.user-menu{position:relative}.user-menu-trigger{color:var(--text-h);border:1px solid var(--border);background:0 0;border-radius:999px;align-items:center;gap:8px;margin:0;padding:5px 10px 5px 5px;font-size:14px;font-weight:600;display:flex}.user-menu-trigger:hover:not(:disabled){background:var(--bg);filter:none}.avatar{background:linear-gradient(135deg, var(--accent-2), var(--accent-h));color:#fff;border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-size:12px;font-weight:700;display:grid}.avatar.lg{width:40px;height:40px;font-size:15px}.user-menu-name{text-overflow:ellipsis;white-space:nowrap;max-width:160px;overflow:hidden}.chevron{color:var(--text);transition:transform .15s}.chevron.up{transform:rotate(180deg)}.user-menu-panel{z-index:20;background:var(--card-bg);border:1px solid var(--border);border-radius:12px;min-width:224px;padding:8px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 16px 32px -16px #0d918959}.user-menu-head{border-bottom:1px solid var(--border);align-items:center;gap:12px;margin-bottom:8px;padding:8px 8px 12px;display:flex}.user-menu-id{min-width:0}.user-menu-name-full{color:var(--text-h);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.user-menu-sub{color:var(--text);font-size:12px}.user-menu-item{width:100%;color:var(--text-h);background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;margin:0;padding:9px 10px;font-size:14px;font-weight:500;display:flex}.user-menu-item:hover:not(:disabled){background:var(--bg);filter:none}@media (width<=520px){.user-menu-name{display:none}}.reg-form{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;flex-direction:column;max-width:480px;padding:24px;display:flex}.reg-form h2{color:var(--text-h);margin:0 0 4px;font-size:18px}.reg-form label{color:var(--text-h);margin:16px 0 6px;font-size:13px;font-weight:600}.reg-form input[type=text],.reg-form input[type=email],.reg-form input[type=date],.reg-form input:not([type]),.reg-form select{font:inherit;border:1px solid var(--border);background:var(--bg);border-radius:8px;padding:10px 12px}.reg-form input:focus,.reg-form select:focus{border-color:var(--accent);outline:none}.file-field{flex-direction:column;display:flex}.file-field label{color:var(--text-h);margin:16px 0 6px;font-size:13px;font-weight:600}.hint{margin-top:6px;font-size:12px}.hint.error{color:var(--error)}.ktp-preview{border:1px solid var(--border);object-fit:contain;border-radius:8px;max-width:100%;max-height:200px;margin-top:8px}.checkbox-row{align-items:flex-start;gap:10px;line-height:1.4;flex-direction:row!important;font-size:14px!important;font-weight:400!important}.checkbox-row input{margin-top:3px}.status-card{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;max-width:100%;padding:24px}.status-card h2{color:var(--text-h);margin:8px 0;font-size:18px}.status-card p{margin:8px 0}.verify-step{max-width:720px}.verify-step h2{color:var(--text-h);margin:0 0 4px;font-size:18px}.step-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.step-header h2{margin:0}.back-btn{flex-shrink:0;margin:0;padding:6px 12px;font-size:13px}.esign-webview{border:1px solid var(--border);background:#fff;border-radius:12px;width:100%;height:640px;margin-top:16px}.webview-mock{border:1px dashed var(--border);background:var(--card-bg);border-radius:12px;margin-top:16px;padding:24px}.webview-mock code{word-break:break-all}.badge{background:var(--accent-bg,#2563eb1a);color:var(--accent);text-transform:uppercase;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;display:inline-block}.badge-success{color:#15803d;background:#16a34a1f}.badge-dukcapil,.badge-liveness,.badge-expired,.badge-rejected,.badge-error{color:var(--error);background:#dc26261a}.badge-pending{color:#a16207;background:#ca8a041f}.status-card+.status-card{margin-top:16px}.actions{flex-wrap:wrap;gap:12px;margin-top:16px;display:flex}.actions button{margin-top:0}button.danger{color:var(--error);border-color:#dc262666}button.danger:hover:not(:disabled){background:#dc262614}.status-card label{color:var(--text-h);margin:16px 0 6px;font-size:13px;font-weight:600;display:block}.status-card select{font:inherit;border:1px solid var(--border);background:var(--bg);border-radius:8px;width:100%;padding:10px 12px}.info{grid-template-columns:80px 1fr;gap:4px 16px;margin:16px 0;font-size:14px;display:grid}.info dt{color:var(--text-h);font-weight:600}.info dd{margin:0}details{margin-top:24px}pre{background:var(--card-bg);border:1px solid var(--border);border-radius:8px;padding:16px;font-size:13px;overflow:auto}.link-button{font:inherit;color:var(--accent);cursor:pointer;background:0 0;border:none;margin:0;padding:0;text-decoration:underline}.link-button:hover{color:var(--accent-h)}.modal-overlay{z-index:1000;background:#0f172a80;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-card{background:var(--card-bg);border-radius:14px;flex-direction:column;width:min(760px,100%);max-height:min(86vh,760px);display:flex;overflow:hidden;box-shadow:0 24px 60px #0f172a40}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 22px;display:flex}.modal-header h2{color:var(--text-h);margin:0;font-size:18px}.terms-version{font-size:12px}.modal-close{color:var(--text);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:26px;line-height:1}.modal-body{color:var(--text);padding:18px 22px;font-size:14px;line-height:1.6;overflow-y:auto}.terms-h2{color:var(--text-h);margin:22px 0 8px;font-size:15px;font-weight:700}.terms-p{text-align:justify;margin:0 0 12px}.terms-li,.terms-sub{text-align:justify;gap:8px;margin:0 0 8px;display:flex}.terms-sub{padding-left:28px}.terms-num{min-width:22px;color:var(--text-h);flex:none;font-weight:600}.terms-link{word-break:break-all;margin:0 0 6px}.modal-footer{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 22px;display:flex}.terms-hint{font-size:12.5px}.modal-actions{gap:10px;margin-left:auto;display:flex}