/* Shift — page layout only: the two columns, the handover stamps, the quoted notes. */
@layer page {
  .sh-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--s8); align-items: start; }
  .sh-brief { max-width: 920px; }
  .sh-set { display: block; font-weight: 400; }
  .sh-plain { font-weight: 400; }
  .sh-join { width: 20px; height: 2px; background: var(--ok-dot); border-radius: 2px; }
  .sh-quote { margin: var(--s2) 0 0; padding: var(--s3) var(--s4); border-left: 2px solid var(--line-2); color: var(--text); font-size: var(--t-data); max-width: 72ch; }

  /* The handover: two stamps converge; complete only when both sides stamp. */
  .sh-ho { display: grid; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr); align-items: stretch; }
  .sh-ho__slot { display: grid; gap: 4px; align-content: start; padding: var(--s3) var(--s4); border-radius: var(--r3); border: 1px solid var(--line-2); background: var(--sheet); font-size: var(--t-small); color: var(--text-2); min-height: 88px; }
  .sh-ho__v { color: var(--text); font-weight: 600; }
  .sh-ho__k { font-size: var(--t-cap); font-weight: 700; color: var(--text-2); }
  .sh-ho__slot[data-state="done"] { border-color: var(--ok-line); background: var(--ok-surface); }
  .sh-ho__slot[data-state="done"] .sh-ho__k { color: var(--ok-fg); }
  .sh-ho__join { position: relative; }
  .sh-ho__join::before { content: ''; position: absolute; left: 4px; right: 4px; top: 50%; height: 2px; background: var(--line-2); }
  .sh-ho[data-stamped="b"] .sh-ho__join::before { background: linear-gradient(90deg, var(--ok-dot) 50%, var(--line-2) 50%); }
  .sh-ho[data-stamped="ab"] .sh-ho__join::before { background: var(--ok-dot); }

  @media (max-width: 1100px) { .sh-grid { grid-template-columns: minmax(0, 1fr); } }
  @media (max-width: 700px) {
    .sh-ho { grid-template-columns: minmax(0, 1fr); gap: var(--s2); }
    .sh-ho__join { height: 16px; }
    .sh-ho__join::before { left: 50%; right: auto; top: 0; bottom: 0; width: 2px; height: auto; }
  }
}