remove background blur

src/components/account.tsx

···
   return (
     <>
       <Modal open={openManager()} onClose={() => setOpenManager(false)}>
-        <div class="dark:bg-dark-800/70 dark:shadow-dark-800 absolute top-12 left-[50%] w-[22rem] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200/70 p-4 text-neutral-900 shadow-md backdrop-blur-xs transition-opacity duration-300 dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
+        <div class="dark:bg-dark-800 dark:shadow-dark-800 absolute top-12 left-[50%] w-[22rem] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200 p-4 text-neutral-900 shadow-md transition-opacity duration-300 dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
           <div class="mb-2 flex items-center gap-1 font-semibold">
             <span class="iconify lucide--user-round"></span>
             <span>Manage accounts</span>

src/components/create.tsx

···
   return (
     <>
       <Modal open={openDialog()} onClose={() => setOpenDialog(false)} closeOnClick={false}>
-        <div class="dark:bg-dark-800/70 dark:shadow-dark-800 absolute top-12 left-[50%] w-[22rem] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200/70 p-2 text-neutral-900 shadow-md backdrop-blur-xs transition-opacity duration-300 sm:w-xl sm:p-4 lg:w-[48rem] dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
+        <div class="dark:bg-dark-800 dark:shadow-dark-800 absolute top-12 left-[50%] w-[22rem] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200 p-2 text-neutral-900 shadow-md transition-opacity duration-300 sm:w-xl sm:p-4 lg:w-[48rem] dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
           <div class="mb-2 flex w-full justify-between">
             <div class="flex items-center gap-1 font-semibold">
               <span class="iconify lucide--square-pen"></span>

src/layout.tsx

···
       </div>
       <Show when={notif().show}>
         <button
-          class="dark:shadow-dark-800 dark:bg-dark-100/70 fixed bottom-10 z-50 flex items-center rounded-lg border-[0.5px] border-neutral-300 bg-white/70 p-2 shadow-md backdrop-blur-xs dark:border-neutral-700"
+          class="dark:shadow-dark-800 dark:bg-dark-100 fixed bottom-10 z-50 flex items-center rounded-lg border-[0.5px] border-neutral-300 bg-white p-2 shadow-md dark:border-neutral-700"
           onClick={() => setNotif({ show: false })}
         >
           <span class={`iconify ${notif().icon} mr-1`}></span>

src/views/blob.tsx

···
         </div>
       </Show>
       <Show when={cursor()}>
-        <div class="dark:bg-dark-500/70 fixed bottom-0 z-5 flex w-screen justify-center bg-neutral-100/70 py-3 backdrop-blur-xs">
+        <div class="dark:bg-dark-500 fixed bottom-0 z-5 flex w-screen justify-center bg-neutral-100 py-3">
           <Show when={!response.loading}>
             <Button onClick={() => refetch()}>Load More</Button>
           </Show>

src/views/collection.tsx

···
       <Show when={hover()}>
         <span
           ref={previewRef}
-          class={`dark:bg-dark-500/70 dark:shadow-dark-800 pointer-events-none absolute left-[50%] z-25 block max-h-[20rem] w-max max-w-sm -translate-x-1/2 overflow-hidden rounded-lg border-[0.5px] border-neutral-300 bg-neutral-100/70 p-2 text-xs whitespace-pre-wrap shadow-md backdrop-blur-xs sm:max-h-[28rem] lg:max-w-lg dark:border-neutral-700 ${isOverflowing(previewHeight()) ? "bottom-7" : "top-7"}`}
+          class={`dark:bg-dark-500 dark:shadow-dark-800 pointer-events-none absolute left-[50%] z-25 block max-h-[20rem] w-max max-w-sm -translate-x-1/2 overflow-hidden rounded-lg border-[0.5px] border-neutral-300 bg-neutral-50 p-2 text-xs whitespace-pre-wrap shadow-md sm:max-h-[28rem] lg:max-w-lg dark:border-neutral-700 ${isOverflowing(previewHeight()) ? "bottom-7" : "top-7"}`}
         >
           <JSONValue
             data={props.record.record.value as JSONType}
···
   return (
     <Show when={records.length || response()}>
       <div class="flex w-full flex-col items-center">
-        <div class="dark:bg-dark-500/70 sticky top-0 z-5 flex w-screen flex-col items-center justify-center gap-2 bg-neutral-100/70 pt-1 pb-3 backdrop-blur-xs">
+        <div class="dark:bg-dark-500 sticky top-0 z-5 flex w-screen flex-col items-center justify-center gap-2 bg-neutral-100 pt-1 pb-3">
           <div class="flex w-[22rem] items-center gap-2 sm:w-[24rem]">
             <Show when={agent() && agent()?.sub === did}>
               <div class="flex items-center gap-x-2">

src/views/labels.tsx

···
           </div>
         </div>
       </form>
-      <div class="dark:bg-dark-500/70 sticky top-0 z-5 flex w-screen flex-col items-center justify-center gap-3 bg-neutral-100/70 py-3 backdrop-blur-xs">
+      <div class="dark:bg-dark-500 sticky top-0 z-5 flex w-screen flex-col items-center justify-center gap-3 bg-neutral-100 py-3">
         <TextInput
           placeholder="Filter by label"
           onInput={(e) => setFilter(e.currentTarget.value)}

src/views/pds.tsx

···
         </For>
       </div>
       <Show when={cursor()}>
-        <div class="dark:bg-dark-500/70 fixed bottom-0 z-5 flex w-screen justify-center bg-neutral-100/70 py-3 backdrop-blur-xs">
+        <div class="dark:bg-dark-500 fixed bottom-0 z-5 flex w-screen justify-center bg-neutral-100 py-3">
           <Show when={!response.loading}>
             <Button onClick={() => refetch()}>Load More</Button>
           </Show>

src/views/record.tsx

···
                 </button>
               </Tooltip>
               <Modal open={openDelete()} onClose={() => setOpenDelete(false)}>
-                <div class="dark:bg-dark-800/70 dark:shadow-dark-800 absolute top-70 left-[50%] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200/70 p-4 text-neutral-900 shadow-md backdrop-blur-xs transition-opacity duration-300 dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
+                <div class="dark:bg-dark-800 dark:shadow-dark-800 absolute top-70 left-[50%] -translate-x-1/2 rounded-lg border-[0.5px] border-neutral-300 bg-neutral-200 p-4 text-neutral-900 shadow-md transition-opacity duration-300 dark:border-neutral-700 dark:text-neutral-200 starting:opacity-0">
                   <h2 class="mb-2 font-semibold">Delete this record?</h2>
                   <div class="flex justify-end gap-2">
                     <Button onClick={() => setOpenDelete(false)}>Cancel</Button>

src/views/stream.tsx

···
       </div>
       <form
         ref={formRef}
-        class="dark:bg-dark-500/70 sticky top-0 z-5 flex w-screen flex-col items-center bg-neutral-100/70 px-4 text-sm backdrop-blur-xs"
+        class="dark:bg-dark-500 sticky top-0 z-5 flex w-screen flex-col items-center bg-neutral-100 px-4 text-sm"
       >
         <div class="flex w-[22rem] flex-col gap-2 py-3 sm:w-[24rem]">
           <Show when={!connected()}>