/* Approved existing-interface polish, 13 September 2026.
   Presentation only. Keep layout, resizing, collapse, selection and drawing
   geometry in styles.css. Do not theme the sidebar or Word/PDF page contents.
   Deliberately separate while functional UI work continues in styles.css. */
.main-shell {
  --polish-paper: #fff;
  --polish-wash: #f4f4f1;
  --polish-line: #dadad4;
  --polish-muted: #61615c;
  background: var(--polish-wash);
}
:root[data-theme="dark"] .main-shell {
  --polish-paper: var(--surface-raised);
  --polish-wash: var(--main-bg);
  --polish-line: var(--border);
  --polish-muted: var(--muted);
}

/* Quiet headers leave the document and drawing as the visual focus. */
.main-shell > .topbar { margin-bottom: .8rem; }
.main-shell > .topbar .eyebrow {
  color: var(--polish-muted); letter-spacing: .1em; font-weight: 600;
}
.main-shell > .surface-nav { border-color: var(--polish-line); }
.main-shell > .surface-nav .surface-tab {
  transition: color 120ms ease, border-color 120ms ease;
}
.main-shell .button, .main-shell .icon-button {
  border-radius: 5px;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}
.main-shell :is(.button, .icon-button, .surface-tab, .chain-card,
  .review-queue-item, .review-queue-filter, summary):focus-visible {
  outline: 2px solid var(--ink); outline-offset: 3px;
}

/* Keep the existing connected steps and every open/empty/warning state.
   Removing decorative shadows does not remove progress information. */
.main-shell .chain-rail.is-snake {
  border-color: var(--polish-line); border-radius: 10px;
  background-color: var(--polish-wash); background-image: none; box-shadow: none;
}
.main-shell .chain-rail.is-snake .chain-card {
  border-radius: 7px; box-shadow: none; padding: .6rem .7rem;
}
.main-shell .chain-rail.is-snake .chain-card:hover {
  box-shadow: 0 1px 3px rgb(0 0 0 / 7%);
}
.main-shell .chain-rail.is-snake .chain-step.is-open > .chain-card {
  box-shadow: inset 0 0 0 1px var(--ink);
}
.main-shell .chain-rail.is-snake .chain-step.is-endstep > .chain-card {
  box-shadow: none;
}
.main-shell .chain-rail.is-snake .chain-step.is-keystep.is-urgent > .chain-card {
  animation: none; box-shadow: inset 3px 0 0 var(--ink);
}
.main-shell .chain-text strong { font-weight: 600; }
.main-shell .chain-node-icon { border-radius: 6px; }
.main-shell .chain-body { border-radius: 7px; }
.main-shell .chain-head .eyebrow { color: var(--polish-muted); letter-spacing: .1em; }

/* Outer document chrome only: page metrics and text/anchor layers are untouched. */
.main-shell .writer-document-context {
  background: var(--polish-paper); border-color: var(--polish-line);
  border-radius: 8px; padding: .75rem .85rem;
}
.main-shell .writer-document-context .eyebrow {
  color: var(--polish-muted); letter-spacing: .1em; font-weight: 600;
}
.main-shell .document-controls { background: var(--polish-paper); }
.main-shell .paper-page {
  border-color: var(--polish-line); border-radius: 8px;
  box-shadow: 0 2px 8px rgb(0 0 0 / 5%);
}
.main-shell .change-card {
  border-radius: 7px; box-shadow: none;
}
.main-shell .change-card.is-navigable:hover {
  background: var(--surface-subtle);
}

/* The current review queue and layer controls, with their state colours intact. */
.main-shell .review-queue {
  border-color: var(--polish-line); background: var(--polish-paper);
  border-radius: 8px; box-shadow: none;
}
.main-shell .review-queue-head {
  padding: .7rem .8rem; border-color: var(--polish-line);
}
.main-shell .review-queue-item { padding: .6rem .7rem; }
.main-shell .review-queue-item.is-active {
  background: var(--surface-subtle); box-shadow: inset 2px 0 0 var(--ink);
}
.main-shell .review-queue-pill { font-weight: 600; letter-spacing: .02em; }
.main-shell .cc-toolbar { border-color: var(--polish-line); }
.main-shell .geom-controls { border-radius: 7px; }
.main-shell .sv-runbar { border-radius: 7px; }

/* No layout animation on resizing; no motion added to reduced-motion users. */
@media (prefers-reduced-motion: reduce) {
  .main-shell :is(.button, .icon-button, .surface-tab, .chain-card) {
    transition: none;
  }
}
/* Existing mobile hit areas remain at least 44px; density never shrinks them. */
@media (pointer: coarse) {
  .main-shell :is(.button, .icon-button, .review-queue-filter, .surface-tab) {
    min-width: 44px; min-height: 44px;
  }
}

/* The approved compact workbench, applied to the real surfaces. */
.main-shell > .topbar {
  padding: .15rem 0 .8rem; margin-bottom: 0;
}
.main-shell > .topbar h2 { font-size: 1.9rem; letter-spacing: -.025em; }
.main-shell > .surface-nav {
  gap: .3rem; padding: .4rem; margin-bottom: 1.2rem;
  border: 1px solid var(--polish-line); border-radius: 9px;
  background: var(--polish-paper); align-items: center;
}
.main-shell > .surface-nav .surface-tab {
  padding: .65rem .8rem; border: 0; border-radius: 5px;
  font-weight: 550; line-height: 1.2;
}
.main-shell > .surface-nav .surface-tab.active {
  background: var(--ink); color: var(--surface);
}
.main-shell > .surface-nav .surface-tab:not(.active):hover {
  background: var(--surface-subtle); color: var(--ink);
}
.main-shell .surface-nav-tools { padding-left: .55rem; gap: .2rem; }
.main-shell .surface-nav-tools-label { font-size: .77rem; letter-spacing: .06em; }

.main-shell #write-surface > .writer-header {
  padding: .15rem 0 .55rem; margin-bottom: .5rem;
  border: 0; background: transparent; box-shadow: none;
}
.main-shell #write-surface > .writer-header .eyebrow { display: none; }
.main-shell #write-surface > .writer-header h3 {
  font-family: var(--font-sans); font-size: .86rem; font-weight: 550;
  color: var(--polish-muted); margin: 0;
}
.main-shell .chain-rail.is-snake {
  padding: .8rem; background: var(--polish-paper);
}
.main-shell .chain-rail.is-snake.is-collapsed {
  padding: .7rem .85rem; border: 1px solid var(--polish-line);
  background: var(--polish-paper);
}
/* The later snake grid rule in styles.css otherwise overrides the original
   collapsed display:none, leaving every step visible underneath "Show steps". */
.main-shell .chain-rail.is-collapsed :is(.chain-steps, .chain-note) { display: none; }
.main-shell .chain-head { align-items: center; gap: .75rem; }
.main-shell .chain-head > div:first-child {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: .65rem;
}
.main-shell .chain-head .eyebrow { margin: 0; }
.main-shell .chain-head h3 {
  font: 550 .86rem/1.4 var(--font-sans); letter-spacing: -.01em;
}
.main-shell .chain-head-actions { flex-wrap: wrap; justify-content: flex-end; }
.main-shell .chain-rail.is-snake .chain-steps { gap: .55rem 1.1rem; }
.main-shell .chain-rail.is-snake .chain-card {
  border-color: var(--polish-line); padding: .55rem .65rem;
  background: var(--polish-paper); grid-template-columns: 28px minmax(0,1fr);
  gap: .55rem;
}
.main-shell .chain-rail.is-snake .chain-node-icon { width: 28px; height: 28px; }
.main-shell .chain-rail.is-snake .chain-step.is-open > .chain-card,
.main-shell .chain-rail.is-snake .chain-step.is-endstep > .chain-card {
  border-color: var(--ink);
}
.main-shell .chain-rail.is-snake .chain-step.is-warn > .chain-card {
  border-color: var(--warning);
}
.main-shell .chain-rail.is-snake .chain-step::before,
.main-shell .chain-rail.is-snake .chain-step::after { opacity: .25; }
.main-shell .chain-note { border-top: 1px solid var(--polish-line); padding-top: .65rem; }

.main-shell .writer-document-context { border-top: 1px solid var(--polish-line); }
.main-shell .writer-document-context strong { font-size: .9rem; font-weight: 600; }
.main-shell .writer-document-context .eyebrow { font-size: .77rem; }
.main-shell .document-controls { border-bottom-color: var(--polish-line); }
.main-shell .review-rail:not(.review-rail-collapsed .review-rail) {
  border-radius: 9px; border-color: var(--polish-line); background: var(--polish-paper);
}
.main-shell .rail-head { padding-bottom: .7rem; border-bottom: 1px solid var(--polish-line); }
.main-shell .rail-title h3 { font-size: .95rem; margin: .25rem 0; }
.main-shell .change-card { border-left-width: 2px; }
.main-shell .change-card .change-meta { font-weight: 500; }
.main-shell .cc-stage { border-color: var(--polish-line); border-radius: 9px; background: var(--polish-paper); }
.main-shell .cc-toolbar { padding: .7rem .8rem; background: var(--polish-paper); }
.main-shell .review-queue-head { padding: .9rem; }
.main-shell .review-queue-detail { padding: .9rem; }
.main-shell .review-queue-item { gap: .6rem; padding: .85rem .9rem; }
.main-shell .review-queue-item span strong { font-weight: 550; line-height: 1.45; }
.main-shell .review-queue-number { border-width: 1px; font-weight: 550; }
.main-shell .review-queue-pill { text-transform: none; letter-spacing: 0; }

@media (max-width: 700px) {
  .main-shell > .surface-nav { gap: .2rem; }
  .main-shell > .surface-nav .surface-tab { padding: .6rem; }
  .main-shell .chain-head { flex-wrap: wrap; }
  .main-shell .chain-head-actions { margin-left: auto; }
}