*{margin:0;padding:0;box-sizing:border-box}:root{--primary-bg: #0f1421;--secondary-bg: #1a1f2e;--card-bg: #22283c;--accent-color: #2962ff;--positive-color: #00c853;--negative-color: #ff1744;--neutral-color: #78909c;--text-primary: #ffffff;--text-secondary: #b0b8c5;--border-radius: 12px;--transition: all .3s ease;--shadow: 0 4px 20px rgba(0, 0, 0, .25)}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:var(--primary-bg);color:var(--text-primary);min-height:100vh}.crypto-tracker{min-height:100vh;padding:2rem 1rem}.container{max-width:1400px;margin:0 auto}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.header-content h1{font-size:2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.header-content p{color:var(--text-secondary);font-size:1.1rem}.refresh-btn{background:var(--accent-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:.5rem}.refresh-btn:hover:not(:disabled){background:#1e88e5;transform:translateY(-2px);box-shadow:var(--shadow)}.refresh-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.refresh-btn.refreshing{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.market-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}.summary-card{background:var(--card-bg);padding:1.5rem;border-radius:var(--border-radius);text-align:center;border:1px solid rgba(255,255,255,.1)}.summary-card h3{color:var(--text-secondary);font-size:.9rem;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.5px}.summary-card p{font-size:1.5rem;font-weight:700}.summary-card .positive{color:var(--positive-color)}.summary-card .negative{color:var(--negative-color)}.error-banner{background:var(--negative-color);color:#fff;padding:1rem;border-radius:var(--border-radius);margin-bottom:2rem}.error-content{display:flex;align-items:center;gap:1rem;justify-content:space-between;flex-wrap:wrap}.error-icon{font-size:1.2rem}.retry-btn{background:#fff3;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;transition:var(--transition)}.retry-btn:hover{background:#ffffff4d}.loading-state{text-align:center;padding:3rem;color:var(--text-secondary)}.spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.1);border-left:4px solid var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}.crypto-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem;margin-bottom:2rem}.crypto-card{background:var(--card-bg);border-radius:var(--border-radius);padding:1.5rem;border:2px solid transparent;transition:var(--transition);position:relative;overflow:hidden}.crypto-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--neutral-color);transition:var(--transition)}.crypto-card.up:before{background:var(--positive-color)}.crypto-card.down:before{background:var(--negative-color)}.crypto-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#ffffff1a}.crypto-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.crypto-info{display:flex;align-items:center;gap:1rem}.crypto-icon{width:48px;height:48px;border-radius:50%}.crypto-names{display:flex;flex-direction:column}.crypto-name{font-size:1.2rem;font-weight:700;margin-bottom:.25rem}.crypto-symbol{color:var(--text-secondary);font-size:.9rem;text-transform:uppercase}.market-cap-rank{background:#ffffff1a;padding:.25rem .5rem;border-radius:6px;font-size:.8rem;font-weight:700}.crypto-price{margin-bottom:1.5rem}.price-amount{font-size:1.8rem;font-weight:700;margin-bottom:.5rem}.percentage{font-weight:700;font-size:1rem}.percentage.positive{color:var(--positive-color)}.percentage.negative{color:var(--negative-color)}.crypto-stats{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1rem}.stat{display:flex;justify-content:space-between;align-items:center;font-size:.9rem}.stat-label{color:var(--text-secondary)}.stat-value{font-weight:600}.stat-value.positive{color:var(--positive-color)}.stat-value.negative{color:var(--negative-color)}.price-indicator{position:absolute;top:1rem;right:1rem;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;background:#ffffff1a}.price-indicator.up{background:#00c85333;color:var(--positive-color)}.price-indicator.down{background:#ff174433;color:var(--negative-color)}.footer{margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1)}.footer-content{text-align:center;color:var(--text-secondary)}.footer-content p{margin-bottom:.5rem}@media (max-width: 768px){.crypto-tracker{padding:1rem}.header{flex-direction:column;text-align:center}.header-content h1{font-size:2rem}.market-summary{grid-template-columns:repeat(2,1fr)}.crypto-grid,.crypto-stats{grid-template-columns:1fr}.error-content{flex-direction:column;text-align:center;gap:.5rem}}@media (max-width: 480px){.market-summary{grid-template-columns:1fr}.crypto-card{padding:1rem}.price-amount{font-size:1.5rem}.crypto-header{flex-direction:column;gap:.5rem;align-items:flex-start}.market-cap-rank{align-self:flex-start}}@keyframes highlightUpdate{0%{background-color:transparent}50%{background-color:#2962ff1a}to{background-color:transparent}}.crypto-card.up,.crypto-card.down{animation:highlightUpdate 1s ease}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%}