@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Space+Grotesk:wght@500;700&display=swap";:root{--font-body:"Manrope", "Segoe UI", Tahoma, sans-serif;--font-display:"Space Grotesk", "Segoe UI", Tahoma, sans-serif;--text-main:#1f2a38;--text-soft:#526170;--text-title:#0e2239;--panel-bg:#ffffffdb;--panel-border:#0f172a1a;--panel-shadow:0 20px 50px #1023381a;--primary:#0f766e;--secondary:#155e75;--danger:#b91c1c;--success:#0f766e;--warning:#b45309;--info:#1d4ed8;--chart-spo2:#0f766e;--chart-hr:#b45309}*{box-sizing:border-box}body{min-height:100vh;font-family:var(--font-body);color:var(--text-main);background-color:#0000;background-image:radial-gradient(circle at 12% 0,#0f766e3b,#0000 34%),radial-gradient(circle at 86% 6%,#155e7533,#0000 28%),linear-gradient(145deg,#eff6ff 0%,#f0fdfa 47%,#fff7ed 100%);background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;margin:0}h1,h2,h3,p{margin:0}#app{max-width:1260px;margin:0 auto;padding:1rem}.app-shell{flex-direction:column;gap:1rem;display:flex}.page-header{border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);background:linear-gradient(130deg,#ffffffd1,#f1f5f9db);border-radius:18px;padding:1.2rem 1.3rem}.page-header h1{font-family:var(--font-display);color:var(--text-title);margin-top:.25rem;font-size:clamp(1.8rem,3.6vw,2.6rem)}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--secondary);font-size:.74rem;font-weight:700}.subline{max-width:72ch;color:var(--text-soft);margin-top:.6rem}.layout-grid{grid-template-columns:350px minmax(0,1fr);gap:1rem;display:grid}.panel{background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:16px;padding:1rem}.panel h2,.panel h3{font-family:var(--font-display);color:var(--text-title)}.panel-header{justify-content:space-between;align-items:center;gap:.6rem;display:flex}.stack-gap-sm{flex-direction:column;gap:.55rem;display:flex}.stack-gap-md{flex-direction:column;gap:.85rem;display:flex}.field-label{color:#334155;font-size:.84rem;font-weight:600}.text-input{width:100%;font:inherit;color:var(--text-main);background:#fff;border:1px solid #cbd5e1;border-radius:10px;padding:.62rem .7rem}.text-input:focus{border-color:#0f766e99;outline:2px solid #0f766e59}.btn{font:inherit;cursor:pointer;border:none;border-radius:10px;padding:.65rem .85rem;font-weight:700;transition:transform .16s,filter .16s}.btn:hover{filter:brightness(1.04);transform:translateY(-1px)}.btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.btn-primary{color:#fff;background:linear-gradient(140deg,#0f766e,#155e75)}.btn-secondary{color:#0f172a;background:linear-gradient(140deg,#dbeafe,#f1f5f9);border:1px solid #bfdbfe}.btn-danger{color:#7f1d1d;background:linear-gradient(140deg,#fee2e2,#fff1f2);border:1px solid #fecaca}.btn-sm{padding:.45rem .6rem;font-size:.82rem}.status-chip{border:1px solid #0000;border-radius:999px;align-items:center;padding:.22rem .55rem;font-size:.74rem;font-weight:700;display:inline-flex}.status-chip.ok{color:#064e3b;background:#d1fae5;border-color:#6ee7b7}.status-chip.warning{color:#7c2d12;background:#ffedd5;border-color:#fdba74}.status-chip.info{color:#1e3a8a;background:#dbeafe;border-color:#93c5fd}.helper-text{color:var(--text-soft);font-size:.92rem}.notice-row{color:#334155;background:#e2e8f073;border:1px dashed #94a3b8;border-radius:10px;padding:.7rem;font-size:.92rem}.success-text{color:#065f46;font-weight:600}.error-text{color:var(--danger);font-weight:600}.auth-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;display:grid}.device-list{flex-direction:column;gap:.5rem;max-height:280px;margin:0;padding:0;list-style:none;display:flex;overflow:auto}.device-item{text-align:left;cursor:pointer;background:#eff6ff;border:1px solid #dbeafe;border-radius:10px;width:100%;padding:.6rem .7rem}.device-item.active{background:#ccfbf1;border-color:#0f766e}.device-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.45rem;display:grid}.device-title{color:#0f172a;font-weight:700;display:block}.device-subtitle{color:#475569;margin-top:.1rem;font-size:.84rem;display:block}.device-status-chip{border:1px solid #0000;border-radius:999px;margin-top:.35rem;padding:.16rem .5rem;font-size:.72rem;font-weight:700;display:inline-flex}.device-status-chip.status-online{color:#065f46;background:#d1fae5;border-color:#6ee7b7}.device-status-chip.status-offline{color:#7c2d12;background:#ffedd5;border-color:#fdba74}.device-status-chip.status-usb{color:#1e3a8a;background:#dbeafe;border-color:#93c5fd}.button-row{gap:.5rem;display:flex}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;display:grid}.metric-card{background:linear-gradient(145deg,#fff,#f8fafc);border:1px solid #dbeafe;border-radius:12px;padding:.7rem}.metric-label{color:#64748b;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem}.metric-value{font-family:var(--font-display);color:#0f172a;margin-top:.2rem;font-size:clamp(1.05rem,2.2vw,1.7rem)}.metric-value span{color:#475569;font-size:.95rem}.text-sm{font-size:1rem;font-family:var(--font-body);color:#1f2937}.subtle-divider{background:#94a3b859;height:1px}.chart-legend{flex-wrap:wrap;gap:.5rem;display:flex}.legend-item{color:#475569;align-items:center;gap:.35rem;font-size:.82rem;display:inline-flex}.legend-dot{border-radius:50%;width:10px;height:10px}.legend-dot.spo2{background:var(--chart-spo2)}.legend-dot.hr{background:var(--chart-hr)}.chart-shell{background:#fff;border:1px solid #dbeafe;border-radius:12px;width:100%;overflow-x:auto}.chart-shell svg{width:100%;min-width:740px;display:block}.axis-line{stroke:#94a3b8;stroke-width:1px}.grid-line{stroke:#e2e8f0;stroke-width:1px;stroke-dasharray:5 5}.axis-text{fill:#64748b;font-family:var(--font-body);font-size:11px}.line-spo2{stroke:var(--chart-spo2);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.line-hr{stroke:var(--chart-hr);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.chart-state-warning{color:#9a3412}.empty-panel{text-align:center;padding:1.4rem}.fade-in-up{animation:.45s both fade-in-up}.delay-1{animation-delay:80ms}@keyframes fade-in-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=1024px){.layout-grid,.auth-grid{grid-template-columns:1fr}}@media (width<=640px){#app{padding:.75rem}.stats-grid{grid-template-columns:1fr}.panel{padding:.85rem}}
