hunk.code_window:     transition: 'all 0.15s',
       letterSpacing: '0.06em',
       '[cmdk-group-heading]': {
         margin: '5px 16px',
         fontSize: theme.font.sm,
         fontWeight: '500',
       },
       '[aria-selected="true"]': {
         borderRadius: '5px',
  
hunk.labels: keep keep keep keep replace keep keep keep keep
hunk.after_edit:       fontSize: theme.font.base,
  
hunk.file_path: packages/app/src/components/quick-search/style.ts
hunk.type: replace
file: import createEmotionServer from '@emotion/server/create-instance';
  import { cache } from '@emotion/css';
  
  import Document, {
    Html,
    Head,
    Main,
    NextScript,
    DocumentContext,
  } from 'next/document';
  import * as React from 'react';
  
  export const renderStatic = async (html: string) => {
    if (html === undefined) {
      throw new Error('did you forget to return html from renderToString?');
    }
    const { extractCritical } = createEmotionServer(cache);
    const { ids, css } = extractCritical(html);
  
    return { html, ids, css };
  };
  
  export default class AppDocument extends Document {
    static async getInitialProps(ctx: DocumentContext) {
      const page = await ctx.renderPage();
      const { css, ids } = await renderStatic(page.html);
      const initialProps = await Document.getInitialProps(ctx);
      return {
        ...initialProps,
        styles: (
          <React.Fragment>
            {initialProps.styles}
            <style
              data-emotion={`css ${ids.join(' ')}`}
              dangerouslySetInnerHTML={{ __html: css }}
            />
          </React.Fragment>
        ),
      };
    }
  
    render() {
      return (
        <Html>
          <Head />
          <body>
            <Main />
            <NextScript />
          </body>
        </Html>
      );
    }
  }
  