:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#fff7ed;color:#24140a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--card: rgba(255, 255, 255, .72);--card-strong: rgba(255, 255, 255, .9);--line: rgba(236, 126, 34, .22);--muted: rgba(89, 55, 31, .74);--soft: rgba(89, 55, 31, .56);--accent: #f97316;--accent-strong: #fb923c;--shadow: 0 18px 54px rgba(154, 74, 14, .13);--hover-shadow: 0 24px 60px rgba(249, 115, 22, .2)}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;background:radial-gradient(circle at top left,rgba(255,184,107,.52),transparent 29rem),radial-gradient(circle at 88% 10%,rgba(255,126,61,.28),transparent 28rem),radial-gradient(circle at 50% 100%,rgba(255,220,168,.5),transparent 32rem),linear-gradient(135deg,#fffaf3,#fff1df 48%,#ffe7c7)}body:before,body:after{position:fixed;z-index:-1;width:24rem;height:24rem;border-radius:999px;content:"";filter:blur(8px);opacity:.5}body:before{right:-8rem;bottom:4rem;background:#ff914d57}body:after{left:10%;bottom:-12rem;background:#ffd5806b}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.68}.app-shell{width:min(1020px,calc(100% - 40px));margin:0 auto;padding:28px 0}.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(315px,.68fr);gap:22px;align-items:stretch}.hero__content{display:flex;min-height:390px;flex-direction:column;justify-content:center;padding:18px 0}.eyebrow,.panel__header span,.current-weather-card__top span,.search-card label,.stat-card span,.daily-card span,.hour-card span{margin:0;color:var(--accent);font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{max-width:630px;margin-bottom:22px;font-size:clamp(2rem,4.6vw,4rem);line-height:.98;letter-spacing:-.065em}.hero__lead{max-width:680px;margin-bottom:34px;color:var(--muted);font-size:clamp(1rem,2vw,1.22rem);line-height:1.7}.search-card,.current-weather-card,.panel{border:1px solid var(--line);background:linear-gradient(145deg,#fffffff2,#fff5e7ad),var(--card);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}.search-card:hover,.current-weather-card:hover,.panel:hover{transform:translateY(-3px);border-color:#f9731659;box-shadow:var(--hover-shadow)}.search-card{width:min(100%,640px);padding:13px;border-radius:26px}.search-card label{display:block;margin:0 0 10px 8px}.search-card>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}.search-card input{min-width:0;border:0;border-radius:17px;outline:none;padding:13px 16px;background:#ffffffbd;color:#24140a;box-shadow:inset 0 0 0 1px #db701a29}.search-card input::placeholder{color:#59371f7a}.search-card input:focus{box-shadow:inset 0 0 0 1px #f97316eb,0 0 0 5px #f9731621}.search-card button,.ghost-button{border:0;border-radius:17px;padding:13px 19px;color:#fff;font-weight:850;background:linear-gradient(135deg,#fb923c,#f97316);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}.search-card button:hover,.ghost-button:hover{transform:translateY(-2px) scale(1.015);box-shadow:0 18px 36px #f973163d;filter:saturate(1.08)}.search-card .ghost-button{width:100%;margin-top:9px;color:#7c2d12;background:#ffedd5b8;box-shadow:inset 0 0 0 1px #f973162e}.error-message{width:min(100%,640px);margin:12px 0 0;border:1px solid rgba(255,125,125,.26);border-radius:18px;padding:12px 14px;color:#8f1d1d;background:#ff4a4a1a}.current-weather-card{position:relative;display:flex;min-height:390px;overflow:hidden;flex-direction:column;justify-content:space-between;border-radius:34px;padding:clamp(18px,2.5vw,24px)}.card-glow{position:absolute;inset:auto -20% -26% 5%;height:45%;border-radius:999px;background:linear-gradient(90deg,#ffaa4c57,#f973163d);filter:blur(28px);pointer-events:none}.current-weather-card__top{position:relative;display:flex;gap:14px;align-items:flex-start;justify-content:space-between}.current-weather-card h2,.panel h2{margin:7px 0 0;font-size:clamp(1.05rem,1.9vw,1.45rem);letter-spacing:-.04em}.temperature-row{position:relative;display:flex;gap:16px;align-items:flex-end;margin:18px 0}.temperature-row>strong{font-size:clamp(3.5rem,7.2vw,5.5rem);line-height:.78;letter-spacing:-.1em}.temperature-row div{padding-bottom:8px}.temperature-row span{display:block;font-size:clamp(.98rem,1.7vw,1.18rem);font-weight:850}.temperature-row small,.stat-card small,.panel__header p,.hour-card small{color:var(--soft)}.metric-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{min-height:86px;border:1px solid rgba(236,126,34,.16);border-radius:22px;padding:12px 14px;background:#fff8f09e;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.stat-card:hover,.hour-card:hover,.daily-card:hover{transform:translateY(-4px);border-color:#f9731657;background:#ffffffd6;box-shadow:0 16px 34px #f9731626}.stat-card strong{display:block;margin:10px 0 4px;font-size:clamp(1rem,1.8vw,1.3rem);letter-spacing:-.05em}.forecast-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:20px;margin-top:18px}.panel{overflow:hidden;border-radius:30px;padding:20px}.panel__header{display:flex;gap:14px;align-items:flex-start;justify-content:space-between;margin-bottom:18px}.panel__header p{max-width:190px;margin:8px 0 0;text-align:right;font-size:.86rem}.hourly-strip{display:grid;grid-auto-columns:minmax(94px,1fr);grid-auto-flow:column;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-color:rgba(249,115,22,.34) transparent}.hour-card,.daily-card{border:1px solid rgba(236,126,34,.16);background:#fff8f09e;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.hour-card{display:grid;min-height:132px;place-items:center;border-radius:22px;padding:12px;text-align:center}.hour-card strong{font-size:1.25rem}.daily-list{display:grid;gap:9px}.daily-card{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;border-radius:20px;padding:12px 14px}.daily-card strong{display:block;margin-top:4px}.daily-card p{margin:0;font-size:.94rem;font-weight:850;white-space:nowrap}.weather-glyph{position:relative;display:inline-grid;width:54px;height:54px;flex:0 0 auto;place-items:center}.weather-glyph:before{width:36px;height:36px;border-radius:999px;content:"";background:linear-gradient(135deg,#ffe58a,#ff9f43);box-shadow:0 0 36px #ffc44f7a}.weather-glyph:after,.weather-glyph span{position:absolute;content:""}.weather-glyph span{display:none}.weather-glyph--partly:after,.weather-glyph--cloudy:after,.weather-glyph--fog:after,.weather-glyph--rain:after,.weather-glyph--snow:after,.weather-glyph--storm:after{right:4px;bottom:9px;width:37px;height:20px;border-radius:999px;background:linear-gradient(135deg,#fff,#ffd7ad);box-shadow:-14px 4px 0 -3px #ffffffe6,0 14px 34px #f973162e}.weather-glyph--cloudy:before,.weather-glyph--fog:before,.weather-glyph--rain:before,.weather-glyph--snow:before,.weather-glyph--storm:before{transform:translate(-11px,-8px) scale(.72);opacity:.46}.weather-glyph--rain span,.weather-glyph--storm span,.weather-glyph--snow span,.weather-glyph--fog span{display:block}.weather-glyph--rain span,.weather-glyph--storm span{bottom:1px;left:18px;width:3px;height:12px;border-radius:999px;background:#75d9ff;box-shadow:12px 3px #75d9ff,24px -1px #75d9ff}.weather-glyph--snow span{bottom:0;left:17px;width:6px;height:6px;border-radius:999px;background:#fff;box-shadow:14px 4px #fff,29px 0 #fff}.weather-glyph--fog span{right:5px;bottom:4px;width:38px;height:4px;border-radius:999px;background:#ffffffc7;box-shadow:0 9px #ffffff85}.weather-glyph--storm span{width:12px;height:20px;background:#ffe66d;clip-path:polygon(45% 0,100% 0,60% 42%,100% 42%,22% 100%,45% 52%,6% 52%);box-shadow:none}@media(max-width:980px){.app-shell{padding:30px 0}.hero,.forecast-layout{grid-template-columns:1fr}.hero__content,.current-weather-card{min-height:auto}.hero__content{padding:18px 0 4px}.current-weather-card{padding:24px}}@media(max-width:620px){.app-shell{width:min(100% - 20px,1180px);padding:16px 0}h1{font-size:clamp(2.25rem,12vw,3.45rem)}.search-card,.current-weather-card,.panel{border-radius:28px}.search-card>div,.metric-grid,.daily-card{grid-template-columns:1fr}.search-card button{width:100%}.temperature-row{align-items:flex-start;flex-direction:column}.panel__header{display:block}.panel__header p{max-width:none;text-align:left}.daily-card{justify-items:start}}
