/* PORTRAIT·EXPORT — the "Take this with you" block at the foot of the area view.
   One row per exportable file: an open-ended "Caïa so far" + each finished-phase
   chapter. Tap = the caller's handler (the component only emits).

   ⭐ THE OPEN-ENDED ONE IS NOT VISUALLY WEAKER THAN THE FINISHED CHAPTERS.
   Same card, same weight — the phase chapters differ in SCOPE, not in quality
   (D-444). Styling one as the prize would make on-demand second-class and turn
   the finished one into a thing to earn.

   ⚠️ NO COUNT, NO "completed" tick, no celebration. The block is a list of files
     she can take with her — completion mechanics in this population produce
     guilt (Mogavi 2022, Chen 2024).

   ⭐ EVERY VALUE A TOKEN (D-425/D-426/D-429). No raw hex, no raw structural px.
   Self-contained: every element the card renders is styled under the card's
   own root class, zero reliance on page or user-agent defaults. */

  .ptx { margin-top: var(--space-24); }

  /* ── HEADING ──────────────────────────────────────────────────────────────── */
  .ptx-h { font-family: var(--font-display); font-size: var(--text-subtitle); /* card head role, D-463 (source used raw --size-20) */
    font-weight: var(--weight-600); color: var(--text-primary);
    margin-bottom: var(--space-12); }

  /* ── A FILE ROW ────────────────────────────────────────────────────────────── */
  /* Three-column grid: [file-glyph] [name + meta] [trailing action].
     The whole row is a button — the click is the caller's export handler.
     ⚠️ NOT A LIST ROW (303/202). The row holds a file, not content; the file
     glyph (left disc) makes that tellable on sight — a list row starts with
     text, this starts with an object. */
  .ptx-file { display: grid;
    grid-template-columns: var(--dim-32) 1fr auto;
    align-items: center; gap: var(--space-12);
    width: 100%; background: var(--surface-card); border: 0;
    border-radius: var(--radius-card); padding: var(--space-16);
    margin-bottom: var(--space-8);
    cursor: pointer; text-align: left; }
  /* The file glyph — teal-100 disc, accent glyph. Matches the area-disc pattern
     on .pt-ic (D-379/D-404): teal-100 says what the thing IS, not its STATE. */
  .ptx-file-ic { grid-column: 1; grid-row: 1 / span 2;
    width: var(--dim-32); height: var(--dim-32);
    background: var(--teal-100); color: var(--accent);
    border-radius: var(--radius-round);
    display: grid; place-items: center; flex: 0 0 auto; }
  .ptx-file-ic svg { width: var(--dim-16); height: var(--dim-16); }
  /* Name and meta stack in column 2 — the meta sits below the name, not beside
     it, because a file row is a file's title and a file's range, read top to
     bottom the way a parent would say it. */
  .ptx-file-n { grid-column: 2; font-family: var(--font-body);
    font-size: var(--text-body); font-weight: var(--weight-600); /* body floor 16, D-463 */
    color: var(--text-primary); }
  .ptx-file-m { grid-column: 2; font-family: var(--font-body);
    font-size: var(--text-caption); color: var(--text-secondary); /* caption == 13 */
    margin-top: var(--radius-2); }
  /* The trailing action — same chevron vocabulary every other row uses (.cv),
     styled the same way (terter ink, 16px). The chevron is the affordance for
     "this is tappable" and never carries an action of its own — the row does. */
  .ptx-file .cv { grid-column: 3; grid-row: 1 / span 2;
    color: var(--text-tertiary); display: inline-flex; }
  .ptx-file .cv svg { width: var(--dim-16); height: var(--dim-16); }
  /* Pressed state: the well, not the accent. An accent press would re-ink
     every glyph on the row; the well re-tones the ground. */
  .ptx-file:active { background: var(--surface-well); }

  /* The open-ended "Caї so far" file is the same card, not a styled-prize twin.
     Same geometry, same weight — the row has no class to opt into the open
     variant. Kept as a placeholder for the design rule it carries. */
  .ptx-file.is-open { }

  /* ── THE NOTHINGYET ──────────────────────────────────────────────────────────
     Heading visible, no rows. A quiet statement — NOT a nudge, NOT a gap-list.
     A nudge here would be the record initiating attention toward itself
     (gate 3), and an empty file list reads as a completeable one once a row
     of "Add something" appears. The honest empty is one sentence saying how it
     works (D-517/D-541). */
  .ptx-none { font-family: var(--font-body); font-size: var(--text-body); /* body floor 16, D-463 */
    line-height: var(--leading-150); color: var(--text-secondary);
    margin: 0 0 var(--space-12); }