@layer components{.home-performance{min-width:0;display:flex}.live-panel{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(var(--space-5), 1fr) auto;column-gap:var(--space-4);min-width:0;color:var(--on-night);flex:1;grid-template-areas:"status more""air air""metrics metrics";text-decoration:none;display:grid;container-type:inline-size}.live-panel:focus-visible{outline-color:var(--ink)}.home-metric-status{min-width:0;color:var(--on-night-2);font-size:var(--text-caption);line-height:var(--leading-caption);grid-area:status;align-items:flex-start;column-gap:.5625rem;margin:0;display:flex}.home-metric-status>.live-dot{margin-top:.375rem}.home-metric-status>:last-child{min-width:0}.home-metric-status time{font-variant-numeric:tabular-nums}.home-performance-more{align-self:start;align-items:center;gap:var(--space-1);font-size:var(--text-small);font-weight:var(--weight-action);line-height:var(--leading-caption);white-space:nowrap;grid-area:more;display:inline-flex}.home-performance-more svg{transition:translate var(--motion-ui) var(--ease-out)}@container (max-width:15rem){.home-performance-more>span{display:none}}@media (hover:hover){.live-panel:hover .home-performance-more svg{translate:3px}}.night>.live-panel__map{display:none}.live-panel__land{background:var(--night-2);-webkit-mask-composite:source-in;position:absolute;inset:0;-webkit-mask-image:url(/brand/world-mask.png),linear-gradient(#0000 2%,#000 24% 52%,#0000 96%);mask-image:url(/brand/world-mask.png),linear-gradient(#0000 2%,#000 24% 52%,#0000 96%);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-in;mask-composite:intersect}.live-panel__map>i{background:var(--ok-night);width:.4375rem;height:.4375rem;box-shadow:0 0 0 5px color-mix(in srgb, var(--ok-night) 16%, transparent);animation:3.6s ease-in-out infinite live-node;animation-delay:calc(var(--i) * .42s);border-radius:50%;margin:-3.5px 0 0 -3.5px;position:absolute}.home-metrics{flex-direction:column;grid-area:metrics;min-width:0;display:flex}.home-metric{flex-wrap:wrap;align-items:baseline;column-gap:.45em;min-width:0;display:flex}.home-metric+.home-metric{margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--night-line)}.home-metric-value{width:100%;margin:0 0 var(--space-3);font-family:var(--font-display);white-space:nowrap;order:1;align-items:baseline;gap:.375rem;line-height:1;display:flex}.home-metric-value strong{--glint-span:33.75rem;font-size:var(--text-num-l);letter-spacing:var(--tracking-figure);color:var(--on-night);font-weight:600;position:relative}.home-metric-value>span{color:var(--on-night-2);font-size:var(--text-h2);font-weight:500}.home-metric:first-child .home-metric-value strong:not(.home-metric-unavailable){font-size:min(var(--text-num-xl), calc((100cqi - 2.75rem) / 3.3));line-height:.86}.home-metric:first-child .home-metric-value>span{font-size:clamp(var(--text-h2), 7cqi, 1.75rem)}.home-metric-value .home-metric-unavailable{color:var(--on-night-2);font-weight:400}.home-metrics h2,.home-metric-note{color:var(--on-night-2);font-family:var(--font-sans);font-size:var(--text-caption);font-weight:400;line-height:var(--leading-caption);order:2;margin:0}.home-metric:has(.home-metric-note) h2:after{content:"·";content:"·" / "";margin-inline-start:.45em}.home-bars{width:100%;height:2.25rem;margin-top:var(--space-4);order:3;align-items:flex-end;gap:.25rem;display:flex}.home-bars>i{background:var(--ok-night);transform-origin:bottom;height:100%;animation:live-bar var(--motion-slow) var(--ease-out) both;animation-delay:calc(var(--i) * 12ms + .12s);border-radius:2px;flex:1}.home-bars>i[data-level=low]{opacity:.55;height:62%}.home-bars>i[data-level=none]{background:var(--night-3)}.home-metric-value strong:not(.home-metric-unavailable):after{content:attr(data-text) / "";pointer-events:none;white-space:nowrap;background-image:linear-gradient(112deg, transparent 46.5%, var(--figure-glint) 48%, transparent 49.5%, transparent 53%, var(--figure-glint-soft) 54%, transparent 55%);background-size:var(--glint-span) 100%;background-repeat:no-repeat;background-position-x:calc(-1 * var(--glint-span));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;animation:6s cubic-bezier(.45,0,.2,1) infinite figure-glint;position:absolute;inset:0}.home-metric+.home-metric .home-metric-value strong:after{animation-delay:var(--motion-ui)}.home-metrics:not([data-inview=true]) .home-metric-value strong:after{animation-play-state:paused}@media (min-width:64em){.night>.live-panel__map{z-index:0;aspect-ratio:8/3;margin:calc(-1 * var(--leading-caption)) calc(-1 * var(--inset)) -6%;pointer-events:none;grid-area:air;place-self:center stretch;display:block}.home-performance>.night{--inset:calc(1.75rem + var(--fit) * .375 / 11)}.home-metric:first-child .home-metric-value strong:not(.home-metric-unavailable){font-size:min(calc(6rem + var(--fit) * 3 / 11), calc((100cqi - 2.75rem) / 3.3))}.home-metric+.home-metric{margin-top:calc(1rem + var(--fit) * .5 / 11);padding-top:calc(1rem + var(--fit) * .5 / 11)}.split>.home-performance .live-panel__map{width:min(calc(100% + 2 * var(--inset)), calc(max(4rem, 100vh - 35.75rem - var(--fit) * 9.4 / 11) * 8 / 3));justify-self:center}}@media (max-width:63.999em){.live-panel.night--glow:after{display:none}}@media (max-width:35em){.home-metric+.home-metric{margin-top:var(--space-5);padding-top:var(--space-5)}.home-metric-value{margin-bottom:.625rem}.home-metric:first-child .home-metric-value strong:not(.home-metric-unavailable){font-size:min(var(--text-num-l), calc((100cqi - 2.75rem) / 3.3))}.home-metric:first-child .home-metric-value>span{font-size:var(--text-h2)}.home-metric+.home-metric .home-metric-value strong{font-size:var(--text-num)}.home-metric+.home-metric .home-metric-value>span{font-size:var(--text-small)}.home-bars{gap:2px;height:1.75rem;margin-top:.875rem}}@media (prefers-reduced-motion:reduce){.home-metric-value strong:after,.home-bars>i,.live-panel__map>i{animation:none}}@media (forced-colors:active){.home-metric-value strong:after{display:none}}}@keyframes figure-glint{0%{background-position-x:calc(-1 * var(--glint-span))}42%,to{background-position-x:calc(100% + var(--glint-span))}}@keyframes live-bar{0%{opacity:0;transform:scaleY(.12)}}@keyframes live-node{50%{box-shadow:0 0 0 8px color-mix(in srgb, var(--ok-night) 6%, transparent)}}
