/* styles/pe.css -- POWER ENDURANCE (2026-10-15, SPEC_power_endurance_v1):
   its own screens in the repeat sprints' design -- sprint.css's parts
   reused as they are, the 3-2-1, the rest ring, the head, the pause sheet,
   the summary and its effort; here only what power endurance adds: the
   exercises' rows with their seconds, the effort counting down, SWITCH
   SIDES at halfway, the safety stop's reasons. Served at `/styles/pe.css`.

   NO NEW TOKEN: the surface's own (`--focal` -- the session's colour through
   `.rv` --, `--card-fill`, `--line`, `--dim`). Every class here is `pe-`:
   one stylesheet is one namespace. */

/* ---- the exercises' rows (the overview, Session A / B, the merged one) ---- */
.pe-list { padding: 4px 14px; }
.pe-row { display: flex; align-items: flex-start; gap: 12px; padding: 10px 0;
          border-bottom: 1px solid var(--line); }
.pe-row:last-child { border-bottom: 0; }
.pe-no { flex: none; width: 26px; height: 26px; border-radius: 50%;
         display: flex; align-items: center; justify-content: center;
         font-size: 13px; font-weight: 700; color: var(--focal);
         border: 1px solid var(--line); }
.pe-row .t { flex: 1; min-width: 0; display: flex; flex-direction: column;
             gap: 2px; }
.pe-row .t b { font-size: 16px; }
.pe-row .t span { font-size: 13.5px; color: var(--dim); line-height: 1.35; }
.pe-row .t .pe-secs { color: var(--focal); font-weight: 600; }

/* ---- an exercise's card (before it, and between exercises) --------------- */
.pe-name { margin: 0; }
.pe-step { margin: -4px 0 0; font-size: 16px; color: var(--dim); }
.pe-secs { margin: 0; font-size: 15px; color: var(--dim); }
.pe-secs.big { font-size: 20px; font-weight: 700; color: var(--focal); }
.pe-next { display: flex; flex-direction: column; gap: 10px; }
.pe-next h2.pe-name { font-size: 24px; }
.pe-next .spr-auto { padding: 0; }

/* ---- the effort: GO, its seconds, SWITCH SIDES ---------------------------- */
.pe-go .pe-word { color: var(--accent-bright, #2196f3); }
/* Two words, not two letters: sized to the phone's width, not GO's. */
.pe-go.switched .pe-word { color: var(--focal); font-size: min(17vw, 96px);
                           line-height: 1.05; max-width: 92vw; }
.pe-left { display: block; font-size: 64px; font-weight: 800;
           line-height: 1; font-variant-numeric: tabular-nums; }
.pe-keep { margin: 0 16px; font-size: 16px; color: var(--dim); }
.pe-restof { font-size: 13px; color: var(--dim); }

/* ---- the safety stop's reasons -------------------------------------------- */
.spr-prow.pe-why .t b { font-weight: 600; }

/* ---- the summary ---------------------------------------------------------- */
.pe-sumt .spr-sumr .v b { font-size: 18px; }
