Sheet: light/dark switch, slimmer lobby header, remove wide view

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HJhXuLD2Z6hv3Wqeq9UL9K

frontend/src/Lobbies.jsx

@@ -1,5 +1,4 @@
 import { useCallback, useEffect, useRef, useState } from 'react'
-import SheetView from './SheetView.jsx'
 import PaperSheet from './PaperSheet.jsx'
 
 const J = { 'Content-Type': 'application/json' }
@@ -321,24 +320,17 @@ function CharTab({ cid, owner, rules, onOpen, name }) {
     const t = setInterval(() => !document.hidden && load(), 15000)
     return () => clearInterval(t)
   }, [cid])
-  const [view, setView] = useState(() => { try { return localStorage.getItem('aw_sheetview') === 'wide' ? 'wide' : 'paper' } catch { return 'paper' } })
-  const pick = (v) => { setView(v); try { localStorage.setItem('aw_sheetview', v) } catch { /* storage may be blocked */ } }
-  const viewSwitch = (
-    <span className="seg" role="group" aria-label="Sheet layout">
-      <button className={view === 'paper' ? 'on' : 'ghost'} onClick={() => pick('paper')} title="A4 page layout, compact">A4 sheet</button>
-      <button className={view === 'wide' ? 'on' : 'ghost'} onClick={() => pick('wide')} title="Expand to the full width">Wide</button>
-    </span>
-  )
   return (
     <div>
-      <div className="row">
-        <h2>{data?.name || name || 'Nameless'}</h2>
-        <button className="ghost" onClick={onOpen}>{owner ? 'Open in the Character tab' : 'Edit in the Character tab'}</button>
-      </div>
-      <p className="muted small">{owner ? `Played by ${owner}. ` : ''}Read-only, hover or tap a value to see how it is made up.</p>
       {err && <p className="warn">{err}</p>}
-      {data && view === 'paper' && <PaperSheet data={data} baseRules={rules} tools={viewSwitch} />}
-      {data && view === 'wide' && <><div className="papertools">{viewSwitch}</div><SheetView data={data} baseRules={rules} /></>}
+      {data && (
+        <PaperSheet data={data} baseRules={rules} tools={
+          <>
+            <span className="muted small">{owner ? `Played by ${owner}` : 'Your character'} · read-only, hover or tap a value for details</span>
+            <button className="ghost" onClick={onOpen}>{owner ? 'Open in Character tab' : 'Edit in Character tab'}</button>
+          </>
+        } />
+      )}
     </div>
   )
 }
@@ -392,10 +384,10 @@ function LobbyView({ id, rules, user, onOpen }) {
 
   return (
     <section className="page lobbypage">
-      <p className="small"><a href="#lobbies">← All lobbies</a></p>
-      <div className="row">
+      <div className="lobbyhead">
+        <a className="small" href="#lobbies">← Lobbies</a>
         <h1>{lobby.name}</h1>
-        <span className="muted">DM: {lobby.dm}{lobby.is_dm ? ' (you)' : ''}</span>
+        <span className="muted small">DM: {lobby.dm}{lobby.is_dm ? ' (you)' : ''}</span>
       </div>
       {err && <p className="warn">{err}</p>}
       {info && <p className="small">{info}</p>}