:root{--cp-primary: #2563EB;--cp-primary-hover: #3B82F6;--cp-primary-light: rgba(37, 99, 235, .1);--cp-primary-glow: rgba(37, 99, 235, .25);--cp-secondary: #84CC16;--cp-secondary-light: rgba(132, 204, 22, .1);--cp-tertiary: #F59E0B;--cp-tertiary-light: rgba(245, 158, 11, .1);--cp-bg: #09090B;--cp-surface: #18181B;--cp-surface-elevated: #27272A;--cp-success: #22C55E;--cp-success-light: rgba(34, 197, 94, .1);--cp-success-glow: rgba(34, 197, 94, .3);--cp-warning: #F59E0B;--cp-warning-light: rgba(245, 158, 11, .1);--cp-error: #EF4444;--cp-error-light: rgba(239, 68, 68, .1);--cp-error-glow: rgba(239, 68, 68, .3);--cp-info: #2563EB;--cp-neutral: #71717A;--cp-neutral-light: rgba(113, 113, 122, .1);--cp-text: #FAFAFA;--cp-text-secondary: #A1A1AA;--cp-text-muted: #71717A;--cp-border: #27272A;--cp-border-hover: #3F3F46;--cp-border-active: #52525B;--cp-font-display: "Space Mono", monospace;--cp-font-body: "DM Sans", sans-serif;--cp-font-mono: "Space Mono", monospace;--cp-space-1: 4px;--cp-space-2: 8px;--cp-space-3: 12px;--cp-space-4: 16px;--cp-space-5: 20px;--cp-space-6: 24px;--cp-space-8: 32px;--cp-space-10: 40px;--cp-space-12: 48px;--cp-space-16: 64px;--cp-radius-none: 0px;--cp-radius-sm: 4px;--cp-radius-md: 8px;--cp-radius-lg: 12px;--cp-radius-xl: 16px;--cp-radius-full: 9999px;--cp-shadow-subtle: 0 0 8px rgba(37, 99, 235, .15);--cp-shadow-medium: 0 0 16px rgba(37, 99, 235, .25);--cp-shadow-large: 0 0 24px rgba(37, 99, 235, .35);--cp-shadow-overlay: 0 0 40px rgba(0, 0, 0, .6);--cp-shadow-profit: 0 0 12px rgba(34, 197, 94, .3);--cp-shadow-loss: 0 0 12px rgba(239, 68, 68, .3);--cp-transition-fast: .15s ease;--cp-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(--cp-font-body);background:var(--cp-bg);color:var(--cp-text);line-height:1.5;min-height:100vh;overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--cp-primary);text-decoration:none}a:hover{color:var(--cp-primary-hover)}.cp-display{font-family:var(--cp-font-display);font-size:32px;font-weight:700;line-height:1.1;letter-spacing:.02em}.cp-headline{font-family:var(--cp-font-display);font-size:24px;font-weight:700;line-height:1.2;letter-spacing:.01em}.cp-subhead{font-family:var(--cp-font-body);font-size:18px;font-weight:600;line-height:1.3}.cp-body-large{font-family:var(--cp-font-body);font-size:16px;font-weight:400;line-height:1.5}.cp-body{font-family:var(--cp-font-body);font-size:14px;font-weight:400;line-height:1.5}.cp-body-small{font-family:var(--cp-font-body);font-size:13px;font-weight:400;line-height:1.4;letter-spacing:.01em}.cp-caption{font-family:var(--cp-font-body);font-size:12px;font-weight:500;line-height:1.3;letter-spacing:.02em}.cp-overline{font-family:var(--cp-font-display);font-size:11px;font-weight:700;line-height:1.2;letter-spacing:.08em;text-transform:uppercase}.cp-mono{font-family:var(--cp-font-mono);font-variant-numeric:tabular-nums}.cp-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--cp-space-2);font-family:var(--cp-font-body);font-weight:500;border:none;cursor:pointer;transition:all var(--cp-transition-fast);white-space:nowrap;text-decoration:none;line-height:1}.cp-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none!important}.cp-btn-sm{height:28px;padding:var(--cp-space-2) var(--cp-space-3);font-size:12px;border-radius:var(--cp-radius-md)}.cp-btn-md{height:36px;padding:var(--cp-space-2) var(--cp-space-4);font-size:14px;border-radius:var(--cp-radius-md)}.cp-btn-lg{height:44px;padding:var(--cp-space-3) var(--cp-space-6);font-size:16px;border-radius:var(--cp-radius-md)}.cp-btn-primary{background:var(--cp-primary);color:#fafafa}.cp-btn-primary:hover:not(:disabled){background:var(--cp-primary-hover);box-shadow:var(--cp-shadow-subtle)}.cp-btn-secondary{background:transparent;color:var(--cp-primary);border:1px solid var(--cp-primary)}.cp-btn-secondary:hover:not(:disabled){background:var(--cp-primary-light)}.cp-btn-ghost{background:transparent;color:var(--cp-text-secondary);border:none}.cp-btn-ghost:hover:not(:disabled){background:var(--cp-surface-elevated);color:var(--cp-text)}.cp-btn-destructive{background:var(--cp-error);color:#fafafa;border:none}.cp-btn-destructive:hover:not(:disabled){background:#dc2626;box-shadow:var(--cp-shadow-loss)}.cp-card{background:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-radius-md);padding:var(--cp-space-4);transition:all var(--cp-transition-fast)}.cp-card-elevated{background:var(--cp-surface-elevated);border:1px solid var(--cp-border-hover);border-radius:var(--cp-radius-md);padding:var(--cp-space-5);box-shadow:var(--cp-shadow-subtle)}.cp-card-hoverable:hover{border-color:var(--cp-border-hover);box-shadow:var(--cp-shadow-subtle)}.cp-card-blue-glow{box-shadow:var(--cp-shadow-subtle)}.cp-input-group{display:flex;flex-direction:column;gap:var(--cp-space-1)}.cp-input-label{font-size:12px;font-weight:500;color:var(--cp-text-secondary);margin-bottom:4px}.cp-input-helper{font-size:12px;font-weight:400;color:var(--cp-neutral);margin-top:4px}.cp-input{height:36px;padding:var(--cp-space-2) var(--cp-space-3);font-family:var(--cp-font-body);font-size:14px;font-weight:400;color:var(--cp-text);background:var(--cp-surface);border:1px solid var(--cp-border-hover);border-radius:var(--cp-radius-md);outline:none;transition:all var(--cp-transition-fast)}.cp-input:hover{border-color:var(--cp-border-active)}.cp-input:focus{border-color:var(--cp-primary);box-shadow:0 0 8px #2563eb40}.cp-input-error{border-color:var(--cp-error);box-shadow:0 0 8px #ef444433}.cp-input-error:focus{border-color:var(--cp-error);box-shadow:0 0 8px #ef444433}.cp-input:disabled{background:var(--cp-bg);border-color:var(--cp-border);color:var(--cp-text-muted);opacity:.4}.cp-chip{display:inline-flex;align-items:center;gap:var(--cp-space-1);padding:var(--cp-space-1) var(--cp-space-2);font-size:12px;font-weight:500;border-radius:var(--cp-radius-sm);white-space:nowrap;line-height:1}.cp-chip-filter{background:var(--cp-surface-elevated);color:var(--cp-text-secondary);border:1px solid var(--cp-border-hover);cursor:pointer;transition:all var(--cp-transition-fast)}.cp-chip-filter:hover{border-color:var(--cp-border-active)}.cp-chip-filter.active{background:var(--cp-primary-light);border-color:var(--cp-primary);color:var(--cp-primary)}.cp-chip-profit{background:#22c55e1a;color:var(--cp-success);border:1px solid rgba(34,197,94,.2)}.cp-chip-loss{background:#ef44441a;color:var(--cp-error);border:1px solid rgba(239,68,68,.2)}.cp-chip-pending{background:#f59e0b1a;color:var(--cp-warning);border:1px solid rgba(245,158,11,.2)}.cp-chip-info{background:#2563eb1a;color:var(--cp-primary);border:1px solid rgba(37,99,235,.2)}.cp-stat-card{background:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-radius-md);padding:var(--cp-space-4);display:flex;flex-direction:column;gap:var(--cp-space-1);transition:all var(--cp-transition-fast)}.cp-stat-card:hover{border-color:var(--cp-border-hover);box-shadow:var(--cp-shadow-subtle)}.cp-stat-label{font-family:var(--cp-font-body);font-size:12px;font-weight:500;color:var(--cp-text-muted);letter-spacing:.02em;text-transform:uppercase}.cp-stat-value{font-family:var(--cp-font-mono);font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}.cp-stat-value.profit{color:var(--cp-success)}.cp-stat-value.loss{color:var(--cp-error)}.cp-stat-value.neutral{color:var(--cp-text)}.cp-stat-value.primary{color:var(--cp-primary)}.cp-stat-change{font-family:var(--cp-font-mono);font-size:12px;font-variant-numeric:tabular-nums}.cp-table{width:100%;border-collapse:collapse}.cp-table th{text-align:left;padding:var(--cp-space-2) var(--cp-space-3);font-family:var(--cp-font-display);font-size:11px;font-weight:700;color:var(--cp-text-muted);letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--cp-border)}.cp-table td{padding:var(--cp-space-3);font-family:var(--cp-font-body);font-size:13px;color:var(--cp-text-secondary);border-bottom:1px solid var(--cp-border);vertical-align:middle}.cp-table tr:hover td{background:#27272a80}.cp-table .cp-mono{font-family:var(--cp-font-mono);font-variant-numeric:tabular-nums}.cp-grid{display:grid;gap:var(--cp-space-4)}.cp-grid-2{grid-template-columns:repeat(2,1fr)}.cp-grid-3{grid-template-columns:repeat(3,1fr)}.cp-grid-4{grid-template-columns:repeat(4,1fr)}.cp-grid-auto{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-header{position:sticky;top:0;z-index:100;background:#09090bd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--cp-border)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 var(--cp-space-6);max-width:1400px;margin:0 auto;width:100%}.header-left{display:flex;align-items:center;gap:var(--cp-space-3)}.brand-link{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--cp-text)}.brand-icon{width:32px;height:32px;background:linear-gradient(135deg,var(--cp-primary),var(--cp-secondary));border-radius:6px;display:flex;align-items:center;justify-content:center;font-family:var(--cp-font-display);font-size:14px;font-weight:700;color:#fff}.brand-text{display:flex;flex-direction:column;line-height:1.2}.brand-name{font-family:var(--cp-font-display);font-size:14px;font-weight:700;background:linear-gradient(135deg,var(--cp-primary),var(--cp-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.brand-by{font-family:var(--cp-font-body);font-size:10px;font-weight:500;color:var(--cp-text-muted);letter-spacing:1px;text-transform:uppercase}.desktop-nav{display:flex;align-items:center;gap:2px}@media (max-width: 899px){.desktop-nav{display:none}}.nav-link{display:flex;align-items:center;gap:5px;padding:6px 10px;font-family:var(--cp-font-body);font-size:12px;font-weight:500;color:var(--cp-text-secondary);border-radius:var(--cp-radius-md);text-decoration:none!important;transition:all var(--cp-transition-fast);white-space:nowrap}.nav-link:hover{background:var(--cp-primary-light);color:var(--cp-text)}.nav-link.active{background:var(--cp-primary-light);color:var(--cp-primary);font-weight:600}.header-right{display:flex;align-items:center;gap:var(--cp-space-3)}.live-indicator{display:flex;align-items:center;gap:6px;padding:4px 12px;font-family:var(--cp-font-display);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cp-text-muted);border:1px solid rgba(113,113,122,.3);border-radius:var(--cp-radius-full)}.live-indicator.connected{color:var(--cp-success);border-color:#22c55e4d}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--cp-text-muted);display:inline-block}.live-dot.on{background:var(--cp-success);box-shadow:0 0 8px #22c55e80;animation:cp-pulse 2s infinite}@keyframes cp-pulse{0%,to{opacity:1}50%{opacity:.5}}.mobile-menu-btn{display:none;background:none;border:none;color:var(--cp-text);cursor:pointer;padding:8px}@media (max-width: 899px){.mobile-menu-btn{display:flex;align-items:center;justify-content:center}}.hamburger{display:flex;flex-direction:column;gap:4px;width:20px}.hamburger span{display:block;width:100%;height:2px;background:var(--cp-text);border-radius:2px;transition:all var(--cp-transition-fast)}.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}.mobile-overlay{position:fixed;inset:0;z-index:200;background:#09090bcc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:cp-fadeIn .15s ease}.mobile-nav{position:fixed;top:0;left:0;bottom:0;width:280px;background:var(--cp-surface);border-right:1px solid var(--cp-border);padding:var(--cp-space-4);overflow-y:auto;animation:cp-slideIn .2s ease;z-index:201}.mobile-nav-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--cp-space-4);margin-bottom:var(--cp-space-6);border-bottom:1px solid var(--cp-border)}.mobile-close-btn{background:none;border:none;color:var(--cp-text-muted);cursor:pointer;font-size:20px;padding:4px}.mobile-close-btn:hover{color:var(--cp-text)}.mobile-nav-link{display:flex;align-items:center;gap:var(--cp-space-3);padding:var(--cp-space-3) var(--cp-space-4);color:var(--cp-text-secondary);font-size:14px;font-weight:500;border-radius:var(--cp-radius-md);text-decoration:none!important;transition:all var(--cp-transition-fast);margin-bottom:2px}.mobile-nav-link:hover{background:var(--cp-primary-light);color:var(--cp-text)}.mobile-nav-link.active{background:var(--cp-primary-light);color:var(--cp-primary);font-weight:600}.page-body{flex:1;padding:var(--cp-space-6);max-width:1400px;margin:0 auto;width:100%}@media (max-width: 768px){.page-body{padding:var(--cp-space-4)}}.page-title{font-family:var(--cp-font-display);font-size:24px;font-weight:700;line-height:1.2;letter-spacing:.01em;margin-bottom:var(--cp-space-2)}.page-subtitle{font-family:var(--cp-font-body);font-size:14px;font-weight:400;color:var(--cp-text-muted);margin-bottom:var(--cp-space-6)}.cp-toolbar{display:flex;align-items:center;gap:var(--cp-space-3);margin-bottom:var(--cp-space-4);flex-wrap:wrap}.cp-toolbar-spacer{flex:1}.cp-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--cp-space-12);gap:var(--cp-space-4);color:var(--cp-text-muted)}.cp-spinner{width:24px;height:24px;border:3px solid var(--cp-border);border-top-color:var(--cp-primary);border-radius:50%;animation:cp-spin .6s linear infinite}@keyframes cp-spin{to{transform:rotate(360deg)}}.cp-empty{text-align:center;padding:var(--cp-space-10);color:var(--cp-text-muted)}.cp-empty-icon{font-size:2.5rem;margin-bottom:var(--cp-space-4);opacity:.5}.cp-empty h3{font-size:16px;margin-bottom:var(--cp-space-2);color:var(--cp-text-secondary)}@keyframes cp-fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes cp-slideIn{0%{transform:translate(-100%)}to{transform:translate(0)}}.animate-fade-in{animation:cp-fadeIn .3s ease both}.cp-divider{height:1px;background:var(--cp-border);margin:var(--cp-space-4) 0}.cp-section{margin-bottom:var(--cp-space-6)}.cp-section-title{font-family:var(--cp-font-display);font-size:14px;font-weight:700;color:var(--cp-text-muted);letter-spacing:.05em;text-transform:uppercase;margin-bottom:var(--cp-space-3)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--cp-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--cp-border-hover)}@media (max-width: 1024px){.cp-grid-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.cp-grid-2,.cp-grid-3,.cp-grid-4{grid-template-columns:1fr}.cp-table thead{display:none}.cp-table tr{display:block;padding:var(--cp-space-3);border-bottom:1px solid var(--cp-border)}.cp-table td{display:flex;justify-content:space-between;padding:var(--cp-space-2) 0;border:none}.cp-table td:before{content:attr(data-label);font-family:var(--cp-font-body);font-size:11px;font-weight:600;color:var(--cp-text-muted);text-transform:uppercase}}@keyframes cp-flash-green{0%{background:#22c55e26}to{background:transparent}}@keyframes cp-flash-red{0%{background:#ef444426}to{background:transparent}}.cp-flash-profit{animation:cp-flash-green 1s ease}.cp-flash-loss{animation:cp-flash-red 1s ease}@media (max-width: 480px){html{font-size:15px}.header-inner{padding:0 var(--cp-space-3)}}