:root {
  color-scheme: light;
  --ink: #1c2824;
  --muted: #66716d;
  --paper: #f5f1e8;
  --surface: #fffdf8;
  --line: #d9d3c8;
  --accent: #e85d3f;
  --accent-dark: #bd4028;
  --green: #1c6b52;
  --green-soft: #deeee7;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
}

button, input, textarea { font: inherit; }

button, a { -webkit-tap-highlight-color: transparent; }

.app-shell {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding-bottom: 80px;
}

.topbar {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.brand {
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.06em;
  text-decoration: none;
}

.topbar-hint, .revision-meta {
  color: var(--muted);
  font-size: .86rem;
}

.revision-meta { display: flex; align-items: center; gap: 18px; }
.revision-meta--empty { display: none; }
.revision-meta a { color: var(--green); font-weight: 650; }

.flash {
  margin: 18px 0 0;
  padding: 12px 16px;
  border-radius: 10px;
  font-size: .9rem;
}

.flash--notice { background: var(--green-soft); color: var(--green); }
.telegram-invite { display: inline-flex; align-items: center; min-height: 44px; color: inherit; font-weight: 650; }

.flash--alert { background: #f8ded8; color: #922d1d; }

.editor { padding-top: 12px; }

.plan-heading {
  position: relative;
  margin-bottom: 12px;
  padding-top: 2rem;
}

.plan-copy {
  min-width: 0;
  flex: 1 1 360px;
}

.eyebrow {
  margin: 0 0 8px;
  color: var(--accent);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.plan-title {
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 1;
  letter-spacing: -.045em;
}

textarea.plan-title { display: block; resize: none; overflow: hidden; overflow-wrap: anywhere; }
textarea.plan-title:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }

.plan-location-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  width: fit-content;
  max-width: 100%;
  color: var(--muted);
}

.plan-location {
  min-width: 0;
  width: auto;
  max-width: 100%;
  field-sizing: content;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--muted);
  font-size: .9rem;
}

.location-marker { flex: none; }
[data-location-display][data-location-color] {
  border-radius: 4px;
  background: color-mix(in srgb, var(--location-accent) 9%, transparent);
  box-shadow: inset 2px 0 var(--location-accent);
  color: var(--muted);
}
[data-location-display][data-location-color="1"] { --location-accent: #c8614e; }
[data-location-display][data-location-color="2"] { --location-accent: #5883b1; }
[data-location-display][data-location-color="3"] { --location-accent: #8066a5; }
[data-location-display][data-location-color="4"] { --location-accent: #a47d30; }
[data-location-display][data-location-color="5"] { --location-accent: #4e8a70; }
[data-location-display][data-location-color="6"] { --location-accent: #9a628a; }
[data-location-display][data-location-color] .location-marker { color: var(--location-accent); }
.plan-location-row[data-location-color] { width: fit-content; padding: 2px 7px; }
.plan-location-row[data-location-color] .plan-location { color: inherit; }

.plan-location-action {
  margin-top: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: .8rem;
}

.plan-location-action:hover { color: var(--green); }

.plan-context-summary {
  display: flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.4;
}

details.plan-context > .plan-context-summary { cursor: pointer; }
details.plan-context > .plan-context-summary:hover { color: var(--green); }
details.plan-context > .plan-context-summary::marker { color: var(--muted); }

.plan-context-settings {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  max-width: 42rem;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.plan-context-field { display: grid; gap: 5px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.plan-context-field select {
  width: 100%;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-weight: 500;
}
.plan-context-field select:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.plan-context-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .75rem; }

@media (max-width: 540px) {
  .plan-context-settings { grid-template-columns: 1fr; }
  .plan-context-note { grid-column: auto; }
}

.share-action, .secondary-action, .text-action, .metadata-button, .icon-button {
  border: 0;
  cursor: pointer;
}

.plan-actions {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.share-action {
  min-height: 28px;
  padding: 3px 2px;
  background: transparent;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
}

.share-action:hover, .share-action:focus-visible { color: var(--green); }

.save-status {
  color: var(--muted);
  font-size: .68rem;
  opacity: .72;
  white-space: nowrap;
}

.save-status[data-state="saving"] { color: var(--green); opacity: 1; }
.save-status[data-state="error"] { color: #922d1d; opacity: 1; }

.agenda-section { padding-bottom: 42px; }

.take-switcher { margin: 0 0 8px; }
.take-strip {
  display: flex;
  gap: 6px;
  padding-bottom: 4px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.take-tab, .take-score-expand, .fork-take-action, .take-preview-title {
  border: 0;
  cursor: pointer;
  white-space: nowrap;
}

.take-pill {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  border-radius: 999px;
  position: relative;
  isolation: isolate;
}
/* Keep 44px controls, with a quieter 32px surface at normal text size. */
.take-pill::before, .take-tab::after, .take-menu-trigger::after {
  content: "";
  position: absolute;
  inset: 6px 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
}
.take-pill::before {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--line) 82%, transparent);
}
.take-pill:has(.take-tab[aria-selected="true"])::before {
  background-color: var(--surface);
  box-shadow: inset 0 0 0 2px var(--green);
}
.take-pill.is-best::before { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--green) 42%, var(--line)); }
.take-pill.is-best:has(.take-tab[aria-selected="true"])::before { box-shadow: inset 0 0 0 2px var(--green); }
.take-pill:has(.take-menu) { padding-right: 3px; }

.take-tab {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 7px 11px;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 700;
}

.take-tab.is-scored::after {
  --score-wash: color-mix(in srgb, var(--green) 8%, transparent);
  background: linear-gradient(90deg, var(--score-wash) 0 var(--take-progress), transparent var(--take-progress));
}
.take-tab.is-scored.score-mid::after { --score-wash: color-mix(in srgb, var(--accent) 9%, transparent); }
.take-tab.is-scored.score-low::after { --score-wash: color-mix(in srgb, #b54a37 8%, transparent); }
.take-tab:hover { color: var(--ink); }
.take-tab:hover::after { background-color: var(--surface); }
.take-tab[aria-selected="true"]::after { background-color: transparent; }
.take-tab[aria-selected="true"] {
  color: var(--ink);
  background-color: transparent;
  font-weight: 850;
}
.take-tab[aria-selected="true"] .take-tab-name::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 6px 1px 0;
  border-radius: 50%;
  background: var(--green);
}
.take-pill .take-tab { border-radius: 999px; }
.take-tab:focus-visible, .take-menu-trigger:focus-visible, .archived-takes-trigger:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: -3px;
}
.take-menu, .archived-takes-menu { flex: 0 0 auto; }
.take-menu-trigger {
  position: relative;
  isolation: isolate;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 1rem;
}
.take-menu-trigger:hover::after, .take-menu-trigger[aria-expanded="true"]::after {
  background: color-mix(in srgb, var(--green) 8%, transparent);
}
.take-menu-trigger:hover, .take-menu-trigger[aria-expanded="true"] { color: var(--ink); }
.take-menu-popover, .archived-takes-popover {
  position: fixed;
  inset: auto;
  display: none;
  /* Size to content, not the top-layer viewport (notably in WebKit). */
  width: max-content;
  height: fit-content;
  min-width: 160px;
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  margin: 0;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 4px 12px rgb(38 45 40 / 10%);
}
.take-menu-popover:popover-open, .archived-takes-popover:popover-open { display: flex; flex-direction: column; }
.take-menu-action {
  min-height: 44px;
  padding: 7px 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: .76rem;
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
}
.take-menu-action:hover, .take-menu-action:focus-visible { outline: 0; background: #ebe5da; }
.take-menu-action--danger { color: #9d4334; }
.take-menu-action:disabled { color: var(--muted); cursor: not-allowed; opacity: .55; }
.archived-takes-trigger {
  min-height: 44px;
  padding: 7px 9px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}
.archived-takes-popover { width: min(300px, calc(100vw - 16px)); }
.archived-take-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.archived-take-row > span { overflow: hidden; padding-left: 7px; font-size: .76rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.take-tab-name { line-height: 1; }
.take-tab-score { display: inline-flex; align-items: center; }
.take-score-detail-track { overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--line) 68%, transparent); }
.take-score-detail-track span { display: block; height: 100%; border-radius: inherit; background: var(--green); }
.take-tab-stars { color: var(--muted); font-size: .68rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.take-score-expand {
  min-height: 44px;
  padding: 7px 9px;
  border-radius: 999px;
  background: transparent;
  color: var(--green);
  font-size: .72rem;
  font-weight: 750;
}
.take-score-expand:hover,
.take-score-expand:focus-visible { background: var(--green-soft); color: var(--green); }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.take-score-dialog {
  width: min(760px, calc(100vw - 28px));
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 24px 70px rgb(38 45 40 / 24%);
}
.take-score-dialog::backdrop { background: rgb(38 45 40 / 28%); backdrop-filter: blur(2px); }
.take-score-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.take-score-dialog h3 { margin: 1px 0 0; font-size: 1.05rem; }
.take-score-comparison-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 10px; margin: 17px 0; }
.take-score-comparison-card { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: rgb(255 255 255 / 48%); }
.take-score-comparison-card.is-best { border-color: color-mix(in srgb, var(--accent) 72%, var(--line)); }
.take-score-comparison-card header { align-items: flex-start; }
.take-score-comparison-card h4 { margin: 1px 0 0; font-size: .9rem; }
.take-score-dialog-overall { color: var(--green); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.take-score-details-list { display: grid; gap: 9px; margin: 13px 0 0; padding: 0; list-style: none; }
.take-score-details-list li { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(80px, 1.3fr) 42px; align-items: center; gap: 10px; color: var(--muted); font-size: .76rem; }
.take-score-details-list li.is-low { color: #922d1d; font-weight: 700; }
.take-score-details-list strong { color: inherit; text-align: right; font-variant-numeric: tabular-nums; }
.take-score-detail-track { height: 6px; }
.take-score-details-list li.is-low .take-score-detail-track span { background: #b54a37; }
.take-score-dialog footer { display: flex; justify-content: flex-end; gap: 8px; }

.fork-take-action {
  min-height: 44px;
  padding: 7px 9px;
  background: transparent;
  color: var(--green);
  font-size: .8rem;
  font-weight: 750;
}

.take-stage { min-width: 0; }
.take-previews { display: none; }

.take-preview {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgb(255 253 248 / 60%);
}

.take-preview header { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.take-preview-title { padding: 0; background: transparent; color: var(--green); font-size: .86rem; font-weight: 800; }
.take-preview ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.take-preview-row { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 5px; padding: 7px 0; border-top: 1px solid var(--line); }
.take-preview-row > span { color: var(--accent); font: 700 .65rem ui-monospace, monospace; }
.take-preview-row div { display: grid; gap: 2px; min-width: 0; }
.take-preview-row strong { overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.take-preview-row small { overflow: hidden; color: var(--muted); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.take-preview-row--outline { margin-top: 4px; padding: 7px 6px; border: 0; border-radius: 7px; background: var(--green-soft); color: var(--green); }
.take-preview-more { padding: 8px 0 0 31px; color: var(--muted); font-size: .7rem; }

.revision-panel h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.8rem;
  letter-spacing: -.025em;
}

.agenda-title, .agenda-subtitle, .agenda-location, .agenda-temporal {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
}

.agenda-list, .revision-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* C3: quiet sequence, compact rhythm, full-width wrapping copy. */
.agenda-list { container-type: inline-size; --agenda-row-space: 6px; --agenda-dot-offset: 14px; }
.agenda-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  align-items: start;
  min-height: 44px;
  margin-left: 5px;
  padding-left: 20px;
}
.agenda-item:not(.agenda-item--outline)::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--line);
}
.agenda-item:not(.agenda-item--outline)::after {
  content: "";
  position: absolute;
  left: -3px;
  top: calc(var(--agenda-dot-offset) - 1px);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--muted);
  outline: 4px solid var(--paper);
}
.agenda-item:first-child::before,
.agenda-item--outline + .agenda-item::before { top: var(--agenda-dot-offset); }
.agenda-item:last-child::before,
.agenda-item:has(+ .agenda-item--outline)::before { bottom: calc(100% - var(--agenda-dot-offset)); }
.agenda-item--outline {
  margin: 8px 0 0;
  padding: 0;
  border-block: 1px solid var(--line);
}
.agenda-item--outline:first-child { margin-top: 0; }
.agenda-copy { min-width: 0; padding-block: var(--agenda-row-space); }
.agenda-item--outline .agenda-copy { padding-block: 8px; }
.agenda-title { font-size: 1.0625rem; font-weight: 650; line-height: 1.35; letter-spacing: -.012em; }
.outline-title { font-weight: 700; }
.agenda-schedule .agenda-time { display: block; }
.agenda-schedule { width: fit-content; max-width: 100%; margin-bottom: 2px; }
.outline-schedule { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 2px; color: var(--muted); }
.outline-weekday { font-size: .8125rem; }
.outline-schedule .agenda-date { width: auto; max-width: 100%; font-size: .8125rem; }
.agenda-meta { display: flex; flex-direction: column; align-items: stretch; gap: 2px; margin-top: 2px; }
.agenda-subtitle { color: var(--muted); font-size: .875rem; line-height: 1.5; }
.agenda-location-group { display: flex; width: fit-content; min-width: 0; max-width: 100%; align-items: flex-start; gap: 6px; color: var(--muted); }
.agenda-location-group .location-marker { font-size: .8125rem; line-height: 1.5; }
.agenda-location-group[data-location-color] { padding: 1px 6px; }
.agenda-location { width: auto; field-sizing: content; min-width: 0; color: inherit; font-size: .8125rem; line-height: 1.5; }
.agenda-copy textarea { display: block; resize: none; overflow: hidden; padding: 0; border-radius: 2px; overflow-wrap: anywhere; }
.agenda-copy textarea:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; background: var(--surface); }
.agenda-temporal { flex: none; color: var(--muted); font-size: .8125rem; padding: 0; }
.agenda-date { width: 8.8rem; }
.agenda-time { width: 100%; color: var(--ink); font-size: .8125rem; line-height: 1.5; font-weight: 650; font-variant-numeric: tabular-nums; }
input[readonly].agenda-temporal::-webkit-calendar-picker-indicator { display: none; }
.item-controls { display: flex; align-items: flex-start; justify-self: end; }
.item-inline-actions { display: none; }
.item-menu { position: relative; justify-self: end; }
.item-menu[open] { z-index: 5; }
.item-menu-trigger {
  display: grid;
  width: 44px;
  height: 44px;
  cursor: pointer;
  list-style: none;
  place-items: center;
  border-radius: 50%;
  color: var(--muted);
  font-size: .78rem;
  letter-spacing: .05em;
}
.item-menu-trigger::-webkit-details-marker { display: none; }
.item-menu-trigger:hover { background: #ebe5da; color: var(--ink); }
.item-menu-popover {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  display: grid;
  width: 12rem;
  max-width: calc(100vw - 48px);
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
}
.item-menu-action, .item-inline-action {
  appearance: none;
  border: 0;
  cursor: pointer;
  min-height: 44px;
  padding: 8px 9px;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  text-align: left;
  font-size: .78rem;
  white-space: normal;
}
.item-menu-action { width: 100%; }
.item-menu-metadata { padding-bottom: 4px; margin-bottom: 4px; border-bottom: 1px solid var(--line); }
.item-menu-action--danger { border-top: 1px solid var(--line); border-radius: 0 0 5px 5px; }
.item-menu-action:disabled { opacity: .4; cursor: default; }
.item-inline-action { color: var(--green); white-space: nowrap; }
.item-inline-action:hover, .item-inline-action:focus-visible { background: var(--green-soft); }
.item-inline-action:focus-visible, .item-menu-action:focus-visible, .item-menu-trigger:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: -2px;
}
@container (min-width: 42rem) {
  .agenda-item { grid-template-columns: minmax(0, 1fr) auto; }
  .item-inline-actions { display: flex; }
  .item-menu-metadata { display: none; }
}
.item-menu-action:not(:disabled):hover { background: #ebe5da; color: var(--ink); }
.item-menu-action--danger { color: #9d4334; }
.agenda-add-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-left: 25px; }
.agenda-add-actions .secondary-action { min-height: 44px; margin-top: 0; }

.insert-agenda-button {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: -11px;
  width: 22px;
  height: 22px;
  border: 1px solid #b9d4c8;
  border-radius: 50%;
  background: var(--paper);
  color: var(--green);
  font-size: .9rem;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity .12s ease, background .12s ease;
}

.agenda-item:hover > .insert-agenda-button,
.agenda-item:focus-within > .insert-agenda-button,
.insert-agenda-button:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

.insert-agenda-button:hover { background: var(--green-soft); }

.icon-button {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  font-size: 1rem;
}

.icon-button:hover { background: #ebe5da; color: var(--ink); }

.metadata-button {
  padding: 6px 7px;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  font-size: .72rem;
  white-space: nowrap;
}

.metadata-button:hover { background: #ebe5da; color: var(--ink); }

.secondary-action {
  justify-self: start;
  margin-top: 14px;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: transparent;
  color: var(--green);
  font-size: .86rem;
  font-weight: 700;
}

.secondary-action:hover { border-color: #91ae9f; background: var(--green-soft); }

.text-action {
  padding: 8px 0;
  background: transparent;
  color: var(--green);
  font-size: .82rem;
  font-weight: 700;
}

.revision-panel {
  display: grid;
  grid-template-columns: minmax(180px, 280px) minmax(0, 1fr);
  gap: clamp(32px, 8vw, 96px);
  padding: 42px 0;
  border-top: 1px solid var(--line);
}

.revision-list { display: grid; gap: 6px; }
.revision-list a { display: flex; justify-content: space-between; gap: 16px; padding: 11px 13px; border-radius: 8px; color: var(--muted); font-size: .85rem; text-decoration: none; }
.revision-list a:hover, .revision-list a.is-current { background: var(--surface); color: var(--ink); }
.revision-list a span { display: grid; gap: 3px; }
.revision-list strong { color: var(--ink); font-size: .82rem; }
.revision-list small { color: var(--muted); font-size: .75rem; }
.revision-list time { flex: none; font-size: .75rem; }

input[readonly] { cursor: default; }

.ai-assistant {
  margin: 0 0 1.25rem;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--paper) 94%, var(--accent));
  box-shadow: 0 14px 40px rgb(34 43 35 / 6%);
}

.ai-assistant-heading,
.ai-chat-input,
.ai-composer-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.ai-assistant-heading h2 { margin: 0; }
.ai-expand-action { display: none; }
.ai-summary { display: none; }
.ai-conversation { min-height: 0; }

.ai-messages {
  display: grid;
  gap: .65rem;
  max-height: 18rem;
  margin: 1rem 0;
  padding-right: .25rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
}

.ai-message {
  width: fit-content;
  max-width: min(44rem, 92%);
  margin: 0;
  padding: .65rem .8rem;
  border-radius: .85rem;
  background: var(--paper);
  animation: ai-message-in 180ms ease-out;
}

@keyframes ai-message-in {
  from { opacity: 0; transform: translateY(4px); }
}

.ai-message--user { justify-self: end; background: var(--ink); color: var(--paper); }
.ai-message--status { opacity: .72; font-style: italic; }
.ai-message--error { color: #8a1f11; background: #fff0ec; }
.ai-message p { margin: 0; white-space: pre-wrap; }
.ai-message-content > :first-child { margin-top: 0; }
.ai-message-content > :last-child { margin-bottom: 0; }
.ai-message-content p,
.ai-message-content ul,
.ai-message-content ol,
.ai-message-content pre,
.ai-message-content blockquote { margin: .55rem 0; }
.ai-message-content ul,
.ai-message-content ol { padding-left: 1.25rem; }
.ai-message-content pre { max-width: 100%; padding: .65rem; overflow-x: auto; border-radius: .55rem; background: var(--ink); color: var(--paper); }
.ai-message-content code { padding: .08rem .25rem; border-radius: .3rem; background: var(--surface); font: .82em ui-monospace, monospace; }
.ai-message-content pre code { padding: 0; background: transparent; }
.ai-message-content a { color: var(--green); text-underline-offset: 2px; }

.ai-attachments,
.ai-tool-activity,
.ai-file-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 0; padding: 0; list-style: none; }
.ai-attachments li,
.ai-tool-activity li,
.ai-file-chips li { padding: .22rem .48rem; border-radius: 999px; font-size: .72rem; }
.ai-attachments li { background: rgb(255 255 255 / 16%); }
.ai-message--assistant .ai-attachments li { background: var(--green-soft); color: var(--green); }
.ai-tool-activity li { display: inline-flex; align-items: center; gap: .25rem; background: var(--green-soft); color: var(--green); font-weight: 700; }

.ai-criteria {
  display: grid;
  gap: .35rem;
  margin-bottom: .8rem;
  font-size: .78rem;
  font-weight: 700;
}

.ai-criteria small { color: var(--muted); font-size: .7rem; font-weight: 500; }
.ai-criteria input,
.ai-chat-input textarea {
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
.ai-criteria input { padding: .65rem .75rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--paper); }

.ai-chat-input { align-items: flex-end; }
.ai-composer {
  flex: 1;
  min-width: 0;
  padding: .45rem .5rem .4rem .75rem;
  border: 1px solid var(--line);
  border-radius: .9rem;
  background: var(--paper);
  box-shadow: 0 6px 20px rgb(34 43 35 / 7%);
  transition: border-color 140ms ease, box-shadow 140ms ease;
}
.ai-composer:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 15%, transparent); }
.ai-chat-input[data-dragging="true"] .ai-composer { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 25%, transparent); }
.ai-chat-input textarea { display: block; min-height: 2.2rem; max-height: 9rem; padding: .45rem .2rem; resize: none; overflow-y: auto; line-height: 1.45; outline: 0; }
.ai-composer-actions { justify-content: flex-start; gap: .45rem; }
.ai-upload-action { display: inline-grid; width: 2rem; height: 2rem; place-items: center; border-radius: 999px; cursor: pointer; font-weight: 800; }
.ai-upload-action { flex: none; color: var(--green); background: var(--green-soft); font-size: 1.15rem; }
.ai-upload-action:hover { color: var(--ink); }
.ai-upload-action input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ai-upload-action:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.ai-composer-hint { flex: 1; color: var(--muted); font-size: .68rem; }
.ai-retry-action { padding: .35rem .55rem; color: var(--green); background: transparent; font-size: .72rem; font-weight: 700; }
.ai-send-action { display: inline-flex; flex: none; height: 2rem; align-items: center; gap: .35rem; padding: 0 .7rem; border-radius: 999px; background: var(--ink); color: var(--paper); font-size: .75rem; font-weight: 800; }
.ai-send-action > :last-child { font-size: 1rem; }
.ai-send-action:disabled { cursor: wait; opacity: .45; }
.ai-file-chips { margin: .15rem 0 .25rem; }
.ai-file-chips:empty { display: none; }
.ai-file-chips li { display: inline-flex; align-items: center; gap: .3rem; max-width: 100%; background: var(--surface); color: var(--ink); }
.ai-file-chips span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-file-remove { display: grid; width: 1rem; height: 1rem; padding: 0; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--ink) 10%, transparent); color: inherit; font-size: .7rem; }

.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; }

@media (pointer: coarse) {
  .insert-agenda-button { display: none; }
}

@media (hover: none) {
  .agenda-item:focus-within > .insert-agenda-button,
  .insert-agenda-button:focus-visible { opacity: 1; pointer-events: auto; }
}

@media (min-width: 1000px) {
  .editor-form:has(.ai-assistant) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 22rem);
    column-gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
  }
  .editor-form:has(.ai-assistant) > .plan-heading { grid-column: 1 / -1; }
  .editor-form:has(.ai-assistant) > .ai-assistant {
    position: sticky;
    top: 1rem;
    grid-column: 2;
    grid-row: 2;
    margin: 0;
  }
  .editor-form:has(.ai-assistant) > [data-editor-content] {
    min-width: 0;
    grid-column: 1;
    grid-row: 2;
  }
  .take-stage:has(.take-previews) { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(360px, 1fr); gap: 30px; align-items: start; }
  .take-previews { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

@media (max-width: 720px) {
  .app-shell { width: min(100% - 24px, 1120px); }
  .editor { padding-top: 12px; }
  .plan-heading { margin-bottom: 12px; }
  .plan-title { font-size: 1.875rem; line-height: 1.12; }
  .revision-panel { grid-template-columns: 1fr; gap: 24px; padding: 34px 0; }
  .topbar { flex-wrap: wrap; gap: 10px 18px; padding: 12px 0; }
  .topbar-hint { display: none; }
  .revision-meta { flex-wrap: wrap; justify-content: flex-end; gap: 4px 10px; font-size: .76rem; }
  .revision-list a { flex-wrap: wrap; gap: 4px 16px; }
  .editor:has(.ai-assistant) { padding-bottom: 9.5rem; }
  .ai-assistant {
    position: fixed;
    z-index: 20;
    right: 12px;
    bottom: max(10px, env(safe-area-inset-bottom));
    left: 12px;
    max-height: min(78dvh, 42rem);
    margin: 0;
    padding: .65rem;
    border-radius: 1rem;
    box-shadow: 0 18px 60px rgb(20 28 22 / 24%);
  }
  .ai-assistant-heading { display: none; }
  .ai-summary {
    display: grid;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .55rem;
    align-items: center;
    padding: .15rem .2rem .6rem;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 75%, transparent);
    border-radius: 0;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
    text-align: left;
  }
  .ai-summary-label { display: inline-flex; align-items: center; gap: .35rem; color: var(--muted); font-size: .65rem; font-weight: 750; text-transform: uppercase; letter-spacing: .055em; }
  .ai-summary-label::before { width: .42rem; height: .42rem; border-radius: 50%; background: var(--green); content: ""; }
  .ai-summary [data-ai-summary-text] { overflow: hidden; color: var(--ink); font-size: .8rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
  .ai-summary-chevron { width: .55rem; height: .55rem; margin: 0 .3rem 0 .2rem; border-top: 2px solid var(--muted); border-right: 2px solid var(--muted); transform: rotate(-45deg); transition: transform 160ms ease; }
  .ai-assistant[data-expanded="true"] .ai-summary-chevron { transform: rotate(135deg); }
  .ai-summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
  .ai-conversation { display: none; }
  .ai-assistant[data-expanded="true"] .ai-conversation { display: block; }
  .ai-assistant[data-expanded="true"] .ai-messages { max-height: min(45dvh, 24rem); margin: .35rem 0 .65rem; }
  .ai-assistant[data-expanded="true"] .ai-criteria { margin-bottom: .6rem; }
  .ai-chat-input { display: block; }
  .ai-composer { padding: .35rem .4rem .3rem .65rem; }
  .ai-chat-input textarea { max-height: 6rem; }
  .ai-composer-hint { display: none; }
  .ai-retry-action { margin-left: auto; }
  .ai-send-action { width: 2rem; padding: 0; justify-content: center; }
  .ai-send-label { display: none; }
}

.collaboration-status {
  color: var(--muted-color, #667085);
  font-size: 0.85rem;
}

[data-collaboration-target][data-collaborator="true"] {
  outline: 2px solid #7c6ee6;
  outline-offset: 3px;
}

.collaboration-conflict {
  position: sticky;
  bottom: 1rem;
  z-index: 20;
  margin: 1rem;
  padding: 1rem;
  border: 1px solid #d92d20;
  border-radius: 0.75rem;
  background: #fff4f2;
  color: #7a271a;
  box-shadow: 0 0.75rem 2rem rgb(16 24 40 / 18%);
}

.collaboration-conflict > div {
  display: flex;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

/* Account and tenant library */
.account-nav { display: flex; flex: 0 0 auto; gap: 0.8rem; margin-left: auto; font-size: 0.82rem; white-space: nowrap; }
.account-nav a { display: inline-flex; min-height: 44px; align-items: center; color: inherit; text-decoration: none; }
.topbar {
  position: relative;
  display: grid;
  min-height: 56px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0 16px;
}
.topbar .brand { display: inline-flex; min-height: 44px; align-items: center; }
.topbar .account-nav { justify-content: flex-end; flex-wrap: wrap; gap: 0 12px; margin-left: 0; }
.plan-details { color: var(--muted); font-size: .82rem; }
.plan-details > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; gap: 6px; list-style: none; }
.plan-details > summary::-webkit-details-marker { display: none; }
.plan-details > summary::after { content: "⌄"; }
.plan-details[open] > summary::after { content: "⌃"; }
.plan-details > summary:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.plan-details-content {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 20;
  width: min(28rem, 100%);
  max-height: calc(100dvh - 88px);
  overflow-y: auto;
  padding: 12px 16px;
  border: 1px solid var(--line);
  background: var(--surface);
  overflow-wrap: anywhere;
}
.plan-details-content .revision-meta { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.plan-details-content .revision-meta--empty { display: none; }
.plan-details-content a:not([hidden]) { min-height: 44px; display: inline-flex; align-items: center; }
.plan-details-content p { margin: 8px 0; line-height: 1.5; }
.telegram-details { margin-top: 8px; border-top: 1px solid var(--line); padding-top: 8px; }
.connection-warning { grid-column: 1 / -1; padding-bottom: 8px; color: #922d1d; font-size: .82rem; }
.account-shell, .library-shell { width: min(70rem, calc(100% - 2rem)); margin: 0 auto; padding: 1.25rem 0 4rem; }
.account-shell > .brand { display: inline-block; margin-bottom: 3rem; }
.account-card { width: min(30rem, 100%); margin: 0 auto; padding: 2rem; border: 1px solid var(--line, #d8d1c4); background: #fffdf8; box-shadow: 0 1rem 3rem rgb(57 47 31 / 8%); }
.account-card h1, .library-section h1, .library-section h2 { margin: 0.25rem 0 1rem; }
.account-form { display: grid; gap: 0.55rem; margin-top: 1.5rem; }
.account-form input { width: 100%; margin-bottom: 0.65rem; padding: 0.75rem; border: 1px solid var(--line, #d8d1c4); background: white; font: inherit; }
.account-slug-field { display: flex; align-items: center; margin-bottom: 0.65rem; border: 1px solid var(--line, #d8d1c4); background: white; }
.account-slug-field span { padding-left: 0.75rem; color: var(--muted, #70695f); white-space: nowrap; }
.account-form .account-slug-field input { min-width: 0; margin: 0; border: 0; }
.account-footnote { margin-top: 1.25rem; font-size: 0.9rem; }
.account-list, .jenda-grid, .local-jenda-list, .member-list { list-style: none; margin: 1rem 0; padding: 0; }
.account-list { display: grid; gap: 0.6rem; }
.library-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 3rem; }
.library-header p { margin: 0.25rem 0 0; color: var(--muted, #70695f); }
.library-header nav { display: flex; align-items: center; gap: 0.8rem; }
.library-header form { margin: 0; }
.library-section { margin-top: 1.5rem; padding: 1.5rem; border: 1px solid var(--line, #d8d1c4); background: #fffdf8; }
.jenda-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.8rem; }
.jenda-grid li, .local-jenda-list li { padding: 1rem; border: 1px solid var(--line, #d8d1c4); background: white; }
.jenda-grid li > a:first-child, .local-jenda-list a { display: grid; gap: 0.35rem; color: inherit; text-decoration: none; }
.jenda-grid small, .local-jenda-list small { color: var(--muted, #70695f); }
.local-jenda-list, .member-list { display: grid; gap: 0.6rem; }
.member-list li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid var(--line, #d8d1c4); background: white; }
.member-list li > div:first-child { display: grid; gap: 0.25rem; }
.member-list small { color: var(--muted, #70695f); }
.member-actions { display: flex; align-items: center; gap: 0.65rem; }
.member-actions form { margin: 0; }
.member-actions select, .invitation-link input { padding: 0.6rem; border: 1px solid var(--line, #d8d1c4); background: white; font: inherit; }
.invitation-link input { width: 100%; }
.text-action--danger { color: #9b2c1f; }
@media (max-width: 700px) {
  .topbar { flex-wrap: wrap; }
  .account-nav { font-size: 0.76rem; }
  .library-header, .library-header nav { align-items: flex-start; flex-direction: column; }
  .account-card { padding: 1.25rem; }
  .member-list li, .member-actions { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 420px) {
  .topbar { column-gap: 10px; padding: 0; }
  .topbar .account-nav { white-space: normal; gap: 0 10px; font-size: .72rem; }
  .plan-details { font-size: .76rem; }
}

/* Telegram is a shell around the existing cue sheet, not a second editor. */
.telegram-mini-app .app-shell {
  padding-top: var(--telegram-safe-top, 0px);
  padding-bottom: calc(80px + var(--telegram-safe-bottom, 0px));
}
.mini-app-launch { padding-top: 32px; }
.mini-app-access { margin-top: 16px; }
.mini-app-access input[type="submit"] {
  max-width: 100%;
  min-height: 44px;
  padding: 10px 16px;
  border: 0;
  border-radius: 8px;
  background: var(--green);
  color: var(--surface);
  cursor: pointer;
}
.mini-app-access input:disabled { opacity: .55; cursor: default; }
.mini-app-access p { color: var(--muted); font-size: .86rem; }

/* Live operations are independent of the editable, planned agenda below. */
.live-panel { margin-top: 20px; border-block: 1px solid var(--line); padding-block: 16px; }
.live-heading, .live-clock-row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.live-heading h2 { margin: 0; font-size: 1.1rem; }
.live-heading > span, .live-clock-row > span, .live-note { color: var(--muted); font-size: .85rem; }
.live-heading > form { margin-left: auto; }
.live-clock-row { margin-top: 12px; }
.live-clock-row > time { font-variant-numeric: tabular-nums; font-weight: 650; }
.live-halves { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-top: 16px; }
.live-half { display: flex; flex-direction: column; min-width: 0; padding: 12px; }
.live-half + .live-half { border-left: 1px solid var(--line); }
.live-half h3 { margin: 0 0 10px; color: var(--green); font-size: .8rem; letter-spacing: .1em; }
.live-half[aria-label="UP NEXT"] h3 { color: #2563a6; }
.live-item[data-live-next] { border-inline-start: 2px solid #2563a6; padding-inline-start: 8px; }
.live-item { flex: 1; min-height: 60px; overflow-wrap: anywhere; }
.live-item strong, .live-item > span { display: block; }
.live-item > span { color: var(--muted); font-size: .85rem; margin-top: 6px; }
.live-item p { white-space: pre-line; }
.live-controls { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.live-clock-row .live-controls { margin-top: 0; }
.live-button { min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); background: var(--surface); cursor: pointer; }
.live-button:hover:not(:disabled) { border-color: var(--green); }
.live-button:disabled { opacity: .5; cursor: default; }
.live-button:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.live-announcement { margin: 12px 0; font-weight: 650; }
.live-history { font-size: .85rem; }
.live-history summary { cursor: pointer; min-height: 44px; padding-block: 12px; }
.live-history ol { max-height: 240px; overflow-y: auto; }
.live-note:empty { display: none; }
@media (max-width: 480px) {
  .live-half { padding-inline: 8px; }
  .live-controls { gap: 6px; }
  .live-button { padding-inline: 8px; }
  .live-heading > form { margin-left: 0; }
}
@media (max-width: 720px) {
  /* The planning composer must not cover live controls during a run. */
  .app-shell:has([data-live-clock]) .ai-assistant { position: static; max-height: none; margin-block: 16px; box-shadow: none; }
  .app-shell:has([data-live-clock]) .editor { padding-bottom: 0; }
}

/* Keep live action forms and labels inside the agenda at large text sizes. */
.live-heading > form, .live-controls form { min-width: 0; max-width: 100%; }
.live-button { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }

/* A cue becomes editable without changing its reading type or position.
   Confirmation uses the existing margin, not the cue's wrapping width. */
.inline-text { display: block; min-width: 0; max-width: 100%; }
.inline-text-line { position: relative; display: flex; align-items: flex-start; width: fit-content; min-width: 0; max-width: 100%; }
.inline-text [data-inline-field] {
  flex: 0 1 auto;
  width: auto;
  min-width: 1ch;
  max-width: 100%;
  field-sizing: content;
  border-radius: 2px;
  caret-color: var(--green);
}
.inline-text--description .inline-text-line, .inline-text--description [data-inline-field] { width: 100%; }
.inline-text [data-inline-field]:is(:focus, [data-editing="true"]) {
  outline: none;
  background: color-mix(in srgb, var(--green) 5%, transparent);
  box-shadow: inset 0 -1px color-mix(in srgb, var(--green) 65%, transparent);
}
.inline-text [data-inline-field]:focus-visible { box-shadow: inset 0 -2px var(--green); }
.inline-text:has(.plan-title) { width: 100%; }
.inline-feedback { position: absolute; inset-inline-start: calc(100% + 2px); top: 0; width: 12px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.inline-feedback[data-state="saved"] { color: var(--green); }
.inline-feedback[data-state="error"] { color: #922d1d; font-weight: 700; }
.inline-failure { display: flex; flex-wrap: wrap; gap: 0 8px; color: #922d1d; font-size: .75rem; line-height: 1.5; }
.inline-failure[hidden] { display: none; }
.inline-retry { min-height: 44px; padding: 0; border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; }
.inline-help { min-height: 1.5em; margin: 6px 0 0; color: var(--muted); font-size: .6875rem; line-height: 1.5; visibility: hidden; }
.inline-help.is-active { visibility: visible; }

.inline-help.is-single-line .inline-multiline-help { visibility: hidden; }