:root{--bg-app: hsl(220, 33%, 98%);--bg-panel: hsl(0, 0%, 100%);--surface-glass: hsla(0, 0%, 100%, .85);--border-subtle: hsl(214, 32%, 91%);--border-strong: hsl(215, 25%, 85%);--text-primary: hsl(224, 71%, 4%);--text-secondary: hsl(215, 25%, 27%);--text-muted: hsl(215, 16%, 47%);--accent: hsl(221, 83%, 53%);--h-accent: 221;--accent-soft: hsla(221, 83%, 53%, .1);--accent-gradient: linear-gradient(135deg, hsl(221, 83%, 58%) 0%, hsl(225, 76%, 48%) 100%);--success: hsl(142, 76%, 36%);--success-soft: hsla(142, 76%, 36%, .1);--warning: hsl(38, 92%, 50%);--warning-soft: hsla(38, 92%, 50%, .1);--danger: hsl(0, 84%, 60%);--danger-soft: hsla(0, 84%, 60%, .1);--info: hsl(199, 89%, 48%);--info-soft: hsla(199, 89%, 48%, .1);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-premium: 0 20px 25px -5px rgba(0, 0, 0, .04), 0 8px 10px -6px rgba(0, 0, 0, .04);--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--glass-blur: blur(12px);--glass-border: 1px solid hsla(0, 0%, 100%, .3);--sidebar-w: 280px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-app);color:var(--text-primary);font-family:Inter,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}h1,h2,h3,h4,.branding-text{font-family:Outfit,sans-serif;font-weight:700;letter-spacing:-.02em}a{color:var(--accent);text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1)}a:hover{opacity:.8}a:visited{color:inherit}.app-shell{display:flex;min-height:100vh;background:var(--bg-app)}.sidebar{width:var(--sidebar-w);background:var(--bg-panel);border-right:1px solid var(--border-subtle);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;transition:transform .3s cubic-bezier(.4,0,.2,1)}@media (max-width: 768px){.sidebar{transform:translate(-100%);box-shadow:20px 0 50px #0000001a}.sidebar--open{transform:translate(0)}}.sidebar__brand{padding:var(--space-6) var(--space-5);display:flex;align-items:center;gap:var(--space-3)}.sidebar__brand-icon{width:40px;height:40px;background:var(--accent-gradient);border-radius:var(--radius-md);display:grid;place-items:center;color:#fff;font-weight:800;font-size:1.2rem;box-shadow:0 4px 12px #2463eb4d}.sidebar__brand-text{font-size:1.1rem}.sidebar__brand-sub{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.sidebar__nav{flex:1;padding:var(--space-2) var(--space-4);overflow-y:auto}.sidebar__link{display:flex;align-items:center;gap:var(--space-3);padding:.75rem 1rem;color:var(--text-secondary);font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-md);margin-bottom:2px;transition:all .2s cubic-bezier(.4,0,.2,1)}.sidebar__link:hover{background:var(--bg-app);color:var(--accent);transform:translate(4px)}.sidebar__link--active{background:var(--accent-soft);color:var(--accent);font-weight:600}.sidebar__footer{padding:var(--space-5) var(--space-5);border-top:1px solid var(--border-subtle);background:hsla(var(--h-accent),12%,97%,.5)}.main-area{flex:1;margin-left:var(--sidebar-w);min-height:100vh;display:flex;flex-direction:column;transition:margin-left .3s cubic-bezier(.4,0,.2,1)}@media (max-width: 768px){.main-area{margin-left:0}}.topbar{height:72px;background:var(--surface-glass);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-8);position:sticky;top:0;z-index:50}.topbar__title{font-family:Outfit,sans-serif;font-weight:700;font-size:1.25rem;letter-spacing:-.01em}@media (max-width: 768px){.topbar{padding:0 var(--space-4)}.topbar__title{font-size:1.1rem}}.main-content{flex:1;padding:var(--space-8) var(--space-8) var(--space-10);max-width:1200px;width:100%;margin:0 auto;animation:fadeIn .4s ease-out}@media (max-width: 768px){.main-content{padding:var(--space-5) var(--space-5) var(--space-7)}}.page-header{margin-bottom:var(--space-6)}.page-title{font-size:1.75rem;font-weight:800;margin-bottom:4px;letter-spacing:-.02em}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.card{background:var(--bg-panel);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);box-shadow:var(--shadow-premium);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.card__header{padding:var(--space-5) var(--space-6);background:#00000005;border-bottom:1px solid var(--border-subtle);font-family:Outfit,sans-serif;font-weight:700;font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);display:flex;align-items:center;justify-content:space-between}.card__body{padding:var(--space-8)}.card__body--flush{padding:0}@media (max-width: 768px){.card__body{padding:var(--space-5)}}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-2);color:var(--text-secondary)}.form-input,.form-select,.form-textarea{width:100%;padding:.75rem 1rem;background:var(--bg-panel);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);font-family:inherit;font-size:var(--text-sm);transition:all .2s ease}.form-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem;padding-right:2.5rem}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:var(--radius-md);font-weight:600;font-size:var(--text-sm);cursor:pointer;border:1.5px solid var(--border-subtle);background:var(--bg-panel);color:var(--text-primary);transition:all .2s cubic-bezier(.4,0,.2,1);font-family:Inter,sans-serif}.btn:hover{background:var(--bg-app);border-color:var(--border-strong);transform:translateY(-1px)}.btn:active{transform:translateY(0);background:var(--accent-soft);color:var(--accent)}.btn--primary{background:var(--accent-gradient);border:none;color:#fff;box-shadow:0 4px 12px #2463eb26}.btn--primary:hover{background:#1450d2;box-shadow:0 6px 16px #2463eb33;opacity:1}.btn--primary:active{transform:scale(.97)}.btn--inverted:hover,.btn--inverted:active,.btn--inverted:visited{background:#fff!important;background-image:none!important;color:var(--accent)!important;border:1.5px solid var(--accent)!important;opacity:1}.btn--secondary{background:#2463eb33;border-color:transparent;color:var(--accent)}.btn--secondary:hover{background:#2463eb26}.btn--danger{background:var(--danger-soft);border-color:transparent;color:var(--danger)}.btn--danger:hover{background:#ef434326}.btn--ghost{background:transparent;border-color:transparent;color:var(--text-secondary)}.btn--ghost:hover{background:var(--accent-soft);color:var(--accent)}.btn--icon{width:32px;height:32px;padding:0;border-radius:50%;font-size:1.1rem}.btn--block{width:100%}.btn--sm{padding:.4rem .8rem;font-size:var(--text-xs)}.btn--lg{padding:.8rem 1.6rem;font-size:var(--text-base)}.btn--whatsapp{background:#25d366;color:#fff;border:none}.btn--whatsapp:hover{background:#128c7e;color:#fff;box-shadow:0 4px 12px #25d3664d}.whatsapp-alert{background:#25d4661a;border:1px solid hsla(142,70%,45%,.3);color:#075e54}.whatsapp-alert h3{color:#075e54}.whatsapp-alert p{color:#075e54;opacity:.8}.whatsapp-alert .icon-box{background:#25d366;color:#fff;border-radius:50%;display:grid;place-items:center}.badge{padding:4px 12px;border-radius:99px;font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;border:1px solid transparent}.badge--primary{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}.badge--success{color:var(--success);border-color:var(--success);background:var(--success-soft)}.badge--warning{color:var(--warning);border-color:var(--warning);background:var(--warning-soft)}.badge--danger{color:var(--danger);border-color:var(--danger);background:var(--danger-soft)}.badge--info{color:var(--info);border-color:var(--info);background:var(--info-soft)}.badge--muted{color:var(--text-muted);border-color:var(--border-subtle);background:var(--bg-app)}.badge--warga{color:#2463eb;border-color:#2463eb4d;background:#2463eb1a}.badge--operator{color:#7c3bed;border-color:#7c3bed4d;background:#7c3bed1a}.badge--admin{color:#ef486f;border-color:#ef486f4d;background:#ef486f1a}.badge--staf{color:#11c0af;border-color:#11c0af4d;background:#11c0af1a}.badge--lapangan{color:#f5930a;border-color:#f5930a4d;background:#f5930a1a}.data-table{width:100%;border-collapse:separate;border-spacing:0}.data-table th,.data-table td{padding:1.25rem 1.5rem;text-align:left;border-bottom:1px solid var(--border-subtle);vertical-align:middle}.data-table th{background:var(--bg-app);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-weight:700}.data-table tr:last-child td{border-bottom:none}.bundle-id{font-weight:800;font-family:Inter,monospace;color:var(--accent);font-size:.85rem;letter-spacing:-.01em}.sub-info{font-size:var(--text-xs);color:var(--text-muted);font-weight:500;margin-top:2px}.action-group{display:flex;gap:var(--space-2);align-items:center}.blangko-card{text-align:center}.blangko-indicator{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem;font-size:1.25rem;background:var(--bg-app);border:1px solid var(--border-subtle)}.blangko-indicator.blangko--available{border-color:var(--success);color:var(--success)}.blangko-indicator.blangko--limited{border-color:var(--warning);color:var(--warning)}.blangko-indicator.blangko--empty{border-color:var(--danger);color:var(--danger)}.op-card{background:var(--bg-panel);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);padding:1.25rem;transition:all .2s ease;box-shadow:var(--shadow-sm)}.op-card--active{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 10px 15px -3px #2463eb1a}.op-card__icon{font-size:1.5rem;margin-bottom:4px}.op-card__label{font-weight:700}.op-step-indicator{background:var(--accent-soft);color:var(--accent);font-weight:700;padding:4px 12px;border-radius:var(--radius-xl);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;width:fit-content;margin-bottom:16px}.op-shell{display:flex;flex-direction:column;height:100vh;background:var(--bg-app)}.op-header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-4);background:var(--surface-glass);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border-subtle);height:64px;position:sticky;top:0;z-index:50}.op-header-btn{background:var(--bg-app);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);width:36px;height:36px;display:flex;align-items:center;justify-content:center}.op-header-title{font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:800;letter-spacing:.02em}.op-main-wrapper{flex:1;display:flex;flex-direction:column;overflow-y:auto}.op-content{flex:1;padding:var(--space-5);max-width:600px;width:100%;margin:0 auto}.op-action-bar{background:var(--surface-glass);backdrop-filter:var(--glass-blur);border-top:1.5px solid var(--border-subtle);padding:1.25rem;position:sticky;bottom:0}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.text-muted{color:var(--text-muted)}.text-sm{font-size:var(--text-sm)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.filter-bar{margin-bottom:var(--space-5);max-width:300px}.checklist__item{padding:var(--space-4) var(--space-6);display:flex;align-items:center;gap:var(--space-4);border-bottom:1px solid var(--border-subtle);transition:background .2s ease}.checklist__item:last-child{border-bottom:none}.checklist__item:hover{background:#00000003}@media (max-width: 768px){.checklist__item{padding:var(--space-4) var(--space-4)}}.wizard-actions{display:flex;justify-content:flex-end;gap:var(--space-4);margin-top:var(--space-7);padding-top:var(--space-6);border-top:1px solid var(--border-subtle)}@media (max-width: 768px){.wizard-actions{flex-direction:column-reverse}.wizard-actions button{width:100%}}.upload-card{padding:var(--space-4) var(--space-5);border:1.5px solid var(--border-subtle);border-radius:var(--radius-lg);display:flex;align-items:center;gap:var(--space-4);background:var(--bg-panel);margin-bottom:var(--space-3);transition:all .2s ease;box-shadow:var(--shadow-sm)}.upload-card--success{background:var(--success-soft);border-color:var(--success)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-7);margin-bottom:var(--space-8)}.stat-card{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-7);box-shadow:var(--shadow-premium);position:relative;overflow:hidden;transition:transform .2s ease}.stat-card:hover{transform:translateY(-2px)}.stat-card:before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;background:var(--stat-accent, var(--accent))}.stat-card__label{font-size:var(--text-xs);font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-2)}.stat-card__value{font-weight:800;font-size:2rem;color:var(--text-primary);font-family:Outfit,sans-serif}.role-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}@media (max-width: 480px){.role-cards{grid-template-columns:repeat(2,1fr)}}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-app);background-image:radial-gradient(at 0% 0%,hsla(221,83%,53%,.1) 0,transparent 50%),radial-gradient(at 50% 0%,hsla(262,83%,58%,.05) 0,transparent 50%),radial-gradient(at 100% 100%,hsla(142,76%,36%,.05) 0,transparent 50%);padding:var(--space-4)}.login-card{width:100%;max-width:480px;background:var(--surface-glass);backdrop-filter:var(--glass-blur);border:var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-7) var(--space-6);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a,0 0 0 1px #ffffff80 inset;animation:slideUp .6s cubic-bezier(.16,1,.3,1)}.login-brand{margin:0 auto 24px;width:80px;height:80px;background:var(--accent-gradient);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:2.5rem;box-shadow:0 12px 24px #2463eb66;transform:rotate(-5deg)}.visit-card__meta-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.visit-meta-item{display:flex;align-items:center;gap:12px;font-size:var(--text-sm);color:var(--text-secondary)}.visit-meta-icon{width:24px;text-align:center;opacity:.8}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.tracking-page{min-height:100vh;background:var(--bg-app)}.tracking-nav{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);background:var(--surface-glass);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border-subtle)}.tracking-content{max-width:800px;margin:0 auto;padding:var(--space-7) var(--space-4) var(--space-7)}.search-hero{background:var(--bg-panel);padding:var(--space-7) var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--border-subtle);box-shadow:var(--shadow-premium);text-align:center;margin-bottom:var(--space-6)}.search-hero h1{font-size:2.5rem;margin-bottom:var(--space-3);line-height:1.1}.hero-sub{font-size:1.1rem;max-width:500px;margin:0 auto var(--space-6)}.search-box{background:var(--bg-app);padding:var(--space-2);border-radius:var(--radius-xl);border:1.5px solid var(--border-subtle);display:flex;gap:var(--space-2);max-width:600px;margin:0 auto;transition:all .2s ease}.search-box:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.example-grid{display:flex;gap:var(--space-3);justify-content:center;flex-wrap:wrap;opacity:.8;margin-top:var(--space-6)}.example-item{background:var(--bg-app);border:1px dashed var(--border-strong);padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);flex:1 1 200px;max-width:280px}.example-code{font-weight:700;font-family:monospace;font-size:1.1rem;color:var(--accent)}@media (max-width: 768px){.search-hero{padding:var(--space-6) var(--space-4)}.search-hero h1{font-size:1.75rem}.search-box{flex-direction:column;padding:var(--space-4);border-radius:var(--radius-lg)}.tracking-content{padding:var(--space-5) var(--space-4)}}.hide-mobile{display:table-cell}.show-mobile{display:none}@media (max-width: 768px){.hide-mobile{display:none!important}.show-mobile{display:block!important}.data-table{display:none}.grid-2{grid-template-columns:1fr}.main-content{padding:1rem}.btn{height:48px}.mobile-toggle{display:flex!important;align-items:center;justify-content:center}.sidebar-overlay{display:block!important}}.mobile-toggle{display:none;cursor:pointer;width:40px;height:40px;align-items:center;justify-content:center;font-size:1.5rem;color:var(--text-primary);background:transparent;border:none;border-radius:var(--radius-md);transition:all .2s ease}.mobile-toggle:hover{background:var(--accent-soft);color:var(--accent)}.sidebar-overlay{display:none;position:fixed;inset:0;background:#0006;backdrop-filter:blur(4px);z-index:99;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}