clima-cuida-care-weather/assets/index-CPSikBCn.css

:root{color-scheme:light;--bg: oklch(97% .018 205);--surface: oklch(100% 0 0);--surface-soft: oklch(95% .02 205);--glass: oklch(100% 0 0 / .78);--fg: oklch(19% .025 190);--muted: oklch(47% .025 190);--muted-2: oklch(62% .02 190);--border: oklch(86% .028 205);--accent: oklch(58% .13 208);--accent-2: oklch(70% .15 82);--green: oklch(58% .14 155);--yellow: oklch(72% .13 88);--orange: oklch(66% .16 50);--red: oklch(58% .19 25);--sky-glow: oklch(83% .105 215 / .42);--sun-glow: oklch(85% .16 82 / .28);--shadow: 0 24px 72px -44px oklch(22% .06 215 / .55);--radius: 22px;--radius-sm: 14px;--font-display: "Avenir Next", "Söhne", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;font-family:var(--font-body);background:var(--bg);color:var(--fg)}html[data-theme=dark]{color-scheme:dark;--bg: oklch(18% .035 236);--surface: oklch(23% .04 236);--surface-soft: oklch(27% .045 236);--glass: oklch(23% .04 236 / .76);--fg: oklch(96% .012 220);--muted: oklch(76% .028 220);--muted-2: oklch(64% .03 220);--border: oklch(37% .045 236);--accent: oklch(73% .13 210);--accent-2: oklch(78% .15 78);--green: oklch(72% .13 155);--yellow: oklch(82% .13 88);--orange: oklch(75% .16 50);--red: oklch(70% .18 25);--sky-glow: oklch(42% .11 240 / .45);--sun-glow: oklch(73% .15 78 / .18);--shadow: 0 30px 82px -46px oklch(4% .02 236 / .82)}*{box-sizing:border-box}html{min-width:320px;background:var(--bg)}body{min-width:320px;margin:0;overflow-x:clip;background:radial-gradient(circle at 14% -12%,var(--sun-glow),transparent 34vw),radial-gradient(circle at 84% 0,var(--sky-glow),transparent 36vw),linear-gradient(180deg,color-mix(in oklch,var(--bg),var(--accent) 12%) 0,var(--bg) 420px),var(--bg);color:var(--fg);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit}:focus-visible{outline:3px solid color-mix(in oklch,var(--accent),white 28%);outline-offset:3px}.app-shell{min-height:100dvh}.topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1fr;gap:14px;padding:16px clamp(16px,4vw,34px);border-bottom:1px solid color-mix(in oklch,var(--border),transparent 20%);background:var(--glass);box-shadow:0 16px 44px -34px color-mix(in oklch,var(--fg),transparent 35%);-webkit-backdrop-filter:blur(20px) saturate(1.18);backdrop-filter:blur(20px) saturate(1.18)}.brand-mark{display:inline-flex;align-items:center;gap:10px;width:fit-content;text-decoration:none;font-family:var(--font-display);font-size:1.02rem;letter-spacing:0}.brand-mark span{display:grid;width:34px;height:34px;place-items:center;border:1px solid color-mix(in oklch,var(--accent),white 52%);border-radius:11px;color:var(--accent);background:color-mix(in oklch,var(--accent),white 89%)}.topbar-actions{display:grid;gap:12px;min-width:0}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;width:fit-content;padding:0 14px;border:1px solid color-mix(in oklch,var(--border),var(--accent) 18%);border-radius:999px;color:var(--fg);background:color-mix(in oklch,var(--surface),var(--accent) 6%);box-shadow:0 14px 34px -28px color-mix(in oklch,var(--accent),black 45%);font-size:.86rem;font-weight:780;transition:transform .18s cubic-bezier(.23,1,.32,1),border-color .18s cubic-bezier(.23,1,.32,1),background .18s cubic-bezier(.23,1,.32,1)}.theme-toggle:hover{transform:translateY(-1px);border-color:color-mix(in oklch,var(--accent),var(--fg) 8%);background:color-mix(in oklch,var(--surface),var(--accent) 12%)}.theme-toggle:active{transform:translateY(1px) scale(.99)}.theme-toggle svg{color:var(--accent-2)}.search-cluster{position:relative;display:grid;gap:10px}.search-form{display:grid;gap:7px}.search-form label,.profile-selector legend{color:var(--muted);font-size:.73rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase}.search-input-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;min-height:46px;padding:5px 5px 5px 13px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--shadow)}.search-input-row svg{color:var(--muted)}.search-input-row input{width:100%;min-width:0;border:0;outline:0;color:var(--fg);background:transparent}.search-input-row input::placeholder{color:var(--muted-2)}.search-input-row button,.geo-button,.error-banner button{min-height:36px;border:0;border-radius:12px;color:#fff;background:var(--fg);font-size:.88rem;font-weight:760;transition:transform .18s cubic-bezier(.23,1,.32,1),background .18s cubic-bezier(.23,1,.32,1)}.search-input-row button{padding:0 14px}.search-input-row button:hover,.geo-button:hover,.error-banner button:hover{transform:translateY(-1px);background:color-mix(in oklch,var(--fg),var(--accent) 18%)}.search-input-row button:active,.geo-button:active,.error-banner button:active{transform:translateY(1px) scale(.99)}.geo-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 14px;color:var(--fg);border:1px solid var(--border);background:var(--surface)}.geo-button:hover{color:var(--fg);background:color-mix(in oklch,var(--surface),var(--accent) 7%)}.search-popover{position:absolute;top:calc(100% + 8px);right:0;left:0;z-index:30;display:grid;gap:6px;padding:8px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:0 24px 64px -30px #001b1a75;box-shadow:0 24px 64px -30px oklch(20% .04 190 / .46)}.search-popover p{margin:0;padding:8px 10px;color:var(--muted);font-size:.9rem}.search-popover button{display:flex;align-items:center;gap:8px;min-height:40px;border:0;border-radius:10px;color:var(--fg);background:transparent;text-align:left}.search-popover button:hover{background:var(--surface-soft)}.profile-selector{min-width:0;margin:0;padding:0;border:0}.profile-options{display:flex;gap:7px;margin-top:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}.profile-options label{position:relative;display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:38px;white-space:nowrap;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.86rem;font-weight:720;transition:color .18s cubic-bezier(.23,1,.32,1),border-color .18s cubic-bezier(.23,1,.32,1),background .18s cubic-bezier(.23,1,.32,1)}.profile-options label.selected{color:var(--fg);border-color:color-mix(in oklch,var(--accent),black 4%);background:color-mix(in oklch,var(--accent),white 87%)}.profile-options input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0}.profile-options span{padding:0 13px}.dashboard-shell{width:min(1480px,calc(100% - 28px));margin:0 auto;padding:24px 0 46px}.dashboard-intro{display:grid;gap:4px;max-width:820px;margin-bottom:18px}.dashboard-intro p{margin:0;color:var(--muted);font-size:clamp(.94rem,1.5vw,1.04rem)}.eyebrow{margin:0;color:color-mix(in oklch,var(--accent),var(--fg) 26%);font-size:.72rem;font-weight:820;letter-spacing:.13em;text-transform:uppercase}.dashboard-grid{display:grid;grid-template-columns:1fr;gap:18px;min-width:0}.primary-column,.secondary-column{display:grid;min-width:0;gap:18px;align-content:start}.semaforo-panel,.recommendation-panel,.timeline-panel,.forecast-panel,.why-panel,.error-banner{border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in oklch,var(--surface),var(--risk-color, var(--accent)) 2%);box-shadow:var(--shadow)}.semaforo-panel{--risk-color: var(--green);display:grid;min-width:0;gap:24px;padding:clamp(20px,4vw,34px);overflow:hidden;transition:border-color .22s cubic-bezier(.23,1,.32,1),background .22s cubic-bezier(.23,1,.32,1)}.risk-green{--risk-color: var(--green)}.risk-yellow{--risk-color: var(--yellow)}.risk-orange{--risk-color: var(--orange)}.risk-red{--risk-color: var(--red)}.semaforo-topline{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;color:var(--muted);font-size:.84rem;font-weight:680}.semaforo-content{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,4vw,30px);align-items:center;min-width:0}.semaforo-content>div{min-width:0}.risk-orb{display:grid;width:clamp(84px,20vw,132px);aspect-ratio:1;place-items:center;border:1px solid color-mix(in oklch,var(--risk-color),white 32%);border-radius:50%;background:radial-gradient(circle at 45% 40%,color-mix(in oklch,var(--risk-color),white 10%) 0 28%,transparent 29%),color-mix(in oklch,var(--risk-color),white 84%)}.risk-orb span{width:48%;aspect-ratio:1;border-radius:50%;background:var(--risk-color);box-shadow:inset 0 1px #fff6}.semaforo-content h1{margin:4px 0 0;font-family:var(--font-display);font-size:clamp(3.25rem,8vw,6.4rem);line-height:.86;letter-spacing:0;overflow-wrap:anywhere}.risk-label{margin:13px 0 0;color:var(--fg);font-weight:820}.risk-summary{max-width:650px;margin:10px 0 0;color:var(--muted);font-size:clamp(1.04rem,1.8vw,1.28rem);line-height:1.42;text-wrap:pretty}.current-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0;overflow:hidden;border:1px solid color-mix(in oklch,var(--risk-color),white 45%);border-radius:18px;background:color-mix(in oklch,var(--risk-color),white 72%)}.current-strip div{min-width:0;padding:14px;background:color-mix(in oklch,var(--surface),var(--risk-color) 4%)}.current-strip dt,.metric-tile span,.forecast-day dt,.timeline-hour dt{color:var(--muted);font-size:.72rem;font-weight:760;letter-spacing:.06em;text-transform:uppercase}.current-strip dd{margin:5px 0 0;overflow:hidden;font-weight:840;text-overflow:ellipsis;white-space:nowrap}.profile-note{display:flex;gap:8px;align-items:flex-start;color:var(--muted);font-size:.92rem}.metrics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric-tile{display:grid;min-width:0;gap:5px;padding:16px;border:1px solid var(--border);border-radius:18px;background:var(--surface)}.metric-tile svg{color:var(--accent)}.metric-tile strong{font-size:clamp(1.25rem,4vw,1.85rem);font-variant-numeric:tabular-nums;line-height:1}.metric-tile small{overflow:hidden;color:var(--muted);font-size:.84rem;text-overflow:ellipsis;white-space:nowrap}.section-heading{display:grid;gap:5px;margin-bottom:16px}.section-heading h2{margin:0;font-family:var(--font-display);font-size:clamp(1.2rem,3vw,1.65rem);line-height:1.05;letter-spacing:0}.inline-heading{grid-template-columns:auto minmax(0,1fr);align-items:start}.recommendation-panel,.timeline-panel,.forecast-panel,.why-panel{min-width:0;padding:clamp(18px,3vw,24px)}.recommendation-list{display:grid;gap:10px}.recommendation-chip{--risk-color: var(--accent);display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;align-items:start;padding:13px;border:1px solid color-mix(in oklch,var(--risk-color),white 45%);border-radius:16px;background:color-mix(in oklch,var(--risk-color),white 88%)}.recommendation-chip svg{color:color-mix(in oklch,var(--risk-color),black 12%)}.recommendation-chip strong,.recommendation-chip span{display:block}.recommendation-chip strong{font-size:.94rem}.recommendation-chip span{margin-top:2px;color:var(--muted);font-size:.86rem;line-height:1.35}.timeline-scroll{display:grid;grid-auto-columns:minmax(172px,1fr);grid-auto-flow:column;gap:10px;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;padding-bottom:4px;scroll-snap-type:x proximity}.timeline-hour{display:grid;gap:8px;min-height:202px;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--surface);scroll-snap-align:start}.timeline-hour time{color:var(--fg);font-weight:840;font-variant-numeric:tabular-nums}.timeline-hour strong{font-size:1.65rem;font-variant-numeric:tabular-nums}.timeline-hour>span{min-height:36px;color:var(--muted);font-size:.9rem}.timeline-hour dl,.forecast-day dl{display:grid;gap:8px;margin:0}.timeline-hour dt,.forecast-day dt{display:flex;gap:5px;align-items:center}.timeline-hour dd,.forecast-day dd{margin:2px 0 0;font-weight:780;font-variant-numeric:tabular-nums}.forecast-list{display:grid;gap:9px}.forecast-day{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px 0;border-top:1px solid var(--border)}.forecast-day:first-child{border-top:0;padding-top:0}.forecast-day time{display:block;font-weight:830;text-transform:capitalize}.forecast-day span{color:var(--muted);font-size:.9rem}.forecast-day strong{font-size:1.18rem;font-variant-numeric:tabular-nums}.factor-list{display:grid;gap:13px}.factor-row{display:grid;gap:7px}.factor-row>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.factor-row span,.factor-row p{color:var(--muted)}.factor-row span{font-size:.86rem;font-variant-numeric:tabular-nums}.factor-row p{margin:0;font-size:.88rem;line-height:1.38}.factor-row meter{width:100%;height:9px;overflow:hidden;border:0;border-radius:999px;background:var(--surface-soft)}.factor-row meter::-webkit-meter-bar{border:0;border-radius:999px;background:var(--surface-soft)}.factor-row meter::-webkit-meter-optimum-value,.factor-row meter::-webkit-meter-suboptimum-value,.factor-row meter::-webkit-meter-even-less-good-value{border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}.factor-row meter::-moz-meter-bar{border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}.error-banner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;margin-bottom:16px;padding:13px;border-color:color-mix(in oklch,var(--orange),white 36%);background:color-mix(in oklch,var(--orange),white 88%)}.error-banner p{margin:0;color:var(--fg);font-size:.92rem}.error-banner button{grid-column:1 / -1;display:inline-flex;align-items:center;justify-content:center;gap:7px;width:100%}.skeleton-grid{display:grid;gap:18px}.skeleton{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in oklch,var(--surface),var(--accent) 3%)}.skeleton:after{position:absolute;top:0;right:0;bottom:0;left:0;content:"";transform:translate(-100%);background:linear-gradient(90deg,transparent,oklch(100% 0 0 / .66),transparent);animation:shimmer 1.2s infinite}.skeleton-hero{min-height:360px}.skeleton-side{min-height:260px}.skeleton-wide{min-height:210px}.spin{animation:spin .8s linear infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){.risk-orb span{animation:pulse-risk 2.4s cubic-bezier(.23,1,.32,1) infinite}@keyframes pulse-risk{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}}@media(min-width:760px){.topbar{grid-template-columns:minmax(155px,auto) minmax(320px,1fr);align-items:end}.topbar-actions{grid-column:1 / -1;grid-template-columns:auto minmax(0,1fr);align-items:end}.profile-selector{min-width:0}.search-cluster{grid-template-columns:minmax(0,1fr) auto;align-items:end}.metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.current-strip{grid-template-columns:repeat(4,minmax(0,1fr))}.forecast-day{grid-template-columns:minmax(0,1.1fr) auto minmax(190px,.9fr);align-items:center}.forecast-day dl{grid-template-columns:repeat(3,minmax(0,1fr))}.error-banner{grid-template-columns:auto minmax(0,1fr) auto}.error-banner button{grid-column:auto;width:auto;padding:0 13px}}@media(min-width:1180px){.topbar{grid-template-columns:auto minmax(440px,1fr) minmax(560px,auto);align-items:end}.topbar-actions{grid-column:auto;grid-template-columns:auto minmax(0,1fr);align-items:end}.profile-options{justify-content:flex-end}.dashboard-shell{padding-top:30px}.dashboard-grid{grid-template-columns:minmax(0,1.42fr) minmax(360px,.72fr);align-items:start}.secondary-column .forecast-day{grid-template-columns:minmax(0,1fr) auto}.secondary-column .forecast-day dl{grid-column:1 / -1;grid-template-columns:repeat(3,minmax(0,1fr))}.semaforo-panel{min-height:438px}.semaforo-content{grid-template-columns:minmax(150px,.24fr) minmax(0,1fr)}.metrics-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:520px){.dashboard-shell{width:min(100% - 20px,1480px);padding-top:18px}.topbar{padding:12px 10px}.theme-toggle{width:100%}.semaforo-content{grid-template-columns:1fr}.risk-orb{width:86px}.metrics-grid{grid-template-columns:1fr}}