/* /edit-checks: the page's own world, the edit-check specification. */

/* ══ The page's own world: the specification spreadsheet. Column letters,
   row numbers, a formula bar that quotes the clause, statuses that move
   from drafted to approved, faint cell rules under the page. ══ */
.page-sheet { --cell: rgba(255, 255, 255, 0.08); --cell-head: #0b111a; }
.page-sheet main { counter-reset: sec; background-image: linear-gradient(rgba(255, 255, 255, 0.022) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px); background-size: 132px 30px; }

.sheet-hero { padding: 136px 0 80px; }
.sheet-hero__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr); gap: 24px 64px; align-items: end; }
.sheet-hero .page-title { max-width: none; font-size: clamp(42px, 5vw, 76px); }
.sheet-hero .page-lede { margin-top: 0; }
.sheet { margin: 52px 0 0; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 8px; background: #070b11; box-shadow: 0 40px 90px -40px rgba(0, 0, 0, 0.9); animation: heroUp 0.9s var(--ease-out) 0.2s both; }
.sheet__bar { display: flex; align-items: center; gap: 18px; padding: 10px 14px; border-bottom: 1px solid var(--cell); background: var(--cell-head); }
.sheet__file { font: 500 12px var(--font-mono); color: #e6edf5; }
.sheet__tabs { display: flex; gap: 4px; }
.sheet__tabs i { padding: 3px 10px; border-radius: 4px; font: 500 11.5px var(--font-ui); font-style: normal; color: var(--label); }
.sheet__tabs i.is-on { background: rgba(110, 231, 183, 0.12); color: var(--live); }
.sheet__bar > b { margin-left: auto; font: 600 9.5px var(--font-ui); letter-spacing: 0.16em; text-transform: uppercase; color: #9fd8ff; }
.sheet__fx { display: flex; align-items: center; gap: 12px; padding: 8px 14px; border-bottom: 1px solid var(--cell); }
.sheet__fx b { padding-right: 12px; border-right: 1px solid var(--cell); font: italic 600 13px var(--font-display); color: var(--label); }
.sheet__fx code { overflow: hidden; font: 400 12.5px var(--font-mono); white-space: nowrap; text-overflow: ellipsis; color: #b6f6ff; }
.sheet__grid { display: grid; grid-template-columns: 36px 86px 56px 70px minmax(0, 1.1fr) minmax(0, 1.3fr) 70px 150px; }
.sheet__grid > * { min-width: 0; overflow: hidden; padding: 9px 10px; border-right: 1px solid var(--cell); border-bottom: 1px solid var(--cell); font: 400 12.5px var(--font-ui); white-space: nowrap; text-overflow: ellipsis; color: rgba(255, 255, 255, 0.8); }
.sheet__corner, .sheet__col, .sheet__row { background: var(--cell-head); font: 500 11px var(--font-ui) !important; text-align: center; color: var(--label) !important; }
.sheet__grid > b { font-weight: 600; color: #fff; }
.sheet__grid > code { font: 400 12px var(--font-mono); color: #b6f6ff; }
.sheet__grid .is-sel { background: rgba(92, 200, 255, 0.07); }
.sheet__grid .sheet__row.is-sel { background: rgba(92, 200, 255, 0.2); color: #fff !important; }
.sheet__grid .is-cell { box-shadow: inset 0 0 0 2px #5cc8ff; }
.sheet__grid > em { font: 600 11px var(--font-ui); font-style: normal; letter-spacing: 0.04em; }
.sheet__grid .is-ok, .sheet__cycle .is-ok { color: var(--live); }
.sheet__grid .is-gap { color: #ff8a82; }
.sheet__cycle { display: grid; }
.sheet__cycle i { grid-area: 1 / 1; font-style: normal; color: var(--label); }
.sheet__cycle .is-test { color: #9fd8ff; }
.sheet__status { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding: 9px 14px; background: var(--cell-head); font: 500 11px var(--font-ui); color: var(--label); }

/* sections are addressed like cells */
.page-sheet .section { counter-increment: sec; }
.page-sheet .section-head .kicker::before { content: "A" counter(sec); display: inline-block; margin-right: 12px; padding: 2px 8px; border: 1px solid rgba(110, 231, 183, 0.45); border-radius: 3px; font: 500 11px var(--font-mono); letter-spacing: 0; color: var(--live); }

@media (max-width: 1100px) {
  .sheet-hero__top { grid-template-columns: 1fr; }
  .sheet__grid { grid-template-columns: 30px 76px 50px 64px minmax(0, 1fr) 0 0 128px; }
  .sheet__grid > :nth-child(8n + 6), .sheet__grid > :nth-child(8n + 7) { padding: 0; border: 0; }
}
@media (max-width: 640px) {
  .sheet-hero { padding-top: 112px; }
  .sheet__tabs { display: none; }
  .sheet__grid { grid-template-columns: 26px 66px 0 0 minmax(0, 1fr) 0 0 112px; }
  .sheet__grid > :nth-child(8n + 3), .sheet__grid > :nth-child(8n + 4) { padding: 0; border: 0; }
  .sheet__grid > * { font-size: 11.5px; padding: 8px 6px; }
}
