refactor(ui): resolve mobile layout and HMR findings for app shell and nav rail

src/ui/StoryView.tsx

@@ -8,9 +8,9 @@ export function StoryView() {
   const hasChoices = story.choices.length > 0;
 
   return (
-    <div className="grid h-full grid-cols-1 gap-8 lg:grid-cols-3">
+    <div className="flex h-full flex-col gap-8 lg:grid lg:grid-cols-3">
       {/* Story Log Section */}
-      <div className="flex max-h-[30vh] flex-col overflow-y-auto border-slate-800 lg:max-h-[calc(100vh-6rem)] lg:border-r lg:pr-6">
+      <div className="order-2 flex max-h-[30vh] flex-col overflow-y-auto border-slate-800 border-t pt-6 lg:order-1 lg:max-h-[calc(100vh-6rem)] lg:border-t-0 lg:border-r lg:pt-0 lg:pr-6">
         <h2 className="mb-4 text-xs font-semibold text-slate-400 tracking-wider uppercase">
           Story Log
         </h2>
@@ -34,7 +34,7 @@ export function StoryView() {
       </div>
 
       {/* Active Node Section */}
-      <div className="flex min-h-[300px] flex-col justify-between rounded-xl border border-slate-800/60 bg-slate-900/40 p-6 shadow-inner lg:col-span-2">
+      <div className="order-1 flex min-h-[300px] flex-col justify-between rounded-xl border border-slate-800/60 bg-slate-900/40 p-6 shadow-inner lg:order-2 lg:col-span-2">
         <div className="flex flex-1 flex-col justify-center">
           <p className="text-lg text-slate-100 leading-relaxed whitespace-pre-wrap">
             {story.currentProse ||