.city-search{pointer-events:auto;position:relative}.city-search-icon{width:15px;height:15px;color:var(--ink-muted);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.city-search input{background:var(--surface-translucent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-md);width:220px;color:var(--ink);padding:10px 12px 10px 34px;font-size:13.5px}.city-search input::placeholder{color:var(--ink-muted)}.city-search-results{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);max-height:260px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow-y:auto}.city-search-results li{margin:0}.city-search-results button{border-radius:var(--radius-sm);text-align:left;width:100%;color:var(--ink);background:0 0;border:none;justify-content:space-between;align-items:baseline;gap:8px;padding:8px 9px;font-size:13px;display:flex}.city-search-results button.is-active,.city-search-results button:hover{background:var(--neutral-soft)}.city-name{font-weight:500}.city-country{color:var(--ink-muted);font-size:11.5px}@media (max-width:640px){.city-search{width:40px;transition:width .2s;overflow:hidden}.city-search:focus-within{width:100%}.city-search:has(input:not(:placeholder-shown)){width:100%}.city-search input{width:100%}}@media (max-width:640px) and (prefers-reduced-motion:reduce){.city-search{transition:none}}