:root {
  color-scheme: light;
  --paper: #F6F3EC;
  --surface: #FFFEFA;
  --surface-soft: #ECE8DE;
  --ink: #292D27;
  --muted: #62685E;
  --line: #D5D3C8;
  --line-strong: #7C8373;
  --brass: #805B20;
  --brass-soft: #EFE4CC;
  --madressa: #366552;
  --madressa-soft: #E4EBE3;
  --personal: #90523F;
  --personal-soft: #F2E6DE;
  --action: #344334;
  --action-ink: #FFFEFA;
  --focus: #75602D;
  --font-body: "Lexend", "Atkinson Hyperlegible", system-ui, sans-serif;
  --font-display: "Lexend", system-ui, sans-serif;
  --radius: 5px;
  --nav-height: 78px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #1C211D;
  --surface: #252B25;
  --surface-soft: #2E352E;
  --ink: #F0EFE5;
  --muted: #B0B8AA;
  --line: #414A40;
  --line-strong: #798572;
  --brass: #DDC08B;
  --brass-soft: #3D3526;
  --madressa: #A6C9AE;
  --madressa-soft: #2C3D30;
  --personal: #E1AA94;
  --personal-soft: #43332C;
  --action: #DFE5CF;
  --action-ink: #22291F;
  --focus: #D5BC84;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
  --paper: #1C211D;
  --surface: #252B25;
  --surface-soft: #2E352E;
  --ink: #F0EFE5;
  --muted: #B0B8AA;
  --line: #414A40;
  --line-strong: #798572;
  --brass: #DDC08B;
  --brass-soft: #3D3526;
  --madressa: #A6C9AE;
  --madressa-soft: #2C3D30;
  --personal: #E1AA94;
  --personal-soft: #43332C;
  --action: #DFE5CF;
  --action-ink: #22291F;
  --focus: #D5BC84;
  }
}
*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: auto; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, textarea, select { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, summary, label[for] { cursor: pointer; }
button, input, select, textarea { color: inherit; }
button { touch-action: manipulation; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
button:disabled { cursor: default; opacity: .55; }
button, input, select, textarea { border-radius: var(--radius); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }
::selection { background: var(--brass-soft); color: var(--ink); }
h1, h2, h3, p { margin: 0; }
svg { display: block; width: 22px; height: 22px; flex: 0 0 auto; }
[hidden] { display: none !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; top: 8px; left: 12px; z-index: 100;
  transform: translateY(-150%); padding: 12px 18px;
  background: var(--action); color: var(--action-ink); border-radius: var(--radius);
}
.skip-link:focus { transform: none; }
.site-header {
  max-width: 1280px; margin: 0 auto; padding: 25px 52px;
  display: flex; align-items: center; gap: 20px;
  border-bottom: 1px solid var(--line); min-height: 98px;
}
.brand { display: flex; align-items: center; gap: 10px; flex: 1; }
.brand-mark { width: 25px; height: 29px; color: var(--action); }
.wordmark { font-family: var(--font-display); font-size: 31px; line-height: 1; letter-spacing: -.045em; }
.header-tools { display: flex; align-items: center; gap: 14px; flex: 1; justify-content: flex-end; }
.preview-label { font-size: 11px; letter-spacing: .06em; color: var(--muted); white-space: nowrap; }
.theme-toggle {
  width: 46px; height: 46px; border: 1px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
}
.theme-toggle:hover { background: var(--surface-soft); }
.theme-toggle .sun { display: none; }
[data-theme="dark"] .theme-toggle .sun { display: block; }
[data-theme="dark"] .theme-toggle .moon { display: none; }
.main-nav { display: flex; align-items: center; gap: 6px; }
.nav-link {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 10px 13px; color: var(--muted);
  text-decoration: none; font-size: 14px; position: relative; border-radius: 3px;
}
.nav-link svg { width: 18px; height: 18px; }
.nav-link:hover { background: var(--surface-soft); color: var(--ink); }
.nav-link[aria-current="page"] { color: var(--ink); font-weight: 600; }
.nav-link[aria-current="page"]::after {
  content: ""; position: absolute; height: 2px; background: var(--action);
  bottom: 2px; left: 14px; right: 14px;
}
main { max-width: 1120px; margin: 0 auto; padding: 63px 32px 72px; }
.eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
h1 {
  font-family: var(--font-display); font-weight: 400; font-size: clamp(48px, 6vw, 76px);
  letter-spacing: -.045em; line-height: 1.08;
}
.page-heading { margin-bottom: 38px; }
.page-heading .eyebrow { margin-bottom: 14px; }
.page-intro { color: var(--muted); margin-top: 12px; font-size: 16px; }
.capture-main { max-width: 964px; padding-top: 56px; }
.capture-main .page-heading { margin-bottom: 31px; }
.capture-main h1 { font-size: clamp(45px, 5.6vw, 68px); }
.capture-form { position: relative; }
.capture-sheet {
  background: var(--surface); border: 1px solid var(--line-strong);
  border-radius: var(--radius); overflow: hidden;
}
.capture-sheet:focus-within { border-color: var(--focus); box-shadow: 0 0 0 1px var(--focus); }
.sheet-top {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 23px 29px 0;
}
.sheet-label { font-size: 11px; letter-spacing: .13em; font-weight: 600; text-transform: uppercase; color: var(--muted); }
.wispr-label { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); }
.wispr-label svg { width: 15px; height: 15px; }
.capture-text {
  display: block; width: 100%; height: 252px; min-height: 200px; max-height: 55vh;
  resize: vertical; padding: 24px 29px; border: 0; background: transparent;
  color: var(--ink); font-size: 24px; line-height: 1.6; letter-spacing: -.02em;
  outline: none; border-radius: 0;
}
.capture-text::placeholder { color: var(--muted); opacity: 1; }
.capture-text:focus-visible { outline: none; }
.sheet-bottom { padding: 0 24px 22px 29px; display: flex; gap: 18px; align-items: center; justify-content: space-between; }
.capture-tip { color: var(--muted); font-size: 12px; max-width: 275px; }
.shortcut { display: block; margin-top: 3px; font-size: 11px; }
kbd { font-family: var(--font-body); font-size: 11px; }
.primary-button {
  min-height: 52px; padding: 13px 22px; border: 1px solid var(--action);
  background: var(--action); color: var(--action-ink); font-weight: 600; font-size: 15px;
  display: inline-flex; justify-content: center; align-items: center; gap: 25px;
}
.primary-button:hover:not(:disabled) { filter: brightness(1.12); }
.primary-button svg { width: 19px; height: 19px; }
.secondary-button {
  min-height: 46px; padding: 10px 16px; border: 1px solid var(--line-strong);
  background: transparent; font-size: 14px; font-weight: 500;
}
.secondary-button:hover { background: var(--surface-soft); }
.capture-afterword { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 22px; }
.routing-key { display: flex; flex-wrap: wrap; align-items: center; gap: 19px; }
.org-brassworks { --org: var(--brass); --org-soft: var(--brass-soft); }
.org-madressa { --org: var(--madressa); --org-soft: var(--madressa-soft); }
.org-personal { --org: var(--personal); --org-soft: var(--personal-soft); }
.org-label { display: inline-flex; align-items: center; gap: 7px; color: var(--org); font-size: 12px; font-weight: 500; }
.org-symbol { display: inline-block; width: 7px; height: 7px; background: currentColor; flex: 0 0 auto; }
.org-personal .org-symbol { background: transparent; border: 1.5px solid currentColor; border-radius: 50%; width: 9px; height: 9px; }
.afterword-note { color: var(--muted); font-size: 12px; }
.demo-note { font-size: 11px; color: var(--muted); margin-top: 34px; }
.inline-question { margin: 0 29px 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.inline-question label { display: block; font-size: 16px; font-weight: 500; margin-bottom: 10px; }
.field-input { background: var(--surface); border: 1px solid var(--line-strong); min-height: 48px; padding: 10px 12px; width: 100%; }
.inline-question .field-input { max-width: 440px; }
.form-message { margin: 0 29px 15px; color: var(--personal); font-size: 14px; }
.receipt {
  display: flex; align-items: center; gap: 12px; margin-top: 18px;
  padding: 13px 16px; border-left: 3px solid var(--madressa); background: var(--madressa-soft);
}
.receipt > svg { color: var(--madressa); width: 20px; height: 20px; }
.receipt-copy { flex: 1; min-width: 0; }
.receipt-title { font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.receipt-detail { color: var(--muted); font-size: 12px; margin-top: 2px; }
.text-button { border: 0; background: transparent; min-height: 46px; padding: 10px 12px; text-decoration: underline; text-underline-offset: 4px; font-size: 14px; }
.correction { margin-top: 12px; border: 1px solid var(--line); background: var(--surface); padding: 24px; border-radius: var(--radius); }
.correction h2 { font-family: var(--font-display); font-weight: 400; font-size: 28px; }
.correction-original { color: var(--muted); font-size: 14px; margin: 7px 0 20px; overflow-wrap: anywhere; }
.correction-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.field-label { display: block; font-size: 12px; font-weight: 500; margin-bottom: 6px; }
.correction-datetime { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 14px; }
.correction-actions { display: flex; gap: 12px; margin-top: 22px; }
.correction-message { margin-top: 12px; font-size: 13px; color: var(--personal); }
.day-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 41px; }
.date-stamp { display: flex; align-items: center; gap: 15px; padding-bottom: 5px; }
.date-stamp > svg { width: 35px; height: 35px; color: var(--muted); }
.date-stamp p { font-size: 15px; }
.date-stamp time { display: block; color: var(--muted); font-size: 13px; margin-top: 1px; }
.day-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 53px; align-items: start; }
.priorities { grid-column: 2; grid-row: 1; background: var(--surface-soft); padding: 26px 27px 15px; border-top: 2px solid var(--line-strong); }
.priorities h2 { font-family: var(--font-display); font-size: 32px; line-height: 1.1; font-weight: 400; letter-spacing: -.025em; }
.section-caption { font-size: 12px; color: var(--muted); margin-top: 5px; }
.priority-list { padding: 0; list-style: none; margin: 16px 0 0; }
.priority-list li + li { border-top: 1px solid var(--line); }
.priority { position: relative; display: grid; grid-template-columns: 26px minmax(0,1fr); align-items: start; gap: 12px; padding: 17px 0; min-height: 79px; }
.priority input { position: absolute; width: 24px; height: 24px; left: 0; top: 20px; opacity: 0; margin: 0; cursor: pointer; }
.check-box { width: 22px; height: 22px; margin-top: 3px; border: 1px solid var(--line-strong); border-radius: 3px; display: grid; place-items: center; }
.check-box svg { width: 15px; height: 15px; visibility: hidden; }
.priority input:focus-visible + .check-box { outline: 2px solid var(--focus); outline-offset: 4px; }
.priority input:checked + .check-box { background: var(--action); border-color: var(--action); color: var(--action-ink); }
.priority input:checked + .check-box svg { visibility: visible; }
.priority-title { display: block; font-size: 16px; font-weight: 500; line-height: 1.5; }
.priority input:checked ~ .priority-copy .priority-title { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }
.priority-copy .org-label { margin-top: 6px; font-size: 12px; }
.agenda { grid-column: 1; grid-row: 1; }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 5px 0 21px; border-bottom: 1px solid var(--line-strong); }
.section-heading h2 { font-family: var(--font-display); font-size: 29px; line-height: 1.1; letter-spacing: -.025em; font-weight: 400; }
.timezone { font-size: 11px; color: var(--muted); white-space: nowrap; }
.agenda-list { list-style: none; padding: 0; margin: 0; }
.agenda-item { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 22px; padding: 27px 0; border-bottom: 1px solid var(--line); }
.event-time { font-size: 19px; font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; padding-top: 2px; letter-spacing: -.04em; }
.event-time span { display: block; font-size: 11px; color: var(--muted); margin-top: 4px; letter-spacing: 0; font-weight: 400; }
.event-title { font-size: 17px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.org-personal .event-title { font-family: var(--font-display); font-size: 24px; font-weight: 400; letter-spacing: -.015em; line-height: 1.12; }
.event-meta { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; row-gap: 6px; margin-top: 10px; }
.event-meta .org-label { font-size: 12px; }
.source { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); }
.source svg { width: 13px; height: 13px; }
.agenda-pager { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 18px; }
.agenda-pager p { color: var(--muted); font-size: 12px; }
.agenda-pager button { min-width: 48px; }
.agenda-empty { padding: 30px 0; color: var(--muted); }
.projects-main { max-width: 1040px; }
.projects-main .page-heading { margin-bottom: 39px; }
.organisations { border-top: 1px solid var(--line-strong); }
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }
.organisation { border-bottom: 1px solid var(--line-strong); }
.organisation > summary { display: flex; align-items: center; gap: 18px; min-height: 102px; padding: 22px 0; }
.org-monogram { width: 47px; height: 47px; display: grid; place-items: center; color: var(--org); background: var(--org-soft); font-size: 13px; font-weight: 600; border-radius: 3px; }
.organisation-name { font-family: var(--font-display); font-size: 33px; font-weight: 400; letter-spacing: -.025em; line-height: 1.2; }
.organisation-summary { color: var(--muted); font-size: 12px; display: block; margin-top: 2px; }
.chevron { width: 20px; height: 20px; margin-left: auto; color: var(--muted); }
details[open] > summary > .chevron { transform: rotate(180deg); }
.project-stack { padding: 0 0 24px 65px; }
.project { border-top: 1px solid var(--line); }
.project > summary { display: flex; align-items: center; gap: 12px; min-height: 61px; padding: 14px 3px; }
.project > summary > svg:first-child { width: 19px; height: 19px; color: var(--org); }
.project-name { font-size: 15px; font-weight: 600; }
.project-kind { font-size: 11px; color: var(--muted); margin-left: 3px; }
.project-notes { padding: 2px 0 18px 31px; }
.project-note { display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 22px; padding: 18px 0; border-top: 1px solid var(--line); }
.note-date { color: var(--muted); font-size: 11px; padding-top: 4px; }
.note-title { font-size: 16px; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
.note-body { color: var(--muted); font-size: 14px; line-height: 1.65; margin-top: 5px; max-width: 580px; overflow-wrap: anywhere; }
.note-type { font-size: 11px; color: var(--org); margin-top: 7px; display: block; }
.note-pager { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 9px 0 0; }
.note-pager p { font-size: 11px; color: var(--muted); }
.note-pager .text-button { padding-left: 0; padding-right: 0; }
@media (min-width: 1440px) {
  main { padding-top: 76px; }
  .capture-main { padding-top: 69px; }
  .capture-text { height: 280px; }
}
@media (max-width: 1020px) {
  .site-header { padding: 20px 30px; }
  .preview-label { display: none; }
  .nav-link { padding-left: 11px; padding-right: 11px; }
  .header-tools, .brand { flex: initial; }
  .main-nav { margin-left: auto; }
  .day-grid { gap: 30px; }
  .priorities { padding-left: 21px; padding-right: 21px; }
}
@media (max-width: 720px) {
  body { padding-bottom: calc(var(--nav-height) + env(safe-area-inset-bottom, 0px)); }
  .site-header { padding: 14px 22px; min-height: 76px; gap: 12px; }
  .brand { flex: 1; gap: 9px; }
  .wordmark { font-size: 29px; }
  .brand-mark { width: 23px; height: 26px; }
  .header-tools { gap: 11px; }
  .preview-label { display: inline; font-size: 11px; }
  .theme-toggle { width: 44px; height: 44px; }
  .main-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 30;
    min-height: var(--nav-height); padding: 5px 10px calc(5px + env(safe-area-inset-bottom, 0px));
    margin: 0; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 0;
    border-top: 1px solid var(--line-strong); background: var(--paper);
  }
  .nav-link { min-height: 66px; flex-direction: column; gap: 5px; padding: 10px 2px 6px; font-size: 11px; border-radius: 0; }
  .nav-link svg { width: 21px; height: 21px; }
  .nav-link[aria-current="page"]::after { top: -5px; bottom: auto; left: 22%; right: 22%; }
  main { padding: 31px 22px 36px; }
  .page-heading { margin-bottom: 27px; }
  .page-heading .eyebrow { margin-bottom: 13px; font-size: 11px; letter-spacing: .13em; }
  h1 { font-size: 51px; }
  .page-intro { font-size: 14px; line-height: 1.65; margin-top: 9px; }
  .capture-main { padding-top: 29px; }
  .capture-main h1 { font-size: 43px; max-width: 320px; }
  .capture-main .page-heading { margin-bottom: 25px; }
  .sheet-top { padding: 19px 19px 0; gap: 10px; }
  .sheet-label { font-size: 11px; }
  .wispr-label { font-size: 11px; }
  .capture-text { height: clamp(204px, 28svh, 280px); min-height: 170px; max-height: 50svh; padding: 20px 19px; font-size: 20px; resize: vertical; }
  .sheet-bottom { flex-direction: column; align-items: stretch; padding: 0 17px 17px; gap: 15px; }
  .capture-tip { font-size: 11px; max-width: none; padding-left: 2px; }
  .shortcut { display: none; }
  .primary-button { width: 100%; min-height: 54px; justify-content: space-between; padding-left: 18px; padding-right: 18px; }
  .capture-afterword { display: block; margin-top: 18px; }
  .routing-key { gap: 15px; }
  .routing-key .org-label { font-size: 12px; gap: 5px; }
  .afterword-note { display: none; }
  .demo-note { margin-top: 23px; font-size: 11px; max-width: 340px; line-height: 1.65; }
  .receipt { gap: 9px; padding: 9px 10px; }
  .receipt-title { font-size: 12px; }
  .receipt-detail { font-size: 11px; }
  .receipt .text-button { font-size: 12px; padding-left: 8px; padding-right: 8px; }
  .receipt > svg { width: 18px; height: 18px; }
  .inline-question { margin-left: 19px; margin-right: 19px; }
  .inline-question label { font-size: 14px; }
  .form-message { margin-left: 19px; margin-right: 19px; }
  .correction { padding: 19px; }
  .correction-grid { grid-template-columns: 1fr; }
  .correction-datetime { grid-template-columns: 1fr; }
  .correction-actions { align-items: center; }
  .correction-actions .primary-button { width: auto; flex: 1; font-size: 13px; justify-content: center; }
  .day-heading { gap: 12px; margin-bottom: 29px; align-items: flex-end; }
  .date-stamp { gap: 0; padding-bottom: 4px; text-align: right; }
  .date-stamp > svg { display: none; }
  .date-stamp p { font-size: 12px; }
  .date-stamp time { font-size: 11px; }
  .day-grid { display: flex; flex-direction: column; gap: 30px; }
  .priorities { order: 0; width: 100%; padding: 20px 20px 7px; }
  .priorities-heading { display: flex; align-items: baseline; gap: 14px; }
  .priorities h2 { font-size: 28px; }
  .section-caption { font-size: 11px; margin-top: 0; }
  .priority-list { margin-top: 9px; }
  .priority { padding: 14px 0; min-height: 74px; gap: 12px; }
  .priority input { top: 17px; }
  .priority-title { font-size: 15px; }
  .priority-copy .org-label { font-size: 12px; margin-top: 5px; }
  .agenda { order: 1; width: 100%; }
  .section-heading { padding-bottom: 18px; }
  .section-heading h2 { font-size: 27px; }
  .timezone { font-size: 11px; }
  .agenda-item { grid-template-columns: 49px minmax(0,1fr); gap: 16px; padding: 23px 0; }
  .event-time { font-size: 17px; }
  .event-title { font-size: 15px; }
  .org-personal .event-title { font-size: 22px; }
  .event-meta { column-gap: 12px; margin-top: 8px; }
  .event-meta .org-label, .source { font-size: 12px; }
  .projects-main .page-heading { margin-bottom: 28px; }
  .organisation > summary { min-height: 98px; gap: 13px; padding: 20px 0; }
  .org-monogram { width: 39px; height: 43px; font-size: 11px; }
  .organisation-name { font-size: 26px; }
  .organisation-summary { font-size: 11px; }
  .organisation > summary .chevron { width: 17px; height: 17px; }
  .project-stack { padding-left: 0; padding-bottom: 15px; }
  .project > summary { padding-left: 3px; min-height: 58px; }
  .project-kind { font-size: 11px; }
  .project-name { font-size: 14px; }
  .project-notes { padding-left: 31px; padding-bottom: 14px; }
  .project-note { display: block; padding: 15px 0; }
  .note-date { display: block; margin-bottom: 6px; font-size: 11px; padding: 0; }
  .note-title { font-size: 14px; }
  .note-body { font-size: 13px; }
  .note-type { font-size: 11px; }
}
@media (max-width: 360px) {
  .preview-label { display: none; }
  .site-header { padding-left: 18px; padding-right: 18px; }
  main { padding-left: 18px; padding-right: 18px; }
  .capture-main h1 { font-size: 39px; }
  .date-stamp time { max-width: 104px; }
  .routing-key { gap: 11px; }
  .organisation-name { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .check-box, .capture-sheet, .theme-toggle, .primary-button, .secondary-button { border: 1px solid ButtonText; }
  .priority input:checked + .check-box { background: Highlight; color: HighlightText; forced-color-adjust: none; }
  .org-symbol { background: CanvasText; }
  .org-personal .org-symbol { background: Canvas; border-color: CanvasText; }
  .nav-link[aria-current="page"] { outline: 1px solid Highlight; }
}

/* Daybook app additions */
.login-sheet { padding: 24px 29px; display: grid; gap: 14px; max-width: 420px; }
.login-sheet .form-message { margin: 0; }
.priority-empty, .agenda-empty { color: var(--muted); padding: 18px 0; font-size: 14px; }
.all-day { font-size: 13px; color: var(--muted); }
.thinking { color: var(--muted); font-size: 14px; }
.receipt-actions { display: flex; }

/* ADHD readability: Lexend for everything you read, open spacing, no tight tracking.
   The serif display face stays only on big page headings. */
body { line-height: 1.65; letter-spacing: .005em; word-spacing: .04em; }
.capture-text { letter-spacing: 0; line-height: 1.55; font-weight: 400; }
.event-time { letter-spacing: 0; }
.org-personal .event-title { font-family: var(--font-body); font-size: 17px; font-weight: 500; letter-spacing: 0; line-height: 1.4; }
.event-title, .priority-title, .note-title { line-height: 1.45; }
.note-body { line-height: 1.7; max-width: 62ch; }
.page-intro, .section-caption, .capture-tip, .receipt-detail { line-height: 1.6; }
.eyebrow, .sheet-label { letter-spacing: .1em; }
@media (max-width: 720px) {
  .org-personal .event-title { font-size: 16px; }
  .capture-text { font-size: 19px; }
}

/* Headings in Lexend too: calm weight, no negative tracking, a little smaller than the serif sizes. */
h1, .wordmark, .priorities h2, .section-heading h2, .organisation-name, .correction h2 { letter-spacing: -.01em; font-weight: 500; }
h1 { font-size: clamp(38px, 5vw, 60px); line-height: 1.15; }
.capture-main h1 { font-size: clamp(34px, 4.6vw, 54px); }
.wordmark { font-size: 26px; }
.priorities h2 { font-size: 26px; }
.section-heading h2 { font-size: 24px; }
.organisation-name { font-size: 26px; }
.correction h2 { font-size: 23px; }
@media (max-width: 720px) {
  h1 { font-size: 40px; }
  .capture-main h1 { font-size: 34px; }
  .wordmark { font-size: 24px; }
  .priorities h2 { font-size: 23px; }
  .section-heading h2 { font-size: 22px; }
  .organisation-name { font-size: 22px; }
}

/* Calendar: week + month */
.calendar-main { max-width: 1040px; }
.cal-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-bottom: 26px; }
.cal-switch { display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--radius); overflow: hidden; }
.cal-switch button { border: 0; background: transparent; min-height: 44px; padding: 8px 20px; font-weight: 500; color: var(--muted); border-radius: 0; }
.cal-switch button[aria-selected="true"] { background: var(--action); color: var(--action-ink); }
.cal-nav { display: flex; align-items: center; gap: 10px; }
.cal-arrow { min-width: 44px; min-height: 44px; padding: 0; font-size: 22px; line-height: 1; }
.cal-range { font-weight: 500; min-width: 150px; text-align: center; }
.cal-week-day { border-top: 1px solid var(--line-strong); padding: 16px 0 10px; display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 16px; }
.cal-week-day.is-today .cal-day-label strong { color: var(--action); }
.cal-week-day.is-today { background: var(--surface-soft); padding-left: 12px; padding-right: 12px; border-radius: var(--radius); }
.cal-week-day.is-past { opacity: .6; }
.cal-day-label strong { display: block; font-size: 16px; font-weight: 600; }
.cal-day-label span { font-size: 13px; color: var(--muted); }
.cal-items { list-style: none; margin: 0; padding: 0; }
.cal-item { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 12px; padding: 6px 0; align-items: baseline; }
.cal-time { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.cal-title { font-size: 15px; font-weight: 500; overflow-wrap: anywhere; }
.cal-title .org-label { margin-left: 8px; font-size: 11px; font-weight: 400; }
.cal-empty { color: var(--muted); font-size: 14px; padding: 6px 0; }
.cal-month { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line); }
.cal-dow { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 8px 6px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cal-cell { min-height: 92px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; text-align: left; padding: 6px; border-radius: 0; display: flex; flex-direction: column; gap: 3px; align-items: stretch; }
.cal-cell:hover { background: var(--surface-soft); }
.cal-cell.is-other { color: var(--muted); opacity: .5; }
.cal-cell.is-today .cal-num { background: var(--action); color: var(--action-ink); }
.cal-cell[aria-pressed="true"] { outline: 2px solid var(--focus); outline-offset: -2px; }
.cal-num { font-size: 13px; font-weight: 600; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; }
.cal-chip { display: block; font-size: 11px; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 1px 5px; border-radius: 3px; background: var(--org-soft); color: var(--org); }
.cal-more { font-size: 11px; color: var(--muted); padding-left: 5px; }
.cal-dots { display: none; gap: 3px; flex-wrap: wrap; padding-left: 2px; }
.cal-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--org); }
.cal-selected { margin-top: 26px; }
.cal-selected h2 { font-size: 20px; font-weight: 600; margin-bottom: 8px; }
@media (max-width: 720px) {
  .cal-toolbar { gap: 12px; }
  .cal-nav { order: 3; width: 100%; justify-content: space-between; }
  .cal-week-day { grid-template-columns: 1fr; gap: 6px; }
  .cal-cell { min-height: 54px; padding: 4px; }
  .cal-chip, .cal-more { display: none; }
  .cal-dots { display: flex; }
  .cal-num { width: 24px; height: 24px; font-size: 12px; }
  .cal-dow { font-size: 10px; padding: 6px 2px; text-align: center; }
  .nav-link { font-size: 10px; }
}

/* ==========================================================================
   Type scale: one font, six sizes, three weights, used everywhere.
   This block comes last on purpose, so it overrides the earlier one-off sizes.
   ========================================================================== */
:root {
  --fs-title: clamp(34px, 4.4vw, 44px);  /* page titles */
  --fs-head: 22px;                       /* section headings */
  --fs-input: 20px;                      /* the capture box */
  --fs-body: 16px;                       /* item titles, body text, buttons */
  --fs-meta: 14px;                       /* secondary text, times, labels, dates */
  --fs-caps: 12px;                       /* small uppercase labels */
  --fw-regular: 400; --fw-medium: 500; --fw-bold: 600;
}
*, *::before, *::after { font-family: var(--font-body); }

/* Page titles */
h1, .capture-main h1 { font-size: var(--fs-title); font-weight: var(--fw-bold); line-height: 1.15; letter-spacing: -.01em; }
.wordmark { font-size: var(--fs-head); font-weight: var(--fw-bold); letter-spacing: -.01em; }

/* Section headings */
.priorities h2, .section-heading h2, .organisation-name, .correction h2, .cal-selected h2 {
  font-size: var(--fs-head); font-weight: var(--fw-bold); line-height: 1.25; letter-spacing: -.005em;
}

/* Item titles and body text */
.event-title, .org-personal .event-title, .priority-title, .note-title, .cal-title, .cal-day-label strong,
.project-name, .receipt-title, .inline-question label, .event-time, .cal-range {
  font-size: var(--fs-body); font-weight: var(--fw-medium); line-height: 1.45; letter-spacing: 0;
}
body, .page-intro, .field-input, .primary-button, .secondary-button, .text-button, .cal-switch button, .form-message, .correction-message {
  font-size: var(--fs-body);
}
.primary-button, .cal-switch button { font-weight: var(--fw-bold); }
.secondary-button, .text-button { font-weight: var(--fw-medium); }

/* Secondary text: times, labels, dates, captions */
.event-time span, .cal-time, .note-date, .note-body, .note-type, .org-label, .source, .timezone, .section-caption,
.organisation-summary, .project-kind, .date-stamp p, .date-stamp time, .capture-tip, .wispr-label, .afterword-note,
.receipt-detail, .correction-original, .field-label, .agenda-pager p, .note-pager p, .cal-day-label span,
.cal-empty, .agenda-empty, .priority-empty, .demo-note, .cal-more, .routing-key .org-label {
  font-size: var(--fs-meta); font-weight: var(--fw-regular); letter-spacing: 0;
}
.date-stamp p { font-weight: var(--fw-medium); }

/* Small uppercase labels */
.eyebrow, .sheet-label, .cal-dow, .org-monogram {
  font-size: var(--fs-caps); font-weight: var(--fw-bold); letter-spacing: .1em; text-transform: uppercase;
}
.org-monogram { letter-spacing: .04em; }

/* Inputs */
.capture-text { font-size: var(--fs-input); font-weight: var(--fw-regular); line-height: 1.55; letter-spacing: 0; }

/* Tiny-space exceptions: month grid cells and the bottom tab bar */
.cal-num { font-size: var(--fs-meta); font-weight: var(--fw-bold); }
.cal-chip { font-size: var(--fs-caps); font-weight: var(--fw-medium); }
.nav-link { font-size: var(--fs-meta); font-weight: var(--fw-medium); }
.nav-link[aria-current="page"] { font-weight: var(--fw-bold); }

@media (max-width: 720px) {
  h1, .capture-main h1 { font-size: 34px; }
  .wordmark { font-size: var(--fs-head); }
  .priorities h2, .section-heading h2, .organisation-name, .correction h2, .cal-selected h2 { font-size: 20px; }
  .event-title, .org-personal .event-title, .priority-title, .note-title, .cal-title, .cal-day-label strong,
  .project-name, .receipt-title, .inline-question label, .event-time { font-size: var(--fs-body); }
  .event-time span, .cal-time, .note-date, .note-body, .note-type, .org-label, .source, .timezone, .section-caption,
  .organisation-summary, .project-kind, .date-stamp p, .date-stamp time, .capture-tip, .receipt-detail,
  .cal-day-label span, .cal-empty, .agenda-empty, .priority-empty, .routing-key .org-label { font-size: var(--fs-meta); }
  .capture-text { font-size: var(--fs-input); }
  .cal-dow { font-size: 11px; letter-spacing: .04em; }
  .cal-num { font-size: 13px; }
  .nav-link { font-size: 11px; }
}
/* Type-scale follow-ups: beat older, more specific selectors; keep the arrow glyphs large enough to tap */
.event-meta .org-label, .priority-copy .org-label, .cal-title .org-label, .event-meta .source { font-size: var(--fs-meta); font-weight: var(--fw-regular); }
.cal-arrow { font-size: 24px; font-weight: var(--fw-regular); }
@media (max-width: 720px) {
  .event-meta .org-label, .priority-copy .org-label, .cal-title .org-label, .event-meta .source { font-size: var(--fs-meta); }
}

/* Optional space / project picker on Capture */
.pick { padding: 0 29px 18px; }
.pick-label { font-size: var(--fs-meta); font-weight: var(--fw-medium); color: var(--ink); margin-bottom: 10px; }
.pick-label span { color: var(--muted); font-weight: var(--fw-regular); margin-left: 6px; }
.pick-row { display: flex; flex-wrap: wrap; gap: 8px; }
.pick-row + .pick-row { margin-top: 10px; }
.chip { min-height: 44px; padding: 8px 16px; border: 1px solid var(--line-strong); background: transparent; border-radius: 999px; font-size: var(--fs-meta); font-weight: var(--fw-medium); color: var(--ink); display: inline-flex; align-items: center; gap: 8px; }
.chip .org-symbol { width: 8px; height: 8px; background: var(--org, var(--muted)); border-radius: 50%; }
.chip[aria-pressed="true"] { background: var(--org-soft, var(--surface-soft)); border-color: var(--org, var(--action)); color: var(--org, var(--ink)); font-weight: var(--fw-bold); }
.chip:hover { background: var(--surface-soft); }
.chip.project-chip { min-height: 38px; padding: 6px 14px; }
@media (max-width: 720px) { .pick { padding: 0 17px 16px; } }

/* Compact Capture on phones: everything above the tab bar, no scrolling */
@media (max-width: 720px) {
  .capture-main { padding-top: 14px; padding-bottom: 12px; }
  .capture-main .page-heading { margin-bottom: 12px; }
  .capture-main .page-heading .eyebrow, .capture-main .page-intro { display: none; }
  .capture-main h1 { font-size: 26px; max-width: none; }
  .sheet-top { padding: 12px 16px 0; }
  .capture-text { height: clamp(110px, 22svh, 190px); min-height: 100px; padding: 8px 16px 10px; }
  .pick { padding: 0 16px 12px; }
  .pick-label { margin-bottom: 8px; }
  .pick-row { flex-wrap: nowrap; gap: 6px; }
  .pick-row + .pick-row { margin-top: 8px; flex-wrap: wrap; }
  .chip { min-height: 40px; padding: 6px 12px; gap: 6px; flex: 1 1 auto; justify-content: center; }
  .chip.project-chip { min-height: 36px; flex: 0 1 auto; }
  .sheet-bottom { padding: 0 16px 14px; gap: 0; }
  .capture-tip { display: none; }
  .primary-button { min-height: 50px; }
  .capture-afterword, .demo-note { display: none; }
  .receipt { margin-top: 10px; }
}
@media (max-width: 720px) {
  #pick-org .chip { flex: 1 1 0; min-width: 0; padding: 6px 6px; font-size: 13px; }
  #pick-org .chip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .capture-text { height: clamp(140px, 30svh, 260px); }
}
@media (max-width: 720px) {
  .pick-row, .pick-row + .pick-row { flex-wrap: nowrap; }
  .pick-row .chip, #pick-project .chip.project-chip { flex: 1 1 0; min-width: 0; padding: 6px 4px; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 38px; }
  .chip[aria-pressed="true"] { font-weight: var(--fw-medium); }
  .chip .org-symbol { width: 7px; height: 7px; }
}

/* Tick + delete on your own items */
.item-actions { display: inline-flex; gap: 4px; align-items: center; align-self: center; }
.icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); background: transparent; border-radius: var(--radius); color: var(--muted); padding: 0; }
.icon-button svg { width: 18px; height: 18px; }
.icon-button:hover { background: var(--surface-soft); color: var(--ink); }
.tick-button[aria-pressed="true"] { background: var(--action); border-color: var(--action); color: var(--action-ink); }
.delete-button:hover { color: var(--personal); border-color: var(--personal); }
.is-done .event-title, .is-done .cal-title, .is-done .note-title { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }
.agenda-item.has-actions { grid-template-columns: 64px minmax(0,1fr) auto; }
.project-note.has-actions { grid-template-columns: 78px minmax(0,1fr) auto; }
.cal-item { grid-template-columns: 64px minmax(0,1fr) auto; }
.priority-row { display: flex; align-items: flex-start; gap: 8px; }
.priority-row > .priority { flex: 1; }
.priority-row > .item-actions { margin-top: 14px; }
.toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--nav-height) + 16px + env(safe-area-inset-bottom, 0px)); z-index: 50; background: var(--ink); color: var(--paper); padding: 10px 10px 10px 16px; border-radius: var(--radius); display: flex; align-items: center; gap: 14px; font-size: var(--fs-meta); max-width: calc(100vw - 32px); box-shadow: 0 6px 20px rgba(0,0,0,.18); }
.toast[hidden] { display: none; }
.toast span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toast-undo { border: 0; background: transparent; color: var(--paper); font-weight: var(--fw-bold); text-decoration: underline; min-height: 40px; padding: 0 8px; }
@media (min-width: 721px) { .toast { bottom: 24px; } }
@media (max-width: 720px) {
  .agenda-item.has-actions { grid-template-columns: 49px minmax(0,1fr) auto; }
  .project-note.has-actions { display: grid; grid-template-columns: minmax(0,1fr) auto; }
  .project-note.has-actions .note-date { grid-column: 1 / -1; }
  .icon-button { width: 38px; height: 38px; }
}

/* Meeting requests on Today */
.meetings-card { margin-bottom: 32px; padding: 18px 20px 12px; border: 1px solid var(--line-strong); border-left: 4px solid var(--brass); border-radius: var(--radius); background: var(--surface); }
.meetings-card .section-heading { padding-top: 0; }
.meeting-list { list-style: none; margin: 0; padding: 0; }
.meeting { padding: 16px 0; border-bottom: 1px solid var(--line); }
.meeting:last-child { border-bottom: 0; }
.meeting-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.meeting-name { font-size: var(--fs-body); font-weight: var(--fw-bold); }
.meeting-when { font-size: var(--fs-meta); color: var(--muted); }
.meeting-topic { font-size: var(--fs-meta); margin-top: 4px; }
.meeting-quote { font-size: var(--fs-meta); color: var(--muted); margin-top: 6px; font-style: italic; overflow-wrap: anywhere; }
.meeting-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.meeting-actions .primary-button, .meeting-actions .secondary-button { min-height: 44px; padding: 8px 14px; font-size: var(--fs-meta); }
.meeting-done { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 10px 0; }
.meeting-history summary { cursor: pointer; font-size: var(--fs-meta); color: var(--muted); padding: 10px 0 4px; }

/* "Turn on notifications" prompt */
.notif-prompt { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 14px 16px; margin: 0 0 20px; border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--surface-soft); font-size: var(--fs-meta); }
.notif-prompt strong { display: block; font-size: var(--fs-body); margin-bottom: 2px; }
.notif-actions { display: flex; align-items: center; gap: 8px; }
.notif-actions .primary-button { min-height: 44px; padding: 8px 18px; }
@media (max-width: 720px) {
  .meetings-card { padding: 14px 14px 8px; margin-bottom: 24px; }
  .meeting-actions > button { flex: 1 1 0; }
  .notif-actions { width: 100%; }
  .notif-actions .primary-button { flex: 1; }
}

/* Tickable lists inside an item (shopping lists etc.) */
.checklist { list-style: none; margin: 10px 0 2px; padding: 0; display: grid; gap: 2px; }
.check-line { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 2px 0; cursor: pointer; font-size: var(--fs-body); font-weight: var(--fw-regular); }
.check-line input { width: 22px; height: 22px; margin: 0; accent-color: var(--action); flex: 0 0 auto; }
.checklist .is-ticked span { color: var(--muted); text-decoration: line-through; }
.priority-row { flex-wrap: wrap; }
.priority-checklist { flex-basis: 100%; margin: -6px 0 10px 38px; }
.cal-title .checklist { margin-top: 6px; }
.widget-settings { font-size: var(--fs-meta); min-height: 44px; padding: 8px 10px; }