@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root,[data-theme=light]{--primary: hsl(230, 75%, 55%);--primary-hover: hsl(230, 70%, 45%);--secondary: hsl(150, 65%, 45%);--secondary-hover: hsl(150, 70%, 35%);--accent: hsl(340, 75%, 55%);--bg-gradient-start: hsl(220, 20%, 98%);--bg-gradient-end: hsl(220, 30%, 93%);--surface: hsl(220, 30%, 100%);--text-main: hsl(220, 30%, 15%);--text-muted: hsl(220, 15%, 45%);--glass-bg: hsla(0, 0%, 100%, .7);--glass-border: hsla(220, 20%, 50%, .15);--glass-shadow: 0 12px 32px hsla(220, 20%, 20%, .1), inset 0 1px 0 hsla(0, 0%, 100%, .8);--input-bg: hsla(0, 0%, 100%, .8);--input-shadow: inset 0 2px 4px hsla(220, 20%, 50%, .05);--input-focus-bg: hsla(0, 0%, 100%, .95);--btn-sec-hover: hsla(0, 0%, 100%, .9);--btn-sec-border: hsla(220, 20%, 50%, .25);--th-bg: hsla(220, 20%, 95%, .8);--tr-hover: hsla(220, 20%, 98%, .8)}[data-theme=dark]{--primary: hsl(230, 80%, 65%);--primary-hover: hsl(230, 80%, 75%);--secondary: hsl(150, 60%, 55%);--secondary-hover: hsl(150, 60%, 65%);--accent: hsl(340, 75%, 65%);--bg-gradient-start: hsl(220, 20%, 8%);--bg-gradient-end: hsl(220, 30%, 12%);--surface: hsl(220, 25%, 15%);--text-main: hsl(220, 20%, 95%);--text-muted: hsl(220, 15%, 75%);--glass-bg: hsla(220, 25%, 20%, .4);--glass-border: hsla(220, 20%, 100%, .08);--glass-shadow: 0 16px 32px hsla(0, 0%, 0%, .4), inset 0 1px 1px hsla(0, 0%, 100%, .05);--input-bg: hsla(220, 25%, 10%, .5);--input-shadow: inset 0 2px 4px hsla(0, 0%, 0%, .1);--input-focus-bg: hsla(220, 25%, 15%, .7);--btn-sec-hover: hsla(220, 25%, 30%, .6);--btn-sec-border: hsla(220, 20%, 100%, .15);--th-bg: hsla(220, 25%, 15%, .4);--tr-hover: hsla(220, 25%, 25%, .2)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:linear-gradient(135deg,var(--bg-gradient-start),var(--bg-gradient-end));color:var(--text-main);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;-webkit-font-smoothing:antialiased}#root{display:flex;flex-direction:column;flex:1}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow);padding:2rem}h1,h2,h3,h4{font-weight:700;letter-spacing:-.025em;margin-bottom:1rem}.text-gradient{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.input-group{margin-bottom:1.5rem;display:flex;flex-direction:column}.input-label{font-size:.875rem;font-weight:500;color:var(--text-muted);margin-bottom:.5rem}.input-field{width:100%;padding:.75rem 1.25rem;background:var(--input-bg);border:1px solid var(--glass-border);border-radius:10px;color:var(--text-main);font-size:.95rem;transition:all .3s cubic-bezier(.4,0,.2,1);outline:none;box-shadow:var(--input-shadow)}.input-field:focus{background:var(--input-focus-bg);border-color:var(--primary);box-shadow:0 0 0 4px #5e76ed26,inset 0 2px 4px #6677990d}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1.25rem;font-weight:500;border-radius:8px;border:1px solid transparent;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);font-size:.95rem;gap:.5rem;letter-spacing:.3px;color:var(--text-main)}.btn-primary{background:var(--primary);color:#f5f7ff;box-shadow:0 4px 12px #5e76ed40,inset 0 1px 1px #fff3}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 16px #5e76ed59,inset 0 1px 1px #ffffff4d}.btn-primary:active{transform:translateY(0);box-shadow:0 2px 4px #5e76ed33}.btn-secondary{background:var(--glass-bg);color:var(--text-main);border:1px solid var(--glass-border);box-shadow:0 2px 4px #29303d0d}.btn-secondary:hover{background:var(--btn-sec-hover);border-color:var(--btn-sec-border);transform:translateY(-2px);box-shadow:0 4px 12px #29303d1a}.btn-secondary:active{transform:translateY(0)}.container{max-width:1200px;margin:0 auto;padding:2rem;width:100%;flex:1;display:flex;flex-direction:column}.flex-center{display:flex;align-items:center;justify-content:center}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--glass-border)}.nav-brand{font-size:1.5rem;font-weight:700;display:flex;align-items:center;gap:.5rem;color:var(--text-main);text-decoration:none}.stat-card{padding:1.5rem;display:flex;flex-direction:column;gap:.5rem;transition:transform .3s ease}.stat-card:hover{transform:translateY(-5px)}@keyframes spin{to{transform:rotate(360deg)}}.loader{border:3px solid rgba(255,255,255,.1);border-radius:50%;border-top-color:var(--primary);width:24px;height:24px;animation:spin 1s ease-in-out infinite}.webcam-container{position:relative;width:100%;max-width:640px;margin:0 auto;border-radius:16px;overflow:hidden;border:2px solid var(--glass-border);box-shadow:var(--glass-shadow)}.webcam-overlay{position:absolute;inset:0;border:4px solid var(--primary);border-radius:16px;opacity:.5;pointer-events:none;animation:pulse 2s infinite}@keyframes pulse{0%{opacity:.3}50%{opacity:.6}to{opacity:.3}}.alert{padding:1rem;border-radius:8px;margin-bottom:1rem;display:flex;align-items:center;gap:.75rem}.alert-success{background:#10b9811a;border:1px solid var(--secondary);color:var(--secondary)}.alert-error{background:#e9638f1a;border:1px solid var(--accent);color:var(--accent)}table{width:100%;border-collapse:separate;border-spacing:0}th{background:var(--th-bg);color:var(--text-muted);font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em;padding:1rem;border-bottom:2px solid var(--glass-border)}td{padding:1rem;border-bottom:1px solid hsla(220,20%,50%,.1);transition:background .2s ease}tr:hover td{background:var(--tr-hover)}tr:last-child td{border-bottom:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none;transform:none}@media(max-width:768px){.container{padding:1rem}.glass-panel{padding:1.25rem}.navbar{padding:.75rem 1rem;flex-wrap:wrap;gap:.5rem}.nav-brand{font-size:1.2rem}.grid-2{grid-template-columns:1fr;gap:1rem}h1{font-size:1.5rem}h2{font-size:1.25rem}}@media(max-width:480px){.container{padding:.75rem}.glass-panel{padding:1rem;border-radius:12px}.btn{font-size:.85rem;padding:.5rem 1rem}.input-field{padding:.6rem 1rem;font-size:.9rem}th,td{padding:.5rem;font-size:.8rem}}
