:root {
  color-scheme: dark;
  --bg: #10171d;
  --surface: #18222a;
  --line: #2b3a45;
  --text: #e6ebe9;
  --muted: #9baeb7;
  --accent: #b3cfc6;
  --orange: #e8a775;
  --red: #ffb4a7;
  --panel: #141d24;
  --raised: #1d2a33;
  --green: #9fd6b5;
  --band: rgba(179, 207, 198, 0.2);
  --band-line: rgba(179, 207, 198, 0.55);
  --grid: #26343e;
  --mark: #5b4a21;
}
* {
  box-sizing: border-box;
}
[hidden] {
  display: none !important;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  font-size: 15px;
}
a {
  color: var(--accent);
  text-underline-offset: 4px;
  overflow-wrap: anywhere;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
}
button:disabled {
  opacity: 0.55;
  cursor: wait;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 3px;
}
.masthead {
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 18px 5vw;
  border-bottom: 1px solid var(--line);
}
.brand {
  display: flex;
  gap: 18px;
  align-items: center;
  color: var(--text);
  text-decoration: none;
  font-weight: 650;
  letter-spacing: 3px;
  font-size: 19px;
}
.brand-mark {
  color: var(--orange);
  font-size: 26px;
}
.masthead-caption {
  font-size: 10px;
  letter-spacing: 1.7px;
  color: var(--muted);
}
.release-seal {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 2px 5px;
  color: var(--muted);
  font: 600 9px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.4px;
  white-space: nowrap;
}
#identity {
  margin-left: auto;
  font-size: 13px;
  color: var(--muted);
}
main {
  max-width: 1220px;
  min-height: calc(100vh - 180px);
  margin: auto;
  padding: 42px 30px 70px;
}
.page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 14px 0 32px;
}
.eyebrow {
  color: var(--orange);
  font-size: 10px;
  letter-spacing: 2.2px;
  font-weight: 600;
}
h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(30px, 3.4vw, 44px);
  line-height: 1.17;
  letter-spacing: -0.7px;
  margin: 12px 0 16px;
}
h2 {
  font-size: 17px;
  font-weight: 550;
  margin: 0;
}
h3 {
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 23px;
  line-height: 1.35;
  margin: 12px 0;
}
.muted {
  color: var(--muted);
}
.fine,
.optional {
  font-size: 12px;
  color: var(--muted);
}
.primary {
  background: var(--accent);
  border: 1px solid var(--accent);
  color: #16251f;
  font-weight: 600;
  border-radius: 5px;
  padding: 11px 18px;
  white-space: nowrap;
}
.primary:hover {
  background: #c7dfd7;
}
.secondary {
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--text);
  padding: 9px 16px;
}
.quiet {
  background: none;
  border: 0;
  color: var(--muted);
  padding: 8px 4px;
}
.quiet:hover {
  color: var(--text);
}
.status-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  border-block: 1px solid var(--line);
  padding: 12px 0;
  font-size: 12px;
  color: var(--muted);
}
.status-strip button {
  margin-left: auto;
}
.status-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  margin-right: 8px;
}
.tabs {
  display: flex;
  gap: 28px;
  margin: 24px 0 30px;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
}
.tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: var(--muted);
  padding: 14px 0;
  white-space: nowrap;
}
.tabs button.selected {
  color: var(--text);
  border-color: var(--orange);
}
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 22px;
}
.news-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.panel,
.news-card,
.input-card {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 25px;
  background: var(--surface);
}
.news-card {
  display: flex;
  flex-direction: column;
  min-height: 245px;
}
.news-card p {
  color: var(--muted);
  font-size: 14px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.news-card a {
  margin-top: auto;
  padding-top: 16px;
  font-size: 12px;
}
.meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 10px;
  letter-spacing: 0.65px;
  color: var(--muted);
}
.tag {
  font-size: 10px;
  letter-spacing: 0.5px;
  border: 1px solid var(--line);
  padding: 3px 8px;
  border-radius: 3px;
  color: var(--accent);
}
.tag.pending {
  color: var(--orange);
}
.empty {
  padding: 36px;
  border: 1px dashed var(--line);
  border-radius: 7px;
  color: var(--muted);
  grid-column: 1/-1;
}
.input-card {
  margin-bottom: 18px;
}
.input-card .body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.input-card .actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
}
.review-history {
  border-left: 2px solid var(--line);
  padding-left: 16px;
  margin: 18px 0;
}
.review-history p {
  font-size: 13px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.review-form {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.evaluation-block {
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 7px;
  min-width: 0;
}
.evaluation-block legend {
  padding: 0 6px;
  color: var(--accent);
  font-size: 13px;
}
.evaluation-block label .fine {
  display: block;
  margin-top: 4px;
}
.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.check-row input {
  width: auto;
}
.decision-job {
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel);
  overflow-wrap: anywhere;
}
.brief-relation {
  margin: 6px 0 14px;
}
.stale-note {
  margin: 4px 0 0;
  padding-left: 18px;
}
.decision-card {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid #496055;
  border-radius: 7px;
  background: #111b22;
  overflow-wrap: anywhere;
}
.decision-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.decision-card h4 {
  margin: 4px 0 12px;
  font: 400 21px/1.35 Georgia, serif;
}
.decision-card h5 {
  margin: 0 0 10px;
  font-size: 13px;
  letter-spacing: 0.35px;
}
.decision-section {
  padding: 18px 0;
  border-top: 1px solid var(--line);
}
.decision-section:first-of-type {
  border-top: 0;
}
.decision-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 22px;
  margin: 0;
}
.decision-field {
  min-width: 0;
}
.decision-field dt {
  color: var(--muted);
  font-size: 11px;
}
.decision-field dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
}
.decision-callout {
  margin: 0 0 8px;
  color: var(--accent);
  font-weight: 600;
}
.decision-list,
.identifier-list {
  margin: 0;
  padding-left: 20px;
}
.decision-list li,
.identifier-list li {
  margin: 7px 0;
}
.identifier-list,
.mono-values dd {
  font: 11px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.forecast-empty {
  border-left: 3px solid var(--orange);
  padding-left: 16px;
}
.decision-history {
  margin-top: 4px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.decision-history > *:not(summary) {
  margin-top: 14px;
}
.composer {
  margin-bottom: 30px;
  max-width: 850px;
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
label {
  display: block;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 18px;
}
input,
textarea,
select {
  display: block;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid #3a4b55;
  background: #111b22;
  border-radius: 4px;
  color: var(--text);
  margin-top: 7px;
  font-size: 14px;
}
textarea {
  resize: vertical;
}
.auth-panel {
  max-width: 440px;
  margin: 7vh auto 10vh;
}
.auth-panel .primary {
  width: 100%;
}
.auth-panel h1 {
  font-size: 44px;
}
.auth-alternative {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 18px 0 0;
}
.auth-alternative .secondary {
  flex: 1 1 auto;
}
.code-actions {
  justify-content: space-between;
}
.code-sent {
  font-size: 14px;
  color: var(--text);
  overflow-wrap: anywhere;
}
.code-error {
  font-size: 13px;
  color: var(--red);
  margin: -8px 0 14px;
}
#code {
  font-size: 22px;
  letter-spacing: 0.35em;
  font-variant-numeric: tabular-nums;
}
.notice {
  position: relative;
  margin: 14px auto -12px;
  max-width: 1160px;
  padding: 12px 18px;
  border: 1px solid var(--accent);
  border-radius: 5px;
  color: var(--text);
  background: var(--surface);
}
.notice.error {
  border-color: var(--red);
  color: var(--red);
}
.source-details {
  margin-top: 28px;
  font-size: 12px;
  color: var(--muted);
}
summary {
  cursor: pointer;
}
.source-row,
.member-row,
.session-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 15px 0;
  border-bottom: 1px solid var(--line);
}
.source-row span:last-child {
  max-width: 60%;
  text-align: right;
}
.invite-form {
  max-width: 650px;
  margin-bottom: 25px;
}
#invite-result {
  overflow-wrap: anywhere;
}
.news-grid + .secondary,
#more-inputs {
  margin-top: 22px;
}
footer {
  max-width: 1220px;
  margin: auto;
  padding: 22px 30px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  letter-spacing: 1px;
  color: var(--muted);
}
@media (max-width: 720px) {
  .masthead {
    padding: 14px 20px;
    gap: 12px;
  }
  .masthead-caption {
    display: none;
  }
  .brand {
    font-size: 16px;
    gap: 10px;
  }
  .release-seal {
    padding-inline: 4px;
    font-size: 8px;
  }
  main {
    padding: 24px 20px 45px;
  }
  .page-heading {
    display: block;
    margin: 0 0 16px;
  }
  .page-heading .primary {
    margin: 10px 0;
  }
  .news-grid,
  .form-grid {
    grid-template-columns: 1fr;
  }
  /* fix-white-screen-20261007: tighter margin/padding than the desktop
     24px/30px margin and 14px/0 button padding, recovering the narrow-screen
     first-screen budget Lane F's two new rows above this nav spent (see
     .market-nav-row below). */
  .tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 12px 0 14px;
  }
  .tabs button {
    min-width: 0;
    padding: 10px 4px;
    white-space: normal;
    line-height: 1.35;
    text-align: center;
  }
  .news-card {
    min-height: 0;
  }
  .panel,
  .input-card {
    padding: 20px;
  }
  .decision-card {
    margin-inline: -8px;
    padding: 18px;
  }
  .decision-heading {
    display: block;
  }
  .decision-fields {
    grid-template-columns: minmax(0, 1fr);
  }
  .status-strip {
    gap: 8px 16px;
  }
  #freshness {
    flex-basis: 100%;
    order: 3;
  }
  .source-row span:last-child {
    max-width: 100%;
    text-align: left;
  }
  footer {
    padding-inline: 20px;
    gap: 18px;
  }
  .auth-panel {
    margin-top: 45px;
  }
  .notice {
    margin: 10px 20px 0;
  }
}

.desk-note { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.7; background: var(--panel); padding: 1.2rem; border-radius: 10px; }
#note-provenance { overflow-wrap: anywhere; }
#note-dates { flex-wrap: wrap; }

/* ------------------------------------------------------------------------
   Three-commodity workspace (SX24-14/15). Class-only styling: the CSP
   forbids inline styles, so every visual state below is a class.
   ------------------------------------------------------------------------ */
.identity-link {
  margin-left: auto;
  font-size: 13px;
  color: var(--muted);
  text-decoration: none;
  max-width: 34vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.identity-link:hover {
  color: var(--text);
  text-decoration: underline;
}
.view {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  min-width: 0;
}
.view > .section-heading,
.view > .page-head,
.view > .banner,
.view > .subnav {
  margin-bottom: 0;
}
.loading {
  color: var(--muted);
}
.banner {
  margin: 0 0 16px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--orange);
  border-radius: 5px;
  background: var(--panel);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.withheld-banner {
  border-left-color: var(--accent);
}
.error-banner {
  border-left-color: var(--red);
  color: var(--red);
}
.withheld {
  color: var(--orange);
  font-size: 13px;
}
.snapshot-line {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 4px 0 0;
}
.tag-current {
  color: var(--green);
  border-color: #3d5e4c;
}
.subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 22px;
}
.subnav a,
.subnav button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 13px;
  color: var(--muted);
  background: none;
  text-decoration: none;
}
.subnav a.selected,
.subnav button.selected {
  color: var(--text);
  border-color: var(--orange);
}
.account-nav {
  margin-top: -12px;
}
.page-head {
  margin: 0 0 18px;
}
.page-head h2 {
  font: 400 28px/1.25 Georgia, "Times New Roman", serif;
  margin: 6px 0 8px;
}
.back-link,
.fine-link {
  font-size: 13px;
}
.back-button {
  padding-left: 0;
}
.market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}
.commodity-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 20px;
  background: var(--surface);
  overflow-wrap: anywhere;
}
.panel-head {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.panel-head h2,
.panel-title {
  font: 400 26px/1.2 Georgia, "Times New Roman", serif;
  color: var(--text);
  text-decoration: none;
  margin: 0;
}
.panel-title:hover {
  text-decoration: underline;
}
.panel-link {
  display: inline-block;
  margin-top: 14px;
  font-size: 13px;
}
.freshness {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.freshness .tag {
  margin-bottom: 2px;
}
.stale-note {
  color: var(--orange);
}
.block {
  padding: 14px 0 4px;
  border-top: 1px solid var(--grid);
  min-width: 0;
}
.panel-head + .block {
  border-top: 0;
}
.block-title {
  margin: 0 0 8px;
  font-size: 11px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}
.block p {
  margin: 0 0 8px;
}
.sub-label {
  margin: 12px 0 6px;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: var(--muted);
}
.bench-list {
  display: grid;
  gap: 12px;
}
.bench-row {
  padding: 12px;
  border: 1px solid var(--grid);
  border-radius: 6px;
  background: var(--panel);
  min-width: 0;
}
.bench-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 6px;
}
.bench-name {
  font-weight: 600;
  color: var(--text);
}
.price-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 14px;
}
.price {
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
.change {
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
.change-up {
  color: var(--green);
}
.change-down {
  color: var(--red);
}
.bench-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}
.chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 6px 0;
}
.chips-label {
  font-size: 11px;
  color: var(--muted);
  margin-right: 2px;
}
.chip {
  display: inline-block;
  max-width: 100%;
  padding: 2px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--accent);
  background: var(--raised);
  text-decoration: none;
  overflow-wrap: anywhere;
}
a.chip:hover {
  border-color: var(--accent);
}
.chip.pending {
  color: var(--orange);
}
.sparkline {
  display: block;
  width: 160px;
  max-width: 100%;
  height: 34px;
  margin-top: 8px;
}
.spark-line {
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.5;
}
.cited .statement {
  margin: 0 0 4px;
}
.outlook-list {
  display: grid;
  gap: 10px;
}
.outlook-cell {
  padding: 12px;
  border: 1px solid var(--grid);
  border-left: 3px solid var(--orange);
  border-radius: 6px;
  background: var(--panel);
  min-width: 0;
}
.outlook-cell.is-current {
  border-left-color: var(--green);
}
.more-benchmarks > summary {
  cursor: pointer;
  padding: 8px 0;
  color: var(--accent);
}
.group-horizon {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--grid);
}
.group-horizon .sub-label {
  margin: 0 0 2px;
}
.view-error details,
.brief-not-built details {
  margin-top: 10px;
}
.cell-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px 12px;
  margin: 0 0 6px;
}
.cell-head h5 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
}
.forecast-summary p {
  margin: 0 0 4px;
}
.forecast-median {
  font-size: 18px;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.forecast-bands {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 16px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.method-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.threshold {
  font-size: 13px;
  color: var(--muted);
}
.forecast-history {
  margin-top: 8px;
}
.forecast-history summary,
.diagnostics summary,
.chart-data summary {
  font-size: 13px;
  color: var(--muted);
}
.history-record {
  margin: 10px 0 0;
  padding: 10px 0 0 12px;
  border-left: 2px solid var(--line);
}
.history-record p {
  margin: 0 0 4px;
}
.plain-list {
  margin: 0;
  padding-left: 18px;
  font-size: 14px;
}
.plain-list li {
  margin: 4px 0;
}
.uncertainty {
  margin-bottom: 10px;
}
.watchpoint {
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  margin: 6px 0;
}
.kv {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  margin: 6px 0;
}
.kv-row {
  display: grid;
  grid-template-columns: minmax(7em, 34%) minmax(0, 1fr);
  gap: 12px;
  font-size: 13px;
}
.kv-row dt {
  color: var(--muted);
}
.kv-row dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.diagnostics {
  margin: 12px 0 0;
  padding: 8px 12px;
  border: 1px solid var(--grid);
  border-radius: 6px;
  background: #0d1418;
}
.diagnostics[open] summary {
  margin-bottom: 8px;
}
.diagnostics .kv-row dd {
  font: 11px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.section-content {
  display: grid;
  gap: 18px;
}
.section-content > .block,
.view > .block {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 18px;
  background: var(--surface);
}
.card-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
  gap: 14px;
}
.scorebook-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 16px;
  margin-bottom: 6px;
}
.scorebook-pressure {
  font-size: 30px;
  font-weight: 700;
  color: var(--text);
}
.scorebook-pressure.up {
  color: var(--green);
}
.scorebook-pressure.down {
  color: var(--red);
}
.scorebook-pressure.pending {
  color: var(--orange);
  font-size: 18px;
}
.scorebook-band {
  color: var(--muted);
  font-size: 13px;
}
.scorebook-blocks {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0;
}
.scorebook-reasons {
  color: var(--orange);
}
.scorebook-disclaimer {
  font-style: italic;
}
.scorebook-indicator-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  list-style: none;
}
.scorebook-indicator-summary::-webkit-details-marker {
  display: none;
}
.scorebook-indicator-title {
  font-weight: 600;
}
.scorebook-pos {
  color: var(--green);
  border-color: #3d5e4c;
}
.scorebook-neg {
  color: var(--red);
  border-color: #6e3d3a;
}
.watch-rule summary {
  font-size: 12px;
  color: var(--muted);
}
.card {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--grid);
  border-radius: 6px;
  background: var(--panel);
  overflow-wrap: anywhere;
}
.card p {
  margin: 0 0 6px;
}
.geo-tracks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 8px 0;
}
.geo-item {
  padding: 6px 0;
  border-top: 1px solid var(--grid);
}
.conditional-output {
  margin: 10px 0;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: var(--raised);
  border-radius: 4px;
}
.table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.data-table th,
.data-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--grid);
  text-align: left;
  vertical-align: top;
}
.data-table th {
  color: var(--muted);
  font-weight: 500;
}
.chart {
  margin: 0;
  min-width: 0;
}
.chart figcaption {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 6px;
}
.chart-svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
}
.chart-grid {
  stroke: var(--grid);
  stroke-width: 1;
}
.chart-axis {
  stroke: var(--line);
  stroke-width: 1;
}
.chart-tick {
  fill: var(--muted);
  font-size: 12px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.chart-tick-y {
  text-anchor: end;
}
.chart-tick-x {
  text-anchor: middle;
}
.chart-band {
  fill: var(--band);
  stroke: var(--band-line);
  stroke-width: 0.8;
}
.chart-range {
  stroke: var(--band-line);
  stroke-width: 6;
}
.chart-mid {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2;
}
.chart-dot {
  fill: var(--accent);
  stroke: var(--bg);
  stroke-width: 1;
}
.chart-dot-filled-in {
  fill: var(--bg);
  stroke: var(--accent);
  stroke-width: 1.5;
}
.chart-missing {
  stroke: var(--orange);
  stroke-width: 1;
  stroke-dasharray: 3 4;
}
.chart-segment {
  stroke: var(--muted);
  stroke-width: 1;
  stroke-dasharray: 6 4;
}
.chart-legend {
  margin: 6px 0 0;
}
.chart-data {
  margin-top: 10px;
}
.source-page {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}
.page-text {
  margin: 12px 0;
  padding: 16px;
  border-radius: 6px;
  background: var(--panel);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.7;
  max-height: 70vh;
  overflow-y: auto;
}
.cited-span {
  background: var(--mark);
  color: var(--text);
  padding: 1px 0;
  outline: 1px solid var(--orange);
}
.pager {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.secondary-link {
  display: inline-block;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 7px 14px;
  font-size: 13px;
  text-decoration: none;
  color: var(--text);
}
.brief-picker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}
.brief-picker select {
  width: auto;
  margin-top: 0;
}
.ask-form {
  max-width: 850px;
  margin-bottom: 22px;
}
.ask-job:empty {
  display: none;
}
.ask-card {
  max-width: 850px;
  margin-bottom: 26px;
  padding: 22px;
  border: 1px solid #496055;
  border-radius: 7px;
  background: #111b22;
  overflow-wrap: anywhere;
}
.ask-card h3 {
  margin-top: 4px;
}
.ask-status {
  font-size: 15px;
}
.ask-status.pending {
  color: var(--orange);
}
.answer-sentences {
  padding-left: 20px;
}
.answer-sentences li {
  margin: 0 0 12px;
}
.answer-text {
  display: block;
}
.ask-history-heading {
  margin-top: 8px;
}
.history-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  overflow-wrap: anywhere;
}
.history-question {
  color: var(--text);
}
.quote {
  margin: 8px 0 12px;
  padding: 8px 14px;
  border-left: 3px solid var(--accent);
  background: var(--raised);
}
.view-error p {
  margin: 0;
}
.glance {
  display: none;
}
.glance-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  align-items: center;
  width: 100%;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  text-align: left;
}
.glance-item strong {
  grid-column: 1;
  grid-row: 1;
  font: 400 18px/1.25 Georgia, "Times New Roman", serif;
}
.glance-item .tag {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  max-width: 132px;
  text-align: center;
}
.glance-price {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
  font-size: 13px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
@media (max-width: 1099px) {
  .glance {
    display: grid;
    gap: 6px;
    margin: 0 0 18px;
  }
  .market-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .market-grid,
  .card-list,
  .geo-tracks {
    grid-template-columns: minmax(0, 1fr);
  }
  .identity-link {
    max-width: 28vw;
  }
  .commodity-panel,
  .section-content > .block,
  .view > .block,
  .source-page,
  .ask-card {
    padding: 14px;
  }
  .kv-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
  .page-head h2 {
    font-size: 24px;
  }
  .page-heading .muted {
    display: none;
  }
  .page-heading h1 {
    margin-bottom: 4px;
  }
  .page-text {
    max-height: none;
  }
}
.brief-picker select {
  max-width: 100%;
  min-width: 0;
}

/* Lane F (2026-10-07 mission): persistent product menu, the compact daily
   note, and the Add market evidence composer. */
/* Its own rules, not .subnav: document.querySelector(".subnav a.selected")
   elsewhere must keep resolving to the commodity SECTION subnav only. */
.product-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 20px;
}
.product-menu a {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 16px;
  font-size: 14px;
  color: var(--muted);
  background: none;
  text-decoration: none;
}
.product-menu a.selected {
  color: var(--text);
  border-color: var(--orange);
}
.market-actions {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 20px;
}
/* market-nav-row wraps .product-menu + .market-actions (fix-white-screen-
   20261007): on wide screens this is a no-op (each child keeps its own
   margin, stacked exactly as before). On narrow screens the product menu
   wrapped to two rows and sat above its own full-margin market-actions row,
   pushing every commodity row -- and the narrow-screen glance strip -- below
   the first screen (measured 1001px against an 860px budget, identically in
   fixture and real data: a fixed layout cost, not data-driven, introduced
   when Lane F added these two rows ahead of the existing markets content).
   Below 720px: scroll the product menu on one row and put it on the same
   row as "Add market evidence" instead of stacking two full-margin rows. */
@media (max-width: 720px) {
  .market-nav-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 6px 10px;
    margin: 0 0 10px;
  }
  .product-menu {
    flex: 1 1 0%;
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0;
  }
  .product-menu::-webkit-scrollbar {
    display: none;
  }
  .product-menu a {
    flex: none;
    padding: 6px 13px;
  }
  .market-actions {
    flex: none;
    margin: 0;
  }
  .glance {
    gap: 4px;
    margin: 0 0 10px;
  }
  .glance-item {
    padding: 5px 10px;
  }
}
.daily-note {
  display: grid;
  gap: 10px;
  margin: 2px 0 6px;
}
.daily-note-row p {
  margin: 3px 0 6px;
}
.daily-note-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--muted);
}
.scorebook-formula {
  margin-top: 10px;
}
.scorebook-formula summary {
  font-size: 12px;
  color: var(--muted);
}
.evidence-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 18px;
}
.evidence-tabs button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 13px;
  color: var(--muted);
  background: none;
}
.evidence-tabs button.selected {
  color: var(--text);
  border-color: var(--orange);
}
@media (max-width: 720px) {
  .market-actions {
    justify-content: flex-start;
  }
}

/* --- Urea dossier: rating catalogue, watchpoints, demonstrations, events/
   scenarios/forecasts/decisions (2026-10-07 missions). Neutral intensity:
   the rating-level-N scale is a plain position marker (1 = lowest reading,
   6 = highest), never a red/green danger cue -- a high restoration or
   resilience level must read the same as a high interruption level. */
.subnav-group {
  display: contents;
}
.dossier-subnav {
  margin-top: -6px;
}
.rating-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rating-group > summary {
  font-weight: 600;
  cursor: pointer;
  padding: 6px 0;
}
.rating-group-list {
  margin-top: 8px;
}
.rating-card-summary {
  cursor: pointer;
  list-style: none;
}
.rating-card-summary::-webkit-details-marker {
  display: none;
}
.rating-compact-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.rating-compact-name {
  font-weight: 600;
}
.rating-compact-level {
  font-variant-numeric: tabular-nums;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--raised);
  border: 1px solid var(--line);
}
.rating-compact-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin: 4px 0;
}
.rating-card,
.rating-level-def {
  border-left: 3px solid var(--line);
}
.rating-level-1 { border-left-color: color-mix(in srgb, var(--accent) 20%, var(--line)); }
.rating-level-2 { border-left-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.rating-level-3 { border-left-color: color-mix(in srgb, var(--accent) 60%, var(--line)); }
.rating-level-4 { border-left-color: color-mix(in srgb, var(--accent) 75%, var(--line)); }
.rating-level-5 { border-left-color: color-mix(in srgb, var(--accent) 90%, var(--line)); }
.rating-level-6 { border-left-color: var(--accent); }
.rating-detail {
  margin-top: 12px;
}
.rating-levels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 10px;
  margin: 10px 0;
}
.rating-level-def {
  padding: 10px 12px;
  border-radius: 4px;
  background: var(--raised);
}
.rating-level-def.current {
  outline: 1px solid var(--orange);
}
.rating-level-def h6 {
  margin: 0 0 4px;
}
.rating-evidence-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 12px;
  margin: 8px 0;
}
.rating-history summary {
  font-size: 12px;
  color: var(--muted);
}
.demo-box {
  border: 1px dashed var(--line);
  border-radius: 6px;
  padding: 10px 12px;
}
.demo-card {
  border-style: dashed;
}
.episode-states {
  margin: 6px 0;
}
.scenario-episode {
  margin-bottom: 14px;
}

/* -- Event intelligence (H14): five visually distinct output chips, plus
   evidence/rating/physical/forecast/H04-shadow cards (2026-10-08 mission,
   section C item 9). Each output chip gets its own accent so the reader
   never mistakes one output type for another; none of them re-use the
   neutral rating-level-N scale, which is reserved for the six-level
   catalogue itself. */
.ei-output-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
  gap: 10px;
  margin: 8px 0;
}
.ei-output-chip {
  border-radius: 6px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--raised);
  border-top: 3px solid var(--line);
}
.ei-output-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 4px;
}
.ei-output-value {
  font-size: 13px;
}
.ei-out-rating { border-top-color: var(--accent); }
.ei-out-pressure { border-top-color: var(--orange); }
.ei-out-evidence { border-top-color: var(--green); }
.ei-out-probability { border-top-color: #9fb6d6; }
.ei-out-price { border-top-color: #c79fd6; }

.ei-evidence-card {
  border-radius: 6px;
  border: 1px solid var(--line);
  padding: 10px 12px;
  margin-bottom: 10px;
}
.ei-evidence-original { border-left: 3px solid var(--green); }
.ei-captured-card {
  border-radius: 6px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  padding: 10px 12px;
  margin-bottom: 10px;
}
.ei-trace { margin: 8px 0; padding-left: 20px; }
.ei-trace li { margin-bottom: 4px; overflow-wrap: anywhere; }
.ei-clocks { margin-top: 12px; }
.ei-clock-card {
  border-radius: 6px;
  border: 1px solid var(--line);
  padding: 8px 12px;
  margin-bottom: 8px;
}
.ei-clock-green { border-left: 3px solid var(--green); }
.ei-clock-amber { border-left: 3px solid var(--orange); }
.ei-clock-red { border-left: 3px solid var(--red, #c0392b); }
.ei-clock-unknown { border-left: 3px solid var(--muted); }
.ei-clock-warning { color: var(--orange); }
.ei-demo-divider {
  margin: 20px 0 8px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-size: 1rem;
}
.ei-evidence-correction { border-left: 3px solid var(--orange); }
.ei-evidence-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.ei-evidence-span {
  margin: 8px 0;
  padding: 6px 10px;
  border-left: 2px solid var(--line);
  color: var(--muted);
  font-style: italic;
}

.ei-rating-card {
  border-radius: 6px;
  border-left: 4px solid var(--line);
  padding: 10px 12px;
}
.ei-rating-refusal {
  border-left-style: dashed;
  border-left-color: var(--muted);
}
.ei-rating-headline {
  font-weight: 600;
  margin-bottom: 4px;
}

.ei-physical-card {
  border-radius: 6px;
  border: 1px solid var(--line);
  padding: 10px 12px;
}
.ei-lane-watch { border-left: 3px solid var(--muted); }
.ei-lane-scenario { border-left: 3px solid var(--orange); }
.ei-lane-supported { border-left: 3px solid var(--green); }

.ei-forecast-history {
  display: grid;
  gap: 8px;
}
.ei-forecast-version {
  border-radius: 6px;
  padding: 8px 12px;
  border: 1px solid var(--line);
}
.ei-forecast-superseded {
  opacity: 0.75;
  border-style: dashed;
}
.ei-forecast-current {
  border-color: var(--accent);
}
.ei-forecast-version-head {
  display: block;
  margin-bottom: 4px;
}

.ei-h04-card .banner {
  margin-top: 8px;
}
.ei-h04-methods {
  display: grid;
  gap: 6px;
}
.ei-h04-method {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 4px;
  background: var(--raised);
}
.ei-h04-method-name {
  font-weight: 600;
}
.ei-h04-issued { border-left: 3px solid var(--green); }
.ei-h04-refused { border-left: 3px solid var(--muted); }

/* Event-intelligence provenance (lane A, 2026-10-09): a demonstration fixture
   is visibly different from captured evidence — dashed edge and an explicit
   "Demonstration data — unverified fixture" tag; never the green "captured"
   accent. A synthetic test capture (scratch stores only; fix round 2) is
   styled the same way: it is a test, not evidence. */
.ei-fixture-banner,
.ei-synthetic-banner {
  border-left-color: var(--orange);
  border-left-style: dashed;
}
.ei-fixture-tag,
.ei-synthetic-tag {
  display: inline-block;
  margin: 6px 0 2px;
  border: 1px dashed var(--orange);
  color: var(--orange);
  white-space: normal;
  overflow-wrap: anywhere;
}
.ei-evidence-fixture,
.ei-evidence-synthetic {
  border-style: dashed;
  border-left-color: var(--orange);
}
.ei-capture {
  margin: 8px 0;
}

/* Access control (21 Oct 2026): My desk and Admin · People & permissions. */
.tabs button.admin-tab {
  margin-left: auto;
  color: var(--orange);
}
.mydesk-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 18px;
  margin-bottom: 24px;
}
.mydesk-card h3,
.mydesk-card h4 {
  margin: 0 0 8px;
}
.mydesk-card h4 {
  margin-top: 18px;
  color: var(--muted);
  font-weight: 500;
}
.mydesk-question-label {
  font-size: 18px;
  margin: 6px 0;
}
.mydesk-deadline strong {
  color: var(--orange);
}
.mydesk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0;
}
.mydesk-history-block {
  margin-bottom: 22px;
}
.perm-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: 18px;
  align-items: start;
}
.perm-filter {
  display: block;
  margin-bottom: 12px;
}
.perm-people tr.selected td {
  background: var(--raised);
}
.link-button {
  border: 0;
  background: none;
  color: var(--text);
  padding: 0;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.link-button:hover,
.link-button:focus-visible {
  color: var(--accent);
  text-decoration: underline;
}
.perm-editor {
  position: sticky;
  top: 12px;
}
.perm-editor-head {
  margin-bottom: 12px;
}
.perm-editor-head h3 {
  margin: 0;
}
.perm-group {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px 14px 6px;
  margin: 14px 0;
}
.perm-group legend {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 6px;
}
.perm-group-title {
  font-weight: 600;
}
.perm-count {
  font-size: 12px;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 8px;
}
.perm-group > .fine {
  margin: 0 0 6px;
}
.perm-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid var(--grid);
  cursor: pointer;
}
.perm-row input {
  margin-top: 4px;
}
.perm-row.locked {
  cursor: default;
}
.perm-row.locked .perm-text strong {
  color: var(--muted);
}
.perm-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.perm-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.perm-lock {
  font-size: 12px;
  color: var(--orange);
}
.perm-diff {
  border-left: 3px solid var(--orange);
  padding: 6px 12px;
  margin: 14px 0;
  background: var(--panel);
}
.perm-add {
  color: var(--green);
}
.perm-remove {
  color: var(--red);
}
.perm-actions {
  display: flex;
  gap: 10px;
}
.perm-result input {
  width: 100%;
  margin: 6px 0;
}
.perm-log {
  margin-top: 28px;
}
@media (max-width: 1099px) {
  .perm-layout,
  .mydesk-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .perm-editor {
    position: static;
  }
}
@media (max-width: 720px) {
  .tabs button.admin-tab {
    margin-left: 0;
  }
  .perm-people th:nth-child(4),
  .perm-people td:nth-child(4) {
    display: none;
  }
}

/* ---- urea/urea.css ---- */
/* ==========================================================================
   Urea desk (master plan, 21 Oct 2026). Appended after team.css by
   sextant/team/asset_bundle.py. Body ~16 px, metadata ~14 px; colour always
   paired with a text label or arrow; keyboard focus and 44 px touch targets;
   390 px phone layout. Tokens: dark is the site default; :root[data-theme=light]
   gives the light set. Series colours: the validated reference palette.
   ========================================================================== */
:root {
  --ud-s1: #3987e5;
  --ud-s2: #d95926;
  --ud-s3: #199e70;
  --ud-up: #8cbcf3;
  --ud-down: #f2a477;
  --ud-ok: #9fd6b5;
  --ud-warn: #f2c46d;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f7f5;
  --surface: #ffffff;
  --panel: #eef1ee;
  --raised: #ffffff;
  --line: #d3d9d5;
  --text: #15191c;
  --muted: #56626b;
  --accent: #1f6b57;
  --grid: #e3e7e3;
  --band: rgba(31, 107, 87, 0.16);
  --band-line: rgba(31, 107, 87, 0.5);
  --ud-s1: #2a78d6;
  --ud-s2: #eb6834;
  --ud-s3: #1baf7a;
  --ud-up: #1c5cab;
  --ud-down: #b4461b;
  --ud-ok: #1f6b57;
  --ud-warn: #8a5a00;
}

.ud {
  display: grid;
  gap: 16px;
  font-size: 16px;
}
.ud-top {
  display: grid;
  gap: 10px;
  margin-bottom: 4px;
}
.ud-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
}
.ud-crumb {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
}
.ud-crumb-market {
  color: var(--text);
}
.ud-context-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.ud-action,
.ud-seg-btn,
.ud-market-select,
.ud-search,
.ud-window input {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--raised);
  color: var(--text);
  padding: 0 14px;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.ud-market-select {
  max-width: 100%;
}
.ud-action-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--bg);
  font-weight: 650;
}
.ud-datastatus {
  font-size: 14px;
  color: var(--muted);
}
.ud-datastatus > summary {
  cursor: pointer;
  width: fit-content;
  min-height: 32px;
}
.ud-datastatus ul {
  margin: 6px 0 0;
  padding-left: 18px;
}

/* cards */
.ud-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 860px) {
  .ud-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
.ud-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px 12px;
  min-width: 0;
}
.ud-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 10px;
  margin-bottom: 10px;
}
.ud-card h3 {
  margin: 0;
  font-size: 17px;
}
.ud-card h4 {
  margin: 0 0 2px;
  font-size: 16px;
}
.ud-card p {
  margin: 4px 0;
}
.ud-meta,
.ud-muted {
  color: var(--muted);
  font-size: 14px;
}
.ud-meta {
  margin-top: 10px;
}
.ud-note {
  padding: 8px 12px;
  border-left: 3px solid var(--ud-warn);
  background: var(--panel);
  font-size: 14px;
}
.ud-problem p {
  margin: 0;
  color: var(--muted);
}
.ud-state {
  font-size: 13px;
  font-weight: 650;
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 2px 10px;
}
.ud-state-ok { color: var(--ud-ok); }
.ud-state-ok::before { content: "● "; }
.ud-state-wait { color: var(--muted); }
.ud-state-wait::before { content: "◌ "; }
.ud-state-warn { color: var(--ud-warn); }
.ud-state-warn::before { content: "⚠ "; }
.ud-details {
  margin-top: 8px;
  font-size: 14px;
}
.ud-details > summary {
  cursor: pointer;
  color: var(--accent);
  min-height: 32px;
}
.ud-details-body {
  color: var(--muted);
  border-left: 2px solid var(--line);
  padding-left: 12px;
  margin-top: 4px;
}
.ud-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
}
.ud-src {
  font-size: 14px;
}

/* latest assessment */
.ud-latest-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px 28px;
}
.ud-mid-block,
.ud-range-block {
  display: grid;
}
.ud-kicker {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.ud-big {
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.ud-range {
  font-size: 20px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.ud-assessed {
  font-weight: 650;
}
.ud-chg {
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.uc-up { color: var(--ud-up); }
.uc-down { color: var(--ud-down); }
.uc-flat { color: var(--muted); }
.ud-spark-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  margin-top: 8px;
}
.ud-spark {
  width: 260px;
  max-width: 100%;
  height: auto;
  overflow: visible;
}
.ud-spark-line { fill: none; stroke: var(--ud-s1); stroke-width: 2; stroke-linejoin: round; }
.ud-spark-dot { fill: var(--ud-s1); }
.ud-spark-last { fill: var(--ud-s1); stroke: var(--surface); stroke-width: 1.5; }

/* forecast */
.ud-np-target {
  font-weight: 700;
}
.ud-methods {
  display: grid;
  gap: 6px;
  margin: 8px 0;
}
.ud-method {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(120px, 220px) auto;
  gap: 2px 12px;
  align-items: center;
}
.ud-method-name { font-weight: 600; font-size: 15px; }
.ud-method-val { font-variant-numeric: tabular-nums; font-size: 14px; white-space: nowrap; }
.ud-method-tag { grid-column: 1 / -1; font-size: 12px; }
.ud-glyph { width: 100%; height: 22px; }
.ud-glyph-track { stroke: var(--grid); stroke-width: 2; }
.ud-glyph-bar { stroke: var(--ud-s1); stroke-width: 4; stroke-linecap: round; opacity: 0.7; }
.ud-glyph-cap { stroke: var(--ud-s1); stroke-width: 2; }
.ud-glyph-dot { fill: var(--text); stroke: var(--surface); stroke-width: 1.5; }
@media (max-width: 520px) {
  .ud-method { grid-template-columns: minmax(0, 1fr) auto; }
  .ud-glyph { grid-column: 1 / -1; }
}

/* next + developments */
.ud-next { display: grid; gap: 10px; }
.ud-next-item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: baseline;
}
.ud-next-date { font-weight: 650; font-variant-numeric: tabular-nums; }
.ud-devs { display: grid; gap: 14px; }
.ud-dev { border-left: 3px solid var(--line); padding-left: 12px; }
.ud-dir { font-size: 13px; font-weight: 650; }
@media (max-width: 520px) {
  .ud-next-item { grid-template-columns: minmax(0, 1fr) auto; }
  .ud-next-main { grid-column: 1 / -1; order: 2; }
}

/* prices */
.ud-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 16px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--ud-s1);
  border-radius: 12px;
  background: var(--surface);
}
.ud-strip-name { font-weight: 700; }
.ud-strip-val { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ud-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin-bottom: 10px;
}
.ud-seg,
.ud-window {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.ud-seg-btn.selected {
  border-color: var(--accent);
  font-weight: 700;
  box-shadow: inset 0 -3px 0 var(--accent);
}
.ud-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  font-size: 14px;
  margin-bottom: 6px;
}
.ud-legend-item::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 3px;
  margin-right: 6px;
  vertical-align: middle;
  border-radius: 2px;
}
.ud-cmp-key-1::before { background: var(--ud-s1); }
.ud-cmp-key-2::before { background: var(--ud-s2); height: 3px; border-top: 1px dashed var(--ud-s2); }
.ud-cmp-key-3::before { background: var(--ud-s3); }
.ud-compare { width: 100%; height: auto; }
.ud-cmp-line { fill: none; stroke-width: 2; stroke-linejoin: round; }
.ud-cmp-line.ud-cmp-1 { stroke: var(--ud-s1); }
.ud-cmp-line.ud-cmp-2 { stroke: var(--ud-s2); stroke-dasharray: 6 3; }
.ud-cmp-line.ud-cmp-3 { stroke: var(--ud-s3); stroke-dasharray: 2 3; }
.ud-cmp-dot { stroke: var(--surface); stroke-width: 1; }
.ud-cmp-dot.ud-cmp-1 { fill: var(--ud-s1); }
.ud-cmp-dot.ud-cmp-2 { fill: var(--ud-s2); }
.ud-cmp-dot.ud-cmp-3 { fill: var(--ud-s3); }
.ud-table-wrap { overflow-x: auto; }
.ud-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ud-table th,
.ud-table td {
  text-align: left;
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.ud-table th { color: var(--muted); font-weight: 600; font-size: 13px; }
.ud-num { font-variant-numeric: tabular-nums; }
.ud-target-row td { font-weight: 650; }
.ud-target-row td:first-child { box-shadow: inset 3px 0 0 var(--ud-s1); }
.ud-search { width: min(100%, 360px); margin: 6px 0 8px; }
.ud-wide { min-width: 0; }
.ud .chart-svg { max-width: 100%; height: auto; }
.ud-top select,
.ud select,
.ud input {
  width: auto;
  margin: 0;
}
.ud-top .ud-market-select,
.ud .ud-market-select {
  max-width: min(100%, 360px);
}
.ud .ud-search {
  width: min(100%, 360px);
}

/* desk chrome (body.ud-desk while a urea desk destination is open) */
body.ud-desk #workspace > .page-heading,
body.ud-desk #workspace > .status-strip,
body.ud-desk #workspace > nav.tabs,
body.ud-desk #account-nav,
body.ud-desk #markets-tab .market-actions {
  display: none;
}
body.ud-desk #markets-tab .market-nav-row {
  margin-bottom: 4px;
}
.ud-navrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}
.ud-nav a {
  font-size: 16px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.ud-menu {
  position: relative;
}
.ud-menu > summary {
  list-style: none;
  cursor: pointer;
}
.ud-menu > summary::-webkit-details-marker {
  display: none;
}
.ud-more > summary::after {
  content: " ▾";
}
.ud-menu-list {
  position: absolute;
  right: 0;
  z-index: 20;
  min-width: 250px;
  margin-top: 6px;
  padding: 6px;
  display: grid;
  gap: 2px;
  background: var(--raised);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}
.ud-more .ud-menu-list {
  left: 0;
  right: auto;
}
.ud-menu-item {
  display: grid;
  text-align: left;
  min-height: 44px;
  align-content: center;
  padding: 4px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  text-decoration: none;
  font-size: 15px;
}
.ud-menu-item:hover,
.ud-menu-item:focus-visible {
  background: var(--panel);
}
.ud-menu-label {
  font-weight: 650;
}
.ud-menu-group {
  margin: 6px 10px 2px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}
@media (max-width: 520px) {
  .ud-menu-list {
    position: fixed;
    left: 12px;
    right: 12px;
    min-width: 0;
  }
  .ud-more .ud-menu-list {
    left: 12px;
    right: 12px;
  }
}

/* ---- deals/deals.css ---- */
/* ==========================================================================
   Deals — the urea deal tracker (owner request 22 Oct 2026). Appended after
   team.css (and urea.css) by sextant/team/asset_bundle.py. Snapshot first;
   44 px touch targets; colour always paired with text (✓, ⚠, words); the
   390 px phone layout stacks everything with no horizontal scroll.
   ========================================================================== */
#deals-tab {
  font-size: 16px;
}
.dl-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 14px;
}
.dl-head h2 {
  margin: 0;
  font-size: 24px;
}
.dl-crumb {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent);
}
.dl-add,
.dl-tap,
.dl-filter,
.dl-seg-btn,
.dl-save,
.dl-add-leg {
  min-height: 44px;
}
a.primary.dl-add {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.dl-num {
  font-variant-numeric: tabular-nums;
}
.dl-totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 14px;
}
.dl-tile {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}
.dl-tile-label {
  font-size: 13px;
  color: var(--muted);
}
.dl-tile-value {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.dl-tile-sub {
  font-size: 13px;
  color: var(--muted);
}
.dl-tile-warn {
  border-color: var(--orange);
}
.dl-tile-warn .dl-tile-value {
  color: var(--orange);
}
.dl-filters {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  margin-bottom: 12px;
}
.dl-filter,
.dl-seg-btn {
  flex: none;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--raised);
  color: var(--text);
  white-space: nowrap;
}
.dl-filter.selected,
.dl-seg-btn.selected {
  border-color: var(--accent);
  background: var(--band);
  font-weight: 600;
}
.dl-list {
  display: grid;
  gap: 8px;
}
.dl-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(0, 1.4fr) minmax(0, 2fr);
  align-items: center;
  gap: 6px 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  text-decoration: none;
  min-height: 44px;
}
.dl-row:hover {
  border-color: var(--accent);
}
.dl-row-name,
.dl-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  min-width: 0;
}
.dl-name {
  font-weight: 700;
  overflow-wrap: anywhere;
}
.dl-code {
  font-size: 13px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.dl-row-chips,
.dl-row-facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  min-width: 0;
}
.dl-row-facts {
  font-size: 14px;
  color: var(--muted);
}
.dl-open,
.dl-margin {
  color: var(--text);
}
.dl-chip {
  display: inline-block;
  padding: 2px 9px;
  border: 1px solid var(--line);
  border-radius: 12px;
  font-size: 13px;
  white-space: nowrap;
}
.dl-chip-stage {
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 600;
}
.dl-on {
  color: var(--green);
}
.dl-off {
  color: var(--muted);
}
.dl-sold-full {
  color: var(--green);
  border-color: var(--green);
}
.dl-sold-partial {
  color: var(--orange);
}
.dl-sold-none {
  color: var(--muted);
}
.dl-warn {
  color: #1d1208;
  background: var(--orange);
  border-color: var(--orange);
  font-weight: 600;
}
.dl-caution {
  color: var(--orange);
  border-color: var(--orange);
}
.dl-empty h3 {
  margin-top: 0;
}
.dl-foot {
  margin-top: 12px;
}
.dl-title h2 {
  margin: 0;
  font-size: 24px;
}
.dl-route {
  margin: 4px 0 14px;
  color: var(--muted);
}
.dl-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.dl-panel {
  min-width: 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.dl-panel h3 {
  margin: 0 0 10px;
  font-size: 17px;
}
.dl-problem {
  color: var(--orange);
}
.dl-sum {
  margin: 0 0 10px;
  font-weight: 600;
}
.dl-label {
  font-size: 13px;
  color: var(--orange);
  margin: 8px 0;
}
.dl-taps-wrap {
  margin-bottom: 10px;
}
.dl-taps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dl-taps select {
  width: auto;
  margin: 0;
  min-height: 44px;
}
.dl-tap {
  padding: 8px 14px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--raised);
  color: var(--text);
}
.dl-timeline,
.dl-history,
.dl-docs,
.dl-notes {
  margin: 0;
  padding-left: 18px;
}
.dl-timeline li,
.dl-docs li,
.dl-notes li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 10px;
  margin-bottom: 6px;
}
.dl-notes li p {
  flex-basis: 100%;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dl-history li {
  font-size: 14px;
  margin-bottom: 4px;
  overflow-wrap: anywhere;
}
.dl-tl-stage {
  font-weight: 600;
}
.dl-gone {
  opacity: 0.55;
  text-decoration: line-through;
}
.dl-mini {
  min-height: 32px;
  padding: 4px 6px;
  font-size: 13px;
}
.dl-legs {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}
.dl-leg {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.dl-leg-main,
.dl-leg-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  align-items: baseline;
  grid-column: 1;
}
.dl-leg .dl-mini {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
}
.dl-leg-facts {
  font-size: 14px;
}
.dl-leg-invoiced,
.dl-leg-contracted,
.dl-leg-agreed {
  color: var(--green);
}
.dl-leg-offered {
  color: var(--orange);
}
.dl-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 8px;
}
.dl-table td {
  padding: 5px 0;
  border-bottom: 1px solid var(--grid);
}
.dl-table td.dl-num {
  text-align: right;
}
.dl-total td {
  font-weight: 700;
  border-bottom: 0;
}
.dl-kv {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px 14px;
  margin: 0 0 10px;
}
.dl-kv dt {
  color: var(--muted);
  font-size: 14px;
}
.dl-kv dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.dl-details {
  margin-top: 8px;
}
.dl-details summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--accent);
}
.dl-quick {
  max-width: 560px;
}
.dl-quick h3 {
  margin-top: 0;
}
.dl-field {
  margin-bottom: 12px;
}
.dl-field-label {
  display: block;
  font-size: 13px;
  color: var(--muted);
}
.dl-field input,
.dl-field select,
.dl-inline textarea {
  min-height: 44px;
  font-size: 16px;
}
.dl-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 12px;
}
.dl-seg {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 7px 0 12px;
}
.dl-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.dl-actions a.secondary {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
}
.dl-inline,
.dl-edit {
  margin-top: 10px;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
}
.dl-status {
  min-height: 1.2em;
}
.linklike {
  background: none;
  border: 0;
  padding: 0;
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 4px;
  min-height: 32px;
  overflow-wrap: anywhere;
  text-align: left;
}
.dl-back {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
@media (max-width: 860px) {
  .dl-totals {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dl-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .dl-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 520px) {
  .dl-tile-value {
    font-size: 20px;
  }
  .dl-head h2,
  .dl-title h2 {
    font-size: 21px;
  }
  .dl-pair {
    grid-template-columns: minmax(0, 1fr);
  }
  .dl-panel {
    padding: 14px;
  }
}
.dl-err {
  display: block;
  color: var(--orange);
  font-size: 13px;
}
.dl-err:empty {
  display: none;
}
.dl-clear {
  margin-top: 4px;
}
.dl-caution-text {
  color: var(--orange);
}

/* ---- dash simplify (23 Oct 2026): one totals line, compact rows, collapsed deal sections ---- */
.dl-totals-line {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 22px;
  align-items: baseline;
  margin: 0 0 12px;
}
.dl-total {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.dl-total-value {
  font-size: 20px;
  font-weight: 700;
}
.dl-total-warn .dl-total-value {
  color: var(--orange);
}
.dl-row {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px 14px;
}
.dl-row .dl-row-name {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}
.dl-row .dl-route {
  margin: 0;
  font-size: 13px;
}
.dl-row .dl-row-chips {
  justify-content: flex-end;
}
.dl-chip.dl-margin {
  color: var(--text);
}
details.dl-panel > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
details.dl-panel > summary::-webkit-details-marker {
  display: none;
}
details.dl-panel > summary::after {
  content: "+";
  color: var(--muted);
  font-size: 18px;
}
details.dl-panel[open] > summary::after {
  content: "−";
}
details.dl-panel > summary h3 {
  margin: 0;
}
details.dl-panel[open] > summary {
  margin-bottom: 10px;
}
.dl-grid {
  align-items: start;
}
@media (max-width: 860px) {
  .dl-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .dl-row .dl-row-chips {
    justify-content: flex-start;
  }
}

/* ---- checks/checks.css ---- */
/* Number checks (static/checks/checks.js): large, plain, one line at a time. The site's dark palette (team.css). */
.ck { max-width: 920px; margin: 0 auto; color: var(--text); }
.ck .panel { margin-bottom: 14px; }
.ck-head h2 { margin: 0 0 4px; }
.ck-marking { border: 1px solid var(--orange); background: rgba(232, 167, 117, 0.12); color: var(--text);
  border-radius: 8px; padding: 8px 12px; margin: 0 0 14px; font-size: 0.92rem; }
.ck-marking strong { color: var(--orange); }
.ck-packline { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0; }
.ck-chip { display: inline-block; border: 1px solid var(--line); border-radius: 999px; padding: 2px 10px;
  font-size: 0.85rem; background: var(--raised); color: var(--text); }
.ck-fp { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.03em; }
.ck-aud-group { border-color: #6ea8fe; color: #cfe2ff; }
.ck-aud-internal { border-color: #b197fc; color: #e5dbff; }
.ck-rehearsal { border-color: var(--red); color: var(--red); font-weight: 600; }
.ck-pack { border-top: 1px solid var(--line); padding: 12px 0; }
.ck-pack:first-of-type { border-top: 0; }
.ck-old { opacity: 0.7; }
.ck-status { margin: 6px 0; font-weight: 600; }
.ck-recheck { color: var(--orange); border: 1px solid var(--orange); border-radius: 6px; padding: 4px 8px;
  display: inline-block; margin: 4px 0; }
.ck-guide summary { font-weight: 700; font-size: 1.05rem; cursor: pointer; }
.ck-guide li { margin: 6px 0; line-height: 1.45; }
.ck-guide p { line-height: 1.5; }
.ck-train { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.ck-train th, .ck-train td { border-top: 1px solid var(--line); padding: 6px; text-align: left; vertical-align: top; }
.ck-progress { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 6px 0 10px; font-weight: 600; }
.ck-progress progress { flex: 1 1 200px; height: 14px; accent-color: var(--green); }
.ck-picker { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 12px; }
.ck-dot { min-width: 34px; padding: 4px 6px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface);
  color: var(--text); font-size: 0.8rem; cursor: pointer; }
.ck-dot.must { border-width: 2px; border-color: var(--accent); }
.ck-dot.on { outline: 3px solid var(--orange); }
.ck-dot.done { background: rgba(159, 214, 181, 0.25); }
.ck-dot.done.ck-ans-MISMATCH, .ck-dot.done.ck-ans-SOURCE-MISSING { background: rgba(255, 180, 167, 0.3); }
.ck-dot.done.ck-ans-UNSURE { background: rgba(240, 210, 120, 0.3); }
.ck-dot.done.ck-ans-NOT-CHECKED { background: var(--grid); }
.ck-dot.held { color: var(--muted); border-style: dashed; }
.ck-dot.again { box-shadow: inset 0 -3px 0 var(--orange); }
.ck-line h3 { font-family: inherit; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--accent); margin: 18px 0 6px; }
.ck-where { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ck-no { font-weight: 700; font-size: 1.15rem; }
.ck-must { background: var(--orange); color: #1b1208; border-radius: 4px; padding: 1px 8px; font-size: 0.8rem; font-weight: 800; }
.ck-block { color: var(--muted); }
.ck-said { font-size: 1.3rem; font-weight: 600; margin: 0; line-height: 1.4; }
.ck-source { margin: 0; padding: 10px 14px; border-left: 4px solid var(--accent); background: var(--raised);
  color: var(--text); font-size: 1.12rem; line-height: 1.45; white-space: pre-wrap; }
.ck-srcline { color: var(--muted); font-size: 0.88rem; margin: 6px 0 0; }
.ck-facts { display: grid; grid-template-columns: minmax(150px, 230px) 1fr; gap: 6px 12px; margin: 0; }
.ck-facts dt { color: var(--muted); }
.ck-facts dd { margin: 0; font-weight: 600; }
.ck-answers { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin: 6px 0 10px; }
.ck-answers.small { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.ck-answer { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; padding: 12px;
  border-radius: 10px; border: 2px solid var(--line); background: var(--surface); color: var(--text); font-weight: 800;
  font-size: 1rem; cursor: pointer; min-height: 64px; }
.ck-answer small { font-weight: 400; font-size: 0.8rem; color: var(--muted); line-height: 1.3; }
.ck-answer:hover { border-color: var(--accent); }
.ck-answer.picked { border-color: var(--accent); background: var(--band); outline: 2px solid var(--accent); }
.ck-answer.ck-ans-MATCH.picked { border-color: var(--green); background: rgba(159, 214, 181, 0.22); outline-color: var(--green); }
.ck-answer.ck-ans-MISMATCH.picked, .ck-answer.ck-ans-SOURCE-MISSING.picked { border-color: var(--red);
  background: rgba(255, 180, 167, 0.18); outline-color: var(--red); }
.ck-answer.ck-ans-UNSURE.picked { border-color: #f0d278; background: rgba(240, 210, 120, 0.18); outline-color: #f0d278; }
.ck-notelabel { display: block; font-weight: 600; margin-top: 4px; }
.ck textarea, .ck select, .ck input[type="text"] { width: 100%; box-sizing: border-box; font-size: 1rem; padding: 8px;
  border-radius: 8px; border: 1px solid var(--line); background: var(--panel); color: var(--text); margin: 4px 0 8px; }
.ck-save { font-size: 1.05rem; padding: 10px 18px; }
.ck-saved { color: var(--muted); margin: 6px 0; }
.ck-nav { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; }
.ck-outcome { border-left: 4px solid #6ea8fe; background: rgba(110, 168, 254, 0.12); padding: 8px 12px; margin: 12px 0;
  border-radius: 4px; }
.ck-checker { border-left: 4px solid #f0d278; background: rgba(240, 210, 120, 0.1); padding: 8px 12px; margin: 10px 0;
  border-radius: 4px; }
.ck-held-note { border: 1px dashed var(--muted); padding: 8px 12px; border-radius: 8px; margin: 8px 0; color: var(--text); }
.ck-warn { border: 1px solid var(--red); background: rgba(255, 180, 167, 0.12); padding: 8px 12px; border-radius: 8px; margin: 8px 0; }
.ck-ok { color: var(--green); font-weight: 700; }
.ck-err { color: var(--red); font-weight: 700; }
.ck-esc.decided { opacity: 0.9; }
.ck-esc h4 { margin: 12px 0 4px; color: var(--accent); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.ck-esc-done summary { font-weight: 700; cursor: pointer; margin: 10px 0; }
@media (max-width: 600px) {
  .ck-facts { grid-template-columns: 1fr; gap: 2px; }
  .ck-facts dd { margin-bottom: 6px; }
  .ck-said { font-size: 1.12rem; }
  .ck-answers { grid-template-columns: 1fr 1fr; }
  .ck-answer { min-height: 56px; padding: 10px; }
}

/* W46 order s5: the documents behind a line */
.ck-source mark { background: #ffe066; color: #111; padding: 0 1px; border-radius: 2px; }
.ck-sources { margin: .5rem 0 1rem; }
.ck-sources h4 { margin: .25rem 0; }
.ck-srcitem { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; padding: .35rem 0; border-top: 1px solid var(--line, #ddd); }
.ck-srcname { flex: 1 1 12rem; min-width: 0; overflow-wrap: anywhere; }
.ck-outlink { font-size: .9em; }
.ck-viewer { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; display: flex; align-items: stretch; justify-content: center; }
.ck-viewer-box { background: var(--bg, #fff); width: min(100%, 980px); display: flex; flex-direction: column; }
.ck-viewer-head { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding: .5rem; border-bottom: 1px solid var(--line, #ddd); }
.ck-viewer-head strong { flex: 1 1 100%; }
.ck-viewer-body { overflow: auto; flex: 1; padding: .5rem; }
.ck-page { width: 100%; height: auto; display: block; user-select: none; -webkit-user-drag: none; }
.ck-copy { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9em; }

/* ---- shell/shell.css ---- */
/* ===========================================================================
   Shell (dash simplify, 23 Oct 2026): five places, one card style, one spacing
   scale (4 / 8 / 12 / 16 / 24 px), numbers large and labels small. Colours are
   the existing theme tokens (team.css, urea.css), so dark and light both work.
   =========================================================================== */
body.sx-shell .masthead {
  min-height: 52px;
  padding: 8px 24px;
}
body.sx-shell main {
  min-height: calc(100vh - 120px);
  padding: 12px 24px 24px;
}
body.sx-shell footer {
  padding: 10px 24px;
}
/* the old workspace chrome gives way to the bar (kept in the page, never deleted) */
body.sx-shell #workspace > .page-heading,
body.sx-shell #workspace > .status-strip,
body.sx-shell #workspace > nav.tabs,
body.sx-shell .ud-navrow,
body.sx-shell .ud-context-actions > .ud-action,
body.sx-shell .ud-context-actions > .ud-add,
body.sx-shell .ud-datastatus,
body.sx-shell.ud-desk #markets-tab .market-nav-row {
  display: none;
}
body.sx-shell .ud-top {
  margin-bottom: 8px;
}

/* ---- the bar ------------------------------------------------------------- */
.sx-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin: 0 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.sx-nav {
  display: flex;
  gap: 4px;
  min-width: 0;
}
.sx-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 6px 14px;
  border-radius: 20px;
  color: var(--muted);
  text-decoration: none;
  font-size: 15px;
  font-weight: 550;
  white-space: nowrap;
}
.sx-tab:hover {
  color: var(--text);
}
.sx-tab.selected {
  color: var(--text);
  background: var(--raised);
  box-shadow: inset 0 0 0 1px var(--line);
}
.sx-badge {
  min-width: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: var(--orange);
  color: #10171d;
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
}
.sx-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.sx-btn {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 4px 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  color: var(--text);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.sx-btn::-webkit-details-marker {
  display: none;
}
.sx-btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #10171d;
}
.sx-menu {
  position: relative;
}
.sx-menu-list {
  position: absolute;
  right: 0;
  z-index: 20;
  display: grid;
  min-width: 180px;
  margin-top: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--raised);
}
.sx-menu-item {
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.sx-menu-item:hover,
.sx-menu-item:focus-visible {
  background: var(--panel);
}

/* ---- cards, lists, type ---------------------------------------------------- */
.sx-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  margin: 0 0 12px;
}
.sx-head h2 {
  font-size: 22px;
  font-weight: 650;
}
.sx-asof {
  color: var(--muted);
  font-size: 14px;
}
.sx-card {
  min-width: 0;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.sx-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 8px;
}
.sx-card-head h3 {
  margin: 0;
  font-family: inherit;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.sx-link {
  font-size: 13px;
  white-space: nowrap;
}
.sx-muted {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.sx-calm {
  margin: 4px 0;
  font-size: 17px;
  font-weight: 600;
  color: var(--green);
}
.sx-warn {
  color: var(--orange);
}
.sx-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.sx-list li + li {
  border-top: 1px solid var(--line);
}
.sx-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 14px;
  align-items: center;
  gap: 2px 12px;
  min-height: 40px;
  padding: 6px 0;
  color: var(--text);
  text-decoration: none;
}
.sx-row:hover .sx-row-main {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sx-row-main {
  font-weight: 600;
  overflow-wrap: anywhere;
}
.sx-row-meta,
.sx-row-date {
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}
.sx-row-date {
  font-variant-numeric: tabular-nums;
}
.sx-area-next .sx-row {
  grid-template-columns: 96px minmax(0, 1fr) 14px;
}
.sx-row-go {
  color: var(--muted);
}
.sx-tone-act {
  box-shadow: inset 3px 0 0 var(--accent);
  padding-left: 10px;
}
.sx-tone-warn {
  box-shadow: inset 3px 0 0 var(--orange);
  padding-left: 10px;
}
.sx-kind {
  display: inline-block;
  margin-right: 8px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 12px;
  font-weight: 650;
  color: var(--text);
}

/* ---- Today ------------------------------------------------------------------- */
.sx-today-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
  gap: 12px;
  align-items: start;
}
.sx-today-grid > .sx-head {
  grid-column: 1 / -1;
  margin: 0;
}
.sx-today-grid.sx-no-prices {
  grid-template-columns: minmax(0, 720px);
}
.sx-col {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.sx-tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.sx-tile {
  display: grid;
  gap: 0;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
}
a.sx-tile:hover {
  border-color: var(--accent);
}
.sx-tile-off {
  opacity: 0.7;
}
.sx-tile-label {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.sx-tile-value {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.sx-tile-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 0 6px;
  font-size: 12px;
}
.sx-chart-link {
  display: block;
}
.sx-chart {
  display: block;
  width: 100%;
  height: auto;
  max-height: 200px;
}
.sx-line {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2.5;
  stroke-linejoin: round;
}
.sx-dot {
  fill: var(--accent);
}
.sx-axis {
  fill: var(--muted);
  font-size: 12px;
}
.sx-axis-y {
  text-anchor: end;
}
.sx-axis-end {
  text-anchor: end;
}
.sx-last {
  fill: var(--text);
  font-size: 14px;
  font-weight: 700;
}

/* ---- More ------------------------------------------------------------------------ */
.sx-more-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}
.sx-more-grid > .sx-head {
  grid-column: 1 / -1;
  margin: 0;
}

/* ---- Inbox ------------------------------------------------------------------------ */
#inbox-tab > section {
  margin-bottom: 12px;
}
#inbox-tab .wa-question {
  margin: 4px 0;
  font-weight: 600;
}
#inbox-tab .wa-details,
#inbox-tab .wa-done {
  margin: 8px 0;
  color: var(--muted);
  font-size: 14px;
}

/* ---- Prices (the urea desk's Prices in the shell) ------------------------------------ */
body.sx-shell .ud-table-compact td,
body.sx-shell .ud-table-compact th {
  padding: 6px 8px;
}
.ud-row-pick {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

/* ---- phone ----------------------------------------------------------------------------- */
@media (max-width: 860px) {
  .sx-today-grid,
  .sx-more-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .sx-col {
    display: contents;
  }
  .sx-today-grid > .sx-head { order: 0; }
  .sx-area-donow { order: 1; }
  .sx-area-prices { order: 2; }
  .sx-area-chart { order: 3; }
  .sx-area-changed { order: 4; }
  .sx-area-next { order: 5; }
}
@media (max-width: 600px) {
  body.sx-shell .masthead {
    padding: 6px 16px;
    gap: 12px;
  }
  body.sx-shell .masthead-caption {
    display: none;
  }
  body.sx-shell main {
    padding: 8px 16px 16px;
  }
  .sx-bar {
    margin: 0 -16px 12px;
    padding: 6px 16px;
    background: var(--bg);
  }
  .sx-nav {
    width: 100%;
  }
  .sx-tab {
    flex: 1 1 0;
    justify-content: center;
    padding: 6px 4px;
    font-size: 14px;
  }
  /* phone: Ask and + Add dock in the masthead row (left of Sign out; the name link gives way, the
     account is under More); nothing floats over the content */
  body.sx-shell #identity {
    display: none;
  }
  .sx-actions {
    position: absolute;
    top: 9px;
    right: 96px;
    z-index: 20;
  }
  .sx-actions .sx-btn {
    min-height: 34px;
    padding: 4px 12px;
  }
  .sx-tiles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  .sx-tile-value {
    font-size: 20px;
  }
  .sx-chart {
    max-height: 150px;
  }
  .sx-area-next .sx-row {
    grid-template-columns: 76px minmax(0, 1fr) 14px;
  }
}

/* one heading style for every card in the shell (labels small, numbers large) */
body.sx-shell .ud-card-head h3,
body.sx-shell #inbox-tab .section-heading h3 {
  margin: 0;
  font-family: inherit;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
body.sx-shell #inbox-tab .panel {
  padding: 12px 16px;
}
body.sx-shell #inbox-tab .section-heading {
  margin: 0 0 8px;
}
body.sx-shell #inbox-tab .input-card,
body.sx-shell #inbox-tab .card {
  margin: 8px 0;
  padding: 12px 14px;
}
body.sx-shell #inbox-tab .check-row {
  font-size: 13px;
}

body.sx-shell #inbox-tab .check-row {
  display: block;
  margin: 0 0 8px;
}
body.sx-shell .dl-panel h3 {
  font-family: inherit;
  font-size: 15px;
  font-weight: 650;
}
/* the permission table scrolls inside its card on a phone (it overflowed the page by ~90 px before) */
body.sx-shell .perm-list {
  min-width: 0;
  overflow-x: auto;
}
@media (max-width: 600px) {
  body.sx-shell .ud-table-compact {
    font-size: 13px;
  }
  body.sx-shell .ud-table-compact td,
  body.sx-shell .ud-table-compact th {
    padding: 6px 4px;
  }
}
body.sx-shell #people-log {
  max-width: 100%;
  overflow-x: auto;
}
/* the Next date column takes what its widest date needs ("Mon 10:00 PKT" or "29 Oct") */
.sx-area-next .sx-row {
  grid-template-columns: max-content minmax(0, 1fr) 14px;
}
@media (max-width: 600px) {
  /* phone: compact tiles, list rows with the meta under the text */
  .sx-tile {
    padding: 6px 8px;
  }
  .sx-tile-label,
  .sx-tile-foot {
    font-size: 11px;
  }
  .sx-tile-value {
    font-size: 18px;
    line-height: 1.15;
  }
  .sx-tile-foot {
    gap: 0 4px;
  }
  .sx-row {
    min-height: 36px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .sx-row:not(.sx-row-dated) {
    grid-template-columns: minmax(0, 1fr) 14px;
  }
  .sx-row:not(.sx-row-dated) .sx-row-meta {
    grid-column: 1;
    grid-row: 2;
    white-space: normal;
  }
  .sx-row:not(.sx-row-dated) .sx-row-go {
    grid-column: 2;
    grid-row: 1 / span 2;
  }
  .sx-card {
    padding: 10px 12px;
  }
  .sx-card-head {
    margin-bottom: 4px;
  }
}
@media (max-width: 600px) {
  body.sx-shell #signout {
    margin-left: auto;
  }
  .sx-today-grid,
  .sx-col {
    gap: 8px;
  }
  .sx-today-grid .sx-card {
    padding: 8px 12px;
  }
  .sx-today-grid > .sx-head {
    margin: 0;
  }
  .sx-chart {
    max-height: 112px;
  }
  .sx-today-grid .sx-muted {
    margin-top: 2px;
  }
  .sx-today-grid .sx-row {
    min-height: 32px;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 1.35;
  }
}

/* review round (23 Oct): units on every tile, failed checks, Inbox tidy */
.sx-tile-price {
  display: flex;
  align-items: baseline;
  gap: 3px;
}
.sx-tile-unit {
  color: var(--muted);
  font-size: 11px;
}
.sx-retry {
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}
.sx-failed {
  font-size: 16px;
  font-weight: 600;
}
body.sx-shell #inbox-tab .check-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
body.sx-shell #inbox-tab .check-row input {
  flex: none;
  margin-top: 4px;
}
body.sx-shell #inbox-tab .wa-answer-text {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  cursor: pointer;
}
body.sx-shell #inbox-tab .wa-answer-text.sx-open {
  display: block;
}
body.sx-shell #inbox-tab .wa-answer-text p {
  margin: 0 0 4px;
}
.sx-more-fold > summary {
  margin: 8px 0;
  color: var(--accent);
  cursor: pointer;
}
/* Outlook, Evidence, Admin at the snapshot standard: one-liners first, long sections folded */
details.sx-fold {
  margin: 0 0 8px;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
details.sx-fold > summary {
  cursor: pointer;
  font-weight: 600;
}
details.sx-fold[open] > summary {
  margin-bottom: 8px;
}
.ud-oneliners {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ud-oneliners li {
  padding: 4px 0;
  border-top: 1px solid var(--line);
}
.ud-oneliners li:first-child {
  border-top: 0;
}
.ud-summary {
  margin-bottom: 12px;
}

/* ===========================================================================
   Colour pass (owner, 23 Oct 2026: "black and white a bit dry"). One small palette as tokens; layout,
   words and data unchanged. Colour always rides with an arrow, a word or a label, never alone.
     brand   copper, the logo's diamond: active place, primary buttons, the chart, series 1
     up/down green ▲ / red ▼ (desk convention), unchanged a neutral grey ◆
     risk    money at risk (demurrage)            warn  amber: unsold tons, laytime, sends to check
     due     a deadline (forecast cutoff), blue
     section Do now copper · What changed blue · Next violet · Prices teal
   Text colours meet WCAG AA (4.5:1) on --bg, --surface and --panel in both themes.
   =========================================================================== */
:root {
  --sx-brand: #e8a775;
  --sx-brand-strong: #f4bf93;
  --sx-brand-ink: #1f1308;
  --sx-brand-soft: rgba(232, 167, 117, 0.14);
  --sx-up: #57c98f;
  --sx-down: #ff8577;
  --sx-flat: #9baeb7;
  --sx-risk: #ff8577;
  --sx-risk-ink: #2a0d09;
  --sx-warn: #f2c46d;
  --sx-due: #74b3ff;
  --sx-sec-do: var(--sx-brand);
  --sx-sec-changed: #74b3ff;
  --sx-sec-next: #b49cff;
  --sx-sec-prices: #4fc3c7;
  --sx-stage-planning: #a9b8c6;
  --sx-stage-fixed: #b49cff;
  --sx-stage-loaded: #a3a9ff;
  --sx-stage-sailing: #74b3ff;
  --sx-stage-arrived: #4fc3c7;
  --sx-stage-done: #57c98f;
  /* the urea desk's own tokens follow the same convention */
  --ud-up: var(--sx-up);
  --ud-down: var(--sx-down);
  --ud-warn: var(--sx-warn);
  --ud-s1: var(--sx-brand);
  --ud-s2: #5aa2f0;
  --band: rgba(232, 167, 117, 0.16);
  --band-line: rgba(232, 167, 117, 0.5);
}
:root[data-theme="light"] {
  --sx-brand: #8f4818;
  --sx-brand-strong: #7a3c12;
  --sx-brand-ink: #ffffff;
  --sx-brand-soft: rgba(143, 72, 24, 0.1);
  --sx-up: #186a40;
  --sx-down: #a8301f;
  --sx-flat: #4f5a62;
  --sx-risk: #a8301f;
  --sx-risk-ink: #ffffff;
  --sx-warn: #7a4f00;
  --sx-due: #1a55ac;
  --sx-sec-changed: #1a55ac;
  --sx-sec-next: #5c41b8;
  --sx-sec-prices: #0b6569;
  --sx-stage-planning: #4f5a62;
  --sx-stage-fixed: #5c41b8;
  --sx-stage-loaded: #4a50c4;
  --sx-stage-sailing: #1a55ac;
  --sx-stage-arrived: #0b6569;
  --sx-stage-done: #186a40;
  --ud-s2: #2a78d6;
  --band: rgba(143, 72, 24, 0.12);
  --band-line: rgba(143, 72, 24, 0.45);
}
.uc-flat { color: var(--sx-flat); }

/* ---- the bar: the active place and "+ Add" carry the brand -------------------------------- */
body.sx-shell .masthead {
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--sx-brand) 22%, transparent);
}
.sx-tab.selected {
  color: var(--sx-brand);
  background: var(--sx-brand-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sx-brand) 45%, transparent);
}
.sx-tab:not(.selected):hover {
  color: var(--sx-brand-strong);
}
.sx-btn-primary,
body.sx-shell .primary,
body.sx-shell .ud-action-primary {
  background: var(--sx-brand);
  border-color: var(--sx-brand);
  color: var(--sx-brand-ink);
}
.sx-btn-primary:hover,
body.sx-shell .primary:hover {
  background: var(--sx-brand-strong);
  border-color: var(--sx-brand-strong);
}
.sx-btn:not(.sx-btn-primary):hover {
  border-color: color-mix(in srgb, var(--sx-brand) 55%, var(--line));
}
.sx-badge {
  background: var(--sx-brand);
  color: var(--sx-brand-ink);
}

/* ---- section identity: a tinted head and a fine top rule, one hue per section ------------- */
.sx-area-donow { --sec: var(--sx-sec-do); }
.sx-area-changed { --sec: var(--sx-sec-changed); }
.sx-area-next { --sec: var(--sx-sec-next); }
.sx-area-prices,
.sx-area-chart,
body.sx-shell #markets-tab .ud-card { --sec: var(--sx-sec-prices); }
.sx-sec-market { --sec: var(--sx-sec-prices); }
.sx-sec-research { --sec: var(--sx-sec-next); }
.sx-sec-team { --sec: var(--sx-sec-changed); }
.sx-sec-admin { --sec: var(--sx-sec-do); }
body.sx-shell #inbox-tab .panel { --sec: var(--sx-sec-do); }
.sx-card[class*="sx-area-"],
.sx-card[class*="sx-sec-"],
body.sx-shell #inbox-tab .panel,
body.sx-shell #markets-tab .ud-card {
  /* a 2 px rule drawn as border colour + inset shadow, so no card grows by a pixel */
  border-top-color: color-mix(in srgb, var(--sec) 60%, var(--line));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--sec) 60%, transparent);
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--sec) 7%, transparent), transparent 56px);
}
.sx-card[class*="sx-area-"] .sx-card-head h3,
.sx-card[class*="sx-sec-"] .sx-card-head h3,
body.sx-shell #inbox-tab .panel .section-heading h3,
body.sx-shell #markets-tab .ud-card .ud-card-head h3 {
  color: var(--sec);
}
.sx-card[class*="sx-area-"] .sx-card-head h3::before,
.sx-card[class*="sx-sec-"] .sx-card-head h3::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 8px 1px 1px;
  border-radius: 1px;
  background: var(--sec);
  transform: rotate(45deg);
}
.sx-card[class*="sx-area-"] .sx-link {
  color: var(--sec);
}

/* ---- Do now: severity on the left rule (the words say it too) ------------------------------ */
.sx-tone-act {
  box-shadow: inset 3px 0 0 var(--sx-brand);
}
.sx-tone-risk {
  box-shadow: inset 3px 0 0 var(--sx-risk);
  padding-left: 10px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--sx-risk) 10%, transparent), transparent 60%);
}
.sx-tone-risk .sx-row-meta {
  color: var(--sx-risk);
  font-weight: 650;
}
.sx-tone-due {
  box-shadow: inset 3px 0 0 var(--sx-due);
  padding-left: 10px;
}
.sx-tone-due .sx-row-meta {
  color: var(--sx-due);
}
.sx-tone-warn,
.sx-tone-stock {
  box-shadow: inset 3px 0 0 var(--sx-warn);
  padding-left: 10px;
}
.sx-tone-stock .sx-row-meta,
.sx-tone-warn .sx-row-meta {
  color: var(--sx-warn);
}
.sx-warn {
  color: var(--sx-warn);
}
.sx-row-go {
  color: color-mix(in srgb, var(--sec, var(--muted)) 70%, var(--muted));
}

/* ---- price tiles: a coloured change badge and a faint tint by direction --------------------- */
.sx-tile .ud-chg,
body.sx-shell .ud-strip .ud-chg {
  padding: 0 6px;
  border-radius: 6px;
  background: color-mix(in srgb, currentColor 14%, transparent);
}
a.sx-tile:hover {
  border-color: var(--sx-brand);
}
.sx-tile.sx-dir-up {
  border-color: color-mix(in srgb, var(--sx-up) 30%, var(--line));
  background: linear-gradient(180deg, color-mix(in srgb, var(--sx-up) 8%, var(--panel)), var(--panel) 70%);
}
.sx-tile.sx-dir-down {
  border-color: color-mix(in srgb, var(--sx-down) 30%, var(--line));
  background: linear-gradient(180deg, color-mix(in srgb, var(--sx-down) 8%, var(--panel)), var(--panel) 70%);
}

/* ---- the 12-week chart: the brand line, a soft area, the last point lit ---------------------- */
.sx-line {
  stroke: var(--sx-brand);
}
.sx-dot {
  fill: var(--sx-brand);
}
.sx-area {
  fill: url(#sx-chart-fill);
  stroke: none;
}
.sx-fill-top {
  stop-color: var(--sx-brand);
  stop-opacity: 0.3;
}
.sx-fill-bottom {
  stop-color: var(--sx-brand);
  stop-opacity: 0;
}
.sx-halo {
  fill: var(--sx-brand);
  fill-opacity: 0.22;
}
.sx-dot-last {
  stroke: var(--bg);
  stroke-width: 1.5;
}
.sx-last {
  fill: var(--sx-brand-strong);
}

/* ---- Prices (urea desk): the selected series, its history and the missing-period marker ------- */
body.sx-shell .chart-mid {
  stroke: var(--sx-brand);
}
body.sx-shell .chart-dot {
  fill: var(--sx-brand);
}
body.sx-shell .chart-dot-filled-in {
  stroke: var(--sx-brand);
}
body.sx-shell .chart-missing {
  stroke: var(--sx-warn);
}
body.sx-shell .ud-seg-btn.selected,
body.sx-shell .dl-filter.selected,
body.sx-shell .dl-seg-btn.selected {
  border-color: var(--sx-brand);
  background: var(--sx-brand-soft);
  color: var(--sx-brand-strong);
  box-shadow: none;
}

/* ---- Deals: each stage its own colour, sold state and warnings in the shared semantics -------- */
body.sx-shell .dl-chip-stage {
  --stage: var(--sx-stage-planning);
  border-color: color-mix(in srgb, var(--stage) 70%, transparent);
  background: color-mix(in srgb, var(--stage) 13%, transparent);
  color: var(--stage);
}
body.sx-shell .dl-stage-fixed { --stage: var(--sx-stage-fixed); }
body.sx-shell .dl-stage-loading,
body.sx-shell .dl-stage-loaded { --stage: var(--sx-stage-loaded); }
body.sx-shell .dl-stage-sailing { --stage: var(--sx-stage-sailing); }
body.sx-shell .dl-stage-arrived,
body.sx-shell .dl-stage-discharging { --stage: var(--sx-stage-arrived); }
body.sx-shell .dl-stage-discharged { --stage: var(--sx-stage-done); }
body.sx-shell .dl-stage-closed { --stage: var(--sx-flat); }
body.sx-shell .dl-sold-full {
  border-color: color-mix(in srgb, var(--sx-up) 70%, transparent);
  background: color-mix(in srgb, var(--sx-up) 13%, transparent);
  color: var(--sx-up);
}
body.sx-shell .dl-sold-partial {
  border-color: color-mix(in srgb, var(--sx-warn) 70%, transparent);
  background: color-mix(in srgb, var(--sx-warn) 12%, transparent);
  color: var(--sx-warn);
}
body.sx-shell .dl-on {
  color: var(--sx-up);
}
body.sx-shell .dl-warn {
  border-color: var(--sx-risk);
  background: var(--sx-risk);
  color: var(--sx-risk-ink);
}
body.sx-shell .dl-total-warn .dl-total-value,
body.sx-shell .dl-tile-warn .dl-tile-value {
  color: var(--sx-risk);
}
body.sx-shell .dl-tile-warn {
  border-color: color-mix(in srgb, var(--sx-risk) 70%, var(--line));
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--sx-risk) 9%, transparent), transparent 70%);
}
body.sx-shell .dl-caution-text,
body.sx-shell .dl-problem {
  color: var(--sx-warn);
}
body.sx-shell .dl-caution {
  border-color: var(--sx-warn);
  color: var(--sx-warn);
}
body.sx-shell .dl-row:hover {
  border-color: var(--sx-brand);
}
@media (max-width: 600px) {
  /* phone: the badge keeps the tile's one-line foot (change and date side by side) */
  .sx-tile .ud-chg {
    padding: 0;
    border-radius: 2px;
    box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 14%, transparent);
  }
}
/* the exact text Approve sends (send path): wrapped, never an inline style */
pre.wa-pre {
  white-space: pre-wrap;
}

/* ---- the owner's weekly call (H1) on Today: the live dash's card, labels and buttons; two columns of fields ---- */
body.sx-shell .sx-h1 > summary {
  list-style: none;
  cursor: pointer;
}
body.sx-shell .sx-h1 > summary::-webkit-details-marker {
  display: none;
}
body.sx-shell .sx-h1-form {
  margin: 8px 0 4px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
}
body.sx-shell .sx-h1-form > p,
body.sx-shell .sx-h1-form > .sx-h1-actions,
body.sx-shell .sx-h1-form > label:nth-of-type(n+5) {
  grid-column: 1 / -1;
}
body.sx-shell .sx-h1-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
body.sx-shell .sx-h1-form label {
  display: grid;
  gap: 4px;
}
@media (max-width: 600px) {
  body.sx-shell .sx-h1-form { grid-template-columns: 1fr; }
}