@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-400.woff2") format("woff2");
}

@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-600.woff2") format("woff2");
}

@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-700.woff2") format("woff2");
}

:root {
  --paper: #fef8ee;
  --ink: #000000;
  --muted: #666666;
  --pine: #f47a46;
  --clay: #e84d2f;
  --card: #ffffff;
  --line: #eadfd4;
  --lilac: #eccbe6;
  --pink: #ffa3c3;
  --gold: #f1ae3d;
  --olive: #aab840;
  --blue: #679be9;
  --mark-blue: #96adec;
  --mark-yellow: #d9cf4d;
  /* To do. Needs-cleaning tiles and a day with too few people. Change this set together. */
  --mark-wash: #f3e6ce;
  --mark-wash-line: #e7d0e4;
  --mark-wash-image:
    radial-gradient(ellipse 90% 46% at 16% 4%, #c1aee7 0%, #c1aee700 70%),
    radial-gradient(ellipse 72% 38% at 86% 14%, #daafdf 0%, #daafdf00 68%),
    radial-gradient(ellipse 80% 34% at 68% 34%, #adc2ec 0%, #adc2ec00 72%),
    linear-gradient(168deg, #e3bcd9 0%, #f0dad7 48%, #f3e6ce 100%);
  --lime: #e1f154;
  --plan-worked: #8ea332;
  --plan-head: #fafafa;
  --plan-line: #ececec;
  --plan-plus: #bbbbbb;
  --plan-rule: #dddddd;
  --plan-sub: #888888;
  --plan-today: #f6f1ea;
  --need-short: #ffe4d6;
  --need-ok: #eef3c4;
  --need-over: #ffe8b8;
  --need-row: #f8f9fa;
  --plan-range: #d7e6fb;
  --plan-ink: #2f5fbe;
  --plan-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  --guest-ink: #6b625c;
  --guest-quiet: #8a7b72;
  --guest-line: #f0e6dc;
  --guest-fill: #f7f1ea;
  --glance-behind-line: #f4c2ae;
  --glance-ahead-line: #d5e08a;
  --act-wait: #6a4a00;
  --act-off: #383838;
  --reply-open: #b86a12;
  --accent: var(--pine);
  --good: #6d7a22;
  --off: #666666;
  --cal-head: #f9f4ee;
  --stayover: #c4cadb;
  --vacant: #e7efb8;
  --chip-on: #fff4ee;
  --shadow: 0 10px 30px rgba(28, 36, 22, 0.04);
  --ink-soft: #241c18;
  --tile-out: #c9a0e4;
  --tile-clean: #8ed48a;
  --tile-gap: #6b3d86;
  --stay-out: #8e2f45;
  --stay-in: #243e8a;
  --gap-bg: #f3e4fb;
  --gap-line: #d7b3ea;
  --cal-needs: #e07aa8;
  --cal-check: #f6d56b;
  --cal-ready: var(--olive);
  --cal-light: var(--cal-head);
  --cal-stay: var(--card);
  --cal-late: var(--pine);
  --cal-early: var(--blue);
  --cal-bar: #2f5f9e;
  --cal-hint: var(--muted);
  --cal-now: #ffe0ec;
  --cal-now-mark: var(--pink);
  --cal-now-label: #c45386;
  --cal-soon: #dce8ce;
  --cal-later: #f4f6f8;
  --cal-open-ground: #fffaf0;
  --cal-open-line: #f3d5e4;
  --cal-weekend: #c8bfb6;
  --cal-weekend-line: #f4ece4;
  font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}

.book-fold {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  margin: 8px 0;
  max-width: 100%;
}
.book-fold.is-room {
  margin-left: 12px;
}
.book-fold > summary {
  min-height: 44px;
  padding: 10px 12px;
  cursor: pointer;
}
.book-fold-summary {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 1.4rem);
  vertical-align: middle;
}
.book-fold-count {
  margin-left: auto;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}
.book-fold .account-scroll,
.book-fold .cln-book-scroll {
  padding: 0 12px 12px;
}

@media (max-width: 640px) {
  .book-fold.is-room {
    margin-left: 8px;
  }
}