.search[open]{translate:0 5vh;opacity:1}.search{width:min(80vw,500px);margin:0 auto;border:none;border-radius:var(--grapes-border-radius-8);background:var(--grapes-color-background-primary-default);font:var(--grapes-body-l);opacity:0;translate:0 0;transition:opacity var(--grapes-transition-duration),translate var(--grapes-transition-duration),display var(--grapes-transition-duration) allow-discrete,overlay var(--grapes-transition-duration) allow-discrete;&::backdrop{background:#17114eb3}a{text-decoration:none}}@starting-style{.search[open]{translate:0 0;opacity:0}}.search-body{padding-inline:var(--grapes-unit-24)}.seach-input-wrapper{display:flex;align-items:center;gap:var(--grapes-unit-16);padding-block:var(--grapes-unit-16);border-block-end:1px solid var(--grapes-color-border-default);input{display:block;flex:1;border:none;font:var(--grapes-body-l)}}.search-list{display:flex;gap:var(--grapes-unit-8);padding-block:var(--grapes-unit-24);flex-direction:column;[role=option]{display:flex;align-items:center;justify-content:space-between;background:var(--grapes-color-background-primary-default);padding:var(--grapes-unit-16) var(--grapes-unit-24);border-radius:var(--grapes-border-radius-8);border:1px solid var(--grapes-color-border-default);color:var(--grapes-color-content-primary)}[role=option]:is(:hover,[aria-selected=true]),a:focus-visible [role=option]{border:1px solid var(--grapes-color-border-hover);color:var(--grapes-color-content-selected)}}.toggle-theme{border:none;background:none;color:var(--grapes-color-content-primary);height:var(--grapes-unit-24);width:var(--grapes-unit-24);cursor:pointer}