/* ===== Console archetype (REDESIGN.md §3E) — Assistant and Settings =====
   One column at a reading measure with a sticky in-page nav beside it on
   desktop. The nav is chrome: it sits in the margin, it never boxes the
   content, and it disappears entirely on a phone, where a six-item list would
   cost more room than the six sections it points at. */

/* .page defaults to its own scroll container (style.css), which would make a
   sticky child stick to a box that never scrolls. The Console hands scrolling
   back to .surface-body, which is where it actually happens. */
.page.console-page { height: auto; overflow: visible; }
.console-page .page-head-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }

.console-body { display: grid; grid-template-columns: 152px minmax(0, 1fr); gap: 8px 40px; align-items: start; }
.console-sections { min-width: 0; max-width: 74ch; }

/* ---- the nav ---- */
.console-toc { position: sticky; top: 0; padding: 2px 0 8px; }
.console-toc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1px; }
.console-toc-link {
  display: block; width: 100%; text-align: left;
  padding: 6px 10px;
  border: none; border-left: 2px solid var(--border-soft); border-radius: 0;
  background: none; color: var(--text-faint);
  font-family: var(--font); font-size: 13px; line-height: 1.4;
  cursor: pointer;
  transition: color 0.14s, border-color 0.14s; }
.console-toc-link:hover { color: var(--text-dim); border-left-color: var(--border-control); }
.console-toc-link:active { color: var(--text); }
.console-toc-link.active { color: var(--text); border-left-color: var(--accent); }

/* ---- the sections ----
   Grouped by a rule and a heading, not by a card: six settings groups are six
   parts of one page, not six different kinds of thing (DESIGN.md §1). */
.console-sections .section {
  background: none; border: none; border-radius: 0;
  padding: 0; margin: 0; }
.console-section { padding: 26px 0 30px; border-top: 1px solid var(--border-soft); scroll-margin-top: 8px; }
.console-section:first-child { padding-top: 4px; border-top: none; }
.console-section:focus { outline: none; }
.console-section:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; border-radius: var(--radius-sm); }
.console-section .section-title { margin-top: 0; }
/* one level down from the section heading: "Workspace stats", "Danger zone" */
.console-sub-title {
  margin: 26px 0 10px; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--text-faint); }

@media (max-width: 900px) {
  .console-body { grid-template-columns: minmax(0, 1fr); }
  .console-toc { display: none; }
  .console-sections { max-width: none; }
}