/* ─────────────────────── Add training (screens/events.js `trainingForm`)
   The owner's Add training v1 handoff (2026-10-27): a bottom sheet over the
   Schedule -- the ball, "Add training" and the × on top; NAME, WHEN, HOW
   LONG, HOW HARD IS IT? in a body that scrolls; Save fixed at the bottom
   over a fade. Built from the surface's tokens, as every calm part is.

   ⚠ IT IS STILL THE ADD FLOW'S `.addsheet`, so the kernel's overlay motion
   treats it as the full-screen form was treated (`OVERLAYS_FULL`): the
   question it was chosen on waits under it while it rises. Only the dim
   is the layer here; the panel is what rises and sinks. */
.addsheet.at-wrap { inset: 0; padding: 0; overflow: hidden;
                    background: rgba(2, 3, 5, .72); }
.ov-in.addsheet.at-wrap { animation: ovDim .3s ease-out both; }
.ov-out.addsheet.at-wrap { animation: ovDim .24s ease-out reverse both; }
.ov-in.at-wrap > .at-sheet { animation: ovRise .32s cubic-bezier(.32, .72, 0, 1)
                                        both; }
.ov-out.at-wrap > .at-sheet { animation: ovRise .26s cubic-bezier(.32, .72, 0, 1)
                                         reverse both; }
@media (prefers-reduced-motion: reduce) {
  .ov-in.addsheet.at-wrap, .ov-out.addsheet.at-wrap,
  .ov-in.at-wrap > .at-sheet, .ov-out.at-wrap > .at-sheet { animation: none; }
}

/* ⚠ THE 1c LOOK (2026-11-07, the owner's Schedule screens handoff, FINAL,
   boards 2-8, 30-34, 67-73): every sheet events.js draws -- the add flow,
   its pickers, the event's own sheet -- built from onec.css's parts and
   tokens (`--c1-*`): raised = tap it, flat dim = words, sunken = type in
   it, solid blue = chosen, ONE bright button, red text only for Delete
   and Remove. WAS the calm surface's panel rows, underlined name, outline
   chips and ghost buttons. Sizes are the boards' reference HTML. Rules
   here set only geometry where an onec part already sets the colour, so
   `.on` and `[disabled]` stay onec's. */
.sheet.at-sheet { position: absolute; left: 0; right: 0; bottom: 0;
                  height: auto; max-height: calc(100% - 44px
                    - env(safe-area-inset-top));
                  display: flex; flex-direction: column; gap: 0;
                  padding: 0; overflow: hidden;
                  background: var(--c1-sheet); border: 0;
                  border-top: 1px solid var(--c1-sheet-line);
                  box-shadow: 0 -20px 50px rgba(0, 0, 0, .7);
                  border-radius: 28px 28px 0 0; }
.at-sheet > .c-grab { flex: none; }
.at-sheet .c-grab i, .at-sub .c-grab i, .sheet.evocc .grab i,
.sheet.evtype .grab i { width: 40px; height: 5px; border-radius: 3px;
                        background: #3d5170; }

.at-head { flex: none; display: flex; align-items: center; gap: 12px;
           padding: 4px 12px 2px 20px; }
.at-head h2 { flex: 1 1 auto; margin: 0; font-size: 24px; font-weight: 800;
              line-height: 1.2; }
.at-ball { flex: none; width: 24px; height: 24px; color: var(--c1-icon); }
.at-ball svg, .at-ric svg, .ac-cup svg { width: 100%; height: 100%;
  fill: none; stroke: currentColor; stroke-width: 1.9;
  stroke-linecap: round; stroke-linejoin: round; }
/* the competition's gold, `--comp` -- the app's only gold */
.ac-cup { flex: none; width: 24px; height: 24px; color: var(--comp); }

/* The ×, top right of every one of these sheets: a 44 px round. */
.at-head button.c-back.c-close, .evtop button.c-back.c-close,
.evhead button.c-back.c-close, .at-sub button.c-back.c-close {
  flex: none; width: 44px; height: 44px; min-height: 0; margin: 0;
  padding: 12px; border-radius: 50%; background: #17233a;
  border: 1px solid #2f4262; color: #c3cddb; }

/* The body scrolls under the fixed Save; its foot is the room Save takes. */
.at-body { flex: 1 1 auto; min-height: 0; overflow-y: auto;
           -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
           padding: 0 16px 28px; }
.at-body > .addnote { margin: 10px 4px 0; }

/* Section labels: onec's `.c1-lab`, its words in the first span. */
.at-label.c1-lab { margin: 22px 4px 8px; }
.at-label.c1-lab > span:first-child { color: inherit; font-size: inherit;
  font-weight: inherit; letter-spacing: inherit; text-transform: inherit; }
.at-lr { font-variant-numeric: tabular-nums; }
.at-name { display: block; }
.at-cap { display: block; margin: 14px 4px 8px; color: var(--c1-lab);
          font-size: 12.5px; font-weight: 800; letter-spacing: .12em;
          text-transform: uppercase; }
/* NAME: the sunken box (onec's `.c1-field`), blue-edged while typing. */
.at-sheet input.at-input.c1-field { margin: 0; }
.at-sheet .c1-field:focus { outline: none; border-color: var(--c1-on-line); }
.at-sheet select.c1-field, .at-sheet input.c1-field[type] {
  min-height: 0; height: 52px; padding: 0 14px; font-size: 16px;
  background: var(--c1-field); border: 1px solid var(--c1-field-line);
  box-shadow: var(--c1-field-sink); border-radius: 14px; color: var(--c1-ink);
  color-scheme: dark; }

/* A raised row: icon · label · value · the round chevron. */
.at-card.c1-card { padding: 12px; }
button.at-row.c1-tile, .ev1-pick.c1-tile { min-height: 56px; }
.at-ric { flex: none; width: 22px; height: 22px; color: var(--c1-icon); }
.at-rl { flex: 1 1 auto; min-width: 0; font-size: 16px; font-weight: 600;
         color: #c9d3e0; }
.at-rv { flex: 0 1 auto; min-width: 0; overflow: hidden;
         text-overflow: ellipsis; white-space: nowrap; font-size: 16px;
         font-weight: 800; color: var(--c1-ink);
         font-variant-numeric: tabular-nums; }
.c1-go svg { width: 14px; height: 14px; fill: none; stroke: currentColor;
             stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.c1-go.ev1-down svg { transform: rotate(90deg); }
.c1-go.ev1-up svg { transform: rotate(-90deg); }

/* HOW LONG, a competition's numbers: raised chips in one row. */
.at-chips { display: flex; gap: 6px; }
button.at-chip.c1-chip { display: flex; align-items: center;
  justify-content: center; height: 56px; min-height: 0; margin: 0;
  padding: 0 2px; text-align: center; white-space: nowrap; }

/* A choice: the ring at its left, its word and line, the bars at its
   right (HOW HARD IS IT?) -- solid blue once chosen. */
.at-loads, .at-reps, .ev1-loads { display: flex; flex-direction: column;
                                  gap: 10px; }
button.at-load.c1-tile, button.at-rep.c1-tile, .ev1-loads button.c1-tile {
  min-height: 56px; gap: 14px; }
.ev1-ring { flex: none; display: flex; align-items: center;
            justify-content: center; width: 26px; height: 26px;
            box-sizing: border-box; border-radius: 50%;
            border: 2px solid #7d93b2; }
.ev1-ring svg { display: none; width: 14px; height: 14px; fill: none;
                stroke: #1478cc; stroke-width: 3.2; stroke-linecap: round;
                stroke-linejoin: round; }
.c1-tile.on > .ev1-ring { background: #fff; border-color: #fff; }
.c1-tile.on > .ev1-ring svg { display: block; }
.at-lm, .ev1-tx { flex: 1 1 auto; min-width: 0; display: flex;
                  flex-direction: column; }
.at-lt, .ev1-tx .t { font-size: 16px; font-weight: 800; line-height: 1.25; }
.at-ls, .ev1-tx .s { margin-top: 2px; font-size: 13.5px; font-weight: 400;
                     line-height: 1.35; color: var(--c1-sub); }
.c1-tile.on .at-ls, .c1-tile.on .ev1-tx .s { color: rgba(255, 255, 255, .92); }
.at-rpt { flex: 1 1 auto; }
/* Until: its long value ("52 weeks · Fri 5 Nov 2027") takes the room. */
button.at-row.at-until .at-rl { flex: 0 0 auto; }
button.at-row.at-until .at-rv { flex: 1 1 auto; text-align: right; }
.at-bars { flex: none; display: flex; }
.at-bars svg.evbars { width: 20px; height: 18px; margin: 0; }
.at-bars svg.evbars rect { fill: #4b607d; opacity: 1; }
.at-bars svg.evbars rect.on { fill: var(--c1-icon); }
.c1-tile.on .at-bars svg.evbars rect { fill: rgba(255, 255, 255, .35); }
.c1-tile.on .at-bars svg.evbars rect.on { fill: #fff; }
.at-note.c1-hint { margin: 12px 4px 0; }

/* THE one bright button on each of these sheets, whatever older class
   rides with it (`c-btn`, `save`). */
.at-sheet button.c1-pri, .at-sub button.c1-pri, .sheet.evocc button.c1-pri {
  width: 100%; min-height: 58px; margin: 0; padding: 0 18px; border: 0;
  border-radius: 18px; background: var(--c1-pri);
  box-shadow: var(--c1-pri-lift); color: #fff; font-size: 17px;
  font-weight: 800; text-align: center; opacity: 1; }
.at-sheet button.c1-pri[disabled], .at-sub button.c1-pri[disabled],
.sheet.evocc button.c1-pri[disabled] { background: var(--c1-tile);
  box-shadow: none; color: var(--c1-hint); }

/* Save: fixed under the body, over a fade the body scrolls under. */
.at-foot { flex: none; position: relative;
           padding: 10px 20px calc(20px + env(safe-area-inset-bottom)); }
.at-foot::before { content: ""; position: absolute; left: 0; right: 0;
                   bottom: 100%; height: 32px; pointer-events: none;
                   background: linear-gradient(180deg, rgba(12, 20, 32, 0),
                                               var(--c1-sheet)); }

/* ─────────── the pickers over the form (boards 4-6): Repeats, a day, two
   wheels -- the app's own sheets, dressed (`atSubDress`). */
.at-sub > .sheet.c-sheet { position: relative; background: var(--c1-sheet);
  border: 0; border-top: 1px solid var(--c1-sheet-line);
  box-shadow: 0 -20px 50px rgba(0, 0, 0, .7); border-radius: 28px 28px 0 0;
  padding: 0 16px calc(24px + env(safe-area-inset-bottom)); gap: 14px; }
.at-sub .sheet > .c-sheethead { position: absolute; top: 24px; right: 12px;
                                margin: 0; }
.at-sub .c-shtitle { padding: 14px 60px 6px 4px; font-size: 24px; }
.at-sub .at-label.c1-lab { margin: 6px 4px -4px; }
.at-wdrow { display: flex; gap: 6px; }
button.at-wd { position: relative; flex: 1 1 0; min-width: 0; height: 54px;
  min-height: 0; margin: 0; padding: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; border-radius: 13px;
  background: var(--c1-tile); border: 1px solid var(--c1-tile-line);
  box-shadow: var(--c1-tile-lift); color: var(--c1-ink); font: inherit; }
button.at-wd b { font-size: 17px; font-weight: 800; line-height: 1.1; }
button.at-wd i { margin-top: 2px; font-size: 12px; font-style: normal;
                 font-weight: 700; color: var(--c1-lab); }
button.at-wd.on { background: var(--c1-on); border-color: var(--c1-on-line);
                  box-shadow: var(--c1-on-lift); color: #fff; }
button.at-wd.on i { color: rgba(255, 255, 255, .92); }
button.at-wd.on::after { content: "\2713"; position: absolute; top: -6px;
  right: -3px; width: 17px; height: 17px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: #1478cc; font-size: 12px; font-weight: 900; }

/* Two wheels in one card, each named, the chosen row on one band. */
.at-wheels { display: flex; padding: 8px 10px 10px; border-radius: 22px;
             background: var(--c1-card); border: 1px solid var(--c1-card-line);
             overflow: hidden; }
.at-wcol { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column;
           align-items: stretch; }
.at-wu { height: 20px; margin: 2px 0 2px; text-align: center;
         color: var(--c1-lab); font-size: 12.5px; font-weight: 800;
         letter-spacing: .12em; text-transform: uppercase; }
.at-wheels .c-wband { background: var(--c1-tile);
                      border: 1px solid var(--c1-tile-line);
                      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09); }
.at-wcol:first-child .c-wband { right: -1px; border-right: 0;
                                border-radius: 14px 0 0 14px; }
.at-wcol:last-child .c-wband { left: -1px; border-left: 0;
                               border-radius: 0 14px 14px 0; }
.at-wheels .c-wv { color: #7d8da3; opacity: .55; }
.at-wheels .c-wv.near { opacity: 1; font-size: 22px; font-weight: 700; }
.at-wheels .c-wv.on { opacity: 1; color: #fff; font-size: 30px;
                      font-weight: 800; }
.at-wnote { margin: 0; min-height: 1.3em; text-align: center;
            font-size: 15px; font-weight: 600; color: #9aa6b6;
            font-variant-numeric: tabular-nums; }

/* The month: the name at the left, its two raised arrows at the right;
   raised days, the past ones dim, the chosen one solid blue. */
.at-sub .c-calhead { gap: 10px; padding: 0 0 0 4px; }
.at-sub .c-calname { order: -1; flex: 1 1 auto; font-size: 18px;
                     font-weight: 800; }
.at-sub button.c-calnav { width: 44px; height: 44px; padding: 14px;
  background: var(--c1-tile); border: 1px solid var(--c1-tile-line);
  box-shadow: var(--c1-tile-lift); color: #e1e8f2; }
.at-sub .c-calgrid { gap: 6px; }
.at-sub .c-calwd { color: var(--c1-hint); font-size: 12px; font-weight: 800;
                   letter-spacing: .08em; text-transform: uppercase; }
.at-sub button.c-calday { height: 46px; border-radius: 12px;
  background: #1b2a42; border: 1px solid #33496a; color: var(--c1-ink);
  font-size: 16px; font-weight: 700; }
.at-sub button.c-calday.ev1-past { background: transparent;
                                   border-color: #1a2638; color: #4f5e73; }
.at-sub button.c-calday.on { background: var(--c1-on);
  border-color: var(--c1-on-line); box-shadow: var(--c1-on-lift);
  color: #fff; font-weight: 800; }
.at-sub button.c-calday:disabled { opacity: .35; }
.at-sub .at-calnote { margin: 0 4px; }

/* ─────────────────── Add competition (screens/events.js `competitionForm`)
   The owner's Schedule updates v1 (3 Nov 2026, AC1/AC2): "in the same style
   as Add training" -- the same sheet, its parts above; only the gold trophy
   in the title, the More row (ruled C1) and what More opens are its own.
   2026-11-07 (boards 7-8): More is a label and a raised row under it --
   "Competition type", the type, the chevron down (up while open). */
.ac-morebox { padding: 0; }
.ac-repx { margin: 10px 0 0; }
.ac-morebox .matchrow { margin: 0 0 10px; padding: 0; border: 0; gap: 8px; }
.ac-morebox .matchrow input.c1-field[type] { margin: 0; }
.ac-morebox .matchrow button.iconbtn { width: 52px; min-height: 52px;
  margin: 0; border-radius: 14px; background: var(--c1-tile);
  border: 1px solid var(--c1-tile-line); color: var(--c1-ink); }
button.ac-add.c1-tile { font-size: 16px; }
.ac-add .at-rl { color: var(--c1-ink); font-weight: 700; }

/* ─────────────── "Add a tennis event" (board 2, `eventTypeScreen`): the
   title, its line and the × on one row; three raised answers, each its
   picture, words and chevron. */
.sheet.evtype { height: auto; background: var(--c1-sheet); border: 0;
  border-top: 1px solid var(--c1-sheet-line); border-radius: 28px 28px 0 0;
  box-shadow: 0 -20px 50px rgba(0, 0, 0, .7);
  padding: 0 16px calc(28px + env(safe-area-inset-bottom)); }
.sheet.evtype .evtop { align-items: flex-start; margin: 4px 0 18px;
                       padding-left: 4px; }
.sheet.evtype .evtop h2 { font-size: 22px; }
.sheet.evtype .evtop p { margin: 2px 0 0; font-size: 13.5px; color: #9aa6b6; }
.sheet.evtype .evtypes { gap: 10px; }
.sheet.evtype .evtypeopt.c1-tile { min-height: 84px; margin: 0;
  padding: 14px; gap: 14px; border-radius: 14px; background: var(--c1-tile);
  border: 1px solid var(--c1-tile-line); box-shadow: var(--c1-tile-lift);
  color: var(--c1-ink); }
.sheet.evtype .evtypeopt .evico { width: 46px; height: 46px;
  border-radius: 14px; background: rgba(140, 196, 245, .14);
  color: var(--c1-icon); }
.sheet.evtype .evtypeopt.ev-competition .evico {
  background: rgba(232, 184, 75, .16); color: var(--comp); }
.sheet.evtype .evtx { flex: 1 1 auto; min-width: 0; }
.sheet.evtype .evtx b { font-size: 17px; font-weight: 800; }
.sheet.evtype .evtx span { margin-top: 3px; font-size: 14px; line-height: 1.4;
                           color: var(--c1-sub); }

/* ─────────────── THE EVENT'S SHEET (boards 30-34, 67-73, `evSheet`), and
   "What happened" (board 33, `playedSheet`): the kind and when, the × at
   their right; its facts flat in one card; Starts and Ends, a lead-in, a
   recap as raised rows; Delete red text on a raised row; Save fixed at
   the foot -- or, a Delete asked, the question, its answers and "Keep it"
   the one bright button. */
.sheetwrap.evoccwrap { background: rgba(2, 3, 5, .72); }
.sheet.evocc { max-height: calc(100% - 44px - env(safe-area-inset-top));
  background: var(--c1-sheet); border: 0;
  border-top: 1px solid var(--c1-sheet-line);
  box-shadow: 0 -20px 50px rgba(0, 0, 0, .7); border-radius: 28px 28px 0 0;
  padding: 0 16px; gap: 12px; }
/* Taller than the phone, it scrolls: no part is squeezed to fit. */
.sheet.evocc > * { flex-shrink: 0; }
.sheet.evocc > :last-child:not(.ev1-foot) {
  margin-bottom: calc(28px + env(safe-area-inset-bottom)); }
.sheet.evocc .evhead { align-items: flex-start; gap: 10px;
                       padding: 0 0 4px 4px; }
.sheet.evocc .evkind { margin-top: 8px; font-size: 12.5px;
                       color: var(--c1-icon); }
.sheet.evocc .evhead h2 { margin: 6px 0 0; font-size: 24px; }
.sheet.evocc .evhead .grow > h2:first-child { margin-top: 2px; }
.sheet.evocc .c1-lab { margin: 6px 4px -2px; }
.sheet.evocc .evint > h3.c1-lab { margin: 6px 4px 10px; }
.evint .ev1-loads { margin-top: 0; }
.sheet.evocc .c1-hint { margin: 2px 4px 0; font-size: 14px; }
.evint > .c1-hint { margin-top: 12px; }
.sheet.evocc .evrows { border-radius: 22px; background: var(--c1-card);
                       border: 1px solid var(--c1-card-line); padding: 4px 16px; }
.sheet.evocc .evrow { min-height: 50px; padding: 0; }
.sheet.evocc .evrow + .evrow { border-top: 1px solid #22324a; }
.sheet.evocc .evrow > span { font-size: 15px; color: #9aa6b6; }
.sheet.evocc .evrow > b { font-size: 15px; font-weight: 800;
                          color: var(--c1-ink); }
.sheet.evocc .ev1-times { padding: 12px; }
/* A row from another file (the lead-in plan's), raised here. */
.sheet.evocc .c1-tile.evlead { justify-content: flex-start; min-height: 56px;
                               border-top: 1px solid var(--c1-tile-line); }
.sheet.evocc .c1-tile.evlead > span:first-child { flex: 1 1 auto; min-width: 0;
  font-size: 16px; font-weight: 600; color: #c9d3e0; }
.sheet.evocc .c1-tile.evlead > b { flex: 0 1 auto; min-width: 0;
  font-size: 16px; font-weight: 800; color: var(--c1-ink); text-align: right; }
.sheet.evocc .c1-tile.ev1-plain { font-weight: 800; }
.sheet.evocc .c1-tile.ev1-red { color: var(--c1-red); font-weight: 800; }
/* The phone's own picker over a row, unseen: the tap lands on it. */
.ev1-pick { position: relative; cursor: pointer; }
.ev1-pick > .c1-go { margin-left: auto; }
input.ev1-native { position: absolute; inset: 0; width: 100%; height: 100%;
  min-height: 0; margin: 0; padding: 0; border: 0; opacity: 0;
  font-size: 16px; cursor: pointer; z-index: 1; }
.evask { display: flex; flex-direction: column; gap: 10px; }
.sheet.evocc .evask .popnote { margin: 6px 4px 2px; font-size: 16px;
  font-weight: 700; line-height: 1.45; color: var(--c1-ink); }
.sheet.evocc button.c1-pri.ev1-keep { justify-content: flex-start;
  min-height: 56px; border-radius: 14px; border: 1px solid var(--c1-on-line);
  text-align: left; font-size: 16px; }
.ev1-foot { position: sticky; bottom: 0; z-index: 2; margin: 0 -16px;
  padding: 30px 20px calc(20px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, rgba(12, 20, 32, 0),
                              var(--c1-sheet) 40%); }
.evplayed .ev1-day { margin: -6px 4px 0; font-size: 15px; color: #9aa6b6; }
.evplayed .ev1-line { margin: 0 4px; font-size: 15px; line-height: 1.5;
                      color: var(--c1-sub); }
.evplayed input.c1-field[type] { height: 56px; min-height: 0; margin: 0;
  background: var(--c1-field); border: 1px solid var(--c1-field-line);
  box-shadow: var(--c1-field-sink); border-radius: 14px; }
.evplayed .addnote { margin: 0 4px; }