*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0d1117;--bg-card:#161b22;--bg-hover:#1c2333;--border:#30363d;--text:#e6edf3;--text-muted:#8b949e;--green:#00c853;--red:#ff1744;--pill-bg:#21262d;--pill-active:#30363d;--font-mono:"JetBrains Mono", "Fira Code", "SF Mono", "Cascadia Code", monospace;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);min-height:100vh;line-height:1.5}#app{max-width:1200px;margin:0 auto;padding:2rem 1.5rem}.site-nav{border-bottom:1px solid var(--border);gap:1.5rem;max-width:1200px;margin:0 auto;padding:1rem 1.5rem;display:flex}.site-nav a{color:var(--text-muted);font-size:.875rem;text-decoration:none;transition:color .15s}.site-nav a:hover,.site-nav a.active{color:var(--text)}.site-nav a.active{font-weight:600}.header-row{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.dashboard-header h1{font-family:var(--font-mono);color:var(--text);letter-spacing:-.02em;font-size:1.5rem;font-weight:600}.header-btn{font-family:var(--font-mono);border:1px solid var(--border);background:var(--pill-bg);color:var(--text-muted);cursor:pointer;border-radius:6px;padding:.4rem .9rem;font-size:.8rem;transition:all .15s}.header-btn:hover{background:var(--pill-active);color:var(--text)}.header-actions{align-items:center;gap:.5rem;display:flex}.budget-indicator{font-family:var(--font-mono);background:var(--pill-bg);border:1px solid var(--border);border-radius:4px;padding:.25rem .6rem;font-size:.7rem}.budget-normal{color:var(--text-muted)}.budget-cautious{color:#ffa726;border-color:#ffa726}.budget-critical{color:var(--red);border-color:var(--red)}.budget-exhausted{color:var(--red);border-color:var(--red);background:#ff17441a}.budget-warning{font-family:var(--font-mono);color:var(--red);background:#ff174414;border:1px solid #ff17444d;border-radius:6px;margin-top:.75rem;padding:.5rem .75rem;font-size:.75rem}.header-btn-icon{padding:.3rem .6rem;font-size:1rem}.watchlist-tabs{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}.tab-wrap{display:inline-flex;position:relative}.tab-delete{border:1px solid var(--border);background:var(--bg);width:18px;height:18px;color:var(--red);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.7rem;line-height:1;display:flex;position:absolute;top:-6px;right:-6px}.tab-delete:hover{background:var(--red);color:var(--text);border-color:var(--red)}.tab-add{color:var(--text-muted);border-style:dashed}.watchlist-tab{font-family:var(--font-mono);border:1px solid var(--border);background:var(--pill-bg);color:var(--text-muted);cursor:pointer;border-radius:9999px;padding:.4rem 1rem;font-size:.8rem;transition:all .15s}.watchlist-tab:hover{background:var(--pill-active);color:var(--text)}.watchlist-tab.active{background:var(--text);color:var(--bg);border-color:var(--text)}.controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.time-range-toggle{background:var(--pill-bg);border:1px solid var(--border);border-radius:6px;gap:.25rem;padding:3px;display:flex}.time-btn{font-family:var(--font-mono);color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:.3rem .7rem;font-size:.75rem;transition:all .15s}.time-btn:hover{color:var(--text)}.time-btn.active{background:var(--pill-active);color:var(--text)}.sort-control{align-items:center;gap:.5rem;display:flex}.sort-label{font-family:var(--font-mono);color:var(--text-muted);font-size:.75rem}.sort-btn{font-family:var(--font-mono);border:1px solid var(--border);background:var(--pill-bg);color:var(--text-muted);cursor:pointer;border-radius:4px;padding:.3rem .7rem;font-size:.75rem;transition:all .15s}.sort-btn:hover{background:var(--pill-active);color:var(--text)}.sort-btn.active{color:var(--text);border-color:var(--text-muted)}.card-grid{grid-template-columns:repeat(4,1fr);gap:1rem;display:grid}@media (width<=1024px){.card-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=768px){.card-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=480px){.card-grid{grid-template-columns:1fr}}.stock-card{background:var(--bg-card);border:1px solid var(--border);cursor:default;border-radius:8px;flex-direction:column;gap:.75rem;padding:1rem;transition:all .15s;display:flex}.stock-card:hover{background:var(--bg-hover);border-color:var(--text-muted)}.card-header{justify-content:space-between;align-items:flex-start;display:flex}.card-ticker{font-family:var(--font-mono);color:var(--text);font-size:1rem;font-weight:700}.card-name{color:var(--text-muted);margin-top:.1rem;font-size:.7rem}.card-right{text-align:right}.card-price{font-family:var(--font-mono);color:var(--text-muted);margin-top:.15rem;font-size:.7rem}.card-change{font-family:var(--font-mono);text-align:right;font-size:.85rem;font-weight:600}.card-change.positive{color:var(--green)}.card-change.negative{color:var(--red)}.sparkline-container{width:100%;height:48px}.sparkline-canvas{width:100%;height:100%;display:block}.card-footer{justify-content:flex-end;display:flex}.summary-btn{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;font-size:.7rem;font-family:var(--font-mono);background:0 0;border-radius:4px;align-items:center;gap:.3rem;padding:.25rem .5rem;transition:all .15s;display:flex}.summary-btn:hover{color:var(--text);border-color:var(--text-muted)}.summary-icon{font-size:.85rem;line-height:1}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#000000b3;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:fixed;inset:0}.modal-overlay.hidden{display:none}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:90%;max-width:500px;padding:2rem;position:relative}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.5rem;line-height:1;transition:color .15s;position:absolute;top:1rem;right:1rem}.modal-close:hover{color:var(--text)}.modal-title{font-family:var(--font-mono);color:var(--text);margin-bottom:1rem;font-size:1.1rem;font-weight:700}.modal-body{color:var(--text-muted);font-size:.85rem;line-height:1.7}.modal-section{margin-bottom:1rem}.modal-section-title{font-family:var(--font-mono);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem;font-size:.75rem}.modal-change{font-family:var(--font-mono);font-weight:600}.modal-change.positive{color:var(--green)}.modal-change.negative{color:var(--red)}.modal-price-row{align-items:baseline;gap:.75rem;display:flex}.modal-price{font-family:var(--font-mono);color:var(--text);font-size:1.3rem;font-weight:700}.modal-detail{font-family:var(--font-mono);color:var(--text);font-size:.85rem}.modal-stat-row{border-bottom:1px solid var(--border);justify-content:space-between;padding:.25rem 0;display:flex}.modal-stat-label{color:var(--text-muted);font-size:.8rem}.modal-stat-value{font-family:var(--font-mono);color:var(--text);font-size:.8rem}.remove-btn{border:1px solid var(--red);color:var(--red);cursor:pointer;font-size:.7rem;font-family:var(--font-mono);background:0 0;border-radius:4px;padding:.25rem .6rem;transition:all .15s}.remove-btn:hover{background:var(--red);color:var(--text)}.add-card{text-align:center;border-style:dashed;justify-content:center;align-items:center;gap:.75rem}.add-card-title{font-family:var(--font-mono);color:var(--text-muted);font-size:.9rem}.add-input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-mono);text-align:center;text-transform:uppercase;border-radius:4px;padding:.5rem;font-size:.85rem}.add-input::placeholder{color:var(--text-muted);text-transform:none}.add-input:focus{border-color:var(--text-muted);outline:none}.add-btn{background:var(--pill-bg);border:1px solid var(--border);color:var(--text);cursor:pointer;font-family:var(--font-mono);border-radius:4px;padding:.4rem 1.2rem;font-size:.8rem;transition:all .15s}.add-btn:hover{background:var(--pill-active)}.empty-state{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:3rem 1rem}.empty-hint{opacity:.6;margin-top:.5rem;font-size:.85rem}.skeleton{background:var(--bg-card);min-height:140px;position:relative;overflow:hidden}.skeleton:after{content:"";background:linear-gradient(90deg,#0000,#ffffff0a,#0000);animation:1.5s infinite shimmer;position:absolute;inset:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.api-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.api-box{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:1rem;width:90%;max-width:420px;padding:2.5rem;display:flex}.api-box-title{font-family:var(--font-mono);color:var(--text);font-size:1.2rem;font-weight:700}.api-box-desc{color:var(--text-muted);font-size:.875rem;line-height:1.6}.api-box-link{font-family:var(--font-mono);color:var(--green);font-size:.8rem;text-decoration:none}.api-box-link:hover{text-decoration:underline}.api-input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-mono);border-radius:6px;padding:.7rem .8rem;font-size:.85rem}.api-input:focus{border-color:var(--text-muted);outline:none}.api-error{color:var(--red);font-size:.8rem}.api-btn{background:var(--text);color:var(--bg);font-family:var(--font-mono);cursor:pointer;border:none;border-radius:6px;padding:.7rem;font-size:.85rem;font-weight:600;transition:opacity .15s}.api-btn:hover{opacity:.9}.api-btn:disabled{opacity:.5;cursor:not-allowed}