/* styles/sesheet.css -- THE SESSION SHEET (Schedule updates v1, 3 Nov 2026:
   SS1-SS7; screens/sesheet.js). Rides index.html's `.sheetwrap` / `.sheet`,
   so the kernel's overlay motion raises it; the sheet 640 px tall, its
   corners 28.

   2026-11-07 (the owner's "Schedule screens, 1c look" handoff, boards
   12-14, 25-29 and 70): MEASURED off `reference/12_S1_Session_Next.html`
   and its siblings (a 390 px frame) and drawn in onec.css's tokens -- the
   sheet #0c1420 under a #34496a line; the top line 12.5/800 soft blue, the
   × a 44 px round; the name 24/800, the meta 14.5; BUILDS its own label
   over 15/600 qualities; the reason and advice boxes and the exercises
   card the 1c card (22 px corners, 4 px wider than the words); a row you
   can tap a raised tile 72 px tall, its thumbnail 46, its tag and round
   chevron at its right -- a done session's rows flat; Start the bright
   58 px button, greyed #1a2638; Skip red text on a raised tile. WAS
   (3 Nov) the You page's card, a soft-blue link and outline buttons. */

.sheetwrap.ss-wrap { background: rgba(2, 3, 5, .72); z-index: 75; }
.sheet.ss-sheet { position: relative; box-sizing: border-box;
  height: min(640px, calc(100% - 24px)); max-height: none;
  border-radius: 28px 28px 0 0; border: 0;
  border-top: 1px solid var(--c1-sheet-line); padding: 10px 0 0;
  overflow: hidden; background: var(--c1-sheet);
  box-shadow: 0 -20px 50px rgba(0, 0, 0, .7); color: var(--c1-ink); }
.ss-grab { flex: none; display: flex; justify-content: center;
  padding: 0 0 6px; }
.ss-grab i { display: block; width: 40px; height: 5px; border-radius: 3px;
  background: #3d5170; }
.ss-in { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 20px 12px; }

/* the top line and its × (a 44 px round, 12 px from the sheet's edge) */
.ss-top { position: relative; padding: 14px 44px 0 0; min-height: 22px; }
.ss-kick { margin: 0; min-width: 0; font-size: 12.5px; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c1-icon);
  line-height: 1.3; }
.ss-kick .ss-stw { color: inherit; font-weight: 800; }
.ss-kick .tp-sample { margin-left: 8px; letter-spacing: .06em; }
.ss-top button.c-back { position: absolute; top: 6px; right: -8px;
  width: 44px; height: 44px; min-height: 0; margin: 0; padding: 0;
  border-radius: 50%; border: 1px solid #2f4262; background: #17233a;
  color: #c3cddb; display: flex; align-items: center;
  justify-content: center; }
.ss-top button.c-back svg { width: 18px; height: 18px; fill: none;
  stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

/* the name, the meta, BUILDS */
.ss-name { margin: 6px 40px 0 0; font-size: 24px; font-weight: 800;
  line-height: 1.2; }
.ss-meta { margin: 6px 0 0; font-size: 14.5px; color: #9aa6b6; }
.ss-builds { display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px 18px; margin-top: 22px; }
.ss-bl { flex: 0 0 100%; font-size: 12.5px; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c1-lab); }
.ss-q { display: inline-flex; align-items: center; gap: 7px; font-size: 15px;
  font-weight: 600; color: #c9d3e0; }
.ss-q i { width: 9px; height: 9px; flex: none; border-radius: 50%; }

/* the reason line (moved, needs a new time: planchg.js `pcSheetWhy`) --
   flat words in the 1c card, no icon; the advice (board 70, `ssAdvice`)
   its gold warning */
.ss-sheet .pc-whybox { margin: 16px -4px 0; padding: 12px 14px; gap: 12px;
  border-radius: 16px; background: var(--c1-card);
  border: 1px solid var(--c1-card-line); }
.ss-sheet .pc-whybox p { font-size: 14px; line-height: 1.45;
  color: var(--c1-sub); }
.ss-sheet .pc-whybox .pc-whyi { display: none; }
.ss-sheet .pc-whybox.ss-adv .pc-whyi { display: inline-flex; margin-top: 1px; }
.ss-sheet .ss-adv .pc-whyi svg { width: 22px; height: 22px;
  stroke: var(--c1-gold); stroke-width: 2.2; }
.ss-sheet .pc-whybox.ss-adv p { color: #dbe6f4; }

/* the exercises card */
.ss-card { margin: 16px -4px 0; padding: 6px 12px 12px; border-radius: 22px;
  background: var(--c1-card); border: 1px solid var(--c1-card-line);
  box-shadow: none; }
.ss-row { display: flex; align-items: center; justify-content: flex-start;
  gap: 12px; padding: 10px 2px; }
.ss-row + .ss-row { border-top: 1px solid #22324a; }
.ss-row .ss-rm { flex: 1; min-width: 0; display: flex;
  flex-direction: column; gap: 2px; }
.ss-rm b { font-size: 15.5px; font-weight: 800; line-height: 1.25; }
.ss-rm .ss-rl { display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap; color: inherit; }
.ss-rl .ss-rd { font-size: 13.5px; font-weight: 400; color: #9aa6b6;
  white-space: nowrap; }
.ss-rd .br-was { margin-right: 4px; color: var(--dim); }
.ss-row .ss-tag { flex: none; font-size: 12.5px; font-weight: 700;
  color: var(--c1-hint); }
/* a row you can tap (boards 12-13, 25-29, 70): raised, its chevron */
.ss-row.ss-tap { min-height: 72px; margin: 10px 0 0; padding: 10px 14px;
  border: 1px solid var(--c1-tile-line); cursor: pointer; }
.ss-row.ss-tap .ss-rd { font-weight: 800; color: #b4bfce; }
.ss-row.ss-tap .px-thumb { width: 46px; height: 46px; }
.ss-sheet .c1-go svg { width: 14px; height: 14px; fill: none;
  stroke: currentColor; stroke-width: 2.6; stroke-linecap: round;
  stroke-linejoin: round; }
/* See all N exercises: a raised tile -- See what you did, the bright one */
button.ss-all { display: flex; align-items: center; gap: 12px; width: 100%;
  min-height: 56px; margin: 10px 0 0; padding: 10px 14px;
  border-radius: 14px; text-align: left; font-size: 16px; font-weight: 800;
  justify-content: flex-start; }
button.ss-all .ss-allw { flex: 1; min-width: 0; }
button.ss-all.c-btn { border: 1px solid var(--c1-on-line);
  background: var(--c1-pri); box-shadow: var(--c1-pri-lift); color: #fff; }
button.ss-all.c-btn .c1-go { background: rgba(255, 255, 255, .22); }
/* done with no rows to list: the record's link alone in its card */
.ss-card > button.ss-all:first-child { margin-top: 6px; }
.ss-wait { margin: 14px 0 0; color: var(--dim); font-size: 14px; }
.ss-parts { margin-top: 16px; }

/* the footer: Start (the bright one) and Skip; a state's line; Check in */
.ss-foot { flex: none; display: flex; flex-direction: column; gap: 10px;
  padding: 12px 20px calc(28px + env(safe-area-inset-bottom)); }
.ss-foot:empty { padding: 0; }
.ss-foot button.c-btn.ss-start { width: 100%; min-height: 58px; margin: 0;
  border: 0; border-radius: 18px; background: var(--c1-pri);
  box-shadow: var(--c1-pri-lift); color: #fff; font-size: 17px;
  font-weight: 800; gap: 10px; justify-content: center; }
.ss-play svg { width: 20px; height: 20px; fill: currentColor; stroke: none; }
/* the greyed Start (today.js `todayLaterGo`) */
.ss-foot button.td-later.ss-later { height: 58px; min-height: 58px;
  margin: 0; border-radius: 18px; border: 0; background: #1a2638;
  color: #7a8aa3; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
  font-size: 17px; font-weight: 800; gap: 10px; }
.ss-foot button.td-later.ss-later .tp-play,
.ss-foot button.td-later.ss-later .tp-play svg { width: 18px; height: 18px;
  fill: #7a8aa3; }
/* Skip (board 12) and Skip session (board 27): red text, raised */
.ss-foot button.ss-skip { width: 100%; min-height: 56px; margin: 0;
  justify-content: center; text-align: center; font-size: 16px;
  font-weight: 800; color: var(--c1-red); }
.ss-did { margin: 0; display: flex; align-items: center;
  justify-content: center; gap: 10px; font-size: 15px; font-weight: 700;
  color: #c9d3e0; text-align: center; }
.ss-did .ss-ico svg { width: 22px; height: 22px; stroke-width: 2.2; }
.ss-lock { margin: 0 4px 2px; display: flex; align-items: center;
  justify-content: center; gap: 10px; font-size: 14.5px; line-height: 1.4;
  color: var(--c1-sub); text-align: center; }
.ss-ico { flex: none; display: inline-flex; color: var(--c1-icon); }
.ss-ico svg { width: 20px; height: 20px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ss-ico.ok { color: var(--c1-icon); }
/* Skip asked (today.js `todaySkipAsk`, board 28): its question, then "Skip
   it" -- red text on a raised tile -- and "Keep it", the chosen blue, the
   one bright button; Skip it drawn first, on the left */
.ss-foot .td-ask { margin: 0; gap: 12px; }
.ss-foot .td-ask p { margin: 0; text-align: center; font-size: 16px;
  font-weight: 700; color: var(--c1-ink); }
.ss-foot .td-ask > div { display: flex; gap: 10px; }
.ss-foot .td-ask button { flex: 1; min-width: 0; min-height: 56px; margin: 0;
  border-radius: 14px; background: var(--c1-tile);
  border: 1px solid var(--c1-tile-line); box-shadow: var(--c1-tile-lift);
  color: var(--c1-ink); font-size: 16px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; }
.ss-foot .td-ask button.td-skipit { order: 1; color: var(--c1-red); }
.ss-foot .td-ask button.td-keep { order: 2; background: var(--c1-on);
  border-color: var(--c1-on-line); box-shadow: var(--c1-on-lift);
  color: #fff; }
/* "Not yet" over the sheet (today.js `todayNotYetPop`, board 29) */
.ss-wrap .td-nywrap { background: rgba(2, 3, 5, .6); padding: 0 28px; }
.ss-wrap .td-ny { padding: 26px 22px 22px; border-radius: 26px;
  background: var(--c1-card); border: 1px solid var(--c1-sheet-line);
  box-shadow: 0 30px 70px rgba(0, 0, 0, .8); }
.ss-wrap .td-nyi { width: 54px; height: 54px; margin: 0 auto;
  border-radius: 50%; background: rgba(140, 196, 245, .14); }
.ss-wrap .td-ny h2 { margin-top: 14px; }
.ss-wrap .td-ny p { margin: 8px 0 0; font-size: 15px; line-height: 1.5;
  color: var(--c1-sub); }
.ss-wrap .td-ny button.c-btn { min-height: 58px; margin: 18px 0 0;
  border-radius: 18px; background: var(--c1-pri);
  box-shadow: var(--c1-pri-lift); color: #fff; font-weight: 800; }