:root {
  color-scheme: light;
  /* Palette: cream base, deep forest green, sage accent. */
  --cream: #F7F3EC;
  --forest: #1F3B2D;
  --forest-hover: #2B4E3C;
  --sage: #8FA886;
  --sage-ink: #52704B;
  --sage-soft: #E7EDE2;
  --paper: #FFFFFF;
  --ink: #2B2B2B;
  --line: #E4DDD0;
  --muted: #66635C;
  --danger: #9C302B;
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  background: var(--cream);
  color: var(--forest);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}

body {
  margin: 0;
  min-height: 100vh;
}

button,
input,
select,
textarea {
  font: inherit;
}

.shell {
  width: min(100% - 3rem, 1040px);
  margin-inline: auto;
}

.site-header {
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.header-inner {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.brand {
  color: var(--forest);
  font-size: 1.15rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.site-nav a {
  color: var(--muted);
  font-size: .95rem;
  font-weight: 600;
  padding: .5rem 0;
  text-decoration: none;
}

.site-nav a:hover,
.site-nav a[aria-current="page"] {
  color: var(--forest);
}

.site-nav a[aria-current="page"] {
  border-bottom: 2px solid var(--forest);
}

.page-intro {
  max-width: 650px;
  margin: 3rem 0 2.25rem;
}

.eyebrow {
  margin: 0 0 .55rem;
  color: var(--muted);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: .6rem;
  font-size: clamp(2.25rem, 5vw, 3rem);
  line-height: 1.15;
  letter-spacing: -.035em;
}

.page-intro > p:last-child,
.section-heading p,
.summary-header p {
  color: var(--muted);
}

.page-intro > p:last-child {
  margin-bottom: 0;
}

.login-shell {
  max-width: 520px;
  padding-bottom: 4rem;
}

.login-panel {
  padding: 2rem;
}

.login-form input {
  display: block;
  width: 100%;
  min-height: 45px;
  padding: .7rem .8rem;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--forest);
}

.login-form .status-message {
  margin-bottom: 1rem;
}

.login-form button {
  width: 100%;
}

h2 {
  font-size: 1.3rem;
  line-height: 1.25;
  letter-spacing: -.02em;
}

.panel,
.entry-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
}

.log-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  align-items: start;
  gap: 2rem;
  padding-bottom: 4rem;
}

.form-panel {
  padding: 1.7rem;
}

.form-panel h2 {
  margin-bottom: 1.5rem;
}

.field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.field {
  margin-bottom: 1.35rem;
}

.field label {
  display: block;
  margin-bottom: .5rem;
  font-size: .9rem;
  font-weight: 700;
}

.required-label,
.optional-label {
  margin-left: .2rem;
  color: var(--muted);
  font-size: .75rem;
  font-weight: 400;
}

.field select,
.field textarea,
.field input[type="file"] {
  display: block;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--forest);
}

.field select,
.field textarea {
  padding: .7rem .8rem;
}

.field select {
  min-height: 45px;
}

.field textarea {
  min-height: 90px;
  resize: vertical;
}

.field textarea::placeholder {
  color: #7E858D;
}

.field select:disabled {
  background: var(--cream);
  color: var(--muted);
}

.field input[type="file"] {
  padding: .6rem;
  font-size: .85rem;
}

.field-hint {
  margin: .5rem 0 0;
  color: var(--muted);
  font-size: .82rem;
}

.photo-preview {
  display: block;
  width: min(100%, 220px);
  max-height: 160px;
  margin-top: .8rem;
  border-radius: 7px;
  object-fit: cover;
}

.photo-preview[hidden],
[hidden] {
  display: none !important;
}

.form-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .7rem 1rem;
}

.spec-review {
  min-width: 0;
  margin: 0 0 1.35rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--cream);
}

.spec-review legend {
  padding: 0 .25rem;
  font-weight: 700;
}

.spec-review > p:first-of-type {
  margin-bottom: .6rem;
  color: var(--muted);
  font-size: .88rem;
}

.spec-review .status-message {
  margin-bottom: .8rem;
}

.spec-point-options {
  display: grid;
  gap: .4rem;
  max-height: 420px;
  overflow-y: auto;
}

.spec-point-option {
  display: grid;
  grid-template-columns: 18px 2.5rem minmax(0, 1fr);
  align-items: start;
  gap: .55rem;
  padding: .55rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
  cursor: pointer;
  font-size: .84rem;
}

.spec-point-option:has(input:checked) {
  border-color: var(--sage);
}

.spec-point-option input {
  margin: .25rem 0 0;
  accent-color: var(--forest);
}

button {
  min-height: 44px;
  border: 0;
  border-radius: 7px;
  background: var(--sage);
  color: var(--forest);
  cursor: pointer;
  font-weight: 700;
  padding: .7rem 1.25rem;
}

button:hover:not(:disabled) {
  filter: brightness(.94);
}

button:disabled {
  cursor: wait;
  opacity: .65;
}

a:focus-visible,
button:focus-visible,
select:focus-visible,
textarea:focus-visible,
input:focus-visible {
  outline: 2px solid var(--forest);
  outline-offset: 2px;
}

.status-message {
  min-height: 1.3em;
  margin: 0;
  color: var(--muted);
  font-size: .88rem;
}

.status-message.error {
  color: #9C302B;
}

.section-heading {
  margin: .2rem 0 1.2rem;
}

.section-heading h2 {
  margin-bottom: .25rem;
}

.section-heading p {
  margin-bottom: 0;
  font-size: .9rem;
}

.entries-list {
  display: grid;
  gap: 1rem;
}

.entry-card {
  padding: 1.3rem 1.4rem;
  overflow-wrap: anywhere;
}

.entry-heading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .2rem .6rem;
  margin-bottom: .8rem;
}

.entry-heading h3 {
  margin-bottom: 0;
  font-size: 1rem;
}

.entry-unit {
  color: var(--muted);
  font-size: .85rem;
}

.entry-unit::before {
  content: "· ";
}

.entry-heading time {
  margin-left: auto;
  color: var(--muted);
  font-size: .82rem;
  white-space: nowrap;
}

.entry-delete {
  min-height: 32px;
  padding: .25rem .45rem;
  background: transparent;
  color: #9C302B;
  font-size: .8rem;
}

.entry-delete:hover:not(:disabled) {
  text-decoration: underline;
}

.entry-description {
  margin-bottom: 0;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.entry-reflection {
  margin: .8rem 0 0;
  color: var(--muted);
  font-size: .9rem;
  white-space: pre-wrap;
}

.entry-photo {
  display: block;
  width: 100%;
  max-height: 280px;
  margin-top: 1rem;
  border-radius: 7px;
  object-fit: contain;
  background: var(--cream);
}

.report-shell {
  max-width: 850px;
  padding-bottom: 4rem;
}

.schedule-shell {
  max-width: 1160px;
  padding-bottom: 4rem;
}

.calendar-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .9rem 1.3rem;
  margin-bottom: 1.5rem;
}

.calendar-views,
.calendar-navigation {
  display: flex;
  align-items: center;
  gap: .3rem;
}

.calendar-views button,
.calendar-navigation button {
  min-height: 36px;
  padding: .35rem .7rem;
  border: 1px solid var(--line);
  background: var(--paper);
  font-size: .85rem;
}

.calendar-views button[aria-pressed="true"] {
  border-color: var(--forest);
  background: var(--forest);
  color: white;
}

.calendar-navigation h2 {
  margin: 0 0 0 .5rem;
  font-size: 1.05rem;
}

#calendar-add {
  margin-left: auto;
}

.schedule-editor {
  margin-bottom: 1.5rem;
  padding: 1.7rem 2rem;
}

.schedule-editor h2 {
  margin-bottom: 1.3rem;
}

.schedule-editor .field-row {
  max-width: 620px;
}

.schedule-objectives {
  margin-top: .2rem;
}

.schedule-objectives .spec-point-options {
  max-height: 440px;
}

.schedule-objectives .field-hint {
  margin: 0;
}

.schedule-editor .field input[type="date"],
.schedule-editor .field input[type="text"] {
  display: block;
  width: 100%;
  min-height: 45px;
  padding: .7rem .8rem;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: white;
  color: var(--forest);
}

.calendar-repeat {
  margin: .2rem 0 1.3rem;
}

.calendar-repeat input[type="checkbox"] {
  accent-color: var(--forest);
}

.calendar-repeat .field {
  max-width: 280px;
  margin: .7rem 0 0;
}

.button-secondary {
  border: 1px solid var(--line);
  background: transparent;
}

.calendar-agenda {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.calendar-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .4rem;
  margin-top: 1rem;
}

.calendar-weekday {
  padding: .45rem;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 700;
  text-align: center;
}

.calendar-day {
  min-width: 0;
  padding: 1rem 1.25rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
}

.calendar-day.is-compact {
  min-height: 105px;
  padding: .55rem;
}

.calendar-day.is-outside {
  opacity: .55;
}

.calendar-day.is-today {
  border-color: var(--sage);
  box-shadow: inset 0 0 0 1px var(--sage);
}

.calendar-day-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}

.calendar-date-button,
.calendar-day-add,
.calendar-month-link {
  min-height: 32px;
  padding: .1rem .4rem;
  background: transparent;
  text-align: left;
}

.calendar-date-button:hover,
.calendar-month-link:hover {
  text-decoration: underline;
}

.calendar-day-add {
  color: var(--muted);
}

.calendar-entry {
  min-width: 0;
  margin-top: .55rem;
  padding: .6rem .7rem;
  border: 1px solid #D4DDE1;
  border-left: 4px solid #628598;
  border-radius: 6px;
  background: #F3F8F9;
  overflow-wrap: anywhere;
}

.calendar-holiday { border-left-color: #8C739E; background: #F7F2F9; }
.calendar-exam { border-left-color: #C2794F; background: #FFF4ED; }
.calendar-event { border-left-color: #638D66; background: #F2F8F0; }

.calendar-entry-heading {
  display: flex;
  align-items: start;
  gap: .3rem .55rem;
  flex-wrap: wrap;
  font-size: .84rem;
}

.calendar-type {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
}

.calendar-entry-actions {
  display: flex;
  gap: .3rem;
  margin-left: auto;
}

.calendar-entry-actions button {
  min-height: 28px;
  padding: .15rem .3rem;
  border: 0;
  background: transparent;
  font-size: .74rem;
}

.calendar-entry-actions .schedule-remove {
  color: #9C302B;
}

.calendar-entry .objectives-list {
  margin-top: .5rem;
}

.calendar-entry .objectives-list li {
  grid-template-columns: 2rem minmax(0, 1fr);
  font-size: .76rem;
}

.calendar-empty,
.objectives-remaining {
  color: var(--muted);
}

.calendar-empty {
  margin: .8rem 0 0;
  font-size: .84rem;
}

.calendar-year-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 1rem;
  margin-top: 1rem;
}

.calendar-year-month {
  padding: .9rem;
}

.calendar-month-link {
  font-size: 1.1rem;
}

.calendar-year-date {
  margin: .85rem 0 -.3rem;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
}

.objectives-list {
  display: grid;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.objectives-list li {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: .5rem;
  font-size: .82rem;
}

.objectives-list li.is-covered {
  color: var(--muted);
}

.objective-covered {
  display: inline-block;
  margin-left: .3rem;
  padding: .1rem .4rem;
  border-radius: 4px;
  background: #E1EDE2;
  color: #245D37;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}

.schedule-choose {
  min-height: 34px;
  margin-top: .7rem;
  padding: .3rem .7rem;
  font-size: .8rem;
}

.objectives-remaining {
  margin: .4rem 0 0;
  font-size: .8rem;
}

.report-summary {
  padding: 1.7rem 2rem;
}

.summary-header {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 1.5rem;
  padding-bottom: 1.3rem;
  border-bottom: 1px solid var(--line);
}

.summary-header h2 {
  margin-bottom: .25rem;
}

.summary-header p {
  margin-bottom: 0;
  font-size: .9rem;
}

.total-count {
  min-width: 125px;
  text-align: right;
}

.total-count strong {
  display: block;
  font-size: 2rem;
  line-height: 1.1;
}

.total-count span {
  color: var(--muted);
  font-size: .78rem;
}

.report-summary h3 {
  margin: 1.4rem 0 .8rem;
  font-size: .95rem;
}

.subject-counts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.subject-counts li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .5rem 0;
  border-bottom: 1px solid var(--line);
  font-size: .9rem;
}

.report-log {
  margin-top: 2.7rem;
}

.report-entries {
  border-top: 1px solid var(--line);
}

.report-entry {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  column-gap: 1.5rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--line);
  overflow-wrap: anywhere;
}

.report-entry.has-photo {
  grid-template-columns: 150px minmax(0, 1fr) 60px;
}

.report-thumbnail {
  grid-column: 3;
  grid-row: 1 / span 3;
  align-self: start;
  width: 60px;
  height: 60px;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--cream);
  cursor: zoom-in;
}

.report-thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.image-dialog {
  width: min(90vw, 960px);
  max-width: 90vw;
  max-height: 90vh;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
  color: var(--forest);
}

.image-dialog::backdrop {
  background: rgba(15, 29, 51, .8);
}

.image-dialog-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: .75rem;
}

.image-dialog-actions button {
  min-height: 36px;
  padding: .35rem .8rem;
}

.image-dialog-image {
  display: block;
  max-width: 100%;
  max-height: calc(90vh - 95px);
  margin-inline: auto;
  object-fit: contain;
}

.report-entry time {
  grid-row: 1 / span 3;
  color: var(--muted);
  font-size: .85rem;
}

.report-entry h3 {
  margin: 0;
  font-size: 1rem;
}

.report-unit {
  margin: .1rem 0 .5rem;
  color: var(--muted);
  font-size: .88rem;
}

.empty-report {
  padding: 1.25rem 0;
  color: var(--muted);
}

@media (max-width: 800px) {
  .log-layout {
    grid-template-columns: 1fr;
  }

  .calendar-month-grid {
    gap: .2rem;
  }

  .calendar-day.is-compact {
    padding: .25rem;
  }

  .calendar-entry {
    padding: .4rem;
  }

  .calendar-year-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .shell {
    width: min(100% - 2rem, 1040px);
  }

  .header-inner {
    min-height: 64px;
    flex-wrap: wrap;
    padding: .5rem 0;
  }

  .site-nav {
    width: 100%;
    flex-wrap: wrap;
    gap: .2rem 1rem;
  }

  .site-nav a {
    padding: .25rem 0;
    font-size: .87rem;
  }

  .page-intro {
    margin: 2.25rem 0 1.75rem;
  }

  .form-panel,
  .report-summary,
  .login-panel,
  .schedule-editor {
    padding: 1.25rem;
  }

  .calendar-month-grid {
    display: block;
  }

  .calendar-weekday,
  .calendar-day.is-outside {
    display: none;
  }

  .calendar-day.is-compact {
    min-height: 0;
    margin-bottom: .45rem;
    padding: .65rem;
  }

  .calendar-year-grid {
    grid-template-columns: 1fr;
  }

  #calendar-add {
    margin-left: 0;
  }

  .field-row,
  .subject-counts {
    grid-template-columns: 1fr;
  }

  .summary-header {
    gap: 1rem;
  }

  .coverage-point-heading {
    grid-template-columns: 2.5rem minmax(0, 1fr);
  }

  .coverage-badge {
    grid-column: 2;
    justify-self: start;
  }

  .report-entry {
    grid-template-columns: 1fr;
  }

  .report-entry.has-photo {
    grid-template-columns: minmax(0, 1fr) 60px;
    column-gap: 1rem;
  }

  .report-thumbnail {
    grid-column: 2;
    grid-row: 1 / span 4;
  }

  .report-entry time {
    grid-row: auto;
    margin-bottom: .35rem;
  }
}

@media print {
  @page {
    margin: 16mm;
  }

  body,
  html {
    background: #fff;
    color: var(--forest);
    font-size: 10pt;
  }

  .site-header {
    display: none;
  }

  .entry-delete {
    display: none;
  }

  .shell {
    width: 100%;
    max-width: none;
  }

  .page-intro {
    margin: 0 0 1rem;
  }

  .report-shell {
    padding: 0;
  }

  .report-summary {
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    padding: 0 0 1rem;
  }

  .report-log {
    margin-top: 1.5rem;
  }

  .report-entry,
  .subject-counts li {
    break-inside: avoid;
  }

  .report-entry.has-photo {
    grid-template-columns: 150px minmax(0, 1fr);
  }

  .report-thumbnail,
  .image-dialog {
    display: none;
  }
}
/* Link from an objective to its Oak lesson */
.objective-link {
  font-size: 0.85em;
  white-space: nowrap;
}

/* Resources page */
.resources-shell { padding-bottom: 4rem; }
.resource-form { margin-bottom: 2rem; }
.resource-form .field input[type="text"],
.resource-form .field input[type="url"] {
  display: block;
  width: 100%;
  min-height: 45px;
  padding: .7rem .8rem;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--forest);
}
.resources-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
}
.resources-filter { margin-bottom: 0; min-width: 220px; }
.resource-group { margin-top: 1.5rem; }
.resource-subject { margin-bottom: .75rem; }
.resource-card { padding: 1.1rem 1.3rem; margin-bottom: .8rem; }
.resource-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
}
.resource-heading h3 { margin: 0; }
.resource-meta { margin: .3rem 0; color: var(--muted); font-size: .85rem; }
.resource-links { margin: .6rem 0 0; }
.resource-size { color: var(--muted); font-size: .85rem; }
.resource-delete { font-size: .8rem; padding: .35rem .7rem; }
.lesson-materials { font-size: .85em; }

/* ───────────────────────────────────────────────────────────────────────
   SalonVQ Bookings look: serif headings, Lato body, white rounded cards
   with an accent top edge, pill buttons, small uppercase labels.
   Palette is the tracker's own (cream, forest green, sage).
   ─────────────────────────────────────────────────────────────────────── */

html {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: var(--serif);
  font-weight: 700;
  color: var(--forest);
  letter-spacing: .2px;
}

h1 { font-size: clamp(2.4rem, 5vw, 3.1rem); line-height: 1.1; }
h2 { font-size: 1.7rem; line-height: 1.15; }
h3 { font-size: 1.3rem; }

a { color: var(--forest); text-underline-offset: 3px; }

/* Header: centred wordmark with the navigation underneath, as in Bookings */
.site-header {
  border-bottom: 0;
  background: transparent;
  padding: 2rem 0 .5rem;
}

.header-inner {
  flex-direction: column;
  justify-content: center;
  gap: .9rem;
  min-height: 0;
}

.brand {
  font-family: var(--serif);
  font-size: 2.1rem;
  font-weight: 700;
  line-height: 1;
  color: var(--forest);
  letter-spacing: .5px;
  text-align: center;
}

.brand::after {
  content: "by Marnie Bloom";
  display: block;
  margin-top: .35rem;
  font-family: var(--sans);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sage-ink);
}

.site-nav {
  flex-wrap: wrap;
  justify-content: center;
  gap: .35rem;
  padding: .3rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
}

.site-nav a {
  padding: .45rem .95rem;
  border-radius: 999px;
  color: var(--muted);
  font-size: .88rem;
  font-weight: 700;
}

.site-nav a:hover { color: var(--forest); background: var(--sage-soft); }

.site-nav a[aria-current="page"] {
  border-bottom: 0;
  background: var(--forest);
  color: #fff;
}

.page-intro { margin: 2rem 0 1.8rem; }

.eyebrow {
  color: var(--sage-ink);
  font-size: .7rem;
  letter-spacing: .22em;
}

/* Cards */
.panel,
.entry-card,
.calendar-day,
.resource-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--paper);
}

.panel { border-top: 5px solid var(--sage); }

.entry-card { border-radius: 16px; }

.calendar-day { border-radius: 14px; }

/* Form controls */
.field label,
.calendar-repeat > label,
.coverage-controls label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
}

.required-label,
.optional-label {
  letter-spacing: 0;
  text-transform: none;
}

.field select,
.field textarea,
.field input[type="file"],
.login-form input,
.schedule-editor .field input[type="date"],
.schedule-editor .field input[type="text"],
.resource-form .field input[type="text"],
.resource-form .field input[type="url"],
.coverage-controls select {
  border: 1px solid #D9D0C0;
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
}

.field select:focus,
.field textarea:focus,
.login-form input:focus,
.schedule-editor .field input:focus,
.coverage-controls select:focus {
  outline: none;
  border-color: var(--sage);
  box-shadow: 0 0 0 3px rgba(143, 168, 134, .28);
}

.spec-review {
  border-radius: 14px;
  background: var(--cream);
}

/* Buttons: forest pill, outlined secondary */
button {
  border-radius: 999px;
  background: var(--forest);
  color: #fff;
  padding: .7rem 1.5rem;
  letter-spacing: .02em;
}

button:hover:not(:disabled) {
  filter: none;
  background: var(--forest-hover);
}

.button-secondary,
.calendar-views button,
.calendar-navigation button {
  border: 1.5px solid var(--forest);
  background: #fff;
  color: var(--forest);
}

.button-secondary:hover:not(:disabled),
.calendar-views button:hover:not(:disabled),
.calendar-navigation button:hover:not(:disabled) {
  background: var(--sage-soft);
}

.calendar-views button[aria-pressed="true"] {
  border-color: var(--forest);
  background: var(--forest);
  color: #fff;
}

/* Text-style buttons keep a transparent look */
.entry-delete,
.calendar-date-button,
.calendar-day-add,
.calendar-month-link,
.calendar-entry-actions button,
.report-thumbnail {
  border-radius: 8px;
  background: transparent;
  color: var(--forest);
  letter-spacing: 0;
}

.entry-delete:hover:not(:disabled),
.calendar-date-button:hover:not(:disabled),
.calendar-day-add:hover:not(:disabled),
.calendar-month-link:hover:not(:disabled),
.calendar-entry-actions button:hover:not(:disabled) {
  background: var(--sage-soft);
}

.entry-delete,
.calendar-entry-actions .schedule-remove { color: var(--danger); }

.status-message.error { color: var(--danger); }

/* Calendar entries in the new palette */
.calendar-entry {
  border: 1px solid var(--line);
  border-left: 4px solid var(--sage-ink);
  border-radius: 10px;
  background: #F2F6EF;
}

.calendar-holiday { border-left-color: #8C739E; background: #F7F2F9; }
.calendar-exam { border-left-color: #C2794F; background: #FFF4ED; }
.calendar-event { border-left-color: #B8965A; background: #FAF5EA; }

.calendar-day.is-today {
  border-color: var(--sage);
  box-shadow: inset 0 0 0 1px var(--sage);
}

.calendar-timing {
  margin: .3rem 0 0;
  color: var(--sage-ink);
  font-size: .76rem;
  font-weight: 700;
}

.field-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.schedule-editor .schedule-timing { max-width: 760px; }

/* Settings page */
.settings-shell { max-width: 720px; padding-bottom: 4rem; }
.settings-panel h2 { margin-bottom: 1rem; }
.settings-panel h2 + .field-hint { margin: -.6rem 0 1rem; }
.settings-panel .field + h2 { margin-top: 2rem; }
.settings-boards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1rem;
}

.learner-details {
  margin: .35rem 0 0;
  color: var(--sage-ink);
  font-weight: 700;
}

/* ── Coverage: subject → unit → objectives, collapsible, with progress ── */
.coverage-section { margin-top: 2.7rem; }

.coverage-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
}

.coverage-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}

.coverage-controls select {
  min-height: 40px;
  padding: .4rem 2rem .4rem .8rem;
}

.coverage-controls button {
  min-height: 40px;
  padding: .4rem 1rem;
  font-size: .85rem;
}

.coverage-subjects {
  display: grid;
  gap: .8rem;
}

.coverage-subject {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--paper);
  overflow: hidden;
}

.coverage-subject > summary,
.coverage-unit > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem 1rem;
  padding: 1rem 1.25rem 1rem 2.6rem;
  position: relative;
  cursor: pointer;
  list-style: none;
}

.coverage-subject > summary::-webkit-details-marker,
.coverage-unit > summary::-webkit-details-marker { display: none; }

.coverage-subject > summary::before,
.coverage-unit > summary::before {
  content: "";
  position: absolute;
  left: 1.2rem;
  top: 1.45rem;
  width: .45rem;
  height: .45rem;
  border-right: 2px solid var(--forest);
  border-bottom: 2px solid var(--forest);
  transform: rotate(-45deg);
  transition: transform .15s ease;
}

.coverage-subject[open] > summary::before,
.coverage-unit[open] > summary::before { transform: rotate(45deg); }

.coverage-subject > summary:hover,
.coverage-unit > summary:hover { background: #FBFAF6; }

.coverage-subject > summary:focus-visible,
.coverage-unit > summary:focus-visible {
  outline: 2px solid var(--forest);
  outline-offset: -2px;
}

.coverage-summary-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .3rem .6rem;
  min-width: 0;
}

.coverage-subject > summary strong {
  font-family: var(--serif);
  font-size: 1.35rem;
  color: var(--forest);
}

.coverage-unit > summary strong {
  font-size: .95rem;
  color: var(--ink);
}

.coverage-tag {
  padding: .1rem .55rem;
  border-radius: 999px;
  background: var(--sage-soft);
  color: var(--sage-ink);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.coverage-count {
  color: var(--muted);
  font-size: .82rem;
  white-space: nowrap;
}

.progress {
  grid-column: 1 / -1;
  display: block;
  height: 8px;
  border-radius: 999px;
  background: #ECE7DC;
  overflow: hidden;
}

.progress-fill {
  display: block;
  height: 100%;
  min-width: 0;
  border-radius: inherit;
  background: var(--sage);
}

.progress.is-complete .progress-fill { background: var(--forest); }

.coverage-units {
  border-top: 1px solid var(--line);
  background: var(--cream);
  padding: .6rem;
  display: grid;
  gap: .5rem;
}

.coverage-unit {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
}

.coverage-unit > summary {
  padding: .75rem 1rem .75rem 2.4rem;
}

.coverage-unit > summary::before { left: 1.05rem; top: 1.1rem; }

.coverage-unit .progress { height: 6px; }

.coverage-list {
  margin: 0;
  padding: 0 1rem .4rem;
  list-style: none;
  border-top: 1px solid var(--line);
}

.coverage-point {
  padding: .8rem 0;
  border-bottom: 1px solid var(--line);
}

.coverage-point:last-child { border-bottom: 0; }

.coverage-point-heading {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr) auto;
  align-items: start;
  gap: .7rem;
  font-size: .88rem;
}

.coverage-point-heading strong { color: var(--forest); }

.coverage-badge {
  padding: .15rem .6rem;
  border-radius: 999px;
  background: #EEEAE2;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}

.is-covered .coverage-badge {
  background: var(--sage-soft);
  color: var(--sage-ink);
}

.coverage-evidence {
  margin: .45rem 0 0 3.2rem;
  padding: 0;
  color: var(--muted);
  font-size: .8rem;
  list-style: none;
}

.coverage-evidence li + li { margin-top: .3rem; }

@media (max-width: 800px) {
  .field-row-3 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .brand { font-size: 1.8rem; }
  .site-nav { border-radius: 18px; }
  .site-nav a { padding: .4rem .7rem; font-size: .82rem; }
  .field-row-3,
  .settings-boards { grid-template-columns: 1fr; }
  .coverage-subject > summary,
  .coverage-unit > summary { grid-template-columns: 1fr; }
  .coverage-subject > summary { padding: .9rem 1rem .9rem 2.3rem; }
  .coverage-subject > summary::before { left: 1rem; }
  .coverage-evidence { margin-left: 0; }
}

@media print {
  .coverage-controls { display: none; }
  .coverage-subject > summary::before,
  .coverage-unit > summary::before { display: none; }
  .coverage-subject,
  .coverage-unit { break-inside: avoid; }
  .progress,
  .progress-fill { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ── Accounts: sign-up, join, Family page, child switcher ── */
.auth-switch {
  margin: 1.2rem 0 4rem;
  text-align: center;
  color: var(--muted);
}

.child-switch {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--sage-ink);
  font-size: .82rem;
  font-weight: 700;
}

.child-switch label {
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}

.child-switch select {
  min-height: 34px;
  padding: .2rem 1.8rem .2rem .8rem;
  border: 1px solid #D9D0C0;
  border-radius: 999px;
  background: #fff;
  color: var(--forest);
  font-weight: 700;
}

.family-shell { max-width: 820px; padding-bottom: 4rem; }

.family-panel,
.welcome-panel {
  padding: 1.6rem 1.8rem;
  margin-bottom: 1.2rem;
}

.family-panel h2,
.welcome-panel h2 { margin-bottom: .6rem; }

.welcome-panel { background: var(--sage-soft); }
.welcome-panel ol { margin: 0; padding-left: 1.2rem; }
.welcome-panel li + li { margin-top: .3rem; }

.family-list {
  margin: .4rem 0 1rem;
  padding: 0;
  list-style: none;
}

.family-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .6rem 1rem;
  padding: .8rem 0;
  border-bottom: 1px solid var(--line);
}

.family-item:last-child { border-bottom: 0; }
.family-item.is-stacked { flex-direction: column; align-items: stretch; }
.family-list.is-quiet .family-item { color: var(--muted); font-size: .9rem; }

.family-item-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.family-item-meta {
  color: var(--muted);
  font-size: .82rem;
  overflow-wrap: anywhere;
}

.family-item-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
}

.family-empty { color: var(--muted); font-size: .9rem; padding: .4rem 0; }

.inline-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: .6rem .8rem;
  width: 100%;
}

.inline-form .field { margin-bottom: 0; flex: 1 1 180px; }

.family-panel .field input,
.inline-form .field input {
  display: block;
  width: 100%;
  min-height: 45px;
  padding: .7rem .8rem;
  border: 1px solid #D9D0C0;
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
}

.link-box {
  margin: 1rem 0;
  padding: 1rem;
  border-radius: 14px;
  background: var(--sage-soft);
}

.link-box p { margin-bottom: .6rem; font-size: .9rem; }

.copy-row {
  display: flex;
  gap: .5rem;
  width: 100%;
}

.copy-row input {
  flex: 1;
  min-width: 0;
  min-height: 40px;
  padding: .4rem .7rem;
  border: 1px solid #D9D0C0;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-size: .85rem;
}

.copy-button { min-height: 40px; padding: .4rem 1.1rem; }

.text-button {
  min-height: 36px;
  padding: .3rem .6rem;
  border-radius: 8px;
  background: transparent;
  color: var(--forest);
  font-size: .85rem;
}

.text-button:hover:not(:disabled) { background: var(--sage-soft); }
.text-button.is-danger { color: var(--danger); }

.button-danger { background: var(--danger); }
.button-danger:hover:not(:disabled) { background: #7F2622; }

.button-link {
  display: inline-block;
  padding: .65rem 1.4rem;
  border-radius: 999px;
  background: var(--forest);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.button-link:hover { background: var(--forest-hover); }

.danger-zone {
  margin-top: 1.4rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}

.danger-zone summary {
  cursor: pointer;
  color: var(--danger);
  font-weight: 700;
}

.danger-zone p { margin: .8rem 0; color: var(--muted); font-size: .9rem; }

@media (max-width: 560px) {
  .family-panel,
  .welcome-panel { padding: 1.2rem; }
  .family-item-actions { width: 100%; }
}

.site-footer {
  max-width: 720px;
  margin: 1rem auto 2.5rem;
  padding: 0 1rem;
  color: var(--muted);
  font-size: .75rem;
  text-align: center;
}

@media print { .site-footer { display: none; } }

.coverage-controls .coverage-toggle {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .82rem;
  font-weight: 700;
  color: var(--muted);
  letter-spacing: 0;
  text-transform: none;
}

.coverage-toggle input { accent-color: var(--forest); }

/* Settings: GCSEs being taken, each with its exam board */
.settings-subjects {
  display: grid;
  gap: .4rem;
  margin-bottom: 1.4rem;
}

.subject-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: .8rem;
  padding: .45rem .7rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.subject-row.is-studying { border-color: var(--sage); background: #F7FAF5; }

.subject-check {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}

.subject-check input { width: 18px; height: 18px; accent-color: var(--forest); }

.subject-row select {
  min-height: 40px;
  padding: .4rem .7rem;
  border: 1px solid #D9D0C0;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
}

.subject-row select:disabled { opacity: .45; }

@media (max-width: 560px) {
  .subject-row { grid-template-columns: 1fr; }
}

.report-prompt {
  margin: 0 0 1.2rem;
  padding: .8rem 1rem;
  border-radius: 12px;
  background: var(--sage-soft);
  color: var(--ink);
  font-size: .9rem;
}

@media print { .report-prompt { display: none; } }