.header-search-box{max-inline-size:var(--size-header-search)}.header-search{transition:border-color var(--motion-duration-quick) var(--motion-easing-standard)}.header-search-box[data-open]{z-index:50}.header-search-field{outline:none}.header-search-field::-webkit-search-cancel-button{appearance:none}.header-search-icon{transition:color var(--motion-duration-moderate) var(--motion-easing-standard)}.header-search:focus-within .header-search-icon{color:var(--color-on-canvas)}.header-search-clear{animation:header-search-pop var(--motion-duration-moderate) var(--motion-easing-spring)}.header-search-panel{inset-inline:0;top:calc(100% + var(--spacing-2));padding:var(--spacing-1);border:1px solid var(--color-outline);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-float);animation:header-search-in var(--motion-duration-menu) var(--motion-easing-out);position:absolute}.header-search-option{-webkit-tap-highlight-color:transparent;transition:background-color var(--motion-duration-quick) var(--motion-easing-standard)}.header-search-option[data-pressed]{background-color:var(--color-fill-pressed)}.header-search-box[data-takeover]{gap:var(--spacing-2);max-inline-size:none;padding:max(var(--spacing-3), env(safe-area-inset-top)) var(--spacing-4) 0;background-color:var(--color-surface);animation:header-search-fade var(--motion-duration-menu) var(--motion-easing-out);flex-direction:column;display:flex;position:fixed;inset:0}.header-search-box[data-takeover] .header-search-panel{overscroll-behavior:contain;min-height:0;padding:0 0 max(var(--spacing-3), env(safe-area-inset-bottom));box-shadow:none;border:0;border-radius:0;flex:1;animation:none;position:static;overflow-y:auto}@keyframes header-search-in{0%{opacity:0;transform:translateY(calc(-1 * var(--spacing-1)))}}@keyframes header-search-fade{0%{opacity:0}}@keyframes header-search-pop{0%{opacity:0;transform:scale(var(--motion-press-control))}}@media (prefers-reduced-motion:reduce){.header-search-panel,.header-search-box[data-takeover],.header-search-clear{animation:none}.header-search-option,.header-search-icon{transition:none}}