.cs{position:relative;max-width:220px}.cs,.cs__pill{min-width:0;width:100%}.cs__pill{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(15,23,42,.12);background:hsla(0,0%,100%,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px;padding:8px 12px;box-shadow:0 10px 26px rgba(15,23,42,.06);cursor:pointer}.cs__pill:hover{border-color:rgba(37,99,235,.28)}.cs__pill.is-loading{opacity:.9}.cs__city{font-weight:950;font-size:12px;letter-spacing:.08em;color:#0f172a;flex:0 0 auto}.cs__sep{width:1px;height:16px;background:rgba(15,23,42,.1);flex:0 0 auto}.cs__wx{gap:8px;min-width:0}.cs__wx,.cs__wxIcon{display:inline-flex;align-items:center}.cs__wxIcon{color:#0284c7;justify-content:center;flex:0 0 auto}.cs__icon,.cs__wxIcon{width:16px;height:16px}.cs__temp{font-weight:950;font-size:12px;color:#0284c7;white-space:nowrap}.cs__aqi{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto}.cs__dot{width:8px;height:8px;border-radius:999px;background:#334155;box-shadow:0 0 0 4px rgba(15,23,42,.04)}.cs__dot--good{background:#16a34a}.cs__dot--moderate{background:#eab308}.cs__dot--sensitive{background:#f97316}.cs__dot--unhealthy{background:#ef4444}.cs__dot--very-unhealthy{background:#9333ea}.cs__dot--hazard{background:#111827}.cs__aqiLabel{font-weight:900;font-size:11px;color:#334155;letter-spacing:.08em}.cs__aqiValue{font-weight:950;font-size:12px;color:#0f172a;white-space:nowrap}.cs__menu{position:absolute;top:calc(100% + 10px);left:0;z-index:60;width:220px;border-radius:16px;border:1px solid rgba(15,23,42,.1);background:hsla(0,0%,100%,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 24px 70px rgba(15,23,42,.14);padding:8px;display:grid;grid-gap:6px;gap:6px}.cs--right .cs__menu{left:auto;right:0}.cs__item{width:100%;text-align:left;border:1px solid rgba(15,23,42,.08);background:rgba(15,23,42,.02);border-radius:12px;padding:10px;font-weight:850;font-size:13px;color:#0f172a}.cs__item:hover{border-color:rgba(37,99,235,.3);background:rgba(37,99,235,.06)}.cs__item.is-active{border-color:rgba(37,99,235,.4);background:linear-gradient(135deg,rgba(37,99,235,.1),rgba(249,115,22,.06))}@media (max-width:520px){.cs{max-width:100%}.cs__pill{padding:6px 10px;gap:8px}.cs__aqiValue,.cs__city,.cs__temp{font-size:11px}.cs__icon{width:14px;height:14px}.cs__menu{width:100%}.cs__aqiLabel{display:none}}