:root{color-scheme:light dark;--bg:#f3f6f4;--surface:#fff;--surface-2:#edf2ef;--text:#13201b;--text-muted:#5b6b64;--border:#d8e2dd;--primary:#0f766e;--primary-strong:#115e59;--on-primary:#fff;--success:#15803d;--success-soft:#dcfce7;--danger:#b91c1c;--danger-soft:#fee2e2;--warning:#92400e;--warning-soft:#fef3c7;--clock-in:#16a34a;--clock-out:#ea580c;--radius:14px;--shadow:0 1px 2px rgba(0,0,0,.04),0 6px 20px rgba(0,0,0,.06);font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;line-height:1.5}@media(prefers-color-scheme:dark){:root{--bg:#0c1311;--surface:#141d1a;--surface-2:#1b2622;--text:#e3ece8;--text-muted:#93a49d;--border:#283631;--primary:#14b8a6;--primary-strong:#2dd4bf;--on-primary:#04211e;--success:#4ade80;--success-soft:#12301d;--danger:#f87171;--danger-soft:#3a1515;--warning:#fbbf24;--warning-soft:#362a0c;--shadow:0 1px 2px rgba(0,0,0,.3)}}*,:after,:before{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;-webkit-tap-highlight-color:transparent}h1,h2,h3{line-height:1.25;margin:0 0 8px}a{color:var(--primary)}.halaman{display:grid;gap:16px;margin:0 auto;max-width:720px;padding:16px 16px 48px}.halaman.lebar{max-width:1100px}.kartu{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0;padding:16px}.muted{color:var(--text-muted)}.kecil{font-size:.875rem}.baris{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.antara{justify-content:space-between}label{display:grid;font-size:.875rem;font-weight:600;gap:4px}.input{background:var(--surface);border:1px solid var(--border);border-radius:10px;color:var(--text);font:inherit;min-width:0;padding:10px 12px;width:100%}.input:focus-visible{outline:2px solid var(--primary);outline-offset:1px}.tombol{align-items:center;background:var(--primary);border:1px solid transparent;border-radius:10px;color:var(--on-primary);cursor:pointer;display:inline-flex;font:inherit;font-weight:600;gap:6px;justify-content:center;padding:10px 16px}.tombol:hover:not(:disabled){background:var(--primary-strong)}.tombol:disabled{cursor:not-allowed;opacity:.55}.tombol.garis{background:transparent;border-color:var(--border);color:var(--primary)}.tombol.garis:hover:not(:disabled){background:var(--surface-2)}.tombol.kecil{font-size:.875rem;padding:6px 10px}.tombol.penuh{width:100%}.pesan{border-radius:10px;font-size:.925rem;margin:0;padding:10px 12px}.pesan.sukses{background:var(--success-soft);color:var(--success)}.pesan.galat{background:var(--danger-soft);color:var(--danger)}.pesan.peringatan{background:var(--warning-soft);color:var(--warning)}.lencana{background:var(--surface-2);border-radius:999px;color:var(--text-muted);display:inline-block;font-size:.75rem;font-weight:700;padding:2px 8px;white-space:nowrap}.lencana.SELESAI,.lencana.ok{background:var(--success-soft);color:var(--success)}.lencana.BERLANGSUNG{background:var(--warning-soft);color:var(--warning)}.lencana.DITUTUP_SISTEM,.lencana.belum{background:var(--danger-soft);color:var(--danger)}.tab-bar{background:var(--surface-2);border-radius:12px;display:flex;gap:4px;overflow-x:auto;padding:4px}.tab-bar button{background:transparent;border:0;border-radius:9px;color:var(--text-muted);cursor:pointer;flex:1;font:inherit;font-weight:600;padding:8px 12px;white-space:nowrap}.tab-bar button[aria-selected=true]{background:var(--surface);box-shadow:var(--shadow);color:var(--text)}.bar-filter{align-items:flex-end;display:flex;flex-wrap:wrap;gap:12px}.bar-filter>label{flex:1 1 170px}.bar-filter>label.lebar{flex:2 1 240px}label.centang{align-items:center;display:flex;font-weight:500;gap:8px}.bar-filter>label.centang{flex:0 1 auto;padding-bottom:10px}.form-panel{background:var(--surface-2);border:1px solid var(--primary);border-radius:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:12px 0;padding:14px;scroll-margin-top:80px}.form-panel h3{font-size:1rem;margin:0}.form-panel .penuh{grid-column:1/-1}.kartu>h2{font-size:1.1rem}.tabel-wrap{margin:0 -16px;overflow-x:auto;padding:0 16px}table{border-collapse:collapse;font-size:.9rem;width:100%}td,th{border-bottom:1px solid var(--border);padding:10px 8px;text-align:left;vertical-align:top}th{color:var(--text-muted);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase}.angka,th{white-space:nowrap}.angka{font-variant-numeric:tabular-nums}