*{box-sizing:border-box}body{margin:0;font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;overflow-x:hidden}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.pwa-container{min-height:100vh;display:flex;flex-direction:column}@media (max-width: 600px){.mobile-padding{padding:16px}.mobile-margin{margin:8px}}.touch-button{min-height:48px;min-width:48px;padding:12px 24px;border-radius:8px;border:none;cursor:pointer;transition:all .2s ease}.touch-button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.touch-button:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}.clock-button{width:120px;height:120px;border-radius:50%;border:none;font-size:16px;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #00000026}.clock-button.clock-in{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.clock-button.clock-out{background:linear-gradient(135deg,#f44336,#d32f2f);color:#fff}.clock-button:hover{transform:scale(1.05);box-shadow:0 6px 16px #0003}.clock-button:active{transform:scale(.98)}.status-indicator{display:inline-flex;align-items:center;padding:4px 12px;border-radius:16px;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.status-indicator.clocked-in{background-color:#e8f5e8;color:#2e7d32}.status-indicator.clocked-out{background-color:#fce4ec;color:#c2185b}.status-indicator.pending{background-color:#fff3e0;color:#f57c00}.status-indicator.approved{background-color:#e8f5e8;color:#2e7d32}.status-indicator.rejected{background-color:#ffebee;color:#d32f2f}.balance-card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 8px #0000001a;transition:all .2s ease}.balance-card:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.balance-value{font-size:2rem;font-weight:600;margin:8px 0}.balance-value.positive{color:#4caf50}.balance-value.negative{color:#f44336}.balance-value.neutral{color:#1976d2}.loading-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.offline-indicator{position:fixed;top:0;left:0;right:0;background:#ff9800;color:#fff;padding:8px 16px;text-align:center;font-size:14px;z-index:1000;transform:translateY(-100%);transition:transform .3s ease}.offline-indicator.show{transform:translateY(0)}.sync-indicator{position:fixed;bottom:20px;right:20px;background:#2196f3;color:#fff;padding:8px 16px;border-radius:20px;font-size:12px;z-index:1000;opacity:0;transform:translateY(20px);transition:all .3s ease}.sync-indicator.show{opacity:1;transform:translateY(0)}.form-container{max-width:500px;margin:0 auto;padding:20px}.form-field{margin-bottom:20px}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}@media (max-width: 600px){.form-actions{flex-direction:column}.form-actions button{width:100%}}.bottom-navigation{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e0e0e0;z-index:100}@supports (padding-bottom: env(safe-area-inset-bottom)){.bottom-navigation{padding-bottom:env(safe-area-inset-bottom)}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.focus-visible{outline:2px solid #1976d2;outline-offset:2px}@media (prefers-contrast: high){.balance-card{border:2px solid #000}.status-indicator{border:1px solid currentColor}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.mobile-menu-drawer{transition:transform .3s cubic-bezier(.4,0,.2,1)}.mobile-menu-overlay{transition:opacity .3s cubic-bezier(.4,0,.2,1)}.mobile-menu-list{overflow-y:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.mobile-menu-item{-webkit-tap-highlight-color:rgba(0,0,0,.1);transition:background-color .2s ease}.mobile-menu-item:active{background-color:#00000014}@keyframes burger-icon-pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.burger-icon-active{animation:burger-icon-pulse .3s ease}@media print{.no-print{display:none!important}.print-only{display:block!important}body{background:#fff}.balance-card{box-shadow:none;border:1px solid #ccc}}
