@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";:root{--pns-khaki: #c5a37d;--korpri-blue: #003366;--korpri-light: #1e40af;--gold-accent: #fbbf24;--bg-deep: #f8fafc;--bg-app: #ffffff;--bg-card: #ffffff;--text-main: #0f172a;--text-muted: #64748b;--glass-border: rgba(0, 51, 102, .08);--nav-bg: rgba(255, 255, 255, .96);--input-bg: #f1f5f9;--tab-inactive: #f1f5f9}.dark-mode{--bg-deep: #0a0e17;--bg-app: #0f1520;--bg-card: rgba(22, 28, 40, .75);--text-main: #f1f5f9;--text-muted: #7a8599;--glass-border: rgba(255, 255, 255, .06);--nav-bg: rgba(12, 16, 24, .96);--input-bg: rgba(40, 48, 64, .5);--tab-inactive: rgba(40, 48, 64, .5)}@keyframes blink{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}@keyframes glow{0%{box-shadow:0 0 5px #fbbf2433}50%{box-shadow:0 0 20px #fbbf2499}to{box-shadow:0 0 5px #fbbf2433}}.blink-alert{animation:blink 1.5s infinite ease-in-out,glow 2s infinite alternate;border:1px solid var(--gold-accent)!important;background:#fbbf240d!important}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif;transition:background .3s,color .3s,border-color .3s}html,body,#root{width:100%;min-height:100vh}body{background:var(--bg-deep);color:var(--text-main);overflow-x:hidden}#root{display:flex;justify-content:center}.app-container{width:100%;max-width:480px;min-height:100vh;position:relative;background:var(--bg-app);margin:0 auto}.admin-page-container{width:100%;max-width:1000px;margin:0 auto;padding:20px;min-height:100vh;background:var(--bg-app)}@media (min-width: 768px){.app-container{max-width:90%}.grid-menu{grid-template-columns:repeat(4,1fr)!important}.grid-stats{grid-template-columns:repeat(4,1fr)!important;gap:12px!important}.bottom-nav{max-width:500px!important;bottom:20px!important;border-radius:35px!important;box-shadow:0 10px 30px #0000004d!important;border:1px solid var(--glass-border)!important}table{font-size:.85rem!important}}@media (min-width: 1024px){.app-container{max-width:1000px}.grid-menu{grid-template-columns:repeat(5,1fr)!important}}@media (max-width: 380px){.grid-stats{grid-template-columns:repeat(2,1fr)!important}.grid-menu{grid-template-columns:repeat(3,1fr)!important;gap:10px!important}.icon-box{width:48px!important;height:48px!important}}.glass-card{background:var(--bg-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:18px;padding:1.2rem;box-shadow:0 2px 12px #00000014;transition:transform .2s ease,box-shadow .2s ease}.dark-mode .glass-card{box-shadow:0 2px 16px #0000004d,inset 0 1px #ffffff0a}.btn-primary{background:linear-gradient(135deg,var(--korpri-blue) 0%,var(--korpri-light) 100%);color:#fff;border:none;border-radius:14px;padding:1rem 1.5rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0363}.btn-primary:active{transform:scale(.98)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.grid-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 15px}.grid-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.menu-item{display:flex;flex-direction:column;align-items:center;text-align:center;font-size:.72rem;color:var(--text-muted);gap:10px;cursor:pointer;transition:transform .15s ease}.menu-item:active{transform:scale(.95)}.icon-box{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;border:1px solid var(--glass-border);transition:transform .2s ease,box-shadow .2s ease}.menu-item:hover .icon-box{transform:scale(1.06)}.dark-mode .icon-box{background:var(--input-bg)!important}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;height:75px;background:var(--nav-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);display:flex;justify-content:space-around;align-items:center;border-top:1px solid var(--glass-border);z-index:1000;border-radius:24px 24px 0 0}.nav-tab{display:flex;flex-direction:column;align-items:center;text-decoration:none;font-size:.65rem;gap:4px;color:var(--text-muted);padding:8px}.nav-tab.active{color:var(--korpri-blue);font-weight:700}body.light-mode .nav-tab.active{color:var(--korpri-blue)}input,select,textarea{font-family:Poppins,sans-serif;background:var(--input-bg);color:var(--text-main);border:1px solid var(--glass-border);border-radius:12px}input[type=time],input[type=date],input[type=datetime-local],input[type=month]{color-scheme:auto}body:not(.light-mode) input[type=time],body:not(.light-mode) input[type=date],body:not(.light-mode) input[type=datetime-local],body:not(.light-mode) input[type=month]{color-scheme:dark}select option{background:var(--bg-deep);color:var(--text-main)}.role-admin{color:var(--pns-khaki);font-weight:700}.role-pimpinan{color:var(--gold-accent);font-weight:700}.role-staf{color:#10b981;font-weight:700}