body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;font-family:Exo\ 2,sans-serif;margin:0}*{box-sizing:border-box}.container{margin:0 auto;max-width:1200px;padding:20px}.btn{border:none;border-radius:5px;cursor:pointer;font-size:16px;font-weight:500;padding:10px 20px;transition:all .3s ease}.btn-primary{background-color:#2196f3;color:#fff}.btn-primary:hover{background-color:#1976d2}.btn-success{background-color:#4caf50;color:#fff}.btn-success:hover{background-color:#388e3c}.btn-danger{background-color:#f44336;color:#fff}.btn-danger:hover{background-color:#d32f2f}.card{background:#fff;border-radius:10px;box-shadow:0 2px 4px #0000001a;margin-bottom:20px;padding:20px}.form-group{margin-bottom:15px}.form-label{font-weight:500;margin-bottom:5px}.form-input{border:1px solid #ddd;border-radius:5px;padding:10px}.form-input:focus{box-shadow:0 0 0 2px #2196f333}.attendance-screen{background-color:#f5f5f5;font-family:Exo\ 2,sans-serif;min-height:100vh}.error-container,.loading-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding:20px;text-align:center}.error-container h2,.loading-container h2{color:#333;margin-bottom:20px}.error-container p{color:#666;margin-bottom:20px}.status-card{align-items:center;display:flex;gap:10px}.status-indicator{flex-shrink:0}.status-text{color:#333;font-size:16px;font-weight:700}.camera-placeholder{background:linear-gradient(135deg,#667eea,#764ba2);flex-direction:column}.camera-placeholder p{font-size:14px;margin-top:10px;opacity:.8}.camera-overlay{font-weight:700}.control-button.primary:hover:not(.disabled){background-color:#388e3c;transform:translateY(-2px)}.control-button.secondary{background-color:#2196f3}.control-button.secondary:hover{background-color:#1976d2}.control-button.danger{background-color:#f44336}.control-button.danger:hover{background-color:#d32f2f}.control-button.disabled{cursor:not-allowed;opacity:.6;transform:none}@media (max-width:768px){.controls{align-items:center;flex-direction:column}.control-button{justify-content:center;max-width:300px;width:100%}.camera-placeholder{height:300px}}.history-screen{background-color:#f5f5f5;font-family:Exo\ 2,sans-serif;min-height:100vh;overflow-x:hidden;width:100%}.loading-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding:20px;text-align:center}.loading-container h2{color:#333;margin-bottom:20px}.empty-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:60vh;padding:40px;text-align:center}.empty-icon{font-size:64px;margin-bottom:20px;opacity:.5}.empty-container h3{color:#333;margin-bottom:10px}.empty-container p{color:#666}.records-list{grid-gap:20px;align-items:start;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));justify-items:start;overflow-x:hidden;padding:20px;width:100%}.record-item{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;height:fit-content;padding:20px;transition:transform .2s ease}.record-item:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.record-header{align-items:center;border-bottom:1px solid #eee;display:flex;justify-content:space-between;margin-bottom:15px;padding-bottom:10px}.record-date{color:#333;font-size:16px;font-weight:700}.record-time{color:#666;font-size:14px}.sync-status{font-size:16px}.record-details{display:flex;flex-direction:column;gap:8px}.record-row{align-items:center;display:flex;gap:8px}.record-type{border-radius:4px;font-size:14px;font-weight:600;padding:4px 8px}.record-type.entry{background-color:#4caf501a;color:#4caf50}.record-type.exit{background-color:#ff98001a;color:#ff9800}.record-location{color:#666;font-family:monospace;font-size:12px}.record-punch-code{color:#3b38a0;font-size:12px;font-weight:500}.record-faces{color:#4caf50;font-size:12px;font-weight:500}.record-status{color:#666;font-size:12px;font-style:italic}@media (max-width:768px){.records-list{gap:15px;grid-template-columns:1fr;max-width:100%;padding:15px}.record-header{align-items:flex-start;flex-direction:column;gap:5px}.record-item{padding:15px}}@media (min-width:320px) and (max-width:480px){.records-list{gap:18px;grid-template-columns:repeat(2,1fr)}}@media (min-width:480px) and (max-width:768px){.records-list{gap:18px;grid-template-columns:repeat(3,1fr)}}@media (min-width:769px) and (max-width:1024px){.records-list{gap:18px;grid-template-columns:repeat(3,1fr)}}@media (min-width:1025px){.records-list{gap:20px;grid-template-columns:repeat(4,1fr)}}.settings-screen{background-color:#f5f5f5;min-height:100vh}.settings-card{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;margin-bottom:20px;padding:25px}.settings-card h2{border-bottom:2px solid #2196f3;color:#333;font-size:20px;margin-bottom:15px;padding-bottom:10px}.settings-description{color:#666;line-height:1.5;margin-bottom:20px}.form-group{margin-bottom:20px}.form-label{color:#333;display:block;font-size:14px;font-weight:600;margin-bottom:8px}.form-input{border:2px solid #ddd;border-radius:8px;font-size:16px;padding:12px;transition:border-color .3s ease;width:100%}.form-input:focus{border-color:#2196f3;box-shadow:0 0 0 3px #2196f333;outline:none}.location-actions{display:flex;flex-wrap:wrap;gap:15px;margin-top:20px}.location-actions .btn{flex:1 1;min-width:150px}.location-info p{font-family:monospace;font-size:14px;margin:8px 0}.location-info strong{color:#333}.system-info{background:#f8f9fa;border-radius:8px;margin-top:15px;padding:15px}.system-info p{font-size:14px;margin:8px 0}.system-info strong{color:#333}@media (max-width:768px){.location-actions{flex-direction:column}.location-actions .btn{width:100%}.settings-card{padding:20px}}.App{background-color:#f5f5f5;font-family:Exo\ 2,sans-serif;min-height:100vh;text-align:center}.header{background-color:#1a2a80;color:#fff;justify-content:space-between;padding:20px}.header,.header-title{align-items:center;display:flex}.header-title{gap:12px}.logo{align-items:center;display:flex}.logo img{filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));height:40px;object-fit:contain;width:40px}.header h1{font-size:24px;font-weight:700;margin:0}.nav-buttons{display:flex;gap:10px}.nav-button{align-items:center;background:#b2b0e8;border:2px solid #b2b0e8;border-radius:5px;color:#fff;cursor:pointer;display:flex;font-family:Exo\ 2,sans-serif;font-size:14px;font-weight:600;gap:8px;padding:10px 15px;transition:all .3s ease}.nav-button img{height:20px;object-fit:contain;transition:transform .3s ease;width:20px}.nav-button:hover img{transform:scale(1.1)}.nav-button:hover{background:#9b99d1;border-color:#9b99d1;color:#fff}.nav-button.danger{background:#b2b0e8;border:2px solid #b2b0e8;color:#fff}.nav-button.danger:hover{background:#9b99d1;border-color:#9b99d1;color:#fff}.main-content{align-items:flex-start;display:flex;gap:30px;margin:0 auto;max-width:1200px;padding:20px}.left-panel,.right-panel{flex:1 1;max-width:500px}.right-panel{display:flex;flex-direction:column;gap:20px}.status-card{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;margin-bottom:20px;padding:20px}.status-indicator{border-radius:50%;display:inline-block;height:12px;margin-right:8px;width:12px}.status-indicator.online{background-color:#4caf50}.status-indicator.offline{background-color:#f44336}.status-indicator.warning{background-color:#ff9800}.camera-container{border-radius:10px;box-shadow:0 4px 12px #00000026;margin:0 auto;max-width:600px;overflow:hidden;position:relative;width:100%}@media (max-width:768px){.camera-container{margin:0;max-width:100%;width:100%}.camera-placeholder{height:300px}}.camera-placeholder{background:linear-gradient(135deg,#667eea,#0e83e1);font-size:18px;height:400px;position:relative;width:100%}.camera-overlay,.camera-placeholder{align-items:center;color:#fff;display:flex;justify-content:center}.camera-overlay{background:#0000004d;bottom:0;font-size:16px;left:0;position:absolute;right:0;top:0}.controls{display:flex;flex-wrap:wrap;gap:15px;justify-content:center;margin-top:20px}.control-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:Exo\ 2,sans-serif;font-size:16px;font-weight:500;gap:8px;padding:12px 24px;transition:all .3s ease}.control-button.primary{background-color:#4caf50;color:#fff}.control-button.primary:hover{background-color:#388e3c;transform:translateY(-2px)}.control-button.verify{background-color:#1a2a80;color:#fff}.control-button.verify:hover{background-color:#3b38a0;transform:translateY(-2px)}.control-button.secondary{background-color:#b2b0e8;color:#fff}.control-button.secondary:hover{background-color:#9b99d1;transform:translateY(-2px)}.control-button.start-camera{background-color:#065084;color:#fff;font-weight:600}.control-button.start-camera:hover{background-color:#0a78c7;transform:translateY(-2px)}.control-button.danger{background-color:#b2b0e8;color:#fff}.control-button.danger:hover{background-color:#9b99d1;transform:translateY(-2px)}.punch-code-input{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;margin:20px 0;padding:20px}.punch-code-input input{border:2px solid #ddd;border-radius:8px;font-family:Exo\ 2,sans-serif;font-size:16px;font-weight:700;padding:12px;text-align:center;width:100%}.punch-code-input input:focus{border-color:#2196f3;box-shadow:0 0 0 3px #2196f333;outline:none}.location-info{color:#000;font-family:monospace;font-size:15px}@media (max-width:768px){.header{flex-direction:column;gap:15px}.nav-buttons{justify-content:center;width:100%}.main-content{flex-direction:column;gap:20px;padding:10px}.camera-container,.left-panel,.right-panel{max-width:100%;width:100%}.camera-container{margin:0}.camera-placeholder{height:300px}.controls{align-items:center;flex-direction:column}.control-button{justify-content:center;max-width:300px;width:100%}}
/*# sourceMappingURL=main.24a7d975.css.map*/