/*
 * Unified Cockpit · specialist work surfaces (C12–C16)
 *
 * Loaded after the legacy Mesa, mobile, reader and Office styles.  This file
 * changes presentation only: route contracts, form ownership, ids and data
 * hooks stay in their original templates and engines.
 */

body.unified-cockpit :where(.matrix, .map-stage, .reader, .wr, .log, .word-preview-shell) {
  color: var(--cockpit-ink);
  font-family: var(--cockpit-sans);
}

body.unified-cockpit :where(.matrix, .map-stage, .reader, .log, .word-preview-shell) h1,
body.unified-cockpit :where(.matrix, .map-stage, .reader, .log, .word-preview-shell) h2,
body.unified-cockpit :where(.m-risk-head, .m-sheet, .m-night-empty, .m-ticket, .mr-sheet) h1,
body.unified-cockpit :where(.m-risk-head, .m-sheet, .m-night-empty, .m-ticket, .mr-sheet) h2 {
  font-family: var(--cockpit-serif);
  letter-spacing: -0.025em;
}

body.unified-cockpit :where(.btn, .m-btn, .ow-button, .button) {
  min-height: 40px;
  border-radius: var(--cockpit-radius-control);
  font-family: var(--cockpit-sans);
  font-weight: 700;
}

body.unified-cockpit :where(.btn-gold, .m-btn-gold, .ow-button-primary, .button.primary) {
  border-color: var(--cockpit-gold-deep);
  background: var(--cockpit-gold);
  color: var(--cockpit-gold-ink);
  box-shadow: var(--cockpit-shadow-press);
}

body.unified-cockpit :where(.btn-gold, .m-btn-gold, .ow-button-primary, .button.primary):hover {
  background: color-mix(in srgb, var(--cockpit-gold) 84%, var(--cockpit-surface-solid));
}

body.unified-cockpit :where(.eyebrow, .m-eyebrow, .ow-eyebrow) {
  color: var(--cockpit-muted-strong);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Mesa · one task canvas -------------------------------------------------- */

body.unified-cockpit.mesa-body .cockpit-workspace {
  min-width: 0;
  background: var(--cockpit-paper);
}

body.unified-cockpit.mesa-body :where(.matrix, .map-stage, .reader, .log) {
  min-height: 100%;
}

body.unified-cockpit.mesa-body .matrix {
  background: var(--cockpit-paper);
}

body.unified-cockpit.mesa-body .matrix-main {
  min-width: 0;
  padding: 0 28px 112px;
}

body.unified-cockpit.mesa-body .v3-top {
  position: sticky;
  z-index: 22;
  top: 0;
  min-height: 64px;
  margin: 0 -28px 18px;
  padding: 12px 28px;
  border-bottom: 1px solid var(--cockpit-line);
  background: color-mix(in srgb, var(--cockpit-paper) 94%, transparent);
  box-shadow: var(--cockpit-shadow-card);
  backdrop-filter: blur(16px);
}

body.unified-cockpit.mesa-body .v3-top .crumbs {
  color: var(--cockpit-muted);
}

body.unified-cockpit.mesa-body .v3-top .tool {
  min-height: 38px;
  border: 1px solid var(--cockpit-line-strong);
  border-radius: var(--cockpit-radius-control);
  background: var(--cockpit-surface-solid);
  color: var(--cockpit-ink);
}

body.unified-cockpit.mesa-body .v3-top .tool.word {
  border-color: var(--cockpit-gold-deep);
  background: var(--cockpit-gold-soft);
}

body.unified-cockpit.mesa-body .steps {
  margin: 0 0 16px;
  padding: 5px;
  border: 1px solid var(--cockpit-line);
  border-radius: 12px;
  background: var(--cockpit-surface);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.mesa-body .steps a {
  border-radius: 8px;
  color: var(--cockpit-muted-strong);
}

body.unified-cockpit.mesa-body .steps a[aria-current="page"],
body.unified-cockpit.mesa-body .steps a[aria-current="true"] {
  background: var(--cockpit-wine);
  color: var(--cockpit-surface);
}

body.unified-cockpit.mesa-body :where(.landscape, .panel, .fcard, .nolayer, .gallery .tile, .kpi) {
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.mesa-body .landscape {
  margin: 0 0 18px;
  overflow: hidden;
}

body.unified-cockpit.mesa-body .landscape-head {
  padding: 12px 16px;
  border-bottom: 1px solid var(--cockpit-line);
  background: var(--cockpit-paper-soft);
  color: var(--cockpit-muted-strong);
}

body.unified-cockpit.mesa-body .v2-body {
  gap: 18px;
}

body.unified-cockpit.mesa-body .fam {
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.mesa-body .fam a {
  border-color: var(--cockpit-line-soft);
}

body.unified-cockpit.mesa-body .fam a[aria-current="true"] {
  background: var(--cockpit-wine);
  color: var(--cockpit-surface);
}

body.unified-cockpit.mesa-body :where(.matrix table, .log-table) {
  border: 1px solid var(--cockpit-line);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.mesa-body :where(.matrix table, .log-table) th {
  border-color: var(--cockpit-line);
  background: var(--cockpit-paper-soft);
  color: var(--cockpit-muted-strong);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.unified-cockpit.mesa-body :where(.matrix table, .log-table) td {
  border-color: var(--cockpit-line-soft);
}

body.unified-cockpit.mesa-body .matrix tbody tr:hover {
  background: var(--cockpit-gold-soft);
}

body.unified-cockpit.mesa-body .matrix tbody tr.is-selected {
  box-shadow: inset 4px 0 var(--cockpit-wine);
  background: var(--cockpit-gold-soft);
}

body.unified-cockpit.mesa-body .statusbar {
  position: relative;
  inset: auto;
  z-index: auto;
  flex-wrap: wrap;
  margin: 16px 0 0;
  border-top: 1px solid var(--cockpit-line);
  background: color-mix(in srgb, var(--cockpit-surface-solid) 96%, transparent);
  box-shadow: var(--cockpit-shadow-dock);
  backdrop-filter: blur(16px);
}

body.unified-cockpit.mesa-body .statusbar .gen {
  min-width: 0;
  flex: 1 1 260px;
  justify-content: flex-end;
}

body.unified-cockpit.mesa-body .statusbar .gen small {
  min-width: 0;
}

body.unified-cockpit.mesa-body .statusbar .gen .btn {
  max-width: 220px;
  white-space: normal;
  text-align: center;
}

body.unified-cockpit.mesa-body .inspector {
  border-left: 1px solid var(--cockpit-line);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.mesa-body .insp-head {
  border-bottom: 1px solid var(--cockpit-line);
  background: var(--cockpit-wine);
  color: var(--cockpit-surface);
}

body.unified-cockpit.mesa-body .insp-head :where(h2, .crumbs, .insp-meta) {
  color: var(--cockpit-surface);
}

body.unified-cockpit.mesa-body .insp-form :where(input, textarea, select) {
  border-color: var(--cockpit-line-strong);
  border-radius: var(--cockpit-radius-control);
  background: var(--cockpit-surface);
}

body.unified-cockpit.mesa-body .insp-form :where(input, textarea, select):focus {
  border-color: var(--cockpit-gold-deep);
  box-shadow: 0 0 0 3px var(--cockpit-gold-soft);
}

body.unified-cockpit.mesa-body :where(.xdrawer, .toast) {
  border-color: var(--cockpit-line);
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.mesa-body .log {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  padding: 40px 0 120px;
}

body.unified-cockpit.mesa-body .log h1 {
  margin: 6px 0 22px;
  color: var(--cockpit-wine);
  font: 700 clamp(30px, 4vw, 48px)/1.04 var(--cockpit-serif);
}

/* Mesa map --------------------------------------------------------------- */

body.unified-cockpit.mesa-body .map-stage {
  background: var(--cockpit-night);
}

body.unified-cockpit.mesa-body .map-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cockpit-surface-solid) 8%, transparent);
}

body.unified-cockpit.mesa-body .map-top {
  gap: 12px;
  padding: 22px 24px;
}

body.unified-cockpit.mesa-body .map-stage .glass {
  border: 1px solid color-mix(in srgb, var(--cockpit-surface-solid) 16%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--cockpit-night) 86%, transparent);
  color: var(--cockpit-night-text);
  box-shadow: var(--cockpit-shadow-float);
  backdrop-filter: blur(14px);
}

body.unified-cockpit.mesa-body .map-stage .glass-light {
  border-color: var(--cockpit-gold);
  background: var(--cockpit-gold);
  color: var(--cockpit-gold-ink);
}

body.unified-cockpit.mesa-body :where(.arrival, .units) {
  border-color: var(--cockpit-line);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-float);
}

/* Mesa Word and reader --------------------------------------------------- */

body.unified-cockpit.mesa-body .mesa.is-night .cockpit-workspace {
  background: var(--cockpit-night);
}

body.unified-cockpit.mesa-body :where(.checks, .reader) {
  border-color: var(--cockpit-night-rule);
}

body.unified-cockpit.mesa-body .checks {
  background: var(--cockpit-night);
}

body.unified-cockpit.mesa-body .checks h2,
body.unified-cockpit.mesa-body .reader h1,
body.unified-cockpit.mesa-body .reader h2 {
  color: var(--cockpit-night-text);
}

body.unified-cockpit.mesa-body .check {
  border-color: var(--cockpit-night-rule);
  border-radius: 10px;
  background: var(--cockpit-night-hover);
  color: var(--cockpit-night-text);
}

body.unified-cockpit.mesa-body .check.is-warn {
  border-color: var(--cockpit-gold-deep);
  background: color-mix(in srgb, var(--cockpit-night-hover) 72%, var(--cockpit-gold-deep));
}

body.unified-cockpit.mesa-body .reader {
  background: var(--cockpit-night);
}

body.unified-cockpit.mesa-body .reader-head,
body.unified-cockpit.mesa-body .wr-head {
  border-bottom: 1px solid var(--cockpit-night-rule);
  background: var(--cockpit-night);
}

body.unified-cockpit.mesa-body .paper,
body.unified-cockpit.mesa-body .wr-page {
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.mesa-body .wr-tools :where(input, button) {
  min-height: 38px;
  border-radius: var(--cockpit-radius-control);
}

body.unified-cockpit.mesa-body .wr-side {
  border-left-color: var(--cockpit-night-rule);
  background: var(--cockpit-night);
}

/* Dedicated mobile surfaces --------------------------------------------- */

body.unified-cockpit.m-body {
  background: var(--cockpit-paper);
}

body.unified-cockpit.m-body .m-app {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-bottom: calc(var(--cockpit-dock) + env(safe-area-inset-bottom));
  background: var(--cockpit-paper);
}

body.unified-cockpit.m-body :where(.m-risk-head, .m-sheet, .m-risk-form, .m-res, .m-ticket, .m-night-empty) {
  width: min(100% - 28px, 780px);
  margin-inline: auto;
}

body.unified-cockpit.m-body .m-risk-head {
  margin-top: 14px;
  padding: 22px;
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.m-body .m-risk-head h1 {
  color: var(--cockpit-wine);
  font-size: clamp(28px, 8vw, 44px);
  line-height: 1.03;
}

body.unified-cockpit.m-body .m-risk-head .m-eyebrow {
  color: var(--cockpit-wine);
}

body.unified-cockpit.m-body .m-risk-head .m-counter,
body.unified-cockpit.m-body .m-risk-head > p {
  color: var(--cockpit-muted-strong);
}

body.unified-cockpit.m-body .m-topbar {
  min-height: 50px;
  margin: 0 0 14px;
  padding: 0;
  background: transparent;
}

body.unified-cockpit.m-body :where(.m-back, .mr-back, .mr-tool) {
  display: inline-grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  border: 1px solid var(--cockpit-line-strong);
  border-radius: 50%;
  background: var(--cockpit-surface-solid);
  color: var(--cockpit-wine);
  box-shadow: var(--cockpit-shadow-press);
}

body.unified-cockpit.m-body .m-progress {
  overflow: hidden;
  height: 7px;
  border-radius: 999px;
  background: var(--cockpit-line-soft);
}

body.unified-cockpit.m-body :where(.m-family, .m-risk-card, .m-kpi, .m-action, .m-field, .m-factor, .m-mag, .m-evidence) {
  border-color: var(--cockpit-line);
  border-radius: 12px;
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.m-body .m-risk-form {
  margin-top: 14px;
  padding: 18px;
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.m-body :where(.m-risk-form, .mr-sheet) :where(input, textarea, select) {
  min-height: 46px;
  border-color: var(--cockpit-line-strong);
  border-radius: var(--cockpit-radius-control);
  background: var(--cockpit-paper-wash);
  color: var(--cockpit-ink);
}

body.unified-cockpit.m-body :where(.m-risk-form, .mr-sheet) :where(input, textarea, select):focus {
  border-color: var(--cockpit-gold-deep);
  box-shadow: 0 0 0 3px var(--cockpit-gold-soft);
}

body.unified-cockpit.m-body .m-factor legend {
  color: var(--cockpit-wine);
  font-weight: 700;
}

body.unified-cockpit.m-body .m-scale label:has(input:checked) {
  border-color: var(--cockpit-gold-deep);
  background: var(--cockpit-gold-soft);
  color: var(--cockpit-gold-ink);
}

body.unified-cockpit.m-body :where(.m-sticky-save, .m-actionbar) {
  bottom: var(--cockpit-dock);
  border-top: 1px solid var(--cockpit-line);
  background: color-mix(in srgb, var(--cockpit-surface-solid) 95%, transparent);
  box-shadow: var(--cockpit-shadow-dock);
  backdrop-filter: blur(16px);
}

body.unified-cockpit.m-body .m-map {
  background: var(--cockpit-night);
}

body.unified-cockpit.m-body .m-map .m-topbar,
body.unified-cockpit.m-body .m-viewer .m-topbar {
  position: absolute;
  inset: 14px 14px auto;
  z-index: 4;
}

body.unified-cockpit.m-body :where(.m-map-chip, .m-mapchip) {
  border: 1px solid color-mix(in srgb, var(--cockpit-surface-solid) 15%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--cockpit-night) 87%, transparent);
  color: var(--cockpit-night-text);
  box-shadow: var(--cockpit-shadow-float);
  backdrop-filter: blur(14px);
}

body.unified-cockpit.m-body .m-sheet,
body.unified-cockpit.m-body .m-legend-sheet {
  border: 1px solid var(--cockpit-line);
  border-radius: 22px 22px 0 0;
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.m-body .m-sheet h1,
body.unified-cockpit.m-body .m-legend-sheet h2 {
  color: var(--cockpit-wine);
}

body.unified-cockpit.m-body .m-night {
  background: var(--cockpit-night);
  color: var(--cockpit-night-text);
}

body.unified-cockpit.m-body .m-night .m-app,
body.unified-cockpit.m-body .m-app.m-night {
  background: var(--cockpit-night);
}

body.unified-cockpit.m-body .m-night .m-topbar,
body.unified-cockpit.m-body .mr-top {
  border-bottom: 1px solid var(--cockpit-night-rule);
  background: var(--cockpit-night);
}

body.unified-cockpit.m-body .m-night :where(.m-back, .mr-back, .mr-tool) {
  border-color: var(--cockpit-night-rule);
  background: var(--cockpit-night-hover);
  color: var(--cockpit-night-text);
}

body.unified-cockpit.m-body .mr-page {
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.m-body .mr-film,
body.unified-cockpit.m-body :where(.mr-navrow, .mr-pager) {
  border-color: var(--cockpit-night-rule);
  background: var(--cockpit-night);
}

body.unified-cockpit.m-body .mr-pager {
  bottom: calc(var(--cockpit-dock) + 8px);
}

body.unified-cockpit.m-body .mr-sheet {
  background: var(--cockpit-surface-solid);
  color: var(--cockpit-ink);
}

body.unified-cockpit.m-body .m-success {
  background: var(--cockpit-green-deep);
}

body.unified-cockpit.m-body .m-success.is-na-receipt {
  background: var(--cockpit-night-active);
}

body.unified-cockpit.m-body .m-ticket {
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  color: var(--cockpit-ink);
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit.m-body .m-ticket h2 {
  color: var(--cockpit-wine);
}

/* Full-page Word preview ------------------------------------------------- */

body.unified-cockpit .word-preview-shell {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  padding: 30px 0 120px;
}

body.unified-cockpit .word-preview-heading {
  border: 1px solid var(--cockpit-night-rule);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-night);
  color: var(--cockpit-night-text);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit .word-preview-heading :where(h1, p, .back) {
  color: var(--cockpit-night-text);
}

body.unified-cockpit :where(.word-version-receipt, .word-preview-panel, .word-preview-findings) {
  border-color: var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit .word-version-receipt h2,
body.unified-cockpit .word-preview-findings h2 {
  color: var(--cockpit-wine);
  font-family: var(--cockpit-serif);
}

body.unified-cockpit .word-preview-page {
  box-shadow: var(--cockpit-shadow-float);
}

body.unified-cockpit .word-preview-controls {
  gap: 12px;
  border-top-color: var(--cockpit-line);
}

body.unified-cockpit .word-preview-jump input {
  border-color: var(--cockpit-line-strong);
  border-radius: var(--cockpit-radius-control);
}

/* Filemón Office · task toolbar, not a second app shell ------------------ */

body.unified-cockpit.ow-app {
  --ow-tabs: 56px;
  background: var(--cockpit-paper);
  color: var(--cockpit-ink);
  font-family: var(--cockpit-sans);
}

body.unified-cockpit.ow-app .ow-cockpit-workspace {
  width: auto;
  max-width: none;
  min-height: 100dvh;
  margin-left: var(--cockpit-rail);
  padding: 0;
}

body.unified-cockpit.ow-app .ow-topbar {
  min-height: 62px;
  border-bottom: 1px solid var(--cockpit-line);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

body.unified-cockpit.ow-app .ow-brand {
  gap: 8px;
  min-width: auto;
  color: var(--cockpit-wine);
  font-weight: 700;
}

body.unified-cockpit.ow-app .ow-brand-name {
  color: var(--cockpit-wine);
  font-family: var(--cockpit-sans);
  font-size: 13px;
}

body.unified-cockpit.ow-app .ow-breadcrumb {
  color: var(--cockpit-muted);
}

body.unified-cockpit.ow-app .ow-breadcrumb strong {
  color: var(--cockpit-ink);
}

body.unified-cockpit.ow-app .ow-view-tabs {
  display: grid;
  min-height: var(--ow-tabs);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid var(--cockpit-line);
  background: var(--cockpit-paper-soft);
}

body.unified-cockpit.ow-app .ow-view-tab {
  min-height: 48px;
  color: var(--cockpit-muted-strong);
}

body.unified-cockpit.ow-app .ow-view-tab.is-active {
  border-color: var(--cockpit-wine);
  color: var(--cockpit-wine);
}

body.unified-cockpit.ow-app .ow-document-bar {
  border-bottom: 1px solid var(--cockpit-line);
  background: var(--cockpit-surface-solid);
}

body.unified-cockpit.ow-app .ow-file-icon {
  border-radius: 7px;
  background: var(--cockpit-wine);
  color: var(--cockpit-surface);
}

body.unified-cockpit.ow-app .ow-main {
  background: var(--cockpit-paper);
}

body.unified-cockpit.ow-app .ow-rail,
body.unified-cockpit.ow-app .ow-inspector {
  border-color: var(--cockpit-line);
  background: var(--cockpit-surface-solid);
}

body.unified-cockpit.ow-app .ow-rail h1,
body.unified-cockpit.ow-app .ow-inspector h2,
body.unified-cockpit.ow-app .ow-dialog h2 {
  color: var(--cockpit-wine);
  font-family: var(--cockpit-serif);
}

body.unified-cockpit.ow-app .ow-stage-shell {
  background: var(--cockpit-paper-soft);
}

body.unified-cockpit.ow-app .ow-stage-toolbar {
  border-color: var(--cockpit-line);
  background: var(--cockpit-surface-solid);
}

body.unified-cockpit.ow-app .ow-mode-tabs {
  border-color: var(--cockpit-line);
  background: var(--cockpit-paper-soft);
}

body.unified-cockpit.ow-app .ow-mode-tab.is-active {
  background: var(--cockpit-wine);
  color: var(--cockpit-surface);
}

body.unified-cockpit.ow-app .ow-dock {
  left: var(--cockpit-rail);
  border-top: 1px solid var(--cockpit-line);
  background: color-mix(in srgb, var(--cockpit-surface-solid) 96%, transparent);
  box-shadow: var(--cockpit-shadow-dock);
  backdrop-filter: blur(16px);
}

body.unified-cockpit.ow-app .ow-dialog-card {
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-float);
}

/* Manual · content, not competing navigation ---------------------------- */

body.unified-cockpit.has-cockpit .cover {
  padding: 42px 28px 34px;
  border-bottom: 1px solid var(--cockpit-night-rule);
  background: var(--cockpit-night);
  color: var(--cockpit-night-text);
}

body.unified-cockpit.has-cockpit .cover h1 {
  color: var(--cockpit-night-text);
  font-family: var(--cockpit-serif);
}

body.unified-cockpit.has-cockpit .cover .eyebrow,
body.unified-cockpit.has-cockpit .cover nav.toc a {
  color: var(--cockpit-gold);
}

body.unified-cockpit.has-cockpit > .cockpit .wrap,
body.unified-cockpit.has-cockpit .cockpit-workspace > .wrap {
  width: min(980px, calc(100% - 48px));
  max-width: none;
}

body.unified-cockpit.has-cockpit main.wrap h2 {
  color: var(--cockpit-wine);
  font-family: var(--cockpit-serif);
}

body.unified-cockpit.has-cockpit :where(.shot, .tip, .ok, table) {
  border: 1px solid var(--cockpit-line);
  border-radius: var(--cockpit-radius);
  background: var(--cockpit-surface-solid);
  box-shadow: var(--cockpit-shadow-card);
}

/* Responsive containment ------------------------------------------------- */

@media (max-width: 1100px) {
  body.unified-cockpit.mesa-body .matrix-main {
    padding-inline: 18px;
  }

  body.unified-cockpit.mesa-body .v3-top {
    margin-inline: -18px;
    padding-inline: 18px;
  }

  body.unified-cockpit.ow-app .ow-breadcrumb {
    min-width: 0;
  }

  body.unified-cockpit.ow-app .ow-main {
    grid-template-columns: minmax(150px, 0.7fr) minmax(260px, 1.4fr) minmax(250px, 1fr);
  }
}

@media (max-width: 800px) {
  body.unified-cockpit.m-body .m-app.m-night {
    padding-bottom: calc(var(--cockpit-dock) + 72px + env(safe-area-inset-bottom));
  }

  body.unified-cockpit.m-body .m-app.m-night .m-night-actions {
    position: fixed;
    right: 0;
    bottom: var(--cockpit-dock);
    left: 0;
    z-index: 55;
    padding: 8px 18px;
    border-top: 1px solid var(--cockpit-night-rule);
    background: color-mix(in srgb, var(--cockpit-night) 96%, transparent);
    backdrop-filter: blur(16px);
  }

  body.unified-cockpit.ow-app .ow-topbar {
    min-height: 54px;
  }

  body.unified-cockpit.ow-app .ow-cockpit-workspace {
    min-height: calc(100dvh - var(--cockpit-dock));
    margin-left: 0;
    padding: 0;
  }

  body.unified-cockpit.ow-app .ow-main {
    height: calc(100dvh - var(--ow-header) - var(--ow-docbar) - var(--ow-tabs) - var(--ow-dock) - var(--cockpit-dock));
  }

  body.unified-cockpit.ow-app .ow-inspector,
  body.unified-cockpit.ow-app .ow-inspector.is-open {
    bottom: var(--cockpit-dock);
  }

  body.unified-cockpit.ow-app .ow-brand-name {
    display: none;
  }

  body.unified-cockpit.ow-app .ow-dock {
    left: 0;
    bottom: var(--cockpit-dock);
  }
}

@media (max-width: 760px) {

  body.unified-cockpit .word-preview-shell {
    width: calc(100% - 24px);
    padding-top: 12px;
  }

  body.unified-cockpit .word-preview-heading {
    padding: 20px;
  }

  body.unified-cockpit .word-preview-controls {
    grid-template-columns: 1fr 1fr;
  }

  body.unified-cockpit .word-preview-controls strong {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  body.unified-cockpit.has-cockpit .cover {
    padding: 26px 18px;
  }

  body.unified-cockpit.has-cockpit > .cockpit .wrap,
  body.unified-cockpit.has-cockpit .cockpit-workspace > .wrap {
    width: calc(100% - 28px);
    padding-inline: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.unified-cockpit :where(.matrix, .m-app, .ow-app) *,
  body.unified-cockpit :where(.matrix, .m-app, .ow-app) *::before,
  body.unified-cockpit :where(.matrix, .m-app, .ow-app) *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}