.navbar{display:flex;justify-content:space-between;align-items:center;padding:14px 30px;background-color:var(--navbar-bg);color:var(--navbar-text);box-shadow:0 5px 20px #0000001f;position:sticky;top:0;z-index:100;transition:background-color .4s ease,color .4s ease,box-shadow .4s ease;border-bottom:1px solid rgba(255,255,255,.1);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.navbar-left{display:flex;align-items:center}.logo{font-size:26px;font-weight:700;letter-spacing:1px;color:var(--navbar-text)}.navbar-right{display:flex;align-items:center;gap:16px}.theme-toggle{background:#ffffff1a;border:none;padding:8px 12px;border-radius:8px;font-size:20px;cursor:pointer;color:var(--navbar-text);transition:all .3s ease;display:flex;align-items:center;justify-content:center}.theme-toggle:hover{background:#fff3;transform:scale(1.15)}:root{--navbar-bg: #1e3a8a;--navbar-text: #ffffff}.dark{--navbar-bg: #1f2937;--navbar-text: #f3f4f6}body{transition:background-color .4s ease,color .4s ease}@media (max-width: 768px){.navbar{flex-direction:column;padding:12px 16px;gap:10px}.logo{font-size:22px;text-align:center}.navbar-right{justify-content:center}}.search-bar{display:flex;width:90%;max-width:700px;margin:20px auto;border-radius:12px;overflow:hidden;transition:all .3s ease;box-shadow:0 6px 18px #0000001a}.search-bar input{flex:1;padding:14px 18px;font-size:16px;border:1px solid #ccc;outline:none;border-radius:12px 0 0 12px;transition:all .3s ease}.search-bar input:focus{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb4d}.search-bar button{padding:0 20px;font-size:18px;border:none;border-radius:0 12px 12px 0;cursor:pointer;transition:all .3s ease}.search-bar button:hover{transform:scale(1.1)}.search-bar.light{background:#f9fafb}.search-bar.light input{background:#fff;color:#111827}.search-bar.light input::placeholder{color:#9ca3af}.search-bar.light .search-btn{background:#2563eb;color:#fff}.search-bar.light .search-btn:hover{background:#1d4ed8}.search-bar.dark{background:#1f2937}.search-bar.dark input{background:#111827;color:#f3f3f3;border:1px solid #4b5563}.search-bar.dark input::placeholder{color:#9ca3af}.search-bar.dark .search-btn{background:#2563eb;color:#fff}.search-bar.dark .search-btn:hover{background:#1d4ed8}@media (max-width: 600px){.search-bar{flex-direction:column;gap:10px}.search-bar input,.search-bar button{width:100%;border-radius:12px}}.stock-card{border-radius:12px;padding:16px 20px;margin:10px;width:180px;max-width:100%;text-align:center;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease,background .3s ease;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 4px 12px #0000001a}.stock-card:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 10px 25px #00000040}.stock-card h3{font-size:18px;margin-bottom:12px;font-weight:600;transition:color .3s ease;word-wrap:break-word}.price{font-size:16px;margin-bottom:8px;font-weight:500;transition:color .3s ease}.positive{color:#10b981;font-weight:700}.negative{color:#ef4444;font-weight:700}.stock-card.light{background-color:#fff;color:#111827;border:1px solid #e5e7eb}.stock-card.light .price{color:#2563eb}.stock-card.light .positive{color:#10b981}.stock-card.light .negative{color:#ef4444}.stock-card.dark{background-color:#1f2937;color:#f3f4f6;border:1px solid #374151}.stock-card.dark .price{color:#60a5fa}.stock-card.dark .positive{color:#22c55e}.stock-card.dark .negative{color:#f87171}@media (max-width: 768px){.stock-card{width:45%;padding:14px}}@media (max-width: 480px){.stock-card{width:90%;padding:12px}.stock-card h3{font-size:16px}.price{font-size:14px}}.loader-container{display:flex;justify-content:center;align-items:center;height:150px;width:100%}.loader{border:6px solid #e0e0e0;border-top:6px solid #2563eb;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;transition:border .3s ease,border-top .3s ease}.dark .loader{border:6px solid #4b5563;border-top:6px solid #fbbf24}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.stock-list{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:20px;width:100%;box-sizing:border-box;transition:all .3s ease}.stock-card{flex:1 1 200px;max-width:250px;background-color:#fff;border-radius:12px;padding:16px;text-align:center;box-shadow:0 4px 20px #00000014;transition:all .3s ease;cursor:pointer;min-width:180px}.stock-card:hover{transform:translateY(-5px);box-shadow:0 6px 25px #00000026}.stock-list.dark .stock-card{background-color:#1f2937;color:#f3f4f6;box-shadow:0 4px 20px #0000004d}.stock-list.dark .stock-card:hover{box-shadow:0 6px 25px #00000080}.stock-card h3{font-size:18px;font-weight:600;margin-bottom:8px}.stock-card p{font-size:15px;margin:4px 0}.stock-card .positive{color:#10b981;font-weight:700}.stock-card .negative{color:#ef4444;font-weight:700}.stock-list p{font-size:16px;font-weight:500;color:#6b7280}.stock-list.dark p{color:#d1d5db}@media (max-width: 1024px){.stock-card{flex:1 1 220px}}@media (max-width: 768px){.stock-card{flex:1 1 90%;max-width:90%}}@media (max-width: 480px){.stock-card{padding:12px;font-size:14px}}.stock-details{margin:20px 0;padding:25px;width:95%;min-height:100vh;display:flex;flex-direction:column;align-items:center;gap:25px;transition:all .3s ease;box-sizing:border-box;border-radius:10px}.stock-details.light{background:linear-gradient(135deg,#f0f4ff,#e2ebff);color:#1f2937}.stock-details.dark{background:linear-gradient(135deg,#1e293b,#111827);color:#f3f4f6}.selected-stock-info.full-width{display:flex;flex-direction:column;align-items:center;width:95%;max-width:1400px;background-color:#fffc;border-radius:12px;padding:25px;box-shadow:0 6px 30px #0000001f;transition:all .3s ease;box-sizing:border-box}.selected-stock-info.full-width,.chart-section{margin-left:auto;margin-right:auto}.stock-details.dark .selected-stock-info.full-width{background-color:#1f2937cc;box-shadow:0 6px 30px #0000004d}.stock-title{font-size:28px;font-weight:700;margin-bottom:25px;text-align:center;width:100%}.stock-metrics{display:flex;flex-wrap:wrap;justify-content:space-around;width:100%;gap:25px}.metric{display:flex;flex-direction:column;align-items:center;min-width:150px}.metric .label{font-size:14px;color:#6b7280;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.metric .value{font-size:20px;font-weight:600}.metric .value.positive{color:#10b981}.metric .value.negative{color:#ef4444}.chart-section{width:95%;max-width:1400px;background-color:#fffc;border-radius:15px;padding:25px;box-shadow:0 6px 30px #0000001f;transition:all .3s ease;box-sizing:border-box}.stock-details.dark .chart-section{background-color:#1f2937cc;box-shadow:0 6px 30px #00000059}.no-data{text-align:center;font-size:16px;font-weight:500;margin:20px auto;padding:16px 24px;border-radius:8px;max-width:600px;line-height:1.5;transition:all .3s ease,color .3s ease,background-color .3s ease;border-left:4px solid}.no-data.light{background-color:#f9fafb;color:#1f2937;border-color:#2563eb}.no-data.dark{background-color:#1f2937;color:#f3f4f6;border-color:#fbbf24}.loader-wrapper{display:flex;justify-content:center;align-items:center;height:300px;width:100%}@media (max-width: 1024px){.stock-metrics{justify-content:center;gap:20px}}@media (max-width: 768px){.selected-stock-info.full-width,.chart-section{padding:20px;width:95%}.stock-metrics{flex-direction:column;align-items:center;gap:15px}.stock-title{font-size:24px}.metric .value{font-size:18px}}@media (max-width: 480px){.selected-stock-info.full-width,.chart-section{padding:15px;width:95%}.stock-title{font-size:20px}.metric .value{font-size:16px}}.dashboard{padding:20px;background-color:#f8fafc;min-height:100vh;text-align:center;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:20px}.dashboard.dark{background-color:#111827;color:#f3f4f6}.dashboard h2{font-size:28px;font-weight:700;margin-bottom:20px;color:#1e3a8a;transition:color .3s ease}.dashboard.dark h2{color:#60a5fa}@media (max-width: 1024px){.dashboard{padding:15px}.dashboard h2{font-size:26px}}@media (max-width: 768px){.dashboard{padding:12px}.dashboard h2{font-size:24px}}@media (max-width: 480px){.dashboard{padding:10px}.dashboard h2{font-size:22px}}.app{font-family:Arial,sans-serif;background-color:#f3f4f6;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}