body{margin:0}*{box-sizing:border-box;margin:0;padding:0}body{color:#e2e8f0;background:#0f172a;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.home{text-align:center;max-width:640px;margin:0 auto;padding:48px 20px}.home h1{margin-bottom:8px;font-size:2rem}.home p{color:#94a3b8;margin-bottom:32px}.home-nav{grid-template-columns:1fr 1fr;gap:16px;display:grid}.nav-card{color:inherit;background:#1e293b;border:1px solid #334155;border-radius:12px;flex-direction:column;align-items:center;gap:6px;padding:24px 16px;text-decoration:none;transition:border-color .2s;display:flex}.nav-card:hover{border-color:#3b82f6}.nav-icon{font-size:2rem}.nav-card span:not(.nav-icon){font-weight:600}.nav-card small{color:#64748b;font-size:.75rem}.page{max-width:640px;margin:0 auto;padding:32px 16px}.page h1{margin-bottom:20px;font-size:1.4rem}.camera-container{background:#000;border-radius:12px;margin:16px 0;position:relative;overflow:hidden}.camera-video{width:100%;display:block}.camera-error{color:#f87171;text-align:center;padding:16px}.camera-loading{text-align:center;color:#64748b;padding:48px 16px}.capture-btn{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:999px;padding:12px 28px;font-size:1rem;transition:opacity .2s;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.capture-btn.hidden{display:none}.capture-btn:disabled{opacity:.5;cursor:not-allowed}.result-overlay{z-index:100;background:#000000bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.result-card{text-align:center;background:#1e293b;border-radius:16px;min-width:280px;padding:32px}.result-card h2{margin-bottom:12px;font-size:1.5rem}.result-name{font-size:1.3rem;font-weight:700}.result-dept{color:#94a3b8;font-size:.9rem}.result-time{margin:8px 0;font-size:1.1rem}.result-confidence{color:#64748b;font-size:.85rem}.result-card button{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;margin-top:16px;padding:10px 32px;font-size:1rem}.enroll-form{flex-direction:column;gap:10px;margin-bottom:16px;display:flex}.enroll-form input,.report-filters input{color:#e2e8f0;background:#1e293b;border:1px solid #334155;border-radius:8px;padding:10px 14px;font-size:.95rem}.enroll-form input::placeholder{color:#64748b}.preview-section{text-align:center;margin:16px 0}.preview-img{object-fit:cover;border:2px solid #334155;border-radius:8px;width:200px;height:200px;margin-bottom:12px}.btn-primary{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;padding:12px 32px;font-size:1rem}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-link{color:#64748b;cursor:pointer;background:0 0;border:none;margin-top:16px;font-size:.9rem;display:block}.mode-toggle{gap:8px;margin-bottom:16px;display:flex}.btn-toggle{color:#94a3b8;cursor:pointer;background:#1e293b;border:2px solid #334155;border-radius:8px;flex:1;padding:12px;font-size:1rem;transition:all .2s}.btn-toggle.active{color:#3b82f6;background:#1e293b;border-color:#3b82f6}.status-msg{text-align:center;border-radius:8px;margin:12px 0;padding:12px 16px}.status-msg.success{color:#6ee7b7;background:#065f46}.status-msg.error{color:#fca5a5;background:#7f1d1d}.status-msg.error button{color:#fca5a5;cursor:pointer;background:0 0;border:1px solid #fca5a5;border-radius:4px;margin-left:12px;padding:4px 12px}.report-filters{flex-wrap:wrap;gap:10px;margin-bottom:16px;display:flex}.report-filters button{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;padding:10px 20px}.report-table{border-collapse:collapse;width:100%}.report-table th,.report-table td{text-align:left;border-bottom:1px solid #1e293b;padding:10px 8px;font-size:.9rem}.report-table th{color:#64748b;font-weight:600}.report-table td{color:#cbd5e1}
