refactor: add pointer-events disabling for envelope states and update e2e tests to match UI interactions

frontend/src/components/reader/EnvelopeReveal.tsx

@@ -48,7 +48,9 @@ export function EnvelopeReveal({
         <div
           className={`relative h-70 w-105 transform-3d transition-transform duration-2000 ${isFlipped ? "rotate-y-180" : ""}`}
         >
-          <div className=" flex backface-hidden rotate-y-180 justify-center transition-all duration-1000">
+          <div
+            className={` flex backface-hidden rotate-y-180 justify-center transition-all duration-1000 ${isFlipped ? "" : "pointer-events-none"}`}
+          >
             <div
               id="env-top"
               className="z-4 delay-500 transition-all duration-2000 absolute peer h-40 w-54 mt-0 bg-base-200 mask mask-triangle-2 scale-x-234 has-checked:scale-y-[-1] has-checked:-translate-y-full has-checked:z-1 has-checked:duration-1000"
@@ -93,7 +95,7 @@ export function EnvelopeReveal({
           <button
             id="env-front"
             type="button"
-            className="text-left p-10 absolute inset-0 backface-hidden w-110 bg-base-200 z-99 rounded-md -translate-x-2"
+            className={`text-left p-10 absolute inset-0 backface-hidden w-110 bg-base-200 z-99 rounded-md -translate-x-2 ${isFlipped ? "pointer-events-none" : ""}`}
             onClick={() => setIsFlipped((prev) => !prev)}
           >
             <span className={"text-neutral-content/60 font-xs font-display"}>

frontend/src/pages/Drawer.tsx

@@ -142,6 +142,7 @@ export default function Drawer() {
 
       <button
         type="button"
+        id="write-letter-btn"
         className="group mt-15 z-10 bg-transparent border border-dashed border-base-content/10 px-8 py-4 text-base-content/40 italic cursor-pointer transition-all hover:border-primary/40 hover:text-base-content/60 hover:bg-primary/5 hover:-translate-y-0.5 flex items-center gap-2 focus-visible:ring-2 focus-visible:ring-primary/50 duration-500"
         onClick={() => navigate(PATHS.write(""))}
       >

frontend/src/pages/Reader.tsx

@@ -315,7 +315,7 @@ export default function Reader() {
           >
             <PaperPlaneTiltIcon size={16} weight="duotone" />
             <span className="text-md uppercase font-sans tracking-widest">
-              Send to someone...
+              Send to someone
             </span>
           </button>
           <button