:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;justify-content:center;align-items:flex-start;min-width:320px;min-height:100vh;background:#f5f5f5}#root{width:100%;max-width:1920px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--brand-primary: #003366;--brand-secondary: #6A0DAD;--brand-accent: #A4D03F;--brand-gold: #FFD700;--profit-color: #A4D03F;--loss-color: #FF6B6B;--neutral-color: #6C757D;--bg-primary: #F5F5F7;--bg-secondary: #F8F9FF;--bg-tertiary: #F1F3FF;--bg-card: #FFFFFF;--bg-sidebar: #F8F9FF;--text-primary: #1A1A1A;--text-secondary: #4A5568;--text-tertiary: #718096;--text-inverse: #FFFFFF;--border-primary: #E5E5E5;--border-secondary: #CBD5E0;--border-accent: #003366;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .06);--shadow-md: 0 2px 8px rgba(0, 0, 0, .08);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .1);--shadow-xl: 0 6px 16px rgba(0, 0, 0, .12);--gradient-primary: linear-gradient(135deg, #003366 0%, #6A0DAD 100%);--gradient-success: linear-gradient(135deg, #A4D03F 0%, #8BC34A 100%);--gradient-card: linear-gradient(135deg, #FFFFFF 0%, #F8F9FF 100%);--mobile-breakpoint: 768px;--tablet-breakpoint: 1024px;--desktop-breakpoint: 1200px;--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}[data-theme=dark]{--bg-primary: #0F1419;--bg-secondary: #1A1F2E;--bg-tertiary: #242B3D;--bg-card: #1A1F2E;--bg-sidebar: #151922;--text-primary: #F7FAFC;--text-secondary: #CBD5E0;--text-tertiary: #A0AEC0;--text-inverse: #1A1A1A;--border-primary: #2D3748;--border-secondary: #4A5568;--border-accent: #6A0DAD;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .3);--gradient-primary: linear-gradient(135deg, #1A1F2E 0%, #2D3748 100%);--gradient-success: linear-gradient(135deg, #38A169 0%, #48BB78 100%);--gradient-card: linear-gradient(135deg, #1A1F2E 0%, #242B3D 100%)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6;transition:background-color var(--transition-normal),color var(--transition-normal)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--brand-primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--brand-secondary)}button{font-family:inherit;cursor:pointer;border:none;outline:none;transition:all var(--transition-fast);font-weight:500}button:disabled{cursor:not-allowed;opacity:.6}input,select,textarea{font-family:inherit;border:1px solid var(--border-primary);background:var(--bg-card);color:var(--text-primary);transition:all var(--transition-fast)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px #0033661a}.gradient-text{background:linear-gradient(135deg,#FFFFFF 0%,var(--brand-gold) 70%,var(--brand-accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.3)}.profit{color:var(--profit-color)}.loss{color:var(--loss-color)}.neutral{color:var(--neutral-color)}.mobile-only{display:none}.desktop-only{display:block}@media (max-width: 768px){.mobile-only{display:block}.desktop-only{display:none}}.fade-in{animation:fadeIn .5s ease-in-out}.slide-up{animation:slideUp .3s ease-out}.scale-in{animation:scaleIn .2s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.hover-lift{transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.glass{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}[data-theme=dark] .glass{background:#0003;border:1px solid rgba(255,255,255,.1)}.footer{background:var(--bg-secondary);border-top:1px solid var(--border-primary);padding:2rem 1rem 1rem;margin-top:auto}.footer-content{max-width:1400px;margin:0 auto;color:var(--text-secondary);font-size:.9rem}.footer-main{display:grid;grid-template-columns:2fr 1fr;gap:2rem;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border-primary)}.footer-info h4{color:var(--text-primary);margin-bottom:.5rem;font-size:1.1rem;font-weight:600}.footer-info p{margin:0;line-height:1.6}.footer-contact h5{color:var(--text-primary);margin-bottom:.5rem;font-size:1rem;font-weight:600}.footer-contact p{margin:.25rem 0;font-size:.85rem}.footer-legal{text-align:center}.footer-links{margin-bottom:1rem}.footer-link{color:var(--text-secondary);text-decoration:none;font-size:.85rem;transition:color .3s ease}.footer-link:hover{color:var(--brand-primary);text-decoration:underline}.footer-divider{margin:0 .75rem;color:var(--border-primary)}.footer-copyright{font-size:.8rem;color:var(--text-tertiary)}.footer-copyright p{margin:.25rem 0}.footer-disclaimer{font-style:italic;color:var(--text-tertiary)}@media (max-width: 768px){.footer{padding:1.5rem 1rem 1rem}.footer-main{grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem;text-align:center}.footer-links{display:flex;flex-direction:column;gap:.5rem;align-items:center}.footer-divider{display:none}}.new-header{background:var(--gradient-primary);color:var(--text-inverse);padding:0;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}.new-header:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.05)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');opacity:.3}.header-content{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:.5rem 2rem;max-width:1400px;margin:0 auto}.brand-section{display:flex;align-items:center}.logo-container{display:flex;align-items:center;gap:1rem;text-decoration:none;color:inherit;cursor:pointer;transition:all .3s ease;border-radius:12px;padding:.5rem;margin:-.5rem}.logo-container:hover{transform:translateY(-1px);opacity:.9}.logo-container:active{transform:translateY(0)}.logo-icon{width:40px;height:40px;background:var(--gradient-success);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1rem;color:var(--text-inverse);box-shadow:var(--shadow-md);transition:transform var(--transition-fast)}.logo-icon:hover{transform:scale(1.05)}.brand-text{display:flex;flex-direction:column}.brand-title{font-size:1.4rem;font-weight:800;margin:0;letter-spacing:-.02em;background:linear-gradient(45deg,#FFFFFF 0%,var(--brand-gold) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.brand-tagline{font-size:.75rem;opacity:.9;margin:0;font-weight:500}.header-nav{display:flex;align-items:center;gap:.5rem}.nav-button{padding:.5rem 1.25rem;border-radius:8px;background:transparent;color:var(--text-inverse);font-size:.9rem;font-weight:600;text-decoration:none;transition:all var(--transition-fast);cursor:pointer;border:2px solid transparent}.nav-button:hover{background:#ffffff1a}.nav-button.active{background:#fff3;border-color:#ffffff4d}.header-actions{display:flex;align-items:center;gap:1rem}.language-selector{padding:.5rem .75rem;border-radius:8px;background:var(--bg-card);border:1px solid var(--border-primary);color:var(--text-primary);font-size:.8rem;font-weight:600;transition:all var(--transition-fast);cursor:pointer;min-width:150px;outline:none}.language-selector:hover{background:var(--bg-secondary);border-color:var(--brand-accent)}.language-selector:focus{outline:2px solid var(--brand-accent);outline-offset:2px}.language-selector option{background:var(--bg-card);color:var(--text-primary);padding:.5rem}.theme-toggle{height:36px;padding:0 12px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:6px;transition:all var(--transition-fast);font-size:.8rem;font-weight:600;cursor:pointer;white-space:nowrap;border:1px solid var(--border-primary)}[data-theme=dark] .theme-toggle{background:var(--bg-card);color:var(--text-primary)}[data-theme=dark] .theme-toggle:hover{background:#f5f5f5;color:#1a1a1a;border-color:var(--brand-accent);transform:scale(1.02)}[data-theme=light] .theme-toggle{background:#2a2a2a;color:#fff}[data-theme=light] .theme-toggle:hover{background:#1a1a1a;color:#fff;border-color:var(--brand-accent);transform:scale(1.02)}.theme-toggle-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.theme-toggle-text{display:block;font-size:.8rem}.header-hero{position:relative;z-index:2;padding:1rem;text-align:center;background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.1) 100%)}.hero-content{max-width:800px;margin:0 auto}.hero-title{font-size:1.8rem;font-weight:700;margin:0 0 .5rem;line-height:1.2}.hero-description{font-size:.95rem;opacity:.9;margin:0;line-height:1.5}.investment-sidebar{background:var(--bg-card);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow-xl);border:1px solid var(--border-primary);max-height:calc(100vh - 120px);overflow-y:auto;transition:all var(--transition-normal)}.investment-sidebar.step-3-active{max-height:none;height:auto;overflow-y:visible}.sidebar-section{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border-primary)}.sidebar-section:last-child{border-bottom:none;margin-bottom:0}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-title{display:flex;align-items:center;gap:.75rem;font-size:.95rem;font-weight:600;color:var(--text-primary);margin:0}.step-number{width:28px;height:28px;background:var(--gradient-primary);color:var(--text-inverse);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700}.loading-indicator{font-size:.8rem;color:var(--brand-primary);font-weight:500}.asset-type-selector{display:flex;flex-direction:column;gap:.75rem}.asset-type-button{display:flex;align-items:center;gap:1rem;padding:1rem;border:2px solid var(--border-primary);border-radius:12px;background:var(--bg-card);color:var(--text-primary);transition:all var(--transition-fast);cursor:pointer;text-align:left}.asset-type-button:hover{border-color:var(--brand-primary);background:var(--bg-secondary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.asset-type-button.active{border-color:var(--brand-primary);background:linear-gradient(135deg,var(--brand-primary) 0%,var(--brand-secondary) 100%);color:var(--text-inverse);box-shadow:var(--shadow-lg)}.asset-icon{font-size:1.5rem;width:40px;text-align:center;transition:all var(--transition-fast)}.asset-type-button:hover .asset-icon{transform:scale(1.05)}.asset-info{flex:1}.asset-name{font-weight:600;font-size:.9rem;margin-bottom:.25rem;color:var(--text-primary)}.asset-desc{font-size:.8rem;opacity:.8;color:var(--text-secondary)}.search-container{margin-bottom:1rem}.search-input-wrapper{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:12px;font-size:14px;color:var(--text-secondary);pointer-events:none;z-index:1}.search-input{width:100%;padding:.75rem 1rem .75rem 2.5rem;border:1px solid var(--border-primary);border-radius:8px;background:var(--bg-card);font-size:.9rem;color:var(--text-primary);transition:all var(--transition-fast);box-sizing:border-box}.search-input:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 2px #3b82f61a;background:var(--bg-primary)}.search-input::placeholder{color:var(--text-secondary);opacity:.7}.search-clear{position:absolute;right:8px;width:24px;height:24px;border:none;background:#0000001a;border-radius:50%;font-size:12px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.search-clear:hover{background:#0003;color:var(--text-primary)}.search-results-count{font-size:.8rem;color:var(--text-primary);margin-top:.5rem;text-align:center;padding:.25rem .5rem;background:var(--bg-tertiary);border-radius:4px;border:1px solid var(--border-primary);font-weight:500}.product-list{max-height:300px;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:.5rem;width:100%;box-sizing:border-box}.product-item{display:flex;flex-direction:column;align-items:flex-start;padding:.75rem 1rem;border:1px solid var(--border-primary);border-radius:8px;background:var(--bg-card);transition:all var(--transition-fast);cursor:pointer;text-align:left;width:100%;box-sizing:border-box;min-width:0}.product-item:hover{border-color:var(--brand-primary);background:var(--bg-secondary);transform:translate(4px);box-shadow:var(--shadow-sm)}.product-item.selected{border-color:var(--brand-primary);background:linear-gradient(135deg,var(--brand-primary) 0%,var(--brand-secondary) 100%);color:var(--text-inverse);box-shadow:var(--shadow-md)}.product-code{font-weight:600;font-size:.85rem;margin-bottom:.25rem;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all var(--transition-fast)}.product-name{font-size:.75rem;opacity:.8;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all var(--transition-fast)}.product-item:hover .product-name{opacity:1}.loading-placeholder,.no-data{padding:2rem 1rem;text-align:center;color:var(--text-primary);font-size:.9rem;font-weight:500;background:var(--bg-tertiary);border-radius:8px;border:1px dashed var(--border-primary)}.error-message{padding:.75rem 1rem;background:var(--bg-tertiary);border:1px solid var(--loss-color);border-radius:8px;color:var(--loss-color);font-size:.85rem;font-weight:500;margin-bottom:.75rem}.selected-product-info{padding:1rem;background:var(--gradient-card);border-radius:12px;border:1px solid var(--border-primary);margin-bottom:1.5rem}.selected-product-label{font-size:.8rem;color:var(--text-secondary);margin-bottom:.5rem;font-weight:500}.selected-product-details{display:flex;flex-direction:column;gap:.25rem}.selected-product-code{font-weight:700;color:var(--brand-primary);font-size:1rem}.selected-product-name{color:var(--text-primary);font-size:.9rem;font-weight:500}.investment-settings{display:flex;flex-direction:column;gap:1.25rem}.calculated-date{padding:.75rem;background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:8px;font-weight:500;color:var(--text-primary)}.date-note{font-size:.8rem;color:var(--text-secondary);margin-left:.5rem}.setting-group{display:flex;flex-direction:column;gap:.5rem}.setting-label{font-weight:600;color:var(--text-primary);font-size:.9rem}.frequency-selector{display:flex;gap:.5rem}.frequency-button{flex:1;padding:.75rem;border:1px solid var(--border-primary);border-radius:8px;background:var(--bg-card);color:var(--text-primary);font-weight:500;transition:all var(--transition-fast)}.frequency-button:hover{border-color:var(--brand-primary);background:var(--bg-secondary)}.frequency-button.active{border-color:var(--brand-primary);background:var(--brand-primary);color:var(--text-inverse)}.setting-select,.setting-input{padding:.75rem;border:1px solid var(--border-primary);border-radius:8px;background:var(--bg-card);color:var(--text-primary);font-size:.9rem;font-weight:500;transition:all var(--transition-fast)}.setting-select:focus,.setting-input:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px #0033661a}.currency-selector{display:flex;gap:.5rem;margin-bottom:.75rem}.currency-button{flex:1;padding:.5rem 1rem;background:var(--bg-secondary);border:2px solid var(--border-primary);border-radius:8px;font-size:.85rem;font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.currency-button:hover{background:var(--bg-hover);border-color:var(--brand-primary)}.currency-button.active{background:var(--brand-primary);color:var(--text-inverse);border-color:var(--brand-primary)}.amount-input-group,.period-input-group{display:flex;gap:.5rem;align-items:center}.amount-unit{color:var(--text-secondary);font-weight:600;font-size:.9rem}.amount-quick-adjust{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem;padding:.75rem;background:var(--bg-secondary);border-radius:8px}.adjust-group{display:flex;align-items:center;gap:.5rem}.adjust-label{font-size:.75rem;color:var(--text-secondary);font-weight:600;min-width:60px}.adjust-group button{flex:1;padding:.4rem .5rem;background:var(--bg-primary);border:1px solid var(--border-primary);border-radius:6px;font-size:.75rem;font-weight:600;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast)}.adjust-group button:hover{background:var(--brand-primary);color:var(--text-inverse);border-color:var(--brand-primary);transform:translateY(-1px)}.adjust-group button:active{transform:translateY(0)}.period-value,.period-unit{flex:1}.amount-display{font-size:.8rem;color:var(--text-secondary);font-weight:500;padding:.5rem .75rem;background:var(--bg-secondary);border-radius:6px;text-align:center}.simulation-button{padding:1rem 1.5rem;background:var(--gradient-success);color:var(--text-inverse);border:none;border-radius:12px;font-weight:700;font-size:1rem;cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-md);margin-top:.5rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.simulation-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-lg);background:linear-gradient(135deg,#8bc34a,#9ccc65)}.simulation-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.button-icon{font-size:1.1rem}.button-loading{display:flex;align-items:center;gap:.5rem}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.main-layout{display:flex;min-height:calc(100vh - 80px);max-width:1600px;margin:0 auto;padding:2rem;gap:2rem;background:var(--bg-primary);width:100%;box-sizing:border-box}.content-area{flex:3;min-width:0;min-height:0;display:flex;flex-direction:column}.sidebar-area{width:340px;flex-shrink:0;min-height:0}.investment-sidebar .setting-label,.investment-sidebar .step-title,.investment-sidebar .step-description,.investment-sidebar .frequency-button,.investment-sidebar .setting-select,.investment-sidebar .setting-input,.investment-sidebar .amount-display,.investment-sidebar .product-code,.investment-sidebar .product-name,.investment-sidebar .selected-code,.investment-sidebar .selected-name,.investment-sidebar .asset-type-button,.investment-sidebar .asset-name,.investment-sidebar .asset-desc{color:var(--text-primary)!important}.investment-sidebar .frequency-button.active,.investment-sidebar .product-item.selected,.investment-sidebar .asset-type-button.active{color:var(--text-inverse)!important}@media (max-width: 1024px){.main-layout{flex-direction:column;padding:1rem;gap:1.5rem}.sidebar-area{width:100%;order:-1}.content-area{order:1;min-width:0;min-height:0;width:100%}.sidebar-area{min-height:0}.chart-area-main{min-height:500px!important;height:auto!important}.chart-container{height:500px!important;min-height:500px!important;flex:none!important}}.chart-area-loading,.chart-area-error,.chart-area-empty{display:flex;align-items:center;justify-content:center;min-height:400px;background:var(--gradient-card);border-radius:20px;border:1px solid var(--border-primary);box-shadow:var(--shadow-lg)}.loading-content,.error-content,.empty-content{text-align:center;max-width:500px;padding:2rem}.loading-spinner-large{width:60px;height:60px;border:4px solid var(--border-primary);border-top:4px solid var(--brand-primary);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1.5rem}.empty-icon{font-size:4rem;margin-bottom:1rem}.feature-highlights{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}.feature-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--bg-secondary);border-radius:8px;border:1px solid var(--border-primary);text-align:left}.feature-icon{font-size:1.25rem}.error-suggestion{margin-top:1rem;color:var(--text-secondary);font-size:.9rem}@media (max-width: 768px){.new-header{padding:0}.header-content{padding:1rem;flex-direction:column;gap:1rem;text-align:center}.logo-container{flex-direction:column;gap:.75rem}.logo-icon{width:50px;height:50px;font-size:1.25rem}.brand-title{font-size:1.75rem}.header-nav{width:100%;justify-content:center;gap:.75rem}.nav-button{padding:.5rem 1rem;font-size:.9rem}.header-actions{flex-direction:row;justify-content:center;gap:.75rem;flex-wrap:wrap}.language-selector{font-size:.85rem;padding:.375rem .5rem}.theme-toggle{padding:0 10px;font-size:.75rem}.theme-toggle-text{font-size:.75rem}}@media (max-width: 480px){.theme-toggle{width:36px;padding:0}.theme-toggle-text{display:none}.hero-content{padding:1rem}.hero-title{font-size:2rem}.hero-description{font-size:1rem}.investment-sidebar{padding:1rem;border-radius:16px;max-height:calc(100vh - 100px)}.investment-sidebar.step-3-active{max-height:none;height:auto;overflow-y:visible}.asset-type-selector{gap:.5rem}.asset-type-button{padding:.75rem;gap:.75rem}.asset-icon{font-size:1.25rem;width:32px}.product-item{padding:.75rem}.simulation-button{padding:.875rem 1.25rem;font-size:.95rem}.chart-area-main{min-height:450px!important;height:auto!important}.chart-container{height:450px!important;min-height:450px!important;padding:1.25rem!important;flex:none!important}}@media (max-width: 480px){.header-content{padding:.75rem}.brand-title{font-size:1.5rem}.brand-tagline{font-size:.8rem}.hero-title{font-size:1.75rem}.hero-description{font-size:.9rem}.investment-sidebar{padding:.75rem;max-height:calc(100vh - 80px)}.investment-sidebar.step-3-active{max-height:none;height:auto;overflow-y:visible}.asset-type-button{flex-direction:column;text-align:center;gap:.5rem}.amount-input-group,.period-input-group{flex-direction:column;gap:.75rem}.chart-area-main{min-height:400px!important;height:auto!important;gap:1rem}.summary-cards-compact{grid-template-columns:1fr;gap:.5rem;margin-bottom:1rem}.summary-card-compact{padding:.75rem}.card-label{font-size:.75rem}.card-value{font-size:.95rem}.profit-rate-compact{font-size:.8rem}.chart-header{flex-direction:column;align-items:stretch;gap:.5rem}.chart-header-actions{flex-direction:column;gap:.5rem}.currency-selector,.table-modal-button{width:100%;padding:.5rem;font-size:.85rem}.chart-container{height:400px!important;min-height:400px!important;padding:1rem!important;flex:none!important}}.step-title{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0 0 .5rem}.step-description{font-size:.85rem;color:var(--text-secondary);margin:0 0 1rem}.step-header{margin-bottom:1.5rem}.step-panel{opacity:0;animation:fadeIn .3s ease-in-out forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.step-navigation{margin-bottom:1.5rem}.step-indicators{display:flex;gap:.5rem}.step-indicator{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;border:1px solid var(--border-primary);background:transparent;cursor:pointer;transition:all var(--transition-fast);border-radius:8px;color:var(--text-primary)}.step-indicator.enabled{color:var(--text-primary);border-color:var(--border-primary)}.step-indicator.disabled{color:var(--text-secondary);cursor:not-allowed;opacity:.6}.step-indicator.active{background:transparent;color:var(--text-primary);border-color:var(--brand-primary);font-weight:600}.step-indicator:hover:not(.disabled){border-color:var(--brand-primary);background:transparent}.step-number{width:24px;height:24px;border-radius:50%;background:var(--border-primary);color:var(--text-primary);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600}.step-indicator.enabled .step-number{background:var(--border-primary);color:var(--text-primary)}.step-indicator.active .step-number{background:var(--text-primary);color:var(--bg-primary)}.step-label{font-size:.75rem;text-align:center}.chart-area-main{display:flex;flex-direction:column;height:auto;min-height:700px;gap:1.5rem}.summary-cards-compact{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.5rem}.summary-card-compact{background:var(--bg-card);border-radius:12px;padding:1rem;border:1px solid var(--border-primary);box-shadow:var(--shadow-sm);text-align:center}.summary-card-compact.positive{border-color:var(--profit-color);background:linear-gradient(135deg,var(--bg-card) 0%,rgba(164,208,63,.05) 100%)}.summary-card-compact.negative{border-color:var(--loss-color);background:linear-gradient(135deg,var(--bg-card) 0%,rgba(255,107,107,.05) 100%)}.card-label{font-size:.85rem;color:var(--text-secondary);margin-bottom:.5rem}.card-value{font-size:1.1rem;font-weight:700;color:var(--text-primary)}.profit-rate-compact{font-size:.9rem;margin-left:.5rem}.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.chart-header-actions{display:flex;align-items:center;gap:.75rem}.currency-selector{padding:.5rem 1rem;border:1px solid var(--border-primary);border-radius:8px;background:var(--bg-card);color:var(--text-primary);font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;outline:none}.currency-selector:hover:not(:disabled){border-color:var(--brand-primary);background:var(--bg-primary)}.currency-selector:disabled{opacity:.6;cursor:not-allowed}.currency-selector:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px #0033661a}.chart-title{display:flex;flex-direction:column;gap:.5rem}.chart-title h3{font-size:1.2rem;font-weight:700;color:var(--text-primary);margin:0}.asset-info-compact{display:flex;align-items:center;gap:.5rem}.ticker-name{font-size:.9rem;font-weight:600;color:var(--brand-accent)}.asset-type-badge{font-size:.75rem;background:var(--brand-accent);color:var(--bg-primary);padding:.25rem .5rem;border-radius:12px;font-weight:600}.table-view-btn{background:var(--bg-secondary);border:1px solid var(--border-primary);color:var(--text-primary);padding:.5rem 1rem;border-radius:8px;font-size:.85rem;cursor:pointer;transition:all var(--transition-fast)}.table-view-btn:hover{background:var(--brand-primary);color:var(--text-inverse);border-color:var(--brand-primary)}.chart-container{height:600px;min-height:600px;background:var(--bg-card);border-radius:12px;padding:1.5rem;border:1px solid var(--border-primary);box-shadow:var(--shadow-md);flex:1}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:var(--bg-card);border-radius:16px;box-shadow:var(--shadow-xl);border:1px solid var(--border-primary);width:90vw;max-width:1200px;max-height:70vh;display:flex;flex-direction:column;overflow:hidden}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1.5rem;border-bottom:1px solid var(--border-primary);background:var(--bg-secondary)}.modal-title-section{display:flex;flex-direction:column;gap:.5rem}.modal-header h3{font-size:1.2rem;font-weight:700;color:var(--text-primary);margin:0}.modal-subtitle{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--text-secondary)}.asset-type-tag{background:var(--brand-primary);color:var(--text-inverse);padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.modal-close-btn{width:32px;height:32px;border-radius:8px;border:1px solid var(--border-primary);background:var(--bg-card);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast);font-size:1rem}.modal-close-btn:hover{background:var(--loss-color);color:var(--text-inverse);border-color:var(--loss-color)}.modal-body{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}.table-container{margin:0 1.5rem;display:flex;flex-direction:column}.table-scroll{overflow-x:auto;overflow-y:scroll;border:1px solid var(--border-primary);border-radius:8px;scroll-behavior:smooth;height:350px;width:100%;display:block}.table-scroll::-webkit-scrollbar{width:14px;height:14px;display:block}.table-scroll::-webkit-scrollbar-track{background:#f1f1f1;border-radius:7px;margin:2px}.table-scroll::-webkit-scrollbar-thumb{background:#4a90e2;border-radius:7px;border:2px solid #f1f1f1;min-height:20px}.table-scroll::-webkit-scrollbar-thumb:hover{background:#357abd}.table-scroll::-webkit-scrollbar-corner{background:var(--bg-secondary);border-radius:5px}.investment-table{width:100%;border-collapse:collapse;font-size:.85rem;min-width:1000px;display:table}.investment-table th{background:var(--bg-secondary);color:var(--text-primary);font-weight:600;padding:.75rem .5rem;text-align:left;border-bottom:2px solid var(--border-primary);position:sticky;top:0;z-index:10;white-space:nowrap;box-shadow:0 2px 4px #0000001a}.investment-table td{padding:.75rem .5rem;border-bottom:1px solid var(--border-primary);color:var(--text-primary);white-space:nowrap}.investment-table tbody tr:hover{background:var(--bg-secondary)}.unit{font-size:.75rem;color:var(--text-secondary);margin-left:.25rem}.profit-positive{color:var(--profit-color);font-weight:600}.profit-negative{color:var(--loss-color);font-weight:600}.table-summary{padding:1rem 1.5rem;border-top:1px solid var(--border-primary);background:var(--bg-secondary)}.summary-info{font-size:.9rem;color:var(--text-secondary)}.modal-footer{padding:1rem 1.5rem;border-top:1px solid var(--border-primary);display:flex;justify-content:flex-end;background:var(--bg-secondary)}.close-button{background:var(--brand-primary);color:var(--text-inverse);border:none;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.close-button:hover{background:var(--brand-secondary);transform:translateY(-1px)}@media (max-width: 768px){.modal-content{width:95vw;max-height:80vh}.modal-header{padding:1rem}.modal-header h3{font-size:1rem}.table-container{margin:0 1rem}.table-scroll{height:280px}.investment-table{font-size:.75rem;min-width:800px}.table-scroll{-webkit-overflow-scrolling:touch}.investment-table th,.investment-table td{padding:.5rem .25rem}.modal-footer{padding:1rem}.table-scroll::-webkit-scrollbar{width:8px;height:8px}.table-scroll::-webkit-scrollbar-thumb{border:1px solid var(--bg-secondary)}}.legal-page{min-height:100vh;background:var(--bg-primary);padding:2rem 1rem}.legal-container{max-width:800px;margin:0 auto;background:var(--bg-card);border-radius:12px;padding:3rem;box-shadow:var(--shadow-lg);border:1px solid var(--border-primary)}.legal-container h1{color:var(--text-primary);font-size:2.5rem;margin-bottom:1rem;text-align:center;border-bottom:2px solid var(--brand-primary);padding-bottom:1rem}.last-updated{text-align:center;color:var(--text-tertiary);font-size:.9rem;margin-bottom:2rem;font-style:italic}.legal-container section{margin-bottom:2.5rem}.legal-container h2{color:var(--brand-primary);font-size:1.4rem;margin-bottom:1rem;padding-left:.5rem;border-left:4px solid var(--brand-primary)}.legal-container h3{color:var(--text-primary);font-size:1.1rem;margin:1.5rem 0 .75rem;font-weight:600}.legal-container p{color:var(--text-secondary);line-height:1.8;margin-bottom:1rem;text-align:justify}.legal-container ul{margin:1rem 0;padding-left:2rem}.legal-container li{color:var(--text-secondary);line-height:1.7;margin-bottom:.5rem}.legal-container strong{color:var(--text-primary);font-weight:600}.legal-container a{color:var(--brand-primary);text-decoration:none;border-bottom:1px dotted var(--brand-primary);transition:all .3s ease}.legal-container a:hover{color:var(--brand-secondary);border-bottom-color:var(--brand-secondary)}@media (max-width: 768px){.legal-page{padding:1rem .5rem}.legal-container{padding:2rem 1.5rem;margin:0 .5rem}.legal-container h1{font-size:2rem}.legal-container h2{font-size:1.2rem}.legal-container ul{padding-left:1.5rem}}@media (max-width: 480px){.legal-container{padding:1.5rem 1rem}.legal-container h1{font-size:1.8rem}.legal-container h2{font-size:1.1rem}}.date-selector-container{display:flex;align-items:center;gap:2.5rem;padding:2rem 2.5rem;background:var(--gradient-card);border-radius:16px;box-shadow:var(--shadow-lg);border:1px solid var(--border-primary);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-bottom:0;max-width:1350px;margin-left:auto;margin-right:auto;flex:1;position:relative;z-index:100}.date-selector-group{display:flex;flex-direction:column;gap:.75rem;flex:1;position:relative}.date-selector-group label{font-size:.875rem;font-weight:700;color:var(--brand-accent);text-transform:uppercase;letter-spacing:.5px}.date-select-button{padding:1rem 1.25rem;border:2px solid transparent;border-radius:12px;background:var(--bg-card);color:var(--text-primary);font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-align:center;box-shadow:var(--shadow-sm);font-family:Courier New,monospace}.date-select-button:hover{border-color:var(--brand-primary);box-shadow:var(--shadow-md);transform:translateY(-1px);background:var(--bg-primary)}.date-select-button:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 4px #667eea26}.date-selector-divider{font-size:1.5rem;font-weight:900;color:var(--brand-accent);margin-top:2rem;flex-shrink:0;text-shadow:0 2px 4px rgba(0,0,0,.1)}.calendar-popup{position:absolute;top:100%;left:0;margin-top:.75rem;background:var(--gradient-card);border:2px solid var(--border-primary);border-radius:16px;box-shadow:0 20px 40px #00000040;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.5rem;z-index:2000;min-width:340px;animation:slideDown .2s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:2px solid var(--border-primary)}.calendar-month{font-size:1.125rem;font-weight:800;color:var(--text-primary);font-family:Courier New,monospace}.calendar-nav-button{background:var(--bg-card);border:1px solid var(--border-primary);color:var(--text-primary);font-size:1.125rem;cursor:pointer;padding:.5rem .75rem;border-radius:8px;transition:all .2s ease;font-weight:700}.calendar-nav-button:hover{color:var(--brand-primary);border-color:var(--brand-primary);box-shadow:var(--shadow-sm);transform:scale(1.05)}.calendar-grid{display:flex;flex-direction:column;gap:.5rem}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem;margin-bottom:.5rem}.calendar-weekdays>div{text-align:center;font-size:.75rem;font-weight:700;color:var(--brand-accent);padding:.5rem;text-transform:uppercase}.calendar-days{display:flex;flex-direction:column;gap:.375rem}.calendar-week{display:grid;grid-template-columns:repeat(7,1fr);gap:.375rem}.calendar-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border-radius:10px;font-size:.9rem;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);font-weight:600}.calendar-day.empty{cursor:default}.calendar-day.unavailable{color:var(--text-tertiary);cursor:not-allowed;opacity:.25}.calendar-day.available{color:var(--text-primary);background:var(--bg-card);border:2px solid var(--border-primary);box-shadow:var(--shadow-sm)}.calendar-day.available:hover{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:transparent;transform:scale(1.1);box-shadow:0 4px 12px #667eea66;z-index:1}.calendar-day.selected{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:transparent;font-weight:800;box-shadow:0 6px 16px #667eea80;transform:scale(1.05)}.day-number{font-size:.9rem;font-family:Courier New,monospace}[data-theme=dark] .date-selector-container{background:linear-gradient(135deg,#1f2937f2,#111827f2);border-color:#6b72804d}[data-theme=dark] .date-select-button{background:#1f2937cc;border-color:#4b556380;box-shadow:0 2px 8px #0000004d}[data-theme=dark] .date-select-button:hover{background:#111827e6;border-color:var(--brand-primary);box-shadow:0 4px 12px #667eea4d}[data-theme=dark] .date-select-button:focus{border-color:var(--brand-primary);box-shadow:0 0 0 4px #667eea33}[data-theme=dark] .calendar-popup{background:linear-gradient(135deg,#1f2937fa,#111827fa);border-color:#4b556380;box-shadow:0 20px 40px #0009}[data-theme=dark] .calendar-nav-button{background:#1f2937cc;border-color:#4b556380}[data-theme=dark] .calendar-nav-button:hover{background:#111827e6;border-color:var(--brand-primary)}[data-theme=dark] .calendar-day.available{background:#111827cc;border-color:#4b556380;box-shadow:0 2px 6px #0003}[data-theme=dark] .calendar-day.available:hover{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;box-shadow:0 4px 12px #667eea80}@media (max-width: 768px){.date-selector-container{flex-direction:column;gap:1.5rem;padding:1.5rem}.date-selector-divider{margin-top:0;transform:rotate(90deg)}.date-select-button{font-size:1rem;padding:.875rem 1rem}.calendar-popup{min-width:300px;padding:1.25rem}.calendar-month{font-size:1rem}.calendar-nav-button{padding:.375rem .625rem;font-size:1rem}.calendar-day,.day-number{font-size:.8rem}}@media (max-width: 480px){.date-selector-container{padding:1rem;gap:1rem}.date-selector-group label{font-size:.75rem}.date-select-button{font-size:.9rem;padding:.75rem}.date-selector-divider{font-size:1.25rem}.calendar-popup{min-width:280px;padding:1rem}.calendar-header{margin-bottom:1rem;padding-bottom:.75rem}.calendar-month{font-size:.9rem}.calendar-nav-button{padding:.25rem .5rem;font-size:.9rem}.calendar-weekdays>div{font-size:.65rem;padding:.375rem}.calendar-day{font-size:.75rem;border-radius:8px}.day-number{font-size:.75rem}}.industry-tooltip-following{position:fixed;z-index:10000;width:280px;background:#141414fa;border:1px solid rgba(255,255,255,.2);border-radius:8px;box-shadow:0 8px 24px #0009;overflow:hidden;pointer-events:none;transition:opacity .15s ease}.tooltip-following-header{padding:10px 12px;background:#4a90e2e6;color:#fff;font-size:13px;font-weight:600;text-align:left;border-bottom:1px solid rgba(255,255,255,.1)}.tooltip-following-content{padding:8px}.tooltip-stock-row{display:grid;grid-template-columns:80px 80px 70px;gap:8px;padding:6px 8px;align-items:center;border-bottom:1px solid rgba(255,255,255,.05);transition:background .15s ease}.tooltip-stock-row:hover{background:#ffffff0d}.tooltip-stock-row:last-child{border-bottom:none}.tooltip-ticker{font-size:12px;font-weight:700;color:#fff;text-align:left}.tooltip-price{font-size:11px;font-weight:600;color:#e0e0e0;text-align:right}.tooltip-change{font-size:11px;font-weight:600;text-align:right}.tooltip-more{padding:8px;text-align:center;font-size:11px;color:#999;font-style:italic}.tooltip-following-content::-webkit-scrollbar{width:4px}.tooltip-following-content::-webkit-scrollbar-track{background:#ffffff0d}.tooltip-following-content::-webkit-scrollbar-thumb{background:#4a90e299;border-radius:2px}.tooltip-following-content::-webkit-scrollbar-thumb:hover{background:#4a90e2cc}html:not([data-theme=dark]) .industry-tooltip-following{background:#fffffffa;border:1px solid rgba(0,0,0,.15);box-shadow:0 8px 24px #0003}html:not([data-theme=dark]) .tooltip-following-header{background:#4a90e2e6;color:#fff}html:not([data-theme=dark]) .tooltip-stock-row{border-bottom:1px solid rgba(0,0,0,.05)}html:not([data-theme=dark]) .tooltip-stock-row:hover{background:#00000008}html:not([data-theme=dark]) .tooltip-ticker{color:#1e1e1e}html:not([data-theme=dark]) .tooltip-price{color:#333}html:not([data-theme=dark]) .tooltip-more{color:#666}html:not([data-theme=dark]) .tooltip-following-content::-webkit-scrollbar-track{background:#0000000d}.sp500-page{min-height:100vh;padding:2rem;background:var(--bg-primary);position:relative}:root{--sector-technology: #4A90E2;--sector-financial: #50C878;--sector-consumer-cyclical: #FF6B6B;--sector-healthcare: #9B59B6;--sector-industrials: #F39C12;--sector-consumer-defensive: #1ABC9C;--sector-utilities: #3498DB;--sector-real-estate: #E67E22;--sector-communication-services: #E91E63;--sector-energy: #2ECC71;--sector-basic-materials: #95A5A6}.sector-detail-overlay{position:fixed;inset:0;background:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sector-detail-modal{background:var(--bg-primary);border-radius:12px;box-shadow:0 25px 50px #00000080;max-width:95vw;max-height:95vh;display:flex;flex-direction:column;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.sector-detail-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:2px solid var(--border-primary)}.sector-detail-header h2{color:var(--text-primary);font-size:1.75rem;font-weight:700;margin:0}.header-controls{display:flex;align-items:center;gap:1rem}.sector-filter-dropdown{padding:.5rem 1rem;border:2px solid var(--border-primary);border-radius:6px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #667eea4d;min-width:280px;max-width:400px;text-transform:none}.sector-filter-dropdown:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-1px)}.sector-filter-dropdown:focus{outline:none;box-shadow:0 0 0 3px #667eea33}.sector-filter-dropdown option{background:var(--bg-secondary);color:var(--text-primary);font-weight:600;text-transform:none}.ticker-search{padding:.5rem 1rem;border:2px solid var(--border-primary);border-radius:6px;background:var(--bg-secondary);color:var(--text-primary);font-size:1rem;width:200px;transition:all .2s}.ticker-search:focus{outline:none;border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e91a}.ticker-search::placeholder{color:var(--text-secondary)}.close-button{background:transparent;border:none;color:var(--text-secondary);font-size:2rem;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s;flex-shrink:0}.close-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.sector-detail-content{width:1300px;max-height:700px;overflow-y:auto;padding:1.5rem 2rem}.sector-detail-content .no-data{display:flex;align-items:center;justify-content:center;width:100%;height:400px;color:var(--text-secondary);font-size:1.5rem}.stock-table-wrapper{width:100%;overflow-x:auto}.stock-table{width:100%;border-collapse:collapse;font-size:.95rem}.stock-table thead{position:sticky;top:0;background:var(--bg-secondary);z-index:10}.stock-table th{padding:1rem;text-align:left;font-weight:600;color:var(--text-primary);border-bottom:2px solid var(--border-primary);white-space:nowrap}.stock-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s}.stock-table th.sortable:hover{background:var(--bg-tertiary);color:#0ea5e9}.stock-table .sort-icon{display:inline-block;margin-left:.5rem;font-size:.85rem;color:#0ea5e9;min-width:1rem;text-align:center}.stock-table tbody tr{border-bottom:1px solid var(--border-primary);transition:all .2s}.stock-table tbody tr:hover{background:var(--bg-secondary)}.stock-table td{padding:.875rem 1rem;color:var(--text-primary)}.ticker-cell{font-weight:700;color:#0ea5e9;font-family:monospace}.name-cell{color:var(--text-primary)}.change-cell{font-weight:600;font-family:monospace}.change-cell.positive{color:#22c55e}.change-cell.negative{color:#ef4444}.price-cell{font-family:monospace;color:var(--text-primary)}.marketcap-cell{font-family:monospace;color:var(--text-primary);font-weight:600}.sector-cell{color:var(--text-primary);font-size:.875rem;font-weight:600}.industry-cell{color:var(--text-secondary);font-size:.875rem}.sp500-controls{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem;gap:1.5rem;max-width:1350px;margin-left:auto;margin-right:auto}.sp500-search-button{display:flex;align-items:center;gap:.625rem;padding:1rem 1.75rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;box-shadow:0 4px 12px #667eea40;flex-shrink:0;margin-top:1.5rem}.sp500-search-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.sp500-search-button:active{transform:translateY(0)}.sp500-search-button svg{flex-shrink:0;width:20px;height:20px}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:1rem}.loading-spinner{width:50px;height:50px;border:4px solid var(--border-primary);border-top-color:#0ea5e9;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-container h2{color:var(--text-primary);margin-bottom:.5rem}.error-container p{color:var(--text-secondary);margin-bottom:1rem}.error-container button{padding:.75rem 1.5rem;background:#0ea5e9;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .2s}.error-container button:hover{background:#0284c7;transform:translateY(-1px)}.sp500-canvas{position:relative;width:1880px;height:1020px;border:2px solid var(--border-primary);box-shadow:var(--shadow-lg);margin:0 auto;z-index:1}html[data-theme=dark] .sp500-canvas{background:#000;border:2px solid #333}html:not([data-theme=dark]) .sp500-canvas{background:#f8f9fa;border:2px solid #d0d0d0}.sector-box{position:absolute;border-radius:0;transition:all .3s ease}html[data-theme=dark] .sector-box{border:2px solid #444;background:#1e1e1ecc}html[data-theme=dark] .sector-box:hover{background:#323232e6;border-color:#0ea5e9;z-index:10}html:not([data-theme=dark]) .sector-box{border:2px solid #b0b0b0;background:#ffffffbf}html:not([data-theme=dark]) .sector-box:hover{background:#f0f5fff2;border-color:#0ea5e9;z-index:10}.sector-box[data-sector=TECHNOLOGY]{border-top:4px solid var(--sector-technology);background:linear-gradient(135deg,#4a90e226,#4a90e20d);box-shadow:0 4px 12px #4a90e24d}.sector-box[data-sector=FINANCIAL]{border-top:4px solid var(--sector-financial);background:linear-gradient(135deg,#50c87826,#50c8780d);box-shadow:0 4px 12px #50c8784d}.sector-box[data-sector="CONSUMER CYCLICAL"]{border-top:4px solid var(--sector-consumer-cyclical);background:linear-gradient(135deg,#ff6b6b26,#ff6b6b0d);box-shadow:0 4px 12px #ff6b6b4d}.sector-box[data-sector=HEALTHCARE]{border-top:4px solid var(--sector-healthcare);background:linear-gradient(135deg,#9b59b626,#9b59b60d);box-shadow:0 4px 12px #9b59b64d}.sector-box[data-sector=INDUSTRIALS]{border-top:4px solid var(--sector-industrials);background:linear-gradient(135deg,#f39c1226,#f39c120d);box-shadow:0 4px 12px #f39c124d}.sector-box[data-sector="CONSUMER DEFENSIVE"]{border-top:4px solid var(--sector-consumer-defensive);background:linear-gradient(135deg,#1abc9c26,#1abc9c0d);box-shadow:0 4px 12px #1abc9c4d}.sector-box[data-sector=UTILITIES]{border-top:4px solid var(--sector-utilities);background:linear-gradient(135deg,#3498db26,#3498db0d);box-shadow:0 4px 12px #3498db4d}.sector-box[data-sector="REAL ESTATE"]{border-top:4px solid var(--sector-real-estate);background:linear-gradient(135deg,#e67e2226,#e67e220d);box-shadow:0 4px 12px #e67e224d}.sector-box[data-sector="COMMUNICATION SERVICES"]{border-top:4px solid var(--sector-communication-services);background:linear-gradient(135deg,#e91e6326,#e91e630d);box-shadow:0 4px 12px #e91e634d}.sector-box[data-sector=ENERGY]{border-top:4px solid var(--sector-energy);background:linear-gradient(135deg,#2ecc7126,#2ecc710d);box-shadow:0 4px 12px #2ecc714d}.sector-box[data-sector="BASIC MATERIALS"]{border-top:4px solid var(--sector-basic-materials);background:linear-gradient(135deg,#95a5a626,#95a5a60d);box-shadow:0 4px 12px #95a5a64d}.sector-header{position:absolute;top:6px;left:6px;z-index:100;display:flex;justify-content:flex-start;align-items:center;padding:0;gap:4px;pointer-events:auto}.sector-header.small{top:4px;left:4px;gap:2px}.sector-name{font-size:16px;font-weight:700;text-align:left;line-height:1.2;flex:1}html[data-theme=dark] .sector-name{color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.9)}html:not([data-theme=dark]) .sector-name{color:#1a1a1a;text-shadow:1px 1px 2px rgba(255,255,255,.8)}.sector-name.small{font-size:10px;line-height:1.1}.detail-button{padding:3px 8px;background:#0ea5e9cc;color:#fff;border:1px solid rgba(14,165,233,1);border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;flex-shrink:0;line-height:1}.detail-button.icon-only{padding:3px;min-width:15px;height:15px;display:flex;align-items:center;justify-content:center}.detail-button.icon-only svg{width:10px;height:10px}.detail-button:hover{background:#0ea5e9;transform:translateY(-1px);box-shadow:0 2px 4px #00000080}.detail-button:active{transform:translateY(0)}.sector-content{position:absolute;inset:0;border-radius:0;border:none;background:transparent}@media (max-width: 1024px){.sp500-page{padding:1rem}.sp500-canvas{width:100%;height:auto;aspect-ratio:3/2}.sp500-controls{flex-direction:column;align-items:stretch}.sp500-search-button{width:100%;justify-content:center}.sector-detail-content{width:100%;max-height:80vh;padding:1rem}.stock-table{font-size:.85rem}.stock-table th,.stock-table td{padding:.75rem .5rem}.sector-filter-dropdown{min-width:250px;max-width:350px;font-size:.875rem}.ticker-search{width:150px;font-size:.875rem}}@media (max-width: 768px){.sp500-page{padding:.5rem}.sp500-controls{gap:.75rem}.sp500-search-button{padding:.625rem 1rem;font-size:.9rem}.sector-detail-header{flex-direction:column;align-items:stretch;padding:1rem;gap:.75rem}.sector-detail-header h2{font-size:1.25rem;text-align:center}.header-controls{flex-direction:column;gap:.75rem}.sector-filter-dropdown{width:100%;font-size:.9rem;min-width:auto}.ticker-search{width:100%}.close-button{position:absolute;top:.75rem;right:.75rem}.sector-detail-content{padding:.75rem;max-height:75vh}.stock-table{font-size:.75rem}.stock-table th,.stock-table td{padding:.5rem .25rem}.name-cell,.industry-cell{white-space:normal;word-break:break-word;min-width:80px}.ticker-cell{white-space:nowrap}.change-cell,.price-cell,.marketcap-cell{white-space:nowrap;min-width:60px}}@media (max-width: 480px){.sp500-page{padding:.25rem}.sp500-search-button{padding:.5rem .75rem;font-size:.85rem}.sp500-search-button span{display:none}.sector-detail-modal{max-width:100vw;max-height:100vh;border-radius:0}.sector-detail-header{padding:.75rem}.sector-detail-header h2{font-size:1.1rem;padding-right:40px}.sector-detail-content{padding:.5rem;max-height:calc(100vh - 150px)}.stock-table{font-size:.7rem}.stock-table th,.stock-table td{padding:.375rem .125rem}.stock-table .sort-icon{margin-left:.25rem;font-size:.7rem}.marketcap-cell{font-size:.65rem}}
