/* Report Desk (S-06): layout the house sheet does not cover — prep bar, grid | template + preview
 * split, grid cells, template shelf, dialogs, context menu, toasts. Tokens come from ../shared/aa.css. */

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.desk-title .actions { flex-wrap: wrap; align-items: center; }
.action-rule { align-self: stretch; width: 1px; margin: 0 var(--s1); background: var(--minor); }

/* ── Toasts ─────────────────────────────────────────────────────────── */
#messages { position: fixed; bottom: 56px; right: var(--s4); z-index: 60; display: flex; flex-direction: column; gap: 6px; max-width: 420px; }
#messages .msg { color: var(--navy); background: var(--sheet); border: 1px solid #C9CFD6; box-shadow: none; font-size: 14px; transition: opacity 0.4s; }
#messages .msg::before { content: none; display: none; }
#messages .msg-success, #messages .msg-warning, #messages .msg-error { color: var(--navy); background: var(--sheet); border: 1px solid #C9CFD6; }
#messages .msg-error { border-left: 4px solid var(--redline); }
#messages .msg.out { opacity: 0; }
.rd-alert { margin: var(--s3) 0 0; padding: var(--s2) var(--s3); border: 1px solid #C9CFD6; border-left: 4px solid var(--redline); background: var(--sheet); color: var(--navy); font-size: 14px; }

/* ── Prep bar (secondary to the merge CTA) ──────────────────────────── */
.rd-prep { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); padding: var(--s2) var(--s5); border-bottom: var(--rule-minor); background: var(--band); }
.rd-prep .caption b { color: var(--navy); font-weight: 600; }
.rd-prep-col b { display: inline-block; min-width: 2ch; font-family: var(--f-mono); letter-spacing: 0; text-transform: none; }
.rd-prep-group { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1); padding-left: var(--s3); border-left: var(--rule-minor); }
.rd-prep-group .caption { margin-right: 2px; }
.rd-prep-end { margin-left: auto; display: flex; gap: var(--s1); }
#prepNote { flex-basis: 100%; margin: 0; font-family: var(--f-ui, inherit); font-size: 14px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--ink2); }
.btn.btn-mini { min-height: 28px; padding: 0 10px; border-width: 1px; background: var(--field); color: var(--navy); font-size: 14px; }
.btn.btn-mini:hover:not(:disabled) { background: var(--margin); }
.btn.btn-mini:disabled { border: 1px dashed var(--minor); background: transparent; }

/* ── Work area: field file | template + preview ─────────────────────── */
.rd-work { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, 1fr); gap: var(--s5); align-items: start; padding: var(--s5); }
.rd-pane { display: flex; flex-direction: column; min-width: 0; border: var(--rule); background: var(--field); }
.rd-pane-head { display: flex; align-items: center; gap: var(--s3); min-height: var(--row-form); padding: 0 var(--s3); border-bottom: var(--rule-minor); background: var(--band); }
.rd-pane-head h2 { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd-pane-head h2 b { color: var(--navy); font-weight: 600; }
.rd-pane-head .tabs { align-self: stretch; margin-left: calc(-1 * var(--s3)); }
.rd-file-name { letter-spacing: 0; text-transform: none; color: var(--navy); }

.tabs { display: flex; background: var(--band); }
.tab-btn { min-height: var(--row-form); padding: 0 var(--s4); border: 0; border-right: var(--rule-minor); background: transparent; font-weight: 600; cursor: pointer; }
.tab-btn:hover { background: var(--margin); }
.tab-btn.active { background: var(--navy); color: var(--field); }
.tab-btn.minor { font-weight: 400; color: var(--ink2); }
.tab-btn.minor.active { color: var(--field); }

.rd-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); padding: 6px var(--s3); border-bottom: var(--rule-minor); }
.rd-meta label { display: inline-flex; align-items: baseline; gap: 6px; }
.rd-meta .rd-stat { margin-left: auto; font-family: var(--f-mono); font-size: 11px; color: var(--ink2); }

/* ── Grid ───────────────────────────────────────────────────────────── */
.rd-grid-wrap { max-height: min(64vh, 720px); min-height: 220px; overflow: auto; }
.rd-grid-wrap .drop { min-height: 220px; margin: var(--s4); }
table.rd-grid { width: auto; min-width: 100%; font-size: var(--t14); }
.rd-grid thead th { position: sticky; top: 0; z-index: 2; padding: 4px 4px 3px; background: var(--field); vertical-align: bottom; }
.rd-grid thead th.row-no { z-index: 3; }
.rd-grid th.sel { background: var(--margin); box-shadow: inset 0 -3px 0 var(--redline); }
.rd-col-head { display: flex; align-items: center; gap: 2px; }
.rd-col { flex: 1; min-width: 36px; padding: 2px 4px; border: 1px solid transparent; background: transparent; font-family: var(--f-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-align: left; text-transform: none; color: var(--navy); cursor: pointer; }
.rd-col:hover { border-color: var(--minor); background: var(--field); }
.rd-sort { display: flex; flex-direction: column; }
.rd-sort button { height: 14px; padding: 0 3px; border: 0; background: transparent; font-size: 11px; line-height: 1; color: var(--ink3); cursor: pointer; }
.rd-sort button:hover, .rd-sort button.on { color: var(--navy); }
.rd-colops { display: block; max-width: 160px; padding: 1px 4px 0; overflow: hidden; font-family: var(--f-mono); font-size: 10px; font-weight: 400; letter-spacing: 0; text-transform: none; text-overflow: ellipsis; color: var(--success); }
.rd-grid tbody td { height: 28px; padding: 0 6px; font-family: var(--f-mono); font-variant-numeric: tabular-nums; font-size: 14px; white-space: pre; color: var(--navy); }
.rd-grid tbody td[contenteditable] { min-width: 56px; }
.rd-grid tbody td[contenteditable]:focus { outline: 2px solid var(--focus); outline-offset: -2px; background: var(--field); }
.rd-grid tbody td.sel { background: var(--band); }
.rd-grid tbody tr:hover td { background: var(--band); }
.rd-grid td.row-no, .rd-grid th.row-no { position: sticky; left: 0; z-index: 1; width: 44px; padding: 0 var(--s2) 0 6px; background: var(--band); font-size: 11px; color: var(--ink3); text-align: right; cursor: context-menu; user-select: none; }
.rd-grid tr.blank td:not(.row-no) { background: repeating-linear-gradient(90deg, transparent 0 6px, var(--band) 6px 12px); }
.rd-grid tr.comment td { color: var(--ink3); }
.rd-grid-cap { padding: var(--s2) var(--s3); font-family: var(--f-mono); font-size: 11px; color: var(--ink3); }

/* ── Text view (escape hatch) ───────────────────────────────────────── */
.rd-text-note { padding: var(--s2) var(--s3); border-bottom: var(--rule-minor); background: var(--band); font-size: var(--t14); color: var(--ink2); }
.rd-text-note:empty { display: none; }
.rd-text-hint { padding: 6px var(--s3); border-bottom: var(--rule-minor); font-size: var(--t14); color: var(--ink2); }
.rd-text-edit { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1); padding: var(--s2) var(--s3); border-bottom: var(--rule-minor); }
.rd-text-edit .caption { margin-right: var(--s2); }
#textArea { display: block; width: 100%; min-height: min(60vh, 660px); padding: var(--s2) var(--s3); border: 0; resize: vertical; font: 14px/1.5 var(--f-mono); color: var(--navy); white-space: pre; overflow-wrap: normal; overflow-x: auto; tab-size: 8; }
#textArea:focus { outline: 2px solid var(--focus); outline-offset: -2px; }

/* ── Change log ─────────────────────────────────────────────────────── */
.rd-log { border-top: var(--rule-minor); }
.rd-log summary { display: flex; align-items: center; gap: var(--s2); min-height: 34px; padding: 0 var(--s3); cursor: pointer; list-style: none; }
.rd-log summary::-webkit-details-marker { display: none; }
.rd-log summary::before { content: "+"; width: 12px; font-family: var(--f-mono); color: var(--ink3); }
.rd-log[open] summary::before { content: "\2212"; }
.rd-log summary .caption b { color: var(--navy); font-weight: 600; }
.rd-log-actions { margin-left: auto; display: flex; gap: var(--s1); }
.rd-log ol { max-height: 200px; margin: 0; padding: 0 var(--s3) var(--s2); overflow: auto; list-style: none; border-top: var(--rule-minor); }
.rd-log li { display: grid; grid-template-columns: auto 1fr; gap: 0 var(--s3); padding: 4px 0; border-bottom: var(--rule-minor); font-size: 14px; }
.rd-log li:last-child { border-bottom: 0; }
.rd-log li time { font-family: var(--f-mono); font-size: 11px; color: var(--ink3); }
.rd-log li b { font-weight: 600; }
.rd-log li span { grid-column: 2; font-family: var(--f-mono); font-size: 11px; color: var(--ink2); overflow-wrap: anywhere; }
.rd-log .empty { padding: var(--s2) 0; color: var(--ink3); }

/* ── Template shelf + editor + preview ──────────────────────────────── */
.rd-shelf { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s2); padding: 6px var(--s3); border-bottom: var(--rule-minor); }
.rd-shelf select { flex: 1 1 180px; min-width: 0; min-height: 28px; padding: 0 6px; border: 1px solid var(--minor); background: var(--field); font-size: var(--t14); color: var(--navy); }
.rd-shelf select:focus { outline: 2px solid var(--focus); outline-offset: -2px; }
#tplText { display: block; width: 100%; min-height: 176px; padding: var(--s2) var(--s3); border: 0; border-bottom: var(--rule-minor); resize: vertical; font: 14px/1.5 var(--f-mono); color: var(--navy); white-space: pre; overflow-wrap: normal; overflow-x: auto; }
#tplText:focus { outline: 2px solid var(--focus); outline-offset: -2px; }
.rd-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px var(--s3); border-bottom: var(--rule-minor); }
.rd-chips:empty { display: none; }
.rd-chip { padding: 1px 6px; border: 1px solid var(--minor); background: var(--band); font-family: var(--f-mono); font-size: 11px; color: var(--navy); cursor: pointer; }
.rd-chip:hover { border-color: var(--navy); background: var(--field); }
.rd-syntax { padding: 6px var(--s3); border-bottom: var(--rule); font-family: var(--f-mono); font-size: 11px; line-height: 1.6; color: var(--ink3); }
.rd-syntax code { color: var(--navy); }
.rd-preview-head select { min-height: 26px; }
.rd-preview { max-height: min(46vh, 520px); min-height: 160px; margin: 0; padding: var(--s2) var(--s3); overflow: auto; background-color: var(--field); background-image: linear-gradient(rgba(22, 35, 63, 0.05) 1px, transparent 1px); background-size: 100% 19.5px; background-position: 0 8px; font: 14px/1.5 var(--f-mono); color: var(--navy); white-space: pre; }
.rd-preview.placeholder { color: var(--ink3); white-space: pre-wrap; }
.rd-qa { padding: 6px var(--s3); border-top: var(--rule-minor); background: var(--band); font-size: var(--t14); color: var(--ink2); }
.rd-qa:empty { display: none; }
.rd-qa code { font-size: 11px; }

/* ── Dialogs + context menu ─────────────────────────────────────────── */
dialog.rd-dialog { width: min(92vw, 440px); padding: 0; border: var(--rule); background: var(--field); color: var(--navy); box-shadow: 6px 6px 0 rgba(22, 35, 63, 0.14); }
dialog.rd-dialog::backdrop { background: rgba(22, 35, 63, 0.28); }
.rd-dialog form { display: grid; }
.rd-dialog h2 { padding: var(--s2) var(--s3); border-bottom: var(--rule); background: var(--band); font-size: var(--t15); font-weight: 700; }
.rd-dialog .rd-dlg-body { display: grid; gap: var(--s2); padding: var(--s3); }
.rd-dialog p { font-size: var(--t14); color: var(--ink2); white-space: pre-line; }
.rd-dialog input[type="text"], .rd-dialog select { width: 100%; min-height: 36px; padding: 0 var(--s2); border: var(--rule-minor); background: var(--field); font-family: var(--f-mono); font-size: var(--t15); }
.rd-dialog input[type="text"]:focus, .rd-dialog select:focus { outline: 2px solid var(--focus); outline-offset: -2px; }
.rd-dialog .rd-dlg-row { display: flex; flex-wrap: wrap; gap: var(--s3); font-size: var(--t14); }
.rd-dialog .rd-dlg-row label { display: inline-flex; align-items: center; gap: 6px; }
.rd-dialog .rd-dlg-count { font-family: var(--f-mono); font-size: 11px; color: var(--ink2); }
.rd-dialog menu { display: flex; flex-direction: row-reverse; flex-wrap: wrap; justify-content: flex-start; gap: var(--s2); margin: 0; padding: var(--s2) var(--s3) var(--s3); }
.rd-dialog menu .btn { min-height: 34px; font-size: var(--t14); }

.rd-ctx { position: fixed; z-index: 70; min-width: 200px; padding: 4px 0; border: var(--rule); background: var(--field); box-shadow: 4px 4px 0 rgba(22, 35, 63, 0.14); }
.rd-ctx .rd-ctx-head { padding: 4px var(--s3); border-bottom: var(--rule-minor); font-family: var(--f-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; color: var(--ink3); }
.rd-ctx button { display: block; width: 100%; padding: 5px var(--s3); border: 0; background: transparent; font-size: var(--t14); text-align: left; cursor: pointer; }
.rd-ctx button:hover:not(:disabled) { background: var(--band); }
.rd-ctx button:disabled { color: var(--ink3); cursor: default; }
.rd-ctx button.danger { color: var(--danger); }
.rd-ctx hr { margin: 3px 0; border: 0; border-top: var(--rule-minor); }

/* Report settings and worked examples */
.rd-report-options { display: flex; flex-wrap: wrap; align-items: end; gap: var(--s2) var(--s3); padding: var(--s2) var(--s3); border-bottom: var(--rule-minor); }
.rd-report-options label { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.rd-report-options select { max-width: 220px; min-height: 30px; }
.rd-example-guide, .rd-column-links, .rd-calculation-help { padding: var(--s2) var(--s3); border-bottom: var(--rule-minor); font-size: 14px; line-height: 1.5; }
.rd-example-guide p, .rd-column-links p, .rd-calculation-help p { margin: 0 0 var(--s2); }
.rd-example-guide summary, .rd-column-links summary, .rd-calculation-help summary { cursor: pointer; color: var(--navy); }
.rd-example-guide dl { display: grid; grid-template-columns: minmax(70px, 120px) 1fr; gap: 4px 12px; margin: var(--s2) 0; }
.rd-example-guide dt { overflow-wrap: anywhere; }
.rd-example-guide dd { margin: 0; }
#columnLinkFields { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2) var(--s3); }
#columnLinkFields label { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
#columnLinkFields select { max-width: 100%; min-width: 0; }
.rd-calculation-help label { display: block; margin-top: var(--s2); }
#calculationInsert { max-width: 100%; margin: var(--s1) 0 var(--s2); }
@media (max-width: 1100px) {
  .rd-work { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .rd-work { padding: var(--s4); gap: var(--s4); }
  .rd-prep { padding: var(--s2) var(--s4); }
  .rd-prep-group { padding-left: 0; border-left: 0; }
  .rd-prep-end { margin-left: 0; }
  .action-rule { display: none; }
  #messages { left: var(--s4); max-width: none; }
}
@media (max-width: 620px) {
  #columnLinkFields { grid-template-columns: 1fr; }
  .rd-report-options label { flex-wrap: wrap; }
}