:root{--bg-color: #F9F9F7;--text-primary: #1A1A1A;--text-secondary: #595959;--accent-color: #8DA399;--accent-dark: #2F3E35;--error-color: #D32F2F;--font-family: "Inter", system-ui, -apple-system, sans-serif;--radius-lg: 16px;--radius-md: 12px;--radius-sm: 8px;--transition-slow: .4s ease-out;--transition-normal: .2s ease-out}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100vw;height:100vh;overflow:hidden}button{font-family:inherit;border:none;cursor:pointer;background:none}h1,h2,h3{font-weight:500;letter-spacing:-.02em}input,textarea{font-family:inherit}.camera-container{position:relative;width:100%;height:100vh;background:#000;overflow:hidden}.camera-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.camera-overlay>*{pointer-events:auto}.camera-error{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#ff6b6b;font-size:1.2rem;text-align:center;padding:2rem}.camera-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1rem;color:#fff}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top-color:#00d4ff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hud-container{position:absolute;pointer-events:none;z-index:100;display:flex;flex-direction:column;gap:.5rem;min-width:250px;max-width:25vw;width:auto;background-color:#f9f9f7f5;padding:1.5rem 2rem;border-radius:var(--radius-lg);box-shadow:0 4px 20px #0000000f;-webkit-backdrop-filter:none;backdrop-filter:none;align-items:flex-start;text-align:left}.hud-name{font-size:3rem;font-weight:500;color:var(--text-primary);line-height:1.1;text-shadow:0 1px 2px rgba(255,255,255,.8);margin-bottom:.25rem}.hud-relation{font-size:1.5rem;font-weight:500;color:#fff;background:#8da399;padding:.5rem 1rem;border-radius:999px;display:inline-block}.hud-routine{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;font-size:1.4rem;font-weight:400;color:#666;line-height:1.5;margin-top:.75rem;margin-bottom:0;max-width:100%}.hud-cue{font-size:1.25rem;font-weight:400;color:var(--accent-dark);background:#ffffffe6;padding:1rem 1.25rem;border-radius:var(--radius-md);margin-top:.5rem;box-shadow:0 4px 12px #0000000d;max-width:80%;line-height:1.4}.fade-in{animation:fadeIn .4s ease-out forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.language-selector{position:relative;display:inline-block}.language-dropdown{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:8px 32px 8px 12px;font-size:14px;font-family:Inter,sans-serif;font-weight:500;color:#1a1a1a;cursor:pointer;transition:all .2s ease;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231A1A1A' d='M6 8L2 4h8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.language-dropdown:hover{background:#ffffff26;border-color:#ffffff4d}.language-dropdown:focus{outline:none;border-color:#8da39999;box-shadow:0 0 0 2px #8da39933}.language-dropdown option{background:#1a1a2e;color:#fff;padding:8px}.language-selector.dark .language-dropdown{background:#0000001a;color:#333;border-color:#00000026;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 8L2 4h8z'/%3E%3C/svg%3E")}.language-selector.dark .language-dropdown:hover{background:#00000026}.language-selector.dark .language-dropdown option{background:#fff;color:#333}.patient-mode{width:100vw;height:100vh;position:relative;background:var(--bg-color);overflow:hidden}.mode-indicator{position:absolute;top:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;border-radius:99px;background:#ffffff80;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:50}.mode-dot{width:6px;height:6px;border-radius:50%;background:#ccc;transition:all .3s ease}.mode-dot.capturing,.mode-dot.scanning{background:var(--accent-color);animation:pulse 1s infinite}.mode-dot.found{background:var(--accent-dark)}.mode-dot.not_found,.mode-dot.idle{background:transparent}@keyframes pulse{0%{transform:scale(.8);opacity:.5}50%{transform:scale(1.2);opacity:1}to{transform:scale(.8);opacity:.5}}.caregiver-link{position:absolute;top:1.5rem;left:1.5rem;font-family:serif;font-weight:700;font-size:1.5rem;color:var(--text-primary);text-decoration:none;opacity:.3;transition:opacity .3s ease;z-index:60}.caregiver-link:hover{opacity:1}.retry-affordance{position:absolute;bottom:8rem;left:50%;transform:translate(-50%);z-index:50;cursor:pointer;padding:1rem 2rem}.retry-tap{font-size:1rem;color:var(--text-secondary);opacity:.6;font-weight:400;letter-spacing:.02em}.caregiver-mode{width:100vw;height:100vh;background-color:#f9f9f7;color:#1a1a1a;display:flex;flex-direction:column;font-family:Inter,system-ui,sans-serif;overflow:hidden}.caregiver-header{background:#f9f9f7fa;border-bottom:1px solid rgba(0,0,0,.05);padding:1rem 1.5rem;z-index:50;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.header-left{display:flex;align-items:center;gap:1rem}.logo-small{font-family:serif;font-weight:700;font-size:1.5rem;color:#1c1917}.back-link{font-size:.875rem;font-weight:500;text-decoration:none;color:#57534e;padding:.5rem 1rem;background:#f5f5f4;border-radius:99px;transition:all .2s}.back-link:hover{background:#e7e5e4;color:#1c1917}.caregiver-main{flex:1;overflow-y:auto;padding:2rem 2rem 6rem;-webkit-overflow-scrolling:touch}.dashboard-container{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:2.5rem}.hero-section{display:flex;flex-direction:column;gap:.5rem}.hero-section h1{font-size:1.875rem;font-weight:700;letter-spacing:-.02em;color:#1a1a1a;margin:0}.hero-header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.system-status{display:inline-flex;align-items:center;gap:.5rem;color:#8da399;font-weight:500;font-size:.95rem;background:#8da3991a;padding:.25rem .75rem;border-radius:99px;align-self:flex-start}.status-dot{width:8px;height:8px;background:#8da399;border-radius:50%;animation:pulse 2s infinite}.settings-row{background:#fff;border-radius:12px;padding:1rem 1.5rem;box-shadow:0 2px 8px #0000000a;border:1px solid rgba(0,0,0,.04);display:flex;gap:2rem;flex-wrap:wrap}.setting-item{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex:1;min-width:200px}.setting-info{display:flex;flex-direction:column;gap:.25rem}.setting-label{font-weight:600;color:#1a1a1a}.setting-desc{font-size:.875rem;color:#666}.toggle-switch{width:52px;height:28px;background:#e0e0e0;border-radius:99px;border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}.toggle-switch.active{background:#8da399}.toggle-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003;transition:transform .2s}.toggle-switch.active .toggle-knob{transform:translate(24px)}.actions-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.add-person-card{background:#fff;border:2px dashed #C0C0C0;border-radius:1rem;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;cursor:pointer;transition:all .2s ease;min-height:200px}.add-person-card:hover{border-color:#8da399;background:#fff}.icon-circle{width:48px;height:48px;background:#f9f9f7;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#8da399}.add-label{font-weight:600;color:#44403c}.people-section h2{font-size:1.25rem;font-weight:600;color:#57534e;margin-bottom:1rem}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.bento-card{background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;display:flex;flex-direction:column;position:relative;transition:transform .2s,box-shadow .2s;border:1px solid rgba(0,0,0,.04)}.bento-card:hover{transform:translateY(-4px);box-shadow:0 10px 15px -3px #0000000d,0 4px 6px -2px #00000006}.card-image-container{aspect-ratio:4/3;width:100%;background:#eee;position:relative;overflow:hidden}.card-image-container img{width:100%;height:100%;object-fit:cover;display:block}.card-content{padding:1.25rem;flex:1;display:flex;flex-direction:column;gap:.5rem}.card-header{display:flex;justify-content:space-between;align-items:flex-start}.card-name{font-family:Inter,sans-serif;font-size:1.25rem;font-weight:700;color:#1c1917;line-height:1.2}.card-relation{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#57534e;background:#f5f5f4;padding:.25rem .5rem;border-radius:6px;align-self:flex-start}.card-note{font-size:.875rem;color:#78716c;line-height:1.5;margin-top:auto;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.btn-delete-icon{position:absolute;top:.75rem;right:.75rem;width:32px;height:32px;background:#fff;box-shadow:0 2px 8px #00000026;border-radius:50%;color:#c00;opacity:1;z-index:10;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:all .2s}.bento-card:hover .btn-delete-icon{opacity:1;transform:scale(1)}.btn-delete-icon:hover{background:#fff0f0;color:#c00;transform:scale(1.1)}.btn-edit-icon{position:absolute;top:.75rem;right:3.25rem;width:32px;height:32px;background:#fff;box-shadow:0 2px 8px #00000026;border-radius:50%;color:#8da399;z-index:10;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:all .2s}.btn-edit-icon:hover{background:#f0fff4;color:#6b8a7a;transform:scale(1.1)}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100;padding:1rem}.edit-modal{background:#fff;border-radius:1rem;padding:2rem;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #0003}.edit-modal h2{font-size:1.5rem;margin-bottom:1.5rem;color:#1a1a1a}.edit-modal .current-photo{width:120px;height:120px;border-radius:12px;overflow:hidden;margin-bottom:1rem}.edit-modal .current-photo img{width:100%;height:100%;object-fit:cover}.edit-modal .photo-section{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.edit-modal .photo-buttons{display:flex;gap:1rem}.edit-modal .photo-buttons .btn-photo{flex:1;padding:.75rem 1.5rem;background:#8da399;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:all .2s;text-align:center}.edit-modal .photo-buttons .btn-photo:hover{background:#6b8a7a;transform:translateY(-1px)}.edit-modal .webcam-section{display:flex;flex-direction:column;gap:1rem}.edit-modal .webcam-section video{width:100%;max-width:640px;border-radius:12px;background:#000}.edit-modal .webcam-controls{display:flex;gap:1rem}.edit-modal .webcam-controls button{flex:1;padding:.75rem;border-radius:8px;border:none;font-size:1rem;cursor:pointer;transition:all .2s}.edit-modal .btn-capture{background:#8da399;color:#fff}.edit-modal .btn-capture:hover{background:#6b8a7a}.webcam-controls{display:flex;gap:1rem;margin-top:1rem}.webcam-controls button{flex:1;padding:.75rem 1.5rem;border-radius:8px;border:none;font-size:1rem;cursor:pointer;transition:all .2s;font-weight:500}.btn-capture{background:#8da399;color:#fff}.btn-capture:hover{background:#6b8a7a;transform:translateY(-1px)}.btn-cancel{background:#e8e8e8;color:#333}.btn-cancel:hover{background:#d0d0d0}.enroll-form{background:#fff;padding:2rem;border-radius:1rem;border:1px solid rgba(0,0,0,.05);box-shadow:0 4px 20px #00000014;margin-bottom:2rem;animation:slideUp .3s ease-out}.enroll-form h2{font-size:1.5rem;margin-bottom:1.5rem;color:#1a1a1a}.form-row{margin-bottom:1.5rem;display:flex;gap:1rem}.form-row input,.form-row select,.form-row textarea{width:100%;padding:1rem;border:1px solid #E0E0E0;border-radius:8px;font-size:1rem;background:#fcfcfc;transition:all .2s;font-family:inherit}.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:#8da399;background:#fff;outline:none;box-shadow:0 0 0 3px #8da3991a}.form-actions{display:flex;gap:1rem;margin-top:2rem}.btn-confirm{flex:2;background:#1a1a1a;color:#fff;padding:1rem;border-radius:8px;font-weight:600;border:none;cursor:pointer;transition:opacity .2s}.btn-confirm:hover{opacity:.9}.btn-cancel{flex:1;background:transparent;border:1px solid #E0E0E0;color:#555;padding:1rem;border-radius:8px;font-weight:600;cursor:pointer}.photo-options{display:flex;gap:1rem;margin-bottom:1.5rem}.btn-photo{flex:1;padding:1.5rem;background:#f5f5f0;border:1px dashed #AAA;border-radius:8px;text-align:center;cursor:pointer;font-weight:500;color:#555}@media(max-width:640px){.caregiver-main{padding:1rem}.people-grid{grid-template-columns:1fr}.btn-delete-icon{opacity:1;background:#fff}.card-image-container{aspect-ratio:16/9}}#root{width:100%;height:100%}.app-container{width:100%;height:100%;display:flex;flex-direction:column;position:relative}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
