:root{--bg-primary:#0a0a1a;--bg-secondary:#12122a;--bg-card:#141432b3;--bg-glass:#ffffff0a;--border-glass:#ffffff14;--text-primary:#e8e8f0;--text-secondary:#88a;--text-muted:#557;--accent-pulse:#ff4d6a;--accent-pulse-glow:#ff4d6a4d;--accent-posture:#4dff91;--accent-posture-glow:#4dff914d;--accent-blink:#4dc3ff;--accent-blink-glow:#4dc3ff4d;--accent-time:#ffd34d;--accent-time-glow:#ffd34d4d;--accent-warn:#ff6b35;--gradient-hero:linear-gradient(135deg, #0a0a1a 0%, #1a1040 50%, #0a0a1a 100%);--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", monospace;--shadow-glow:0 0 30px #4dc3ff1a;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.3s cubic-bezier(.4, 0, .2, 1);--transition-spring:.5s cubic-bezier(.34, 1.56, .64, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden}.bg-grid{z-index:0;pointer-events:none;background-image:linear-gradient(#4dc3ff08 1px,#0000 1px),linear-gradient(90deg,#4dc3ff08 1px,#0000 1px);background-size:60px 60px;animation:20s linear infinite gridMove;position:fixed;inset:0}@keyframes gridMove{0%{transform:translate(0)}to{transform:translate(60px,60px)}}.bg-orbs{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.bg-orb{filter:blur(80px);opacity:.15;border-radius:50%;animation:15s ease-in-out infinite orbFloat;position:absolute}.bg-orb--1{background:var(--accent-pulse);width:400px;height:400px;animation-delay:0s;top:-100px;right:-100px}.bg-orb--2{background:var(--accent-blink);width:300px;height:300px;animation-delay:-5s;bottom:-50px;left:-50px}.bg-orb--3{background:var(--accent-posture);width:350px;height:350px;animation-delay:-10s;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes orbFloat{0%,to{transform:translate(0)scale(1)}33%{transform:translate(30px,-30px)scale(1.05)}66%{transform:translate(-20px,20px)scale(.95)}}#app{z-index:1;flex-direction:column;min-height:100vh;display:flex;position:relative}.landing{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:2rem;min-height:100vh;padding:2rem;display:flex}.landing__logo{background:linear-gradient(135deg, var(--accent-pulse), var(--accent-blink));border-radius:var(--radius-lg);width:80px;height:80px;box-shadow:0 0 40px var(--accent-pulse-glow);justify-content:center;align-items:center;font-size:2.5rem;animation:3s ease-in-out infinite logoPulse;display:flex}@keyframes logoPulse{0%,to{box-shadow:0 0 40px var(--accent-pulse-glow);transform:scale(1)}50%{box-shadow:0 0 60px var(--accent-blink-glow);transform:scale(1.05)}}.landing__title{background:linear-gradient(135deg, var(--text-primary) 0%, var(--accent-blink) 50%, var(--accent-pulse) 100%);-webkit-text-fill-color:transparent;background-clip:text;font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.2}.landing__subtitle{color:var(--text-secondary);max-width:600px;font-size:clamp(1rem,2vw,1.25rem);line-height:1.6}.landing__features{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;width:100%;max-width:800px;margin:1rem 0;display:grid}.feature-chip{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-glass);backdrop-filter:blur(10px);transition:var(--transition-smooth);text-align:left;align-items:center;gap:.75rem;padding:1rem 1.25rem;display:flex}.feature-chip:hover{border-color:#ffffff26;transform:translateY(-2px)}.feature-chip__icon{flex-shrink:0;font-size:1.5rem}.feature-chip__text{color:var(--text-secondary);font-size:.85rem}.feature-chip__text strong{color:var(--text-primary);margin-bottom:2px;font-size:.95rem;display:block}.btn-start{border-radius:var(--radius-xl);background:linear-gradient(135deg, var(--accent-pulse), #c35);color:#fff;font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth);box-shadow:0 4px 20px var(--accent-pulse-glow);border:none;align-items:center;gap:.75rem;padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;display:inline-flex;position:relative;overflow:hidden}.btn-start:hover{box-shadow:0 8px 30px var(--accent-pulse-glow);transform:translateY(-2px)scale(1.02)}.btn-start:active{transform:translateY(0)scale(.98)}.btn-start:after{content:"";background:linear-gradient(135deg,#0000 40%,#fff3 50%,#0000 60%);animation:3s ease-in-out infinite btnShimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes btnShimmer{0%,to{transform:translate(-100%)}50%{transform:translate(100%)}}.landing__privacy{color:var(--text-muted);border-radius:var(--radius-sm);background:var(--bg-glass);border:1px solid var(--border-glass);align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.8rem;display:flex}.dashboard{flex-direction:column;min-height:100vh;display:flex}.dashboard__header{background:var(--bg-glass);border-bottom:1px solid var(--border-glass);backdrop-filter:blur(20px);z-index:100;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;position:sticky;top:0}.dashboard__brand{align-items:center;gap:.75rem;font-size:1.1rem;font-weight:700;display:flex}.dashboard__brand-icon{border-radius:var(--radius-sm);background:linear-gradient(135deg, var(--accent-pulse), var(--accent-blink));justify-content:center;align-items:center;width:36px;height:36px;font-size:1.2rem;display:flex}.dashboard__actions{gap:.75rem;display:flex}.btn-icon{border-radius:var(--radius-sm);background:var(--bg-glass);border:1px solid var(--border-glass);width:40px;height:40px;color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);justify-content:center;align-items:center;font-size:1.1rem;display:flex}.btn-icon:hover{color:var(--text-primary);border-color:#ffffff26}.btn-icon.active{color:var(--accent-blink);border-color:var(--accent-blink);background:#4dc3ff1a}.dashboard__body{flex:1;grid-template-rows:auto 1fr;grid-template-columns:320px 1fr;gap:1.25rem;padding:1.25rem;display:grid}@media (width<=1024px){.dashboard__body{grid-template-columns:1fr}}.camera-panel{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-glass);backdrop-filter:blur(10px);flex-direction:column;grid-row:1/-1;display:flex;overflow:hidden}.camera-panel__header{border-bottom:1px solid var(--border-glass);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.camera-panel__title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);font-size:.85rem;font-weight:600}.camera-panel__status{align-items:center;gap:.4rem;font-size:.75rem;display:flex}.status-dot{border-radius:50%;width:8px;height:8px}.status-dot--active{background:var(--accent-posture);box-shadow:0 0 8px var(--accent-posture-glow);animation:2s ease-in-out infinite statusBlink}.status-dot--inactive{background:var(--text-muted)}@keyframes statusBlink{0%,to{opacity:1}50%{opacity:.5}}.camera-panel__video-wrap{aspect-ratio:4/3;background:#000;justify-content:center;align-items:center;display:flex;position:relative}.camera-panel__video{object-fit:cover;width:100%;height:100%;transform:scaleX(-1)}.camera-panel__canvas{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.camera-panel__placeholder{color:var(--text-muted);text-align:center;flex-direction:column;align-items:center;gap:1rem;padding:2rem;display:flex}.camera-panel__placeholder-icon{opacity:.5;font-size:3rem}.camera-panel__metrics{flex-direction:column;flex:1;gap:.75rem;padding:1rem;display:flex}.metric-mini{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-glass);transition:var(--transition-smooth);align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.metric-mini:hover{border-color:#ffffff1f}.metric-mini__icon{border-radius:var(--radius-sm);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.2rem;display:flex}.metric-mini__icon--pulse{background:#ff4d6a26}.metric-mini__icon--posture{background:#4dff9126}.metric-mini__icon--blink{background:#4dc3ff26}.metric-mini__icon--time{background:#ffd34d26}.metric-mini__info{flex:1}.metric-mini__label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-size:.7rem}.metric-mini__value{font-family:var(--font-mono);font-size:1.25rem;font-weight:600}.metric-mini__value--pulse{color:var(--accent-pulse)}.metric-mini__value--posture{color:var(--accent-posture)}.metric-mini__value--blink{color:var(--accent-blink)}.metric-mini__value--time{color:var(--accent-time)}.metric-mini__unit{color:var(--text-muted);font-size:.7rem;font-family:var(--font-sans)}.metric-mini__trend{border-radius:4px;padding:2px 6px;font-size:.75rem;font-weight:500}.metric-mini__trend--good{color:var(--accent-posture);background:#4dff911a}.metric-mini__trend--warn{color:var(--accent-warn);background:#ff6b351a}.metric-mini__trend--neutral{color:var(--text-muted);background:var(--bg-glass)}.card{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-glass);backdrop-filter:blur(10px);overflow:hidden}.card__header{border-bottom:1px solid var(--border-glass);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.card__title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);font-size:.85rem;font-weight:600}.card__body{padding:1.25rem}.vitals-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;display:grid}.vital-card{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-glass);transition:var(--transition-smooth);padding:1.5rem;position:relative;overflow:hidden}.vital-card:hover{border-color:#ffffff1f;transform:translateY(-2px)}.vital-card__glow{filter:blur(60px);opacity:.1;pointer-events:none;border-radius:50%;width:100%;height:100%;position:absolute;top:-50%;right:-50%}.vital-card__header{z-index:1;justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex;position:relative}.vital-card__icon{font-size:1.5rem}.vital-card__badge{text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:3px 8px;font-size:.65rem;font-weight:600}.vital-card__badge--good{color:var(--accent-posture);background:#4dff911a;border:1px solid #4dff9133}.vital-card__badge--warn{color:var(--accent-warn);background:#ff6b351a;border:1px solid #ff6b3533}.vital-card__badge--neutral{color:var(--text-muted);background:var(--bg-glass);border:1px solid var(--border-glass)}.vital-card__value{font-family:var(--font-mono);z-index:1;margin-bottom:.25rem;font-size:2.5rem;font-weight:700;line-height:1;position:relative}.vital-card__unit{color:var(--text-muted);z-index:1;font-size:.85rem;position:relative}.vital-card__label{color:var(--text-muted);z-index:1;margin-top:.75rem;font-size:.75rem;position:relative}.signal-chart{width:100%;height:200px;position:relative}.signal-chart canvas{width:100%;height:100%}.timeline{flex-direction:column;gap:.5rem;max-height:300px;display:flex;overflow-y:auto}.timeline::-webkit-scrollbar{width:4px}.timeline::-webkit-scrollbar-track{background:0 0}.timeline::-webkit-scrollbar-thumb{background:var(--border-glass);border-radius:2px}.timeline__item{border-radius:var(--radius-sm);background:var(--bg-glass);transition:var(--transition-fast);border:1px solid #0000;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.85rem;display:flex}.timeline__item:hover{border-color:var(--border-glass)}.timeline__item-icon{flex-shrink:0;font-size:1.1rem}.timeline__item-text{color:var(--text-secondary);flex:1}.timeline__item-time{font-family:var(--font-mono);color:var(--text-muted);font-size:.75rem}.nudge-overlay{z-index:1000;width:calc(100% - 2rem);max-width:400px;animation:nudgeSlideIn .5s var(--transition-spring);position:fixed;bottom:2rem;right:2rem}@keyframes nudgeSlideIn{0%{opacity:0;transform:translate(120%)}to{opacity:1;transform:translate(0)}}.nudge{border-radius:var(--radius-md);backdrop-filter:blur(20px);background:linear-gradient(135deg,#ff6b3526,#ff4d6a26);border:1px solid #ff6b354d;padding:1.25rem 1.5rem;box-shadow:0 8px 32px #0000004d}.nudge__header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.nudge__title{color:var(--accent-warn);align-items:center;gap:.5rem;font-size:.95rem;font-weight:600;display:flex}.nudge__close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:1.2rem;line-height:1}.nudge__close:hover{color:var(--text-primary)}.nudge__body{color:var(--text-secondary);font-size:.85rem;line-height:1.5}.nudge__actions{gap:.5rem;margin-top:1rem;display:flex}.nudge__btn{border-radius:var(--radius-sm);font-family:var(--font-sans);cursor:pointer;transition:var(--transition-fast);border:none;padding:.5rem 1rem;font-size:.8rem;font-weight:500}.nudge__btn--primary{background:var(--accent-warn);color:#000}.nudge__btn--primary:hover{background:#f85}.nudge__btn--secondary{background:var(--bg-glass);color:var(--text-secondary);border:1px solid var(--border-glass)}.nudge__btn--secondary:hover{color:var(--text-primary)}.fade-in{animation:.5s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.pulse-ring{animation:1.5s ease-out infinite pulseRing}@keyframes pulseRing{0%{box-shadow:0 0 0 0 var(--accent-pulse-glow)}70%{box-shadow:0 0 0 10px #ff4d6a00}to{box-shadow:0 0 #ff4d6a00}}.settings-overlay{z-index:200;backdrop-filter:blur(4px);opacity:0;visibility:hidden;background:#00000080;transition:opacity .3s,visibility .3s;position:fixed;inset:0}.settings-overlay.open{opacity:1;visibility:visible}.settings-overlay.open .settings-panel{transform:translate(0)}.settings-panel{background:var(--bg-secondary);border-left:1px solid var(--border-glass);flex-direction:column;width:min(420px,90vw);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:0;bottom:0;right:0;overflow:hidden;transform:translate(100%)}.settings-panel__header{border-bottom:1px solid var(--border-glass);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.settings-panel__title{font-size:1.1rem;font-weight:700}.settings-panel__close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px;font-size:1.4rem;line-height:1}.settings-panel__close:hover{color:var(--text-primary)}.settings-panel__body{scrollbar-width:thin;scrollbar-color:var(--border-glass) transparent;flex:1;padding:1rem 1.5rem;overflow-y:auto}.settings-section{margin-bottom:1.5rem}.settings-section__title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);border-bottom:1px solid var(--border-glass);margin-bottom:.75rem;padding-bottom:.5rem;font-size:.85rem;font-weight:600}.settings-group{flex-direction:column;gap:.75rem;display:flex}.setting-row{grid-template-columns:1fr auto;align-items:center;gap:.25rem .75rem;padding:.5rem 0;display:grid}.setting-row__label{color:var(--text-primary);grid-column:1;font-size:.85rem}.setting-row__value{font-family:var(--font-mono);color:var(--accent-blink);text-align:right;grid-column:2;min-width:40px;font-size:.8rem}.setting-row__hint{color:var(--text-muted);grid-column:1/-1;margin-top:-2px;font-size:.7rem}.setting-slider{appearance:none;background:var(--bg-glass);border:1px solid var(--border-glass);cursor:pointer;border-radius:3px;outline:none;grid-column:1/-1;width:100%;height:6px}.setting-slider::-webkit-slider-thumb{appearance:none;background:var(--accent-blink);border:2px solid var(--bg-secondary);cursor:pointer;width:18px;height:18px;box-shadow:0 0 8px var(--accent-blink-glow);border-radius:50%}.setting-slider::-moz-range-thumb{background:var(--accent-blink);border:2px solid var(--bg-secondary);cursor:pointer;border-radius:50%;width:18px;height:18px}.setting-row--toggle{grid-template-columns:1fr auto}.setting-toggle{appearance:none;background:var(--bg-glass);border:1px solid var(--border-glass);cursor:pointer;width:44px;height:24px;transition:var(--transition-fast);border-radius:12px;position:relative}.setting-toggle:before{content:"";background:var(--text-muted);width:18px;height:18px;transition:var(--transition-fast);border-radius:50%;position:absolute;top:2px;left:2px}.setting-toggle:checked{border-color:var(--accent-blink);background:#4dc3ff33}.setting-toggle:checked:before{background:var(--accent-blink);transform:translate(20px)}.setting-select{border-radius:var(--radius-sm);background:var(--bg-glass);border:1px solid var(--border-glass);width:100%;color:var(--text-primary);font-family:var(--font-sans);cursor:pointer;outline:none;grid-column:1/-1;padding:.5rem .75rem;font-size:.85rem}.setting-select:focus{border-color:var(--accent-blink)}.setting-select option{background:var(--bg-secondary)}.settings-actions{border-top:1px solid var(--border-glass);margin-top:.5rem;padding:1rem 0}.settings-btn{border-radius:var(--radius-sm);font-family:var(--font-sans);cursor:pointer;transition:var(--transition-fast);border:none;width:100%;padding:.6rem 1.25rem;font-size:.85rem;font-weight:500}.settings-btn--reset{color:var(--accent-warn);background:#ff6b351a;border:1px solid #ff6b3533}.settings-btn--reset:hover{background:#ff6b3533}.debug-bar{font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-glass);border-top:1px solid var(--border-glass);flex-wrap:wrap;gap:1rem;padding:.5rem 1rem;font-size:.7rem;display:flex}.debug-bar__item{gap:.25rem;display:flex}.debug-bar__label{color:var(--text-muted)}.debug-bar__value{color:var(--accent-blink)}@media (width<=768px){.dashboard__body{gap:.75rem;padding:.75rem}.vitals-grid{grid-template-columns:1fr 1fr}.camera-panel{grid-row:auto}.landing__features{grid-template-columns:1fr}}@media (width<=480px){.vitals-grid{grid-template-columns:1fr}.nudge-overlay{max-width:calc(100% - 1rem);bottom:.5rem;right:.5rem}.settings-panel{width:100vw}}