body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.black-bg{background-color:#000;height:100vh;width:100vw}.face-recognition-container{background-color:#000;bottom:0;display:flex;flex-direction:column;left:0;margin:0;padding:0;position:fixed;right:0;top:0}.webcam-container{align-items:center;background:#000;bottom:0;display:flex;justify-content:center;left:0;overflow:hidden;position:absolute;right:0;top:0}.webcam-container video{height:100vh;object-fit:cover;width:100vw}.recognition-overlay{background-color:#000000b3;border-radius:5px;bottom:20px;color:#fff;font-size:1.2em;left:20px;padding:10px;position:absolute}.controls{bottom:80px;left:50%;position:fixed;transform:translateX(-50%);z-index:20}.add-face-form{display:flex;gap:10px;margin-top:10px}.error-message{color:red;margin:10px 0}button{background-color:#007bff;border:none;border-radius:5px;color:#fff;cursor:pointer;padding:10px 20px}button:hover{background-color:#0056b3}input{border:1px solid #ccc;border-radius:5px;padding:8px}.camera-selector{position:fixed;right:20px;top:20px;z-index:20}.camera-select{-webkit-appearance:none;appearance:none;background-color:#fff;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007bff%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:12px;border:2px solid #007bff;border-radius:5px;color:#333;cursor:pointer;font-size:16px;min-width:200px;padding:8px 12px;transition:all .2s ease}.camera-select:hover{border-color:#0056b3}.camera-select:focus{border-color:#0056b3;box-shadow:0 0 0 2px #007bff40;outline:none}.camera-access-container{margin:2rem auto;max-width:500px;padding:2rem;text-align:center}.camera-access-container h2{color:#000;margin-bottom:1rem}.camera-access-container p{color:#666;line-height:1.5;margin-bottom:1.5rem}.camera-access-button{font-size:1.1rem;padding:12px 24px;transition:background-color .2s}.initialization-message{color:#666;font-size:1.2rem;margin:2rem;text-align:center}.face-box,.face-boxes-container,.face-label{display:none}.status-message-container{bottom:20px;gap:10px;left:0;position:absolute;right:0}.speak-button,.status-message-container{align-items:center;display:flex;justify-content:center}.speak-button{background:#000000b3;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:20px;height:40px;transition:all .2s ease;width:40px}.speak-button:hover{background:#000000e6}.speak-button:disabled{cursor:not-allowed;opacity:.7}.status-message-overlay{background:#000000b3;border-radius:20px;color:#fff;font-size:1.2em;padding:10px 20px}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@media (max-width:768px){.webcam-container{height:100vh;width:100vw}.camera-selector{right:10px;top:10px}.status-message-overlay{bottom:10px;max-width:400px;width:90%}}@supports (-webkit-touch-callout:none){.webcam-container{aspect-ratio:4/3;height:auto;max-width:640px;width:100%}.webcam-container video{height:100%;object-fit:cover;width:100%}}.App{height:100vh;left:0;overflow:hidden;position:fixed;top:0;width:100vw}.App main{height:100%;margin:0;padding:0;width:100%}.App h1{display:none}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/*# sourceMappingURL=main.80069ab1.css.map*/