/* THROWAWAY: bounded layouts for the course editor, gated by ?variant=A/B/C outside production. */
@layer app {
  .course-editor-prototype { margin: 2rem 0 0; padding-bottom: 7rem; }
  .course-editor-prototype.prototype-A { max-width: 660px; }
  .course-editor-prototype.prototype-B { max-width: 960px; }
  .course-editor-prototype.prototype-C { max-width: 900px; }
  .prototype-heading { margin-bottom: 2rem; }
  .prototype-heading h1 { font-size: 1.9rem; letter-spacing: -.04em; }
  .prototype-heading p { margin-top: .4rem; font-size: .9rem; }
  .course-editor-prototype .field { display: grid; gap: .65rem; }
  .course-editor-prototype .field > label, .course-editor-prototype legend { font-size: .9rem; font-weight: 700; }
  .course-editor-prototype input:is([type="text"], [type="url"]) { min-height: 3.5rem; border: 1px solid transparent; border-radius: .85rem; background: #edf0f4; padding: .95rem 1rem; font-weight: 600; box-shadow: none; }
  .course-editor-prototype input:is([type="text"], [type="url"]):focus { border-color: #126fc4; outline: 0; background: white; box-shadow: 0 0 0 3px rgb(18 111 196 / 14%); }
  .course-editor-prototype h2 { font-size: 1.15rem; letter-spacing: -.025em; }
  .course-editor-prototype .course-class-days { margin-top: 1.5rem; }
  .course-editor-prototype .course-class-time { margin-top: 1.75rem; }
  .course-editor-prototype .study-day-option > span { background: #f0f3f6; border-color: transparent; border-radius: .85rem; }
  .course-editor-prototype .study-day-option input:checked + span { background: #126fc4; color: white; }
  .course-editor-prototype .study-day-option input:checked + span .study-day-tick { color: white; }
  .course-editor-prototype .field-note { font-size: .78rem; line-height: 1.55; }
  .prototype-sheet { display: grid; gap: 2rem; border: 1px solid #e7ebef; border-radius: 1.5rem; background: white; padding: 2rem; }
  .prototype-sheet-schedule { border-top: 1px solid var(--line); padding-top: 1.75rem; }
  .prototype-notebook { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); gap: 2.75rem 3.5rem; }
  .prototype-course-title { grid-column: 1 / -1; }
  .prototype-course-title input { font-size: 1.3rem; }
  .prototype-notebook-details h2 { margin-bottom: 1.5rem; }
  .prototype-notebook-schedule { border-left: 1px solid var(--line); padding-left: 2rem; }
  .prototype-notebook-schedule .study-day-options { gap: .3rem; }
  .prototype-notebook-schedule .study-day-option > span { font-size: .75rem; }
  .prototype-disclosures { display: grid; gap: 1rem; }
  .prototype-disclosures details { border: 1px solid #e7ebef; border-radius: 1.25rem; background: white; }
  .prototype-disclosures summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.5rem; list-style: none; cursor: pointer; }
  .prototype-disclosures summary::-webkit-details-marker { display: none; }
  .prototype-disclosures summary strong, .prototype-disclosures summary small { display: block; }
  .prototype-disclosures summary small { margin-top: .35rem; color: var(--muted); font-size: .8rem; }
  .prototype-disclosures summary > span:last-child { font-size: 1.5rem; }
  .prototype-disclosures details[open] summary > span:last-child { transform: rotate(45deg); }
  .prototype-disclosure-body { display: grid; gap: 1.75rem; border-top: 1px solid var(--line); padding: 1.5rem; }
  .prototype-disclosure-body .course-class-days, .prototype-disclosure-body .course-class-time { margin-top: 0; }
  .prototype-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.75rem; }
  .prototype-actions > span { color: var(--muted); font-size: .75rem; }
  .prototype-actions .button { width: auto; padding-inline: 1.5rem; }
  .prototype-danger { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; border-top: 1px solid var(--line); padding-top: 1.25rem; color: var(--danger); font-size: .8rem; }
  .prototype-danger button { border: 1px solid #edc8cd; border-radius: 2rem; background: transparent; padding: .6rem 1rem; color: var(--danger); font: inherit; }
  @media (max-width: 1000px) { .prototype-notebook { grid-template-columns: 1fr; gap: 2rem; } .prototype-notebook-schedule { border-left: 0; border-top: 1px solid var(--line); padding: 2rem 0 0; } }
  @media (max-width: 600px) { .prototype-sheet { padding: 1.25rem; } .prototype-actions { align-items: stretch; flex-direction: column; } .prototype-disclosures summary, .prototype-disclosure-body { padding: 1.25rem; } }
}