:root{--color-primary: #0D405E;--color-primary-light: #1a5a7a;--color-accent: #80C7F2;--color-accent-light: #a8d8f5;--color-background: #f8fafc;--color-surface: #ffffff;--color-text: #1e293b;--color-text-secondary: #64748b;--color-border: #e2e8f0;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-negative: #2563eb;--color-positive: #dc2626;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition-fast: .15s ease;--transition-normal: .25s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);color:var(--color-text);background-color:var(--color-background);line-height:1.6;min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-light);text-decoration:underline}.app-container{display:flex;min-height:100vh}.sidebar{width:260px;background:linear-gradient(180deg,var(--color-primary) 0%,#0a3249 50%,var(--color-primary-light) 100%);color:#fff;padding:var(--spacing-lg);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:100;border-right:1px solid rgba(255,255,255,.06)}.sidebar-logo{font-size:1.75rem;font-weight:700;margin-bottom:var(--spacing-xl);letter-spacing:-.02em;background:linear-gradient(135deg,#80c7f2,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sidebar-nav{display:flex;flex-direction:column;gap:var(--spacing-xs)}.nav-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);color:#ffffffb3;font-weight:500;transition:all var(--transition-normal);cursor:pointer;border:none;border-left:3px solid transparent;background:transparent;width:100%;text-align:left;font-size:.95rem;position:relative}.nav-item:hover{background-color:#ffffff14;color:#fff;border-left-color:#80c7f266}.nav-item.active{background-color:#80c7f21f;color:#fff;border-left-color:var(--color-accent);font-weight:600}.sidebar-footer{margin-top:auto;padding-top:var(--spacing-lg);border-top:1px solid rgba(255,255,255,.08);font-size:.875rem;color:#fff9}.sidebar-footer a{color:#fff9;transition:color var(--transition-fast)}.sidebar-footer a:hover{color:var(--color-accent-light)}.main-content{flex:1;margin-left:260px;padding:var(--spacing-xl);max-width:calc(100vw - 260px)}.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--spacing-lg);border:1px solid var(--color-border)}.card-header{margin-bottom:var(--spacing-md)}.card-title{font-size:1.125rem;font-weight:600;color:var(--color-text)}.form-group{margin-bottom:var(--spacing-md)}.form-label{display:block;font-size:.875rem;font-weight:500;color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.form-select,.form-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:.95rem;font-family:inherit;background-color:var(--color-surface);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.form-select:focus,.form-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #80c7f233}.form-select:disabled,.form-input:disabled{background-color:var(--color-background);cursor:not-allowed;opacity:.6}.searchable-select{position:relative;width:100%}.searchable-select-input{cursor:text}.searchable-select-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1.2rem;line-height:1;color:var(--color-text-secondary);cursor:pointer;padding:2px 6px;border-radius:var(--radius-sm);transition:color var(--transition-fast),background var(--transition-fast)}.searchable-select-clear:hover{color:var(--color-text);background:var(--color-background)}.searchable-select-dropdown{position:absolute;z-index:50;top:100%;left:0;right:0;margin-top:4px;max-height:240px;overflow-y:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);list-style:none;padding:var(--spacing-xs) 0}.searchable-select-option{padding:var(--spacing-xs) var(--spacing-md);font-size:.92rem;cursor:pointer;transition:background var(--transition-fast)}.searchable-select-option.highlighted{background:var(--color-background)}.searchable-select-option.selected{color:var(--color-primary);font-weight:600}.searchable-select-option.no-results{color:var(--color-text-secondary);font-style:italic;cursor:default}.btn{display:flex;gap:6px;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:.8rem;font-weight:500;font-family:inherit;cursor:pointer;border:none;transition:all var(--transition-fast)}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover{background-color:var(--color-primary-light)}.btn-secondary{background-color:var(--color-background);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background-color:var(--color-border)}.data-table{width:100%;border-collapse:collapse;font-size:.875rem}.data-table th,.data-table td{padding:var(--spacing-sm) var(--spacing-md);text-align:left;border-bottom:1px solid var(--color-border)}.data-table th{background-color:var(--color-background);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}.data-table tr:hover{background-color:var(--color-background)}.data-table tr.selected{background-color:#80c7f226}.data-table tr{cursor:pointer;transition:background-color var(--transition-fast)}.skeleton{background:linear-gradient(90deg,var(--color-border) 25%,var(--color-background) 50%,var(--color-border) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:var(--radius-sm)}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{height:1rem;margin-bottom:var(--spacing-xs)}.skeleton-text:last-child{width:60%}.skeleton-row{height:2.5rem;margin-bottom:var(--spacing-xs)}.error-boundary{padding:var(--spacing-xl);text-align:center;color:var(--color-error)}.error-boundary h2{margin-bottom:var(--spacing-md)}.viz-container{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-top:var(--spacing-lg);border:1px solid var(--color-border);overflow-x:auto}.viz-title{font-size:1rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--color-text)}@keyframes pageEnter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.page-enter{animation:pageEnter .35s ease-out}.section-header{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-border)}.section-header h3{font-size:1.1rem;font-weight:700;color:var(--color-primary);letter-spacing:-.01em}.scroll-progress{position:fixed;top:0;left:260px;height:3px;background:linear-gradient(90deg,var(--color-accent),#0D9488);z-index:200;transition:width 60ms linear;border-radius:0 2px 2px 0}@media (max-width: 1024px){.sidebar{width:200px}.main-content{margin-left:200px;max-width:calc(100vw - 200px)}.scroll-progress{left:200px}}@media (max-width: 768px){.sidebar{position:relative;width:100%;height:auto}.main-content{margin-left:0;max-width:100vw}.app-container{flex-direction:column}.scroll-progress{left:0}.legend{flex-direction:column!important;gap:var(--spacing-xs)!important}}.tooltip{position:absolute;background:var(--color-text);color:#fff;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:.8125rem;pointer-events:none;z-index:1000;box-shadow:var(--shadow-lg);max-width:300px}.tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--color-text)}.legend{display:flex;flex-direction:row;justify-content:center;gap:var(--spacing-xl);margin-top:var(--spacing-md);font-size:.875rem}.about-card{background:linear-gradient(135deg,var(--color-surface) 0%,#f1f5f9 100%);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl) var(--spacing-2xl);line-height:1.75;font-size:.95rem;color:var(--color-text)}.about-card p{margin-bottom:var(--spacing-md)}.about-card p:last-child{margin-bottom:0}.study-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--spacing-sm)}.study-list li{padding:var(--spacing-sm) var(--spacing-md);border-left:3px solid var(--color-accent);background:var(--color-surface);border-radius:0 var(--radius-md) var(--radius-md) 0;transition:background var(--transition-fast),border-color var(--transition-fast);font-size:.92rem;line-height:1.5}.study-list li:hover{background:#f0f9ff;border-left-color:var(--color-primary)}.study-list.clinical li{border-left-color:var(--color-success)}.study-list.clinical li:hover{background:#f0fdf4;border-left-color:#059669}
