:root{--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg-color: #f0f4f8;--text-primary: #1a202c;--text-secondary: #5a667b;--border-color: rgba(255, 255, 255, .4);--shadow-color: rgba(0, 0, 0, .05);--card-bg: rgba(255, 255, 255, .6);--card-blur: 10px}body{margin:0;font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-primary);background-image:linear-gradient(120deg,#f0f4f8,#d9e2ec);min-height:100vh}main{padding:2rem 1.5rem;max-width:1200px;margin:0 auto}header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2rem;background-color:var(--card-bg);box-shadow:0 4px 30px var(--shadow-color);backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border-bottom:1px solid var(--border-color);border-radius:0 0 12px 12px;margin:0 auto;max-width:1200px;position:relative;z-index:1000}header h1{margin:0;font-size:1.5rem;font-weight:600}.search-icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);width:1.25rem;height:1.25rem;color:var(--text-secondary);pointer-events:none}.search-container input{padding:.75rem 1rem .75rem 2.5rem;border:1px solid var(--border-color);border-radius:8px;width:250px;background-color:#ffffff80;font-family:var(--font-family);font-size:.9rem}.search-container input:focus{outline:2px solid #3182ce;border-color:#3182ce}.search-container{position:relative}.search-results{position:absolute;top:100%;left:0;right:0;background-color:#ffffffe6;backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border:1px solid var(--border-color);box-shadow:0 8px 16px var(--shadow-color);border-radius:8px;list-style:none;padding:.5rem 0;margin-top:.5rem;z-index:100;overflow:hidden}.search-results li{padding:.75rem 1.25rem;cursor:pointer;transition:background-color .2s ease}.search-results li:hover{background-color:#007aff1a}button{padding:.6rem 1rem;font-family:var(--font-family);font-size:.9rem;font-weight:500;background-color:#fff;border:1px solid #dcdcdc;border-radius:8px;cursor:pointer;transition:all .2s ease}button:hover{border-color:#aaa;box-shadow:0 2px 4px var(--shadow-color)}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}.empty-dashboard-message{text-align:center;margin-top:4rem;color:var(--text-secondary);background-color:var(--card-bg);padding:3rem;border-radius:12px;box-shadow:0 8px 32px var(--shadow-color);backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border:1px solid var(--border-color)}.empty-dashboard-message h2{margin-top:0}.weather-card{background-color:var(--card-bg);box-shadow:0 8px 32px var(--shadow-color);backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border:1px solid var(--border-color);border-radius:16px;padding:1.5rem;text-decoration:none;color:var(--text-primary);display:flex;flex-direction:column;transition:all .3s ease}.weather-card:hover{box-shadow:0 12px 40px #00000014;transform:translateY(-5px)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.card-header h3{margin:0;font-weight:600}.remove-btn{background:none;border:none;font-size:1.5rem;color:var(--text-secondary);cursor:pointer;transition:color .2s ease}.remove-btn:hover{color:#e53e3e}.card-body{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.card-body img{width:80px;height:80px;margin-right:1rem}.card-body .temp{font-size:3rem;font-weight:600;line-height:1}.card-footer{display:flex;justify-content:space-between;text-align:left;font-size:.9rem;color:var(--text-secondary);margin-top:auto}.card-footer p{margin:.25rem 0 0;font-weight:600;color:var(--text-primary)}.detailed-view-container{max-width:1000px;margin:0 auto}.back-link{display:inline-flex;align-items:center;margin-bottom:1rem;font-size:1rem;font-weight:500;color:#007aff;text-decoration:none;padding:.5rem 1rem;background-color:var(--card-bg);border-radius:8px;transition:all .2s ease}.back-link:hover{background-color:#ffffffe6;box-shadow:0 4px 10px var(--shadow-color)}.current-details-header{background:var(--card-bg);border-radius:16px;box-shadow:0 8px 32px var(--shadow-color);backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border:1px solid var(--border-color);padding:2rem;display:grid;grid-template-columns:1fr 1fr;gap:2rem}.current-temp p{font-size:4rem}.current-temp span{font-size:2rem}.header-left h3{font-size:1.2rem;font-weight:400;color:var(--text-secondary);text-transform:capitalize}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-content:center;font-size:1rem}.stats-grid div{background:#f0f4f8b3;padding:.85rem;border-radius:8px}.stats-grid strong{color:var(--text-secondary)}.charts-section{margin-top:2rem;display:grid;grid-template-columns:1fr;gap:2rem}.chart-container{background:var(--card-bg);border-radius:16px;box-shadow:0 8px 32px var(--shadow-color);backdrop-filter:blur(var(--card-blur));-webkit-backdrop-filter:blur(var(--card-blur));border:1px solid var(--border-color);padding:1.5rem}.chart-container h3{margin-top:0;text-align:center;font-weight:600}.weather-card.loading{padding:1.5rem;background-color:var(--card-bg)}.loading-fullscreen{text-align:center;font-size:1.5rem;padding:4rem}@keyframes pulse{0%{background-color:#dcdcdc80}50%{background-color:#c8c8c880}to{background-color:#dcdcdc80}}.skeleton{animation:pulse 1.5s cubic-bezier(.4,0,.6,1) infinite;background-color:#ddd;border-radius:4px}.skeleton-text{height:1em}.skeleton-img{height:80px;width:80px;border-radius:50%}@media(max-width:768px){.current-details-header{grid-template-columns:1fr}}@media(max-width:600px){header{flex-direction:column;gap:1rem;border-radius:0}.search-container input{width:90vw}.stats-grid{grid-template-columns:1fr}}.header-right{display:flex;align-items:center;gap:1rem}.login-button{background-color:#4285f4;color:#fff;border:none}.login-button:hover{background-color:#357ae8}.user-profile{display:flex;align-items:center;gap:.75rem}.user-profile img{width:40px;height:40px;border-radius:50%}.logout-button{background-color:#f1f1f1}.logout-button:hover{background-color:#e7e7e7}