/* Checkout modal, the rules _styles.css does not carry.

   The first version of this file carried ONE rule and said in its own
   comment that "everything else the modal needs (.modal-backdrop, .modal,
   .btn-buy, .btn-cancel, .modal-actions) is already in the shared sheet".
   That was checked by seeing the selector NAMES in _styles.css. The names
   are there; the rules that matter are not. _styles.css scopes .btn-buy
   under .prep-grid .exam-card, which never matches inside a modal, and
   carries only the :focus half of the email input. So btygoat's checkout
   card rendered with a browser-default input and a browser-default grey
   submit button, next to a correctly styled Cancel — which is what made it
   look like a partial failure rather than a missing file.

   Lifted verbatim from index.html; gated against it, and the gate now
   resolves the modal's markup against the sheets this page actually loads
   rather than against the block it was copied from. */
.modal input[type="email"] {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line);
  border-radius: 8px; font-family: var(--body); font-size: 15px;
  background: var(--bg); color: var(--ink); margin-bottom: 14px;
}
.modal input[type="email"]:focus { outline: none; border-color: var(--rose); }
.modal .feedback {
  font-size: 13px; padding: 10px 12px; border-radius: 6px; margin-bottom: 12px;
}
.modal .feedback.bad { background: var(--rose-tint); color: var(--rose-ink); }
.modal .modal-actions {
  display: flex; gap: 10px; margin-top: 8px;
}
.modal .modal-actions .btn-buy {
  flex: 1; background: var(--ink); color: #fff; border: none;
  border-radius: 10px; padding: 12px 18px; font-weight: 600; font-size: 14px;
  font-family: var(--body); cursor: pointer;
}
.modal .modal-actions .btn-cancel {
  background: transparent; color: var(--ink-2); border: 1px solid var(--line);
  border-radius: 10px; padding: 12px 18px; font-weight: 500; font-size: 14px;
  font-family: var(--body); cursor: pointer;
}
.modal-tutor-note{margin:14px 0 4px;padding:11px 13px;border-radius:9px;background:var(--cream,#f6f3ee);border:1px solid var(--line,#e3ddd5);font-size:13.5px;line-height:1.55;color:var(--ink-2,#5a4e48)}.modal-tutor-note strong{color:var(--ink,#2c2420)}