/* Your answers so far: one tile piece for every page that shows them (answer 293 (1), the founder 1 Nov 14:21: the long
   lists were "almost impossible to digest"). Lifted from the founder's mockup (local/founder-design-session/2026-11-01/
   mockup/summaries.html) and the money page's chapter tiles (local/consult/2026-11-01-money-page/1-chapter-version.html,
   prototypes/agree/facts-first-money/money.css:25-34), never redrawn from memory. The papers' type and quiet ground come
   from prototypes/agree/facts-first-results/papers.css:9-14, carried here so an asking flow needn't load the papers' sheet.

   Markup (each tile reopens its asking screen and comes back, 287 (3)):
     <p class="sf-lab">Your sit · the animals</p><h2 class="sf-hl">Your <em>animals.</em></h2><p class="sf-sub">16 of 17 answered.</p>
     <div class="sf-grid">
       <button class="sf-tile big done"><span class="sf-mark"></span>{drawing}<span class="sf-tx"><b>Pepper</b>
         <i>Dog · <strong>has bitten before</strong> · <em>getting out: not answered</em></i></span></button>
       <button class="sf-tile open">…</button>
     </div>
     <p class="sf-quiet">For every dog</p>
   One tile wide, the rest in pairs; "done" ticks it, "open" dots it. In a line, <strong> is what a sitter must know and
   <em> is what isn't answered yet. */
/* 330 (3), the founder 3 Nov ("a41's cream-filled tiles reconsidered"): the papers' cream is the comparing area's ground now, so
   these tiles take the kit's own quiet fill (sketch.css --soft, the frozen sketch's quiet tile), no area's colour (/surface §1a) */
.sf{--sf-quiet:var(--soft,#f1f2f4);--sf-ink3:#625b50;--sf-mono:'DM Mono',ui-monospace,monospace;--sf-serif:'Source Serif 4',Georgia,serif}
.sf-lab{font-family:var(--sf-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:4px 0 10px}
.sf-hl{margin:0;font-family:var(--sans);font-weight:800;font-size:34px;line-height:1.04;letter-spacing:-.025em;color:var(--ink)}
.sf-hl em{font-family:var(--sf-serif);font-style:italic;font-weight:600;letter-spacing:-.01em;color:var(--accent)}
.sf-sub{font-family:var(--sans);font-size:16px;line-height:1.45;color:var(--ink2);margin:10px 0 16px}
.sf-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sf-tile{all:unset;box-sizing:border-box;background:var(--sf-quiet);border-radius:18px;padding:12px 13px 13px;display:flex;flex-direction:column;gap:4px;min-height:128px;position:relative;cursor:pointer;text-align:left}
.sf-tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sf-tile.big{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px;min-height:0}
.sf-tile .art,.sf-tile img,.sf-tile svg{width:70px;height:52px;object-fit:contain;object-position:left;margin:0 0 2px -4px;flex:none}
.sf-tile.big .art,.sf-tile.big img,.sf-tile.big svg{width:96px;height:70px}
.sf-tx{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.sf-tile:not(.big) .sf-tx{margin-top:auto}
.sf-tile b{font-family:var(--sans);font-weight:750;font-size:16px;line-height:1.22;color:var(--ink);padding-right:14px}
.sf-tile.big b{font-size:19px}
.sf-tile i{font-style:normal;font-family:var(--sans);font-size:13px;line-height:1.38;color:var(--sf-ink3);display:block}
.sf-tile i strong{color:var(--ink);font-weight:700}
.sf-tile i em{font-style:normal;color:var(--amber);font-weight:650}
.sf-mark{position:absolute;top:12px;right:13px;width:12px;height:12px}
.sf-tile.done .sf-mark{width:10px;height:6px;border-left:2.5px solid var(--accent);border-bottom:2.5px solid var(--accent);transform:rotate(-45deg);top:14px;right:14px} /* the kit's tick, sketch.css:83 */
.sf-tile.open .sf-mark{width:9px;height:9px;border-radius:50%;background:var(--amber);top:15px;right:15px}
.sf-quiet{font-family:var(--sf-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--sf-ink3);margin:18px 0 8px}
.sf-note{margin:0 0 8px;font-family:var(--sans);font-size:15px;line-height:1.4;color:var(--ink2)} /* a note to come back to: plain text, never a tile */
.sf-note b{display:block;color:var(--ink);font-weight:700}
