:root{--primary: #1152d4;--primary-light: #3b7dff;--primary-10: rgba(17, 82, 212, .1);--primary-20: rgba(17, 82, 212, .2);--primary-05: rgba(17, 82, 212, .05);--sage: #6b9b7d;--sage-hover: #5a8a6c;--sage-shadow: rgba(107, 155, 125, .25);--bg-light: #f4f5f8;--bg-card: #ffffff;--bg-card-hover: #fafbfc;--clinical-navy: #1e293b;--clinical-blue: #4c669a;--text-primary: #0f172a;--text-secondary: #475569;--text-tertiary: #94a3b8;--text-inverse: #ffffff;--border-light: #e8ebf0;--border-medium: #cbd5e1;--emerald-50: #ecfdf5;--emerald-400: #34d399;--emerald-500: #10b981;--emerald-600: #059669;--emerald-700: #047857;--amber-500: #f59e0b;--indigo-500: #6366f1;--blue-100: #dbeafe;--blue-500: #3b82f6;--blue-600: #2563eb;--orange-100: #ffedd5;--orange-500: #f97316;--orange-600: #ea580c;--red-500: #ef4444;--status-green: #07883b;--status-green-10: rgba(7, 136, 59, .1);--font-display: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 18px;--radius-2xl: 24px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .06), 0 1px 4px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .04);--shadow-xl: 0 20px 60px rgba(0, 0, 0, .12);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--duration-fast: .15s;--duration-normal: .25s;--duration-slow: .4s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-display);background:var(--bg-light);color:var(--text-primary);min-height:100dvh;overflow-x:hidden;line-height:1.5}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.app-shell{position:relative;display:flex;flex-direction:column;min-height:100dvh;width:100%;max-width:480px;margin:0 auto;background:var(--bg-light);overflow-x:hidden}@media(min-width:481px){.app-shell{border-left:1px solid var(--border-light);border-right:1px solid var(--border-light);box-shadow:var(--shadow-xl)}}.app-header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-4) var(--space-3);background:#ffffffd1;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.04)}.header-left{display:flex;align-items:center;gap:var(--space-2)}.logo-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--primary-10);color:var(--primary)}.logo-icon .material-symbols-outlined{font-size:24px}.app-title{font-size:18px;font-weight:800;letter-spacing:-.02em;color:var(--text-primary)}.status-badge{display:flex;align-items:center;gap:var(--space-2);padding:6px 12px;border-radius:var(--radius-full);background:var(--emerald-50)}.status-dot{position:relative;width:8px;height:8px}.status-dot-ping{position:absolute;inset:0;border-radius:50%;background:var(--emerald-400);animation:ping 1.5s cubic-bezier(0,0,.2,1) infinite;opacity:.75}.status-dot-core{position:relative;display:block;width:8px;height:8px;border-radius:50%;background:var(--emerald-500)}.status-text{font-size:11px;font-weight:700;color:var(--emerald-700);letter-spacing:.02em}@keyframes ping{75%,to{transform:scale(2.5);opacity:0}}.app-main{flex:1;padding-bottom:90px}.section{padding:var(--space-3) var(--space-4)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.section-title{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--text-primary)}.camera-section{padding:var(--space-4)}.camera-viewport{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--clinical-navy);aspect-ratio:16 / 9;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg),inset 0 0 40px #0000004d}.camera-viewport video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera-viewport canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:scaleX(-1)}.db-overlay{position:absolute;top:12px;right:12px;display:flex;align-items:flex-end;gap:2px;padding:6px 8px;height:36px;background:#00000073;backdrop-filter:blur(12px);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.12);z-index:10}.db-bar{width:3px;background:var(--emerald-400);border-radius:2px;transition:height var(--duration-fast) var(--ease-out)}.db-value{font-size:9px;font-family:Courier New,monospace;color:#fff;margin-left:4px;white-space:nowrap}.face-mesh-overlay{position:absolute;inset:0;border:2px solid var(--primary-20);border-radius:var(--radius-xl);pointer-events:none;display:flex;align-items:center;justify-content:center;opacity:.5;transition:opacity var(--duration-normal)}.face-mesh-overlay.active{opacity:0}.face-mesh-svg{width:100%;height:100%;color:var(--primary);opacity:.35}.camera-toggle{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:#ffffff1f;backdrop-filter:blur(8px);color:#fff;transition:all var(--duration-normal) var(--ease-out)}.camera-toggle:hover{background:#ffffff38;transform:scale(1.05)}.camera-toggle.attention{animation:cameraAttention .5s ease-in-out 3}@keyframes cameraAttention{0%,to{transform:scale(1);box-shadow:0 0 #f59e0b99}50%{transform:scale(1.15);box-shadow:0 0 0 12px #f59e0b00}}.camera-toggle:active{transform:scale(.95)}.camera-toggle .material-symbols-outlined{font-size:28px;font-variation-settings:"FILL" 1}.camera-badges{position:absolute;bottom:12px;left:12px;display:flex;gap:6px;z-index:10}.badge{padding:2px 8px;border-radius:var(--radius-sm);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.badge--live{background:var(--red-500);color:#fff;animation:livePulse 2s ease-in-out infinite}.badge--info{background:#0006;color:#ffffffd9;font-weight:500}@keyframes livePulse{0%,to{opacity:1}50%{opacity:.6}}.timer{display:flex;align-items:center;gap:2px}.timer-segment{display:flex;align-items:center;justify-content:center;padding:4px 10px;border-radius:var(--radius-md);background:var(--primary-10);color:var(--primary);font-family:Courier New,monospace;font-size:18px;font-weight:700;min-width:40px}.timer-sep{color:var(--text-tertiary);font-weight:500;padding-top:2px}.stim-type-tabs{display:flex;background:var(--bg-card);border-radius:var(--radius-lg);padding:4px;border:1px solid var(--border-light);margin-bottom:var(--space-4)}.stim-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-1);padding:10px;font-size:14px;font-weight:600;color:var(--text-secondary);border-radius:var(--radius-md);transition:all var(--duration-fast)}.stim-tab .material-symbols-outlined{font-size:20px}.stim-tab.active{background:var(--primary-05);color:var(--primary);box-shadow:0 2px 8px #1152d414}.stim-options{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-5)}.stim-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-full);font-size:13px;font-weight:600;color:var(--text-secondary);transition:all var(--duration-fast)}.stim-chip-dot{width:8px;height:8px;border-radius:50%}.stim-chip.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 12px var(--primary-20)}.stim-apply-btn{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:var(--space-4);background:var(--bg-card);border:2px dashed var(--primary-light);border-radius:var(--radius-xl);color:var(--primary);transition:all var(--duration-normal)}.stim-apply-inner{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:800}.stim-apply-inner .material-symbols-outlined{font-size:28px}.stim-apply-hint{font-size:12px;font-weight:500;color:var(--text-tertiary)}.stim-apply-btn:hover{background:var(--primary-05);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.stim-apply-btn:active{transform:translateY(0)}.stim-apply-btn.locked{opacity:.55;border-color:var(--border-light);color:var(--text-tertiary);cursor:not-allowed}.stim-apply-btn.locked:hover{background:var(--bg-card);transform:none;box-shadow:none}.stim-apply-btn.locked .stim-apply-hint{color:var(--amber-500);font-weight:700}.stim-apply-btn.tracking{background:var(--amber-500);border-color:var(--amber-500);border-style:solid;color:#fff;box-shadow:0 8px 20px #f59e0b4d;animation:trackingPulse 1.5s infinite}.stim-apply-btn.tracking .stim-apply-hint{color:#fffc}@keyframes trackingPulse{0%{box-shadow:0 0 #f59e0b66}70%{box-shadow:0 0 0 15px #f59e0b00}to{box-shadow:0 0 #f59e0b00}}.reaction-tracker{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--amber-500);border-radius:var(--radius-lg);color:#fff;margin-top:var(--space-4);box-shadow:0 4px 12px #f59e0b4d;animation:slideDown var(--duration-normal) var(--ease-spring)}.reaction-tracker-info{display:flex;flex-direction:column}.reaction-tracker-label{font-size:12px;font-weight:700;opacity:.9}.reaction-tracker-time{font-size:20px;font-weight:800;font-family:Courier New,monospace;line-height:1.1}.reaction-tracker-skip{padding:6px 12px;background:#fff3;border-radius:var(--radius-sm);font-size:12px;font-weight:700;color:#fff}.reaction-tracker-skip:active{background:#ffffff4d}.log-section{padding-top:0}.log-count{font-size:12px;font-weight:600;color:var(--primary);background:var(--primary-10);padding:2px 8px;border-radius:var(--radius-full)}.stim-log{display:flex;flex-direction:column;gap:var(--space-3);max-height:200px;overflow-y:auto;padding-right:4px}.log-item{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-md);animation:slideIn var(--duration-normal) var(--ease-spring)}.log-item-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:#fff}.log-item-icon.olfactory{background:#fb923c}.log-item-icon.auditory{background:#60a5fa}.log-item-icon .material-symbols-outlined{font-size:18px}.log-item-info{flex:1}.log-item-title{font-size:13px;font-weight:700;color:var(--text-primary)}.log-item-time{font-size:11px;color:var(--text-tertiary)}.log-item-reaction{text-align:right}.log-item-rt{font-size:15px;font-weight:800;color:var(--emerald-600)}.log-item-rt.no-reaction{color:var(--text-tertiary);font-size:12px}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.metric-card{padding:var(--space-4);border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);transition:all var(--duration-normal) var(--ease-out)}.metric-card:hover{box-shadow:var(--shadow-md)}.metric-label{font-size:11px;font-weight:600;color:var(--text-tertiary);margin-bottom:var(--space-1);letter-spacing:.01em}.metric-value-row{display:flex;align-items:flex-end;justify-content:space-between}.metric-value{font-size:24px;font-weight:900;color:var(--text-primary);letter-spacing:-.02em;line-height:1.1}.metric-value small{font-size:13px;font-weight:500;margin-left:2px}.metric-trend{font-size:16px}.metric-trend--up{color:var(--emerald-500)}.metric-trend--blue{color:var(--primary)}.metric-trend--amber{color:var(--amber-500)}.metric-trend--indigo{color:var(--indigo-500)}.metric-bar{width:100%;height:4px;border-radius:var(--radius-full);background:var(--border-light);margin-top:var(--space-3);overflow:hidden}.metric-bar-fill{height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out)}.metric-bar-fill--green{background:var(--emerald-500)}.metric-sub{font-size:10px;color:var(--text-tertiary);margin-top:var(--space-2)}.app-footer{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;padding:var(--space-4);background:#ffffffeb;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-top:1px solid rgba(0,0,0,.04);z-index:90}.btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;border-radius:var(--radius-lg);font-weight:700;transition:all var(--duration-normal) var(--ease-out)}.btn--lg{height:56px;font-size:17px}.btn--sage{background:var(--sage);color:var(--text-inverse);box-shadow:0 4px 16px var(--sage-shadow)}.btn--sage:hover{background:var(--sage-hover)}.btn--sage:active{transform:scale(.98)}.btn--primary{background:var(--primary);color:var(--text-inverse);box-shadow:0 4px 16px #1152d440}.btn--primary:hover{background:var(--primary-light)}.btn--primary:active{transform:scale(.98)}.btn--success{background:var(--status-green, #22c55e)!important;color:#fff!important;box-shadow:0 4px 16px #22c55e4d!important}.btn--error{background:#ef4444!important;color:#fff!important;box-shadow:0 4px 16px #ef44444d!important}.report-overlay{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;justify-content:flex-end;background:#1e293b8c;backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:all var(--duration-slow) var(--ease-out)}.report-overlay.open{opacity:1;visibility:visible}.report-sheet{display:flex;flex-direction:column;width:100%;max-width:480px;max-height:92dvh;margin:0 auto;background:var(--bg-card);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;box-shadow:var(--shadow-xl);overflow:hidden;transform:translateY(100%);transition:transform var(--duration-slow) var(--ease-out)}.report-overlay.open .report-sheet{transform:translateY(0)}.report-handle{width:48px;height:5px;border-radius:var(--radius-full);background:var(--border-medium);margin:12px auto 8px}.report-header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6) var(--space-3);border-bottom:1px solid var(--border-light)}.report-close{padding:var(--space-2);color:var(--text-tertiary);border-radius:var(--radius-md);transition:background var(--duration-fast)}.report-close:hover{background:var(--border-light)}.report-title{font-size:17px;font-weight:700;color:var(--clinical-navy);letter-spacing:-.01em}.report-body{flex:1;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.report-body::-webkit-scrollbar{display:none}.report-section{padding:var(--space-6)}.report-section-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}.report-section-header h3{font-size:19px;font-weight:700;color:var(--clinical-navy)}.report-section-icon{font-size:22px;color:var(--primary)}.report-chart-card{padding:var(--space-5);border-radius:var(--radius-xl);background:var(--bg-light);border:1px solid var(--border-light)}.report-chart-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}.report-chart-label{font-size:13px;font-weight:500;color:var(--clinical-blue);margin-bottom:var(--space-1)}.report-chart-value{font-size:28px;font-weight:800;color:var(--clinical-navy);letter-spacing:-.03em}.report-badge{display:flex;align-items:center;gap:4px;padding:4px 12px;border-radius:var(--radius-full);font-size:13px;font-weight:700}.report-badge--green{background:var(--status-green-10);color:var(--status-green)}.report-badge--down{background:#ef44441a;color:#ef4444}.report-badge .material-symbols-outlined{font-size:15px}.report-chart{margin-top:var(--space-6)}.report-chart-svg{width:100%;height:120px;max-height:120px}#reportChartCanvas{max-height:160px;width:100%!important}.report-chart-labels{display:flex;justify-content:space-between;margin-top:var(--space-2);padding:0 var(--space-1);font-size:10px;font-weight:700;color:#4c669a80;letter-spacing:.08em;text-transform:uppercase}.response-cards{display:flex;flex-direction:column;gap:var(--space-3)}.response-card{display:flex;align-items:center;padding:var(--space-4);border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-light);box-shadow:var(--shadow-sm)}.response-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-md);margin-right:var(--space-4);flex-shrink:0}.response-icon--orange{background:var(--orange-100);color:var(--orange-600)}.response-icon--blue{background:var(--blue-100);color:var(--blue-600)}.response-info{flex:1;min-width:0}.response-info-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.response-name{font-size:14px;font-weight:700;color:var(--clinical-navy)}.response-pct{font-size:12px;font-weight:700;color:var(--clinical-blue)}.response-bar{width:100%;height:6px;border-radius:var(--radius-full);background:var(--border-light);overflow:hidden}.response-bar-fill{height:100%;border-radius:var(--radius-full);transition:width 1s var(--ease-out)}.response-bar-fill--orange{background:var(--orange-500)}.response-bar-fill--blue{background:var(--blue-500)}.recommendation-card{padding:var(--space-5);border-radius:var(--radius-xl);background:var(--primary-05);border:1px solid var(--primary-10)}.recommendation-top{display:flex;gap:var(--space-3);margin-bottom:var(--space-4)}.recommendation-icon{color:var(--primary);font-size:22px;flex-shrink:0;margin-top:2px}.recommendation-title{font-size:14px;font-weight:700;color:var(--clinical-navy);margin-bottom:var(--space-1)}.recommendation-text{font-size:13px;color:var(--clinical-blue);line-height:1.6}.recommendation-btn{width:100%;padding:12px var(--space-4);background:var(--bg-card);border:1px solid var(--primary-20);border-radius:var(--radius-lg);color:var(--primary);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:var(--space-2);transition:background var(--duration-fast)}.recommendation-btn:hover{background:var(--primary-05)}.recommendation-btn .material-symbols-outlined{font-size:18px}.report-footer{padding:var(--space-6);background:var(--bg-light);border-top:1px solid var(--border-light)}.report-disclaimer{text-align:center;font-size:11px;color:var(--text-tertiary);margin-top:var(--space-3);font-weight:500}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.camera-section{animation:fadeInUp .6s var(--ease-out) .1s both}.stimulus-section{animation:fadeInUp .6s var(--ease-out) .2s both}.metrics-section{animation:fadeInUp .6s var(--ease-out) .3s both}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.auth-chip{display:inline-flex;align-items:center;gap:4px;padding:6px 10px;margin-right:8px;border-radius:var(--radius-full);background:var(--bg-card, #fff);border:1px solid var(--border-light, #e5e7eb);color:var(--text-secondary, #475569);font-size:12px;font-weight:700;cursor:pointer;transition:all var(--duration-normal, .2s)}.auth-chip:hover{background:var(--primary-05, rgba(17, 82, 212, .05));border-color:var(--primary-light, #93c5fd)}.auth-chip .material-symbols-outlined{font-size:18px}.auth-chip--in{background:var(--status-green-10, rgba(34, 197, 94, .1));border-color:transparent;color:var(--status-green, #16a34a)}.save-notice{display:flex;align-items:flex-start;gap:8px;padding:12px 14px;margin-bottom:12px;border-radius:var(--radius-lg, 12px);background:var(--secondary-05, rgba(255, 153, 51, .08));border:1px solid var(--secondary, #ff9933);color:var(--text-secondary, #475569);font-size:13px;line-height:1.5}.save-notice .material-symbols-outlined{font-size:20px;color:var(--secondary, #ff9933);flex-shrink:0}.save-notice strong{color:var(--accent, #e74c3c)}.login-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px;background:#0f172a8c;backdrop-filter:blur(4px)}.login-overlay.open{display:flex;animation:fadeIn .2s ease-out}.login-modal{position:relative;width:100%;max-width:360px;background:#fff;border-radius:20px;padding:28px 24px 20px;text-align:center;box-shadow:0 20px 60px #00000040;animation:fadeInUp .3s var(--ease-out, ease-out)}.login-close{position:absolute;top:12px;right:12px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:var(--text-tertiary, #94a3b8);cursor:pointer}.login-close:hover{background:var(--bg-muted, #f1f5f9)}.login-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;margin:4px auto 14px;border-radius:50%;background:var(--primary-05, rgba(17, 82, 212, .08));color:var(--primary, #1152d4)}.login-icon .material-symbols-outlined{font-size:30px}.login-title{font-size:18px;font-weight:800;color:var(--text-primary, #0f172a);margin-bottom:8px}.login-desc{font-size:13px;line-height:1.6;color:var(--text-secondary, #475569);margin-bottom:20px}.login-providers{display:flex;flex-direction:column;gap:10px}.login-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:filter .15s,transform .1s}.login-btn:hover{filter:brightness(.97)}.login-btn:active{transform:scale(.99)}.login-btn-icon{width:20px;height:20px;flex-shrink:0}.login-btn-icon--naver{display:inline-flex;align-items:center;justify-content:center;font-weight:900;font-size:15px;line-height:1;color:#fff}.login-btn-label{line-height:1}.login-btn--google{background:#fff;border:1px solid #dadce0;color:#3c4043}.login-btn--kakao{background:#fee500;color:#191600}.login-btn--naver{background:#03c75a;color:#fff}.login-skip{margin-top:16px;padding:6px;font-size:13px;color:var(--text-tertiary, #94a3b8);text-decoration:underline;cursor:pointer}.login-skip:hover{color:var(--text-secondary, #475569)}