:root {
  --ink: #13241c;
  --muted: #5c6d65;
  --line: #cfd8d2;
  --paper: #e7eee8;
  --green: #124a36;
  --lime: #d9f774;
  --white: #fbfcfb;
  --forest: #0e2f25;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --display: "Iowan Old Style", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --sans: "Avenir Next", "Segoe UI", ui-sans-serif, system-ui, sans-serif;
  --mono: "SFMono-Regular", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
[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; }
body.authed .login { display: none !important; }
body {
  margin: 0;
  font: 14px/1.55 var(--sans);
  text-rendering: optimizeLegibility;
  color: var(--ink);
  background:
    linear-gradient(180deg, #f3f7f3 0, transparent 180px),
    var(--paper);
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.icon, button svg, summary svg, .link svg, .card.jump svg {
  pointer-events: none;
}

.skip { position: absolute; left: -999px; top: 8px; background: #fff; padding: 8px 12px; z-index: 20; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
main :focus-visible { outline-color: var(--green); }

.login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  position: fixed;
  inset: 0;
  z-index: 6;
  background:
    repeating-linear-gradient(-12deg, transparent, transparent 22px, #ffffff0a 22px, #ffffff0a 23px),
    radial-gradient(circle at 80% 10%, #d9f77433, transparent 28%),
    var(--forest);
}
.login-card {
  width: min(420px, 92vw);
  padding: 40px 36px 32px;
  background: #fbfcf8;
  border: 1px solid #1a3d30;
  box-shadow: 8px 8px 0 #0a1f18;
}
.login h1 {
  margin: var(--space-6) 0 var(--space-2);
  font: 400 36px/1.08 var(--display);
  letter-spacing: -.025em;
}
.login p { color: var(--muted); margin: 0 0 12px; line-height: 1.6; }
.login label, .form label { display: grid; gap: 7px; margin: 16px 0; font-weight: 600; font-size: 13px; }
.login input, .form input, .form select, .form textarea {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: #fff;
}
.login button, .primary, .form button {
  border: 0;
  background: var(--green);
  color: #fff;
  padding: 11px 16px;
  border-radius: 2px;
  font-weight: 700;
  cursor: pointer;
}
.login button { width: 100%; margin: 12px 0; }
.login small { color: var(--muted); }
.error { color: #9b2c1a; margin-top: 10px; }

.brand {
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -.04em;
  display: flex;
  align-items: center;
  gap: 10px;
}
.brand span {
  display: inline-grid;
  place-items: center;
  background: var(--lime);
  color: #143428;
  width: 34px;
  height: 34px;
  border-radius: 2px;
  font: 800 14px/1 var(--sans);
}
.brand.large { font: 400 30px/1 var(--display); }
.brand.large span { width: 46px; height: 46px; font-size: 18px; }

#app { min-height: 100vh; display: grid; grid-template-columns: 200px 1fr; }
.ghost.menu-toggle { display: none; }
.title-row { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
#nav-backdrop { border: 0; padding: 0; }
aside {
  background: var(--forest);
  color: #c5d5cd;
  padding: 12px 8px 10px;
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0 auto 0 0;
  width: 200px;
}
aside .brand { color: #fff; padding: 2px 8px 12px; font-size: 17px; gap: 8px; }
aside .brand span { width: 28px; height: 28px; font-size: 12px; }
nav {
  display: grid;
  align-content: start;
  gap: 1px;
  overflow: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
  scrollbar-color: #2a5a48 transparent;
}
nav button {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 5px 8px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: inherit;
  text-align: left;
  font-size: 13px;
  line-height: 1.35;
  width: 100%;
  cursor: pointer;
}
nav button *,
aside .user button *,
.ghost *,
.primary *,
.card.jump *,
.cal-pill *,
.cal-agenda-row *,
.cal-more * {
  pointer-events: none;
  cursor: inherit;
}
nav button i { font-style: normal; }
.icon { width: 15px; height: 15px; flex-shrink: 0; display: block; }
nav button:hover { background: #174537; color: #fff; }
nav button.active {
  background: #174537;
  color: #fff;
  box-shadow: inset 2px 0 0 var(--lime);
}
nav button.active .icon { color: var(--lime); }
.nav-group { margin: 2px 0 0; }
.nav-group summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6px 4px 2px;
  padding: 4px 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #7f968c;
  border-radius: 2px;
}
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary::after {
  content: "";
  width: 5px;
  height: 5px;
  border-right: 1.5px solid #7f968c;
  border-bottom: 1.5px solid #7f968c;
  transform: rotate(-45deg);
  margin-left: 6px;
  flex-shrink: 0;
}
.nav-group[open] summary::after { transform: rotate(45deg); }
.nav-group summary:hover { color: #d5e4dc; background: #143c30; }
.nav-label {
  margin: 10px 8px 2px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #7f968c;
}
.user {
  margin-top: auto;
  padding: 8px 8px 2px;
  border-top: 1px solid #ffffff1f;
  display: grid;
  gap: 4px;
}
.user strong { color: #fff; font-size: 12px; }
.user button {
  border: 0;
  background: none;
  color: #a8bcb4;
  padding: 2px 0;
  text-align: left;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  cursor: pointer;
}

.header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.alerts { position: relative; }
.alerts-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  width: min(340px, 80vw);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 8px 8px 0 #0a1f1822;
  z-index: 8;
  padding: 8px;
  display: grid;
  gap: 4px;
}
.alerts-panel button {
  display: grid;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 8px 10px;
  border-radius: 2px;
}
.alerts-panel button:hover { background: #eef4ee; }
.alerts-panel small { color: var(--muted); }
#alerts-count {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--green);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  font-style: normal;
}
#alerts-count[hidden] { display: none !important; }
.attach-box { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--line); }
.attach-box ul { list-style: none; padding: 0; margin: 8px 0; }
.attach-box li { display: flex; gap: 8px; align-items: center; padding: 4px 0; }
.attach-box small { color: var(--muted); }
.ghost {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink);
  padding: 9px 12px;
  border-radius: 2px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.25;
}
.ghost:hover, .ghost[aria-expanded="true"] { border-color: var(--green); color: var(--green); background: #f4f8f4; }
.primary { display: inline-flex; align-items: center; gap: 8px; }
.primary:hover { background: #0e3c2b; }
#app.companion-open { grid-template-columns: 200px 1fr 320px; }
#companion {
  position: fixed;
  inset: 0 0 0 auto;
  width: 320px;
  background: var(--white);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  z-index: 4;
}
#companion[hidden] { display: none !important; }
#companion > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  padding: 14px 14px 10px;
  border-bottom: 1px solid var(--line);
  position: static;
  background: var(--white);
}
#companion > header > div { min-width: 0; }
#companion #ai-close { position: relative; z-index: 2; flex: 0 0 36px; width: 36px; height: 36px; padding: 8px; cursor: pointer; }
#companion > header strong { font-size: 15px; }
#companion > header .muted { margin: 4px 0 0; font-size: 12px; }
.ai-log { flex: 1; overflow: auto; padding: 12px 14px; display: grid; align-content: start; gap: 10px; }
.ai-msg { padding: 8px 10px; border-radius: 2px; font-size: 13px; line-height: 1.45; white-space: pre-wrap; }
.ai-msg.user { background: #eef4ee; justify-self: end; max-width: 92%; }
.ai-msg.bot { background: #f7f4ea; border-left: 3px solid var(--lime); }
.ai-msg .ai-tools { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; }
.ai-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 14px 10px; }
.ai-chips button {
  border: 1px solid var(--line);
  background: #f7faf7;
  border-radius: 2px;
  padding: 5px 8px;
  font-size: 12px;
  text-align: left;
}
.ai-chips button:hover { border-color: var(--green); color: var(--green); }
#ai-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 10px 14px 14px; border-top: 1px solid var(--line); }
#ai-form .search { min-width: 0; }
#ai-form .primary { margin: 0; }
.actions button, .link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 0;
  background: none;
  color: var(--green);
  font-weight: 700;
  padding: 3px 5px;
  white-space: nowrap;
}
.actions button:hover, .link:hover { color: #0b2f22; }

main {
  grid-column: 2;
  padding: 28px 32px 56px;
  max-width: 1520px;
  width: 100%;
  min-width: 0;
}
header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: var(--space-5);
  margin-bottom: var(--space-5);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 3;
  background: linear-gradient(180deg, #f3f7f3 70%, #f3f7f300);
}
header h1 {
  font: 400 38px/1.05 var(--display);
  margin: 4px 0 0;
  letter-spacing: -.025em;
}
.eyebrow {
  font-size: 10px;
  line-height: 1.4;
  font-weight: 800;
  color: #5f7a6d;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.lede { margin: 8px 0 0; color: var(--muted); max-width: 58ch; font-size: 14px; line-height: 1.5; }
#content { min-width: 0; }

.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-3); }
.cards-3 { grid-template-columns: repeat(3, 1fr); }
.card, .panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: var(--space-5);
}
.card {
  position: relative;
  overflow: hidden;
}
.card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--lime);
}
.card b {
  font: 400 32px/1.05 var(--display);
  display: block;
  margin-top: 12px;
  letter-spacing: -.015em;
  font-variant-numeric: tabular-nums;
}
.card span { color: var(--muted); font-size: 10.5px; line-height: 1.35; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.card.jump { cursor: pointer; text-align: left; width: 100%; }
.card.jump:hover { background: #f4f8f4; }

.grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: var(--space-4); margin-top: var(--space-4); }
.panel h2 {
  font: 400 24px/1.15 var(--display);
  letter-spacing: -.015em;
  margin: 0 0 var(--space-4);
}
.panel h3 { margin: 20px 0 8px; font-size: 15px; line-height: 1.35; }
.panel > p { margin: 0 0 14px; }
.panel > p:last-child { margin-bottom: 0; }
.bar-chart { height: 190px; display: flex; align-items: end; gap: 12px; padding-bottom: 22px; }
.bar {
  flex: 1;
  background: linear-gradient(180deg, #e8f99a, #b7d85a);
  border-radius: 2px 2px 0 0;
  min-height: 4px;
  position: relative;
}
.bar small {
  position: absolute;
  bottom: -22px;
  width: 100%;
  text-align: center;
  color: var(--muted);
  font: 11px var(--mono);
}
.bar > span {
  position: absolute;
  top: -21px;
  left: 0;
  width: 100%;
  text-align: center;
  color: var(--ink);
  font: 10px/1.2 var(--mono);
  white-space: nowrap;
}

.table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--white);
  scrollbar-gutter: stable;
  max-width: 100%;
}
table {
  width: 100%;
  border-collapse: collapse;
  background: var(--white);
  table-layout: auto;
}
th, td {
  padding: 10px 13px;
  text-align: left;
  border-bottom: 1px solid #e6ece8;
  vertical-align: middle;
  white-space: nowrap;
}
td.wrap, td:has(br) { white-space: normal; line-height: 1.35; }
th {
  font-size: 10.5px;
  line-height: 1.35;
  font-weight: 750;
  text-transform: uppercase;
  color: #66756e;
  letter-spacing: .075em;
  background: #f3f6f3;
  position: sticky;
  top: 0;
  z-index: 1;
  box-shadow: inset 0 -1px 0 var(--line);
}
.sort-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  text-align: inherit;
}
th.num .sort-button { justify-content: flex-end; }
.sort-button span { color: #91a098; font-size: 12px; }
th[aria-sort="ascending"] .sort-button span { transform: rotate(180deg); color: var(--green); }
th[aria-sort="descending"] .sort-button span { color: var(--green); }
tr:last-child td { border-bottom: 0; }
tr:hover td { background: #f5f8f5; }
tr.row-click, tr.row-click td, tr.row-click td * { cursor: pointer; }
tr.row-click:hover td { background: #e8f1ea; }
tr.row-click:focus-visible { outline: 3px solid var(--green); outline-offset: -3px; }
tr.row-click:focus-visible td { background: #e8f1ea; }
.overdue td { background: #fff4f0; }
tr.row-click.overdue:hover td { background: #ffe6de; }
.doc {
  font: 600 12.5px/1.4 var(--mono);
  letter-spacing: -.02em;
}
.num, th.num, td.num {
  font-variant-numeric: tabular-nums;
  font-family: var(--mono);
  font-size: 12.5px;
  text-align: right;
}
span.num { display: inline; min-width: 0; }
th.actions, td.actions {
  text-align: right;
  width: 1%;
  white-space: nowrap;
}
.panel:has(> .table-wrap) {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
  overflow: hidden;
}
.panel:has(> .table-wrap) > h2 {
  padding: 0 16px 12px;
}
.panel:has(> .table-wrap) > .table-wrap {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
}

.badge {
  display: inline-block;
  padding: 3px 7px;
  border-radius: 2px;
  background: #edf1ef;
  font-size: 10.5px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: .02em;
}
.badge.confirmed, .badge.paid, .badge.active, .badge.accepted, .badge.received, .badge.completed, .badge.posted, .badge.passed, .badge.operational, .badge.won, .badge.approved, .badge.hired, .badge.resolved, .badge.done { background: #d7f0e2; color: #0f5a3a; }
.badge.open, .badge.draft, .badge.partially_received, .badge.pending, .badge.planned, .badge.qualified, .badge.interview { background: #f7e7b8; color: #6d4e00; }
.badge.sent, .badge.ordered, .badge.matched, .badge.in_progress, .badge.maintenance, .badge.new { background: #dce8f8; color: #1a4b86; }
.badge.ignored, .badge.closed, .badge.cancelled, .badge.retired, .badge.disposed, .badge.unpaid { background: #e6eae7; color: #4a5751; }
.badge.overdue, .badge.failed, .badge.rejected, .badge.lost { background: #f8d7d0; color: #8d2414; }
.low { color: #9b2c1a; font-weight: 700; }

.empty { padding: 48px 24px; text-align: center; color: var(--muted); }
.empty.action { display: grid; justify-items: center; gap: 8px; }
.empty.action .icon { width: 28px; height: 28px; color: var(--muted); }
.busy { opacity: .55; }

dialog {
  border: 1px solid #1a3d30;
  border-radius: 2px;
  padding: var(--space-6);
  box-shadow: 10px 10px 0 #0a1f1880;
  width: min(640px, 92vw);
}
dialog::backdrop { background: #0d221ccc; }
dialog h2 { margin: 0 40px 12px 0; font: 400 30px/1.1 var(--display); letter-spacing: -.02em; }
dialog .close, #companion .close {
  background: none;
  border: 0;
  color: var(--muted);
  display: grid;
  place-items: center;
  padding: 4px;
}
dialog .close { position: absolute; right: 16px; top: 14px; }
dialog .close .icon, #companion .close .icon { width: 20px; height: 20px; }
.detail-page { display: grid; gap: var(--space-3); }
.detail-page-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.detail-page-head .muted { font: 11px/1.4 var(--mono); }
.detail-page .detail { max-width: 980px; width: 100%; }
.detail .facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4) var(--space-5); margin: 0 0 var(--space-5); }
.detail .facts div { min-width: 0; }
.detail dt { font-size: 10px; line-height: 1.35; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.detail dd { margin: 4px 0 0; line-height: 1.45; }
.detail .table-wrap { margin: 12px 0 20px; }
.detail-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0 0 var(--space-5); }
.danger {
  border: 0;
  background: #8d2414;
  color: #fff;
  padding: 10px 14px;
  border-radius: 2px;
  font-weight: 700;
  cursor: pointer;
  width: 100%;
}
.danger:hover { background: #6e1b10; }
.confirm-dialog { width: min(460px, 92vw); }
.confirm-dialog h2 { margin-right: 0; }
.confirm-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 18px; background: #f8d7d0; color: #8d2414; border-radius: 50%; }
.confirm-icon .icon { width: 21px; height: 21px; }
.confirm-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-5); }
.confirm-actions .ghost, .confirm-actions .danger { width: auto; margin: 0; }
dialog.wide { width: min(760px, 94vw); }
.form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form button { width: 100%; margin-top: 12px; }
.form [aria-invalid="true"] { border-color: #a52d1b; box-shadow: 0 0 0 2px #a52d1b1f; }
.field-error { color: #8d2414; font-size: 12px; font-weight: 600; line-height: 1.35; }
.form-state { margin: 12px 0 0; padding: 9px 11px; border-left: 3px solid var(--line); background: #f4f7f4; font-size: 12px; }
.form-state:empty { display: none; }
.form-state[data-state="loading"] { color: #1a4b86; border-color: #1a4b86; background: #edf4fc; }
.form-state[data-state="success"] { color: #0f5a3a; border-color: #168150; background: #eaf7ef; }
.form-state[data-state="error"] { color: #8d2414; border-color: #a52d1b; background: #fff0ec; }
[aria-busy="true"] { cursor: progress; }
button[aria-busy="true"] { opacity: .68; }
.order-line { display: grid; grid-template-columns: 1fr 90px 30px; gap: 8px; margin: 7px 0; }
.order-line button { margin: 0; padding: 0; background: #ecefec; color: #333; border-radius: 2px; display: grid; place-items: center; }
.muted { color: var(--muted); line-height: 1.5; }

#toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  background: var(--forest);
  color: #fff;
  padding: 12px 16px;
  border-left: 3px solid var(--lime);
  opacity: 0;
  transform: translateY(8px);
  transition: .2s;
  pointer-events: none;
  z-index: 30;
}
#toast.show { opacity: 1; transform: none; }
#toast[data-type="error"] { background: #641b10; border-left-color: #ffb29f; }

.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: var(--space-4); }
.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: 8px 12px;
  min-width: min(320px, 100%);
  flex: 1;
}
.search input { border: 0; outline: 0; width: 100%; background: transparent; }
.filters { display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
  border: 1px solid var(--line);
  background: var(--white);
  border-radius: 2px;
  padding: 6px 10px;
  color: var(--ink);
}
.chip.active { background: var(--green); color: #fff; border-color: var(--green); }
.count { color: var(--muted); font-size: 12px; margin-left: auto; font-family: var(--mono); }
.pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 12px; color: var(--muted); font-size: 12px; }
.pagination label { display: flex; align-items: center; gap: 6px; }
.pagination select { min-width: 68px; padding: 7px; }

.stack { display: grid; gap: var(--space-4); }
.doc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.import-box textarea { width: 100%; min-height: 140px; font: 12px/1.45 var(--mono); }
kbd {
  font: 600 11px/1 var(--mono);
  border: 1px solid #b7c4bc;
  border-bottom-width: 2px;
  border-radius: 2px;
  padding: 1px 5px;
  background: #f4f7f4;
}
.shortcut-list { display: grid; gap: 0; margin: 16px 0 4px; }
.shortcut-list > div { display: grid; grid-template-columns: minmax(125px, auto) 1fr; gap: 18px; align-items: center; padding: 11px 0; border-top: 1px solid var(--line); }
.shortcut-list dt { display: flex; align-items: center; gap: 5px; margin: 0; white-space: nowrap; }
.shortcut-list dt span { color: var(--muted); font-size: 11px; }
.shortcut-list dd { margin: 0; color: var(--ink); }

.jump-dialog {
  width: min(460px, 92vw);
  padding: 16px;
  border: 1px solid #1a3d30;
  border-radius: 2px;
  box-shadow: 10px 10px 0 #0a1f1880;
}
.jump-dialog .search { margin-bottom: 10px; }
.jump-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 8px 10px;
  border-radius: 2px;
}
.jump-item small { color: var(--muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.jump-item.active, .jump-item:hover { background: #eef4ee; }
.jump-hint { margin: 10px 2px 0; font-size: 12px; }
.jump-hint kbd { margin-right: 3px; }

.cal-toolbar { align-items: center; }
.cal-nav { display: flex; gap: 6px; }
.cal-heading { text-transform: capitalize; }
.cal-types { margin: -4px 0 14px; }
.check { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; font-weight: 600; }
.check input { width: auto; }
.cal-month { background: var(--white); border: 1px solid var(--line); border-radius: 2px; overflow: hidden; }
.cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: #eef4ee;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.cal-weekdays span { padding: 8px 10px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.cal-day {
  min-height: 118px;
  padding: 8px 6px 6px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  background: #fff;
}
.cal-day:nth-child(7n) { border-right: 0; }
.cal-day.is-other { background: #f6f8f6; color: #8a9791; }
.cal-day.cal-today { background: #f4fad4; }
.cal-day:hover { background: #eef4ee; }
.cal-num { display: block; font-weight: 700; font-size: 12px; margin-bottom: 4px; }
.cal-pills { display: grid; gap: 3px; }
.cal-pill, .cal-agenda-row {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-radius: 2px;
  padding: 3px 6px;
  font-size: 11px;
  line-height: 1.3;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-pill.is-done, .cal-agenda-row.is-done { opacity: .55; }
.cal-more { font-size: 11px; color: var(--muted); padding: 0 4px; border: 0; background: transparent; cursor: pointer; text-align: left; }
.cal-pill.type-event, .cal-agenda-row.type-event { background: #dce8f8; color: #1a4b86; }
.cal-pill.type-leave, .cal-agenda-row.type-leave { background: #eadcf8; color: #5b2d86; }
.cal-pill.type-time, .cal-agenda-row.type-time { background: #e6eae7; color: #4a5751; }
.cal-pill.type-maintenance, .cal-agenda-row.type-maintenance { background: #fde4c8; color: #8a4b00; }
.cal-pill.type-production, .cal-agenda-row.type-production { background: #ddd8f8; color: #2f2a7a; }
.cal-pill.type-invoice, .cal-agenda-row.type-invoice { background: #f8d7d0; color: #8d2414; }
.cal-pill.type-bill, .cal-agenda-row.type-bill { background: #f7e7b8; color: #6d4e00; }
.cal-pill.type-project, .cal-agenda-row.type-project { background: #d7f0e2; color: #0f5a3a; }
.cal-pill.type-quote, .cal-agenda-row.type-quote { background: #d4f1f4; color: #0d5c63; }
.cal-pill.type-purchase, .cal-agenda-row.type-purchase { background: #cceee6; color: #0b5a4b; }
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.cal-week-col {
  min-height: 280px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: 10px 8px;
  cursor: pointer;
}
.cal-week-col.cal-today { background: #f4fad4; }
.cal-week-col header { display: flex; flex-direction: column; gap: 2px; margin-bottom: 8px; }
.cal-week-col header small { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.cal-agenda { display: grid; gap: 14px; }
.cal-agenda-day {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: 10px 12px;
}
.cal-agenda-day.cal-today { background: #f4fad4; }
.cal-agenda-day h3 { margin: 0 0 8px; font-size: 15px; }
.cal-agenda-row {
  display: grid;
  grid-template-columns: 10px 88px 1fr auto;
  gap: 10px;
  align-items: center;
  white-space: normal;
  margin-bottom: 4px;
  padding: 8px 10px;
}
.cal-agenda-row small { display: block; color: var(--muted); font-weight: 400; }
.cal-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.cal-when { font-family: var(--mono); font-size: 12px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; transform: none !important; }
}
@media (max-width: 1100px) {
  #app.companion-open { grid-template-columns: 200px 1fr; }
  #companion { width: min(320px, 100vw); box-shadow: -8px 0 24px #0a1f1822; }
}
@media (max-width: 900px) {
  #app, #app.companion-open { grid-template-columns: 1fr; }
  #sidebar {
    width: min(280px, 86vw);
    padding: 12px 8px 10px;
    z-index: 12;
    transform: translateX(-105%);
    transition: transform .18s ease;
    box-shadow: 10px 0 28px #06130e55;
  }
  #app.nav-open #sidebar { transform: translateX(0); }
  #nav-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 11;
    background: #07171199;
  }
  #nav-backdrop[hidden] { display: none; }
  .ghost.menu-toggle { display: grid; place-items: center; flex: 0 0 auto; padding: 9px; }
  main { grid-column: 1; padding: 22px 18px 40px; }
  .cards, .cards-3 { grid-template-columns: 1fr 1fr; }
  .grid { grid-template-columns: 1fr; }
  .toolbar { flex-direction: column; align-items: stretch; }
  .count { margin-left: 0; }
  header { margin-bottom: 20px; padding-bottom: 16px; }
  header h1 { font-size: 32px; }
}
@media (max-width: 700px) {
  th.col-priority-low, td.col-priority-low { display: none; }
  .detail-page-head { align-items: flex-start; flex-direction: column; }
  .detail-page-head .muted { display: none; }
}
@media (max-width: 560px) {
  .cards, .cards-3 { grid-template-columns: 1fr; }
  .app-header { align-items: start; flex-direction: column; }
  .header-actions { width: 100%; flex-wrap: wrap; }
  .header-actions > * { flex: 1 1 96px; min-width: 0; }
  .header-actions button { width: 100%; justify-content: center; padding: 9px 8px; font-size: 12px; }
  main { padding: 18px 12px 36px; }
  header h1 { font-size: 30px; }
  .lede { font-size: 13px; }
  .card, .panel { padding: 18px 16px; }
  .form .row { grid-template-columns: 1fr; }
  th.col-priority-medium, td.col-priority-medium { display: none; }
  .detail .facts { grid-template-columns: 1fr; }
  dialog { width: 96vw; padding: 22px 18px; }
  .shortcut-list > div { grid-template-columns: 1fr; gap: 6px; }
  .cal-grid, .cal-weekdays, .cal-week { grid-template-columns: 1fr; }
  .cal-weekdays { display: none; }
  .cal-day { min-height: 0; }
  .cal-agenda-row { grid-template-columns: 10px 1fr; }
  .cal-when { grid-column: 2; }
}