.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 800 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline fill='none' stroke='%231a3a5c' stroke-width='1.5' opacity='0.06' points='0,50 100,50 130,50 145,15 160,80 175,10 190,50 250,50 280,50 295,15 310,80 325,10 340,50 400,50 430,50 445,15 460,80 475,10 490,50 550,50 580,50 595,15 610,80 625,10 640,50 700,50 730,50 745,15 760,80 775,10 790,50 800,50'/%3E%3C/svg%3E");background-repeat:repeat-x;background-size:800px 100px;background-position:center;pointer-events:none}.login-card{position:relative;z-index:1;width:min(400px,calc(100vw - 32px));background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:clamp(24px,6vw,48px) clamp(20px,6vw,40px);box-shadow:0 4px 40px #1a3a5c14}.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:32px}.login-logo-icon{width:42px;height:42px;background:var(--blue);border-radius:10px;display:flex;align-items:center;justify-content:center}.login-logo-icon svg{width:22px;height:22px;stroke:#fff}.login-logo-title{font-family:var(--font-display);font-size:1.35rem;font-weight:400;color:var(--blue);letter-spacing:-.02em}.login-logo-sub{font-size:.68rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;font-family:var(--font-mono)}.login-heading{font-family:var(--font-display);font-size:1.5rem;font-weight:300;margin-bottom:6px;color:var(--text)}.login-sub{font-size:.8rem;color:var(--muted);margin-bottom:28px}.field{margin-bottom:18px}.field label{display:block;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2);margin-bottom:6px}.field input{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;font-family:var(--font-body);font-size:.9rem;color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1a3a5c14;background:var(--surface)}.btn-primary{width:100%;padding:12px;background:var(--blue);color:#fff;border:none;border-radius:var(--radius);font-family:var(--font-body);font-size:.88rem;font-weight:500;letter-spacing:.03em;cursor:pointer;transition:background .15s,transform .1s;margin-top:4px}.btn-primary:hover{background:var(--blue-mid);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.55;cursor:not-allowed;transform:none}.login-error{margin-top:14px;padding:10px 14px;background:var(--red-light);border:1px solid rgba(192,57,43,.25);border-radius:var(--radius);font-size:.8rem;color:var(--red);text-align:center}.app-layout{display:flex;height:100vh;overflow:hidden}.sidebar{width:var(--sidebar-w);background:var(--blue);color:#fff;display:flex;flex-direction:column;flex-shrink:0}.sidebar-brand{padding:24px 20px 20px;border-bottom:1px solid rgba(255,255,255,.1)}.sidebar-brand-name{font-family:var(--font-display);font-size:1.15rem;font-weight:400;letter-spacing:-.01em}.sidebar-brand-sub{font-size:.65rem;opacity:.5;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;margin-top:2px}.sidebar-nav{flex:1;padding:12px 10px}.sidebar-nav-item{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:7px;font-size:.82rem;color:#fff9;cursor:pointer;transition:background .15s,color .15s;margin-bottom:2px}.sidebar-nav-item svg{width:15px;height:15px;stroke:currentColor}.sidebar-nav-item:hover{background:#ffffff14;color:#fff}.sidebar-nav-item.active{background:#ffffff26;color:#fff}.sidebar-footer{padding:14px;border-top:1px solid rgba(255,255,255,.1)}.sidebar-user{display:flex;align-items:center;gap:9px;font-size:.78rem;color:#ffffffb3}.sidebar-avatar{width:28px;height:28px;border-radius:50%;background:#fff3;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;color:#fff;flex-shrink:0;font-family:var(--font-mono)}.sidebar-logout{margin-left:auto;background:none;border:none;cursor:pointer;color:#fff6;padding:4px;transition:color .15s}.sidebar-logout:hover{color:#ffffffe6}.sidebar-logout svg{width:14px;height:14px;stroke:currentColor;display:block}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden}.topbar{background:var(--surface);border-bottom:1px solid var(--border);padding:14px 28px;display:flex;align-items:center;gap:16px;flex-shrink:0}.topbar-title{font-family:var(--font-display);font-size:1.2rem;font-weight:400;letter-spacing:-.01em;flex:1;color:var(--blue)}.topbar-search{display:flex;align-items:center;gap:7px;background:var(--bg);border:1px solid var(--border);border-radius:7px;padding:7px 12px}.topbar-search svg{width:13px;height:13px;stroke:var(--muted);flex-shrink:0}.topbar-search input{background:none;border:none;outline:none;font-size:.82rem;color:var(--text);width:180px;font-family:var(--font-body)}.topbar-search input::placeholder{color:var(--muted2)}.page-content{flex:1;overflow-y:auto;padding:24px 28px}.patients-table-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.table-toolbar{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.table-toolbar-title{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text2)}.table-toolbar-count{font-family:var(--font-mono);font-size:.72rem;color:var(--muted)}table{width:100%;border-collapse:collapse}thead th{padding:9px 14px;text-align:left;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);background:var(--bg);border-bottom:1px solid var(--border);white-space:nowrap}tbody tr{border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:var(--blue-light)}tbody td{padding:11px 14px;vertical-align:middle}.patient-name{font-weight:500;color:var(--blue)}.patient-email{font-size:.72rem;color:var(--muted);margin-top:1px}.stat-tags{display:flex;flex-wrap:wrap;gap:4px}.stat-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:4px;font-size:.68rem;font-family:var(--font-mono);white-space:nowrap}.stat-tag-symptom{background:var(--amber-light);color:var(--amber);border:1px solid rgba(184,134,11,.2)}.stat-tag-detection{background:var(--red-light);color:var(--red);border:1px solid rgba(192,57,43,.2)}.stat-tag-count{font-weight:600}.ratio-bar{display:flex;align-items:center;gap:8px}.ratio-track{width:56px;height:4px;border-radius:2px;background:var(--border);overflow:hidden;flex-shrink:0}.ratio-fill{height:100%;border-radius:2px}.ratio-val{font-family:var(--font-mono);font-size:.72rem}.topbar-hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;background:none;border:none;cursor:pointer;color:var(--text2);border-radius:var(--radius);transition:background .15s}.topbar-hamburger:hover{background:var(--bg2)}.topbar-hamburger svg{width:20px;height:20px;stroke:currentColor}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:199;background:#00000073}@media (max-width: 700px){.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:200;transform:translate(-100%);transition:transform .25s ease}.sidebar.open{transform:translate(0)}.sidebar-overlay.open{display:block}.topbar-hamburger{display:flex}.topbar{padding:12px 16px}.page-content{padding:14px}.topbar-search input{width:100px}}@media (max-width: 420px){.topbar-search{display:none}}.stat-card-download-group{display:flex;flex-direction:column;gap:10px;grid-column:span 1;justify-content:center}.download-btn{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:var(--radius);font-size:.82rem;font-weight:500;text-decoration:none;border:1.5px solid transparent;transition:background .15s,border-color .15s,color .15s;cursor:pointer;white-space:normal;word-break:break-word;line-height:1.3}.download-btn svg{width:16px;height:16px;flex-shrink:0;stroke:currentColor}.download-btn--pdf{background:var(--blue-light, #e8f0f8);color:var(--blue, #1a3a5c);border-color:var(--blue-mid, #4a7aaa)}.download-btn--pdf:hover{background:var(--blue-mid, #4a7aaa);color:#fff}.download-btn--edf{background:var(--amber-light, #fdf3e3);color:var(--amber, #b87c0a);border-color:var(--amber, #b87c0a)}.download-btn--edf:hover{background:var(--amber, #b87c0a);color:#fff}.detail-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.8rem;cursor:pointer;margin-bottom:20px;padding:6px 10px;border-radius:6px;transition:background .12s,color .12s;border:none;background:none}.detail-back:hover{background:var(--border);color:var(--text)}.detail-back svg{width:13px;height:13px;stroke:currentColor}.detail-header-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;display:flex;gap:20px;align-items:flex-start;margin-bottom:20px}.detail-avatar{width:52px;height:52px;background:var(--blue);border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:1rem;color:#fff;flex-shrink:0}.detail-name{font-family:var(--font-display);font-size:1.4rem;font-weight:400;color:var(--blue);margin-bottom:8px}.detail-meta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}.detail-meta-item{font-size:.78rem;color:var(--text2)}.detail-meta-item strong{font-weight:500;color:var(--text)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:20px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;border-top:3px solid var(--card-accent, var(--blue))}.stat-card-label{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:6px}.stat-card-value{font-family:var(--font-mono);font-size:1.4rem;color:var(--text);line-height:1}.stat-card-sub{font-size:.68rem;color:var(--muted);margin-top:4px}.viewer-layout{display:grid;grid-template-columns:280px 1fr;gap:16px;margin-bottom:24px}.events-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column}.events-panel-header{padding:12px 16px;border-bottom:1px solid var(--border);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text2);display:flex;align-items:center;justify-content:space-between}.events-panel-tabs{display:flex;border-bottom:1px solid var(--border)}.events-panel-tab{flex:1;padding:8px;font-size:.72rem;font-weight:500;text-align:center;cursor:pointer;border:none;background:none;color:var(--muted);border-bottom:2px solid transparent;transition:color .15s}.events-panel-tab.active{color:var(--blue);border-bottom-color:var(--blue)}.events-list{flex:1;overflow-y:auto;padding:8px}.event-item{padding:9px 12px;border-radius:6px;cursor:pointer;margin-bottom:3px;border:1px solid transparent;transition:background .1s;display:flex;align-items:flex-start;gap:8px}.event-item:hover{background:var(--bg)}.event-item.selected{background:var(--blue-light);border-color:#1a3a5c33}.event-item-checkbox{flex-shrink:0;margin-top:3px;width:14px;height:14px;accent-color:var(--blue);cursor:pointer}.event-item-body{flex:1;min-width:0}.event-item-label{font-size:.8rem;font-weight:500;color:var(--text)}.event-item-time{font-size:.68rem;color:var(--muted);font-family:var(--font-mono);margin-top:2px}.event-item-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px;vertical-align:middle}.dot-symptom{background:var(--amber)}.dot-detection{background:var(--red)}.ecg-viewer-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column}.ecg-viewer-toolbar{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:16px;flex-wrap:wrap}.ecg-viewer-toolbar-title{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text2);flex:1}.toolbar-control{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--text2)}.toolbar-control label{white-space:nowrap}.toolbar-control input[type=range]{width:80px;accent-color:var(--blue)}.toolbar-control span{font-family:var(--font-mono);font-size:.72rem;color:var(--blue);min-width:28px}.ecg-charts-area{flex:1;padding:12px 16px 16px}.ecg-empty{display:flex;align-items:center;justify-content:center;height:350px;flex-direction:column;gap:10px;color:var(--muted);font-size:.85rem}.ecg-empty svg{width:40px;height:40px;stroke:var(--border2)}canvas.ecg-canvas{display:block;width:100%}.chart-label{font-size:.65rem;color:var(--muted);font-family:var(--font-mono);letter-spacing:.05em;margin-bottom:4px}.chart-sep{height:12px}.ecg-expand-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin:6px 0 2px;padding:6px 12px;background:var(--surface, #f7f5f2);border:1px solid var(--border, #e0dbd4);border-radius:6px;color:var(--muted, #8c8278);font-family:var(--font-sans, "IBM Plex Sans", sans-serif);font-size:.78rem;cursor:pointer;transition:background .15s,color .15s}.ecg-expand-btn:hover{background:var(--border, #e0dbd4);color:var(--text, #2d2926)}.two-col-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 900px){.viewer-layout{grid-template-columns:1fr}.events-panel{max-height:300px}}@media (max-width: 700px){.detail-header-card{flex-direction:column;gap:12px;padding:16px}.detail-avatar{width:44px;height:44px;font-size:.85rem}.detail-meta-grid,.stats-grid{grid-template-columns:1fr 1fr}.two-col-grid{grid-template-columns:1fr}}@media (max-width: 420px){.stats-grid,.detail-meta-grid{grid-template-columns:1fr}}.bpm-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}.bpm-label-row>span{flex:1;font-size:.65rem;color:var(--muted);font-family:var(--font-mono);letter-spacing:.05em}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #f7f5f2;--bg2: #eeeae4;--surface: #ffffff;--border: #ddd9d2;--border2: #c8c3ba;--blue: #1a3a5c;--blue-mid: #2c5f8a;--blue-light: #e8f0f8;--red: #c0392b;--red-light: #fdf0ee;--amber: #b8860b;--amber-light: #fdf8e8;--green: #1e6641;--green-light: #e8f5ed;--text: #1a1714;--text2: #4a4540;--muted: #8c8278;--muted2: #b0a898;--ecg-line: #c0392b;--bpm-dot: #1a3a5c;--window-bg: rgba(26, 58, 92, .08);--window-border: rgba(26, 58, 92, .4);--font-display: "Fraunces", Georgia, serif;--font-body: "IBM Plex Sans", sans-serif;--font-mono: "IBM Plex Mono", monospace;--sidebar-w: 220px;--radius: 8px;--radius-lg: 14px}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}.mono{font-family:var(--font-mono)}.muted{color:var(--muted)}.spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.btn-delete{display:flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;border:1px solid rgba(192,57,43,.3);border-radius:var(--radius);background:var(--red-light);color:var(--red);cursor:pointer;transition:background .15s,color .15s,border-color .15s}.btn-delete:hover{background:var(--red);color:#fff;border-color:var(--red)}.loading-state{display:flex;align-items:center;justify-content:center;gap:10px;height:200px;color:var(--muted);font-size:.85rem}