/* Shared workspace overlays; feature surfaces own their presentation CSS. */
  /* Shared end-session feedback moved out of the retired Workforce page. */
  .board-toast {
    position:fixed; z-index:var(--cc-z-status); left:50%;
    bottom:calc(1.25rem + var(--cc-visual-viewport-bottom,0px)
      + env(safe-area-inset-bottom,0px));
    transform:translateX(-50%); max-width:min(22rem,calc(100vw - 2rem));
    display:flex; align-items:center; gap:.6rem; padding:.55rem .9rem;
    border:1px solid var(--ui-line); border-radius:var(--ui-radius-sm);
    background:var(--ui-raised); box-shadow:var(--ui-shadow); color:var(--ui-text);
    font-size:.875rem; line-height:1.35;
  }
  .board-toast[hidden] { display:none; }
  .board-toast__action { flex-shrink:0; margin-left:auto; font-size:inherit; }
  .end-session-dialog { width:min(460px,calc(100vw - 28px)); padding:22px; }
  .end-session-dialog h2 { margin:0 0 10px; }
  .end-session-dialog > p { margin:0 0 18px; color:var(--ui-text-soft); line-height:1.5; }
  .end-session-dialog .end-session-error { color:var(--ui-danger); }
  .end-session-dialog .actions { display:flex; justify-content:flex-end; gap:8px; }
  html[data-session-ended="true"] :is(#instruct-form,#dock-instruct-form) { opacity:.52; }
  html[data-session-ended="true"] :is(#agent-status,#dock-agent-status) { color:var(--ui-text-soft); }
  .composer .actions { justify-content:flex-end; }
  .composer-actions { align-items:center; gap:10px; }
  .controls { min-height:0; overflow:auto; border-left:1px solid var(--line); padding:18px; }
  .control-section + .control-section { border-top:1px solid var(--line); margin-top:20px; padding-top:20px; }
  .control-section h2 { margin-bottom:6px; }
  .hint { color:var(--dim); font-size:12px; margin-bottom:12px; }
  label { display:block; color:var(--txt-soft); font-size:13px; font-weight:600; margin-bottom:6px; }
  input, textarea, select { width:100%; border:1px solid var(--line); border-radius:8px;
                            color:var(--txt); padding:9px 10px; }
  textarea { min-height:104px; resize:vertical; }
  .field + .field { margin-top:13px; }
  .actions { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
  .result { margin-top:10px; border-radius:8px; background:var(--card-2); color:var(--txt-soft);
            padding:10px 11px; font:12px/1.5 ui-monospace,Menlo,monospace;
            white-space:pre-wrap; overflow-wrap:anywhere; }
  .result:empty { display:none; }
  .result details { margin-top:7px; border:1px solid var(--line); border-radius:6px;
                    padding:7px 9px; background:var(--inset-soft); }
  .result summary { cursor:pointer; color:var(--dim); }
  .result details pre { max-height:150px; margin:7px 0 0; overflow:auto; white-space:pre-wrap;
                        color:var(--txt-soft); font:11px/1.5 ui-monospace,Menlo,monospace; }
  .busy-question { margin-top:10px; padding:10px; border:1px solid var(--warning-border);
                   border-radius:8px; background:var(--warning-soft); color:var(--amber); }
  .session-ended-banner { display:grid; gap:10px; margin-top:10px; padding:10px 12px;
                           border:1px solid var(--line);
                           border-radius:8px; background:var(--inset-soft); color:var(--txt-soft); }
  .session-ended-banner-row { display:flex; align-items:center; justify-content:space-between;
                               gap:10px; }
  .danger-zone { border-color:var(--danger-border) !important; }
  .form-body { overflow:auto; padding:20px; }
  .settings-drawer { position:fixed; z-index:var(--cc-z-modal); display:flex; flex-direction:column;
                     max-height:var(--cc-visual-viewport-height,100dvh);
                     background:var(--drawer-bg); transform:translateX(105%); visibility:hidden;
                     transition:transform .22s ease,visibility 0s linear .22s; }
  .settings-drawer.open { transform:translateX(0); visibility:visible;
                          transition:transform .22s ease; }
  .settings-tab { min-width:0; border-color:transparent; background:transparent;
                  color:var(--dim); text-align:center; }
  .settings-tab[aria-selected="true"] { border-color:var(--accent-border);
                                          background:var(--accent-soft); color:var(--txt); }
  .settings-body { min-height:0; overflow:auto; }
  .settings-pane[hidden] { display:none; }
  .settings-pane h2 { margin-bottom:5px; font-size:18px; }
  .settings-intro { margin-bottom:16px; color:var(--dim); font-size:12.5px; line-height:1.55; }
  .credits-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
  .credits-stat, .credits-card { border:1px solid var(--line); border-radius:9px;
                                 background:var(--card-child); padding:12px; }
  .credits-stat small { display:block; color:var(--dim); }
  .credits-stat strong { display:block; margin-top:4px; font-size:18px; }
  .credits-card { margin-top:11px; }
  .credits-card h3 { margin-bottom:7px; }
  .pricing-head { display:flex; align-items:start; justify-content:space-between; gap:12px; }
  .pricing-head p { margin:2px 0 0; color:var(--dim); font-size:11px; }
  .pricing-intervals { display:inline-flex; gap:3px; padding:3px; border:1px solid var(--line);
                       border-radius:8px; background:var(--bg); }
  .pricing-intervals .button { min-height:30px; padding:5px 9px; border-color:transparent; }
  .pricing-intervals .button[aria-pressed="true"] {
    color:var(--txt); border-color:var(--accent-border); background:var(--accent-soft);
  }
  .pricing-tier-list { display:grid; gap:8px; margin-top:12px; }
  .pricing-tier { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px;
                  align-items:center; padding:10px; border:1px solid var(--line);
                  border-radius:8px; background:var(--card); }
  .pricing-tier strong, .pricing-tier small { display:block; }
  .pricing-tier small { margin-top:2px; color:var(--dim); }
  .pricing-preview { margin-top:10px; padding:10px; border:1px solid var(--accent-border);
                     border-radius:8px; background:var(--accent-soft); }
  .pricing-preview-actions { display:flex; gap:7px; margin-top:9px; }
  .pricing-status { margin:9px 0 0; color:var(--dim); font-size:11px; }
  #credits-plan-card[data-state="in-flight"] .pricing-status { color:var(--blue); }
  #credits-plan-card[data-state="failed"] .pricing-status { color:var(--red); }
  #credits-plan-card[data-state="success"] .pricing-status { color:var(--green); }
  .credits-toggle-row { grid-column:1/-1; }
  .credits-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .credits-form label { color:var(--dim); font-size:11px; }
  .credits-form input, .credits-form select { width:100%; margin-top:3px; }
  .credits-usage { width:100%; border-collapse:collapse; font-size:12px; }
  .credits-usage th, .credits-usage td { padding:7px; border-bottom:1px solid var(--line);
                                        text-align:left; }
  .credits-unavailable { color:var(--amber); }
  .capacity-list { display:grid; gap:12px; }
  .capacity-card { display:grid; gap:12px; padding:15px; border:1px solid var(--line);
                   border-radius:10px; background:var(--card); }
  .capacity-card.attention { border-color:var(--warning-border); }
  .capacity-head { display:flex; align-items:start; justify-content:space-between; gap:12px; }
  .capacity-head strong { display:block; color:var(--txt); font-size:14px; }
  .capacity-head small { color:var(--dim); }
  .capacity-metrics { display:grid; gap:10px; }
  .capacity-metric-head { display:flex; justify-content:space-between; gap:12px;
                          color:var(--txt-soft); font-size:11.5px; }
  .capacity-track { height:8px; overflow:hidden; border-radius:99px; background:var(--inset-soft); }
  .capacity-fill { height:100%; border-radius:inherit; background:var(--blue); }
  .capacity-card.attention .capacity-fill { background:var(--amber); }
  .capacity-prediction { color:var(--dim); font-size:10.5px; }
  .capacity-prompt { display:grid; gap:9px; padding:11px; border:1px solid var(--warning-border);
                     border-radius:8px; background:var(--warning-soft); color:var(--txt-soft);
                     font-size:12px; line-height:1.5; }
  .capacity-actions { display:flex; flex-wrap:wrap; gap:7px; }
  .capacity-actions .button { min-height:34px; }
  .capacity-empty { color:var(--dim); font-size:12px; }
  .storage-preparing { animation:storage-scan-pulse 1.4s ease-in-out infinite; }
  @keyframes storage-scan-pulse { 0%,100% { opacity:.45; } 50% { opacity:1; } }
  .capacity-result { margin-bottom:12px; }
  .system-spec-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .system-spec { padding:12px; border:1px solid var(--line); border-radius:9px;
                 background:var(--card-child); }
  .system-spec small, .system-spec strong { display:block; }
  .system-spec small { color:var(--dim); }
  .system-spec strong { margin-top:4px; color:var(--txt); font-size:13px;
                        overflow-wrap:anywhere; }
  .storage-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px;
                     margin-bottom:12px; }
  .storage-consumers { display:grid; gap:8px; }
  .storage-consumer { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px;
                      align-items:center; padding:9px 10px; border:1px solid var(--line);
                      border-radius:8px; background:var(--card-child); }
  .storage-consumer span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .storage-consumer small { color:var(--dim); }
  .performance-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .performance-card { min-width:0; padding:12px; border:1px solid var(--line);
                      border-radius:9px; background:var(--card); }
  .performance-head { display:flex; align-items:baseline; justify-content:space-between;
                      gap:8px; margin-bottom:8px; }
  .performance-head strong { color:var(--txt); font-size:13px; }
  .performance-head span { color:var(--dim); font-size:11px; }
  .performance-chart { width:100%; height:82px; display:block; overflow:visible; }
  .performance-chart .chart-area { fill:var(--accent-soft); }
  .performance-chart .chart-line { fill:none; stroke:var(--cyan); stroke-width:2;
                                   vector-effect:non-scaling-stroke; }
  .performance-empty { color:var(--dim); font-size:11.5px; line-height:1.5; }
  .backup-mode-notice { margin-bottom:13px; padding:12px; border:1px solid var(--warning-border);
                        border-radius:9px; background:var(--warning-soft); color:var(--txt-soft);
                        font-size:12.5px; line-height:1.5; }
  .backup-preview-list { display:grid; gap:7px; margin:0 0 15px; padding:0; list-style:none; }
  .backup-preview-list li { padding:9px 10px; border:1px solid var(--line); border-radius:8px;
                            background:var(--card-child); color:var(--txt-soft); font-size:12px; }
  .backup-suggestion { display:grid; gap:10px; margin-bottom:14px; padding:13px;
                       border:1px solid var(--warning-border); border-radius:9px;
                       background:var(--warning-soft); color:var(--txt-soft);
                       font-size:12.5px; line-height:1.5; }
  .backup-suggestion .button { justify-self:start; }
  .backup-list { display:grid; gap:10px; }
  .backup-card { display:flex; align-items:center; justify-content:space-between; gap:14px;
                 padding:14px; border:1px solid var(--line); border-radius:10px;
                 background:var(--card); }
  .backup-card-copy { min-width:0; display:grid; gap:3px; }
  .backup-card-copy strong { color:var(--txt); font-size:13.5px; overflow-wrap:anywhere; }
  .backup-card-copy time, .backup-card-copy small { color:var(--dim); font-size:11.5px; }
  .backup-result { min-height:20px; margin-bottom:10px; }
  .backup-empty { color:var(--dim); font-size:12px; }
  .restore-dialog { width:min(540px,calc(100vw - 28px)); padding:22px; }
  .restore-warning { margin:12px 0 16px; padding:12px; border:1px solid var(--danger-border);
                     border-radius:8px; background:var(--danger-soft); color:var(--txt-soft);
                     line-height:1.55; }
  .restore-dialog .field { margin-bottom:14px; }
  .restore-dialog code { color:var(--txt); }
  .restore-result { min-height:20px; margin-bottom:10px; }
  .launch-intro { margin-bottom:18px; color:var(--dim); font-size:13px; }
  .field-note { min-height:17px; margin-top:5px; color:var(--dim); font-size:11.5px; }
  .field-optional { color:var(--dim); font-weight:450; }
  .field-error { min-height:18px; margin-top:5px; color:var(--red); font-size:12px; }
  .field-warning { margin-top:7px; padding:8px 10px; border:1px solid var(--warning-border);
                   border-radius:7px; background:var(--warning-soft); color:var(--amber);
                   font-size:11.5px; line-height:1.45; }
  .duplicate-name-suggestion { margin-left:5px; border-color:var(--accent-border);
                               padding:3px 7px; color:var(--blue); font-size:11.5px; }
  .engine-options { border:0; padding:0; }
  .engine-options legend { margin-bottom:7px; color:var(--txt-soft); font-size:13px; font-weight:600; }
  .engine-grid { display:flex; flex-wrap:wrap; gap:8px; }
  .engine-card { position:relative; display:flex; align-items:center; gap:10px; margin:0;
                 min-width:128px; padding:9px 11px; border:1px solid var(--line); border-radius:99px;
                 background:var(--muted-bg); cursor:pointer; }
  .engine-card:hover { border-color:var(--accent-border); }
  .engine-card:has(input:checked) { border-color:var(--cyan); background:var(--accent-soft); }
  .engine-card:has(input:checked)::after { content:'✓'; margin-left:auto; color:var(--cyan);
                                           font-size:11px; font-weight:800; }
  .engine-card.is-unavailable { opacity:.68; cursor:not-allowed; }
  .engine-card.is-unavailable:has(.engine-unavailable-reason) {
                 max-width:250px; border-radius:14px; flex-wrap:wrap; }
  .engine-card .engine-unavailable-reason { flex:1 0 100%; }
  .engine-card[hidden] { display:none; }
  .engine-card input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
  .engine-mark { width:24px; height:24px; display:grid; place-items:center; border-radius:50%;
                 border:1px solid var(--line); color:var(--cyan); font-weight:750; }
  .engine-mark img { width:16px; height:16px; object-fit:contain; display:block; }
  .engine-copy { min-width:0; display:flex; flex-direction:column; }
  .engine-copy strong { color:var(--txt); font-size:13px; }
  .engine-copy small { color:var(--dim); font-size:10px; }
  .launch-mode-note { margin:8px 0 0 25px; }
  .check-in-options { border:0; padding:0; }
  .check-in-options legend { margin-bottom:8px; color:var(--txt-soft); font-size:13px;
                             font-weight:600; }
  .check-in-grid { display:grid; gap:8px; }
  .check-in-choice { display:grid; grid-template-columns:auto minmax(0,1fr); gap:9px;
                     align-items:start; margin:0; padding:10px 11px;
                     border:1px solid var(--line); border-radius:8px;
                     background:var(--muted-bg); cursor:pointer; }
  .check-in-choice:hover { border-color:var(--accent-border); }
  .check-in-choice:has(input:checked) { border-color:var(--cyan);
                                        background:var(--accent-soft); }
  .check-in-choice::before { content:''; width:14px; height:14px; margin-top:2px;
                             border:1px solid var(--line); border-radius:50%; }
  .check-in-choice:has(input:checked)::before { border:4px solid var(--cyan);
                                                background:var(--drawer-bg); }
  .check-in-choice.is-unavailable { opacity:.62; cursor:not-allowed; }
  .check-in-choice > input { position:absolute; width:1px; height:1px; opacity:0;
                             pointer-events:none; }
  .check-in-copy { min-width:0; display:flex; flex-direction:column; color:var(--txt); }
  .check-in-copy small { color:var(--dim); font-weight:400; }
  .routine-handoff { margin-top:9px; display:flex; align-items:center; justify-content:space-between;
                     gap:10px; color:var(--dim); font-size:11px; }
  .routine-handoff .button { flex:0 0 auto; }
  .launch-progress { margin-top:18px; padding:13px; border:1px solid var(--line);
                     border-radius:8px; background:var(--muted-bg); }
  .launch-progress ol { display:grid; gap:9px; list-style:none; padding:0; }
  .launch-step { display:flex; align-items:center; gap:9px; color:var(--slate); font-size:12px; }
  .launch-step::before { content:''; width:8px; height:8px; flex:0 0 auto; border-radius:50%;
                         border:1px solid currentColor; }
  .launch-step.active { color:var(--cyan); }
  .launch-step.active::before { background:var(--cyan); animation:pulse 1.4s infinite; }
  .launch-step.done { color:var(--green); }
  .launch-step.done::before { border-color:var(--green); background:var(--green); }
  .card.newly-launched { border-color:var(--cyan); animation:launch-highlight 2s ease-out 2; }
  @keyframes launch-highlight { 50% { box-shadow:0 0 0 3px var(--accent-medium),0 0 28px var(--accent-border); } }
  /* AR32/round2 (doc 57/65 routine drawer): every routine-scoped rule
     (.routine-*, .run-*, #run-log) that used to live here has moved to
     static/routines/routines.css —
     one source of truth for the routine detail drawer, same "one component,
     one source of truth" principle T495/T496/T497 already applied. See
     routines.css's own "T498 routine detail drawer" section. */
  .file-preview-body img { display:block; max-width:100%; max-height:100%; margin:auto; }
  .html-preview-note { color:var(--dim); font-size:10px; white-space:nowrap; }
  .html-preview-host { display:flex; min-height:0; padding:0; overflow:hidden; }
  .html-preview { width:100%; min-width:0; min-height:0; height:100%; flex:1 1 auto;
                  border:0; background:var(--paper); }
  .pdf-preview-host { display:flex; min-height:0; padding:0; overflow:hidden;
                      container-type:inline-size; background:var(--ui-panel); }
  .pdf-preview { width:100%; height:100%; min-width:0; min-height:0; flex:1 1 auto;
                 display:flex; flex-direction:column; overflow:hidden; }
  .pdf-toolbar { min-width:0; display:flex; align-items:center; gap:5px;
                 background:var(--ui-panel); }
  .pdf-page-count { min-width:48px; color:var(--txt-soft); text-align:center;
                    font:11px/1 ui-monospace,Menlo,monospace; }
  .pdf-zoom-value { width:42px; color:var(--dim); text-align:center;
                    font:11px/1 ui-monospace,Menlo,monospace; }
  .pdf-toolbar .button { min-width:28px; height:28px; padding:3px 6px;
                         border-color:var(--ui-line); background:var(--ui-panel);
                         color:var(--ui-text-soft); box-shadow:none; }
  .pdf-toolbar .button:hover { border-color:var(--ui-accent);
                               background:var(--ui-accent-soft); color:var(--ui-accent); }
  .pdf-toolbar .button[aria-pressed="true"] { color:var(--blue); border-color:var(--accent-border);
                                               background:var(--accent-soft); }
  .pdf-pages { min-height:0; flex:1; overflow:auto; padding:12px 20px;
               background:var(--ui-panel); scroll-behavior:smooth; }
  .pdf-page { position:relative; width:max-content; margin:0 auto 12px;
              background:var(--ui-panel); }
  .pdf-page:last-child { margin-bottom:0; }
  .pdf-page canvas { display:block; background:var(--ui-panel);
                     box-shadow:0 8px 28px var(--shadow-color); }
  .pdf-pages.pdf-fit-width { padding-inline:0; }
  .pdf-pages.pdf-fit-width .pdf-page { max-width:none; margin-inline:0; }
  .pdf-pages.pdf-fit-width .pdf-page canvas {
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ui-line) 65%,transparent);
  }
  .pdf-annotation-layer { position:absolute; top:0; left:0; pointer-events:none; }
  .pdf-annotation-link { position:absolute; pointer-events:auto; border:1px solid transparent;
                         border-radius:2px; background:transparent; }
  .pdf-annotation-link:hover, .pdf-annotation-link:focus-visible {
    border-color:var(--accent-border); background:var(--accent-faint); outline:0;
  }
  .pdf-page-label { display:block; margin-top:6px; color:var(--dim); text-align:center;
                    font:10px/1.3 ui-monospace,Menlo,monospace; }
  @container (max-width:620px) {
    .pdf-pages { padding-block:2px; }
    .pdf-page { margin-bottom:4px; }
    .pdf-page-label { display:none; }
  }
  .pdf-error { min-height:100%; display:grid; place-items:center; padding:28px; }
  .pdf-error-card { max-width:430px; border:1px solid var(--danger-border);
                    border-radius:9px; padding:18px; background:var(--danger-soft); }
  .pdf-error-card strong { display:block; margin-bottom:7px; color:var(--txt); }
  .pdf-error-card p { margin:0; color:var(--dim); line-height:1.55; }
  .pdf-error-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
  .file-preview-empty { min-height:100%; display:grid; place-items:center; color:var(--dim);
                        text-align:center; }
  .file-preview-text { white-space:pre-wrap; overflow-wrap:anywhere; color:var(--txt-soft);
                       font:12.5px/1.6 ui-monospace,Menlo,monospace; }
  .code-preview-host { padding:0; overflow:auto; }
  .code-preview { min-width:max-content; width:100%; padding:14px 0; color:var(--txt);
                  font:12.5px/1.6 ui-monospace,Menlo,monospace; }
  .code-line { min-height:20px; display:grid; grid-template-columns:auto minmax(max-content,1fr); }
  .code-line:hover { background:var(--accent-faint); }
  .code-line-number { position:sticky; left:0; min-width:4.5em; padding:0 13px 0 8px;
                      border-right:1px solid var(--line); background:var(--preview-surface);
                      color:var(--slate); text-align:right; user-select:none; }
  .code-line code { display:block; padding:0 16px; white-space:pre; color:var(--txt); }
  .syntax-comment { color:var(--slate); font-style:italic; }
  .syntax-string { color:var(--green); }
  .syntax-keyword { color:var(--cyan); font-weight:650; }
  .syntax-number { color:var(--amber); }
  .csv-preview-host { padding:0; overflow:hidden; }
  .csv-preview { width:100%; min-width:0; min-height:0; height:100%; display:flex;
                 flex-direction:column; }
  .csv-preview-meta { flex:0 0 auto; padding:9px 13px; border-bottom:1px solid var(--line);
                      color:var(--dim); font-size:11.5px; }
  .csv-preview-scroll { min-width:0; min-height:0; flex:1; overflow:auto; }
  .csv-table { min-width:100%; width:max-content; border-collapse:separate; border-spacing:0;
               color:var(--txt); font-size:12.5px; line-height:1.45; }
  .csv-table th, .csv-table td { max-width:440px; padding:8px 11px; border-right:1px solid var(--line);
                                 border-bottom:1px solid var(--line); text-align:left;
                                 vertical-align:top; white-space:pre-wrap; overflow-wrap:anywhere; }
  .csv-table th { position:sticky; z-index:1; top:0; color:var(--txt); background:var(--card-2);
                  font-weight:650; white-space:nowrap; }
  .csv-table tbody tr:nth-child(even) td { background:var(--card); }
  .csv-table td.csv-numeric { text-align:right; white-space:nowrap;
                              font-family:ui-monospace,Menlo,monospace; color:var(--amber); }
  .csv-too-large { min-height:100%; display:grid; place-items:center; text-align:center; }
  .csv-too-large-card { max-width:390px; color:var(--dim); line-height:1.55; }
  .csv-too-large-card strong { display:block; margin-bottom:6px; color:var(--txt); }
  .csv-too-large-card .button { display:inline-block; margin-top:13px; }
  .markdown-preview { width:100%; max-width:850px; margin:0 auto;
                      color:var(--txt-prose); line-height:1.65; }
  .markdown-preview h1, .markdown-preview h2, .markdown-preview h3,
  .markdown-preview h4, .markdown-preview h5, .markdown-preview h6 {
    margin:1.15em 0 .45em; line-height:1.25; color:var(--txt); }
  .markdown-preview h1:first-child, .markdown-preview h2:first-child { margin-top:0; }
  .markdown-preview p, .markdown-preview ul, .markdown-preview ol,
  .markdown-preview blockquote, .markdown-preview pre { margin:.7em 0; }
  .markdown-preview ul, .markdown-preview ol { padding-left:1.6em; }
  .markdown-preview code { background:var(--code-bg); border-radius:4px; padding:.1em .35em;
                           font:12px/1.5 ui-monospace,Menlo,monospace; }
  .markdown-preview pre { overflow:auto; border:1px solid var(--line); border-radius:8px;
                          background:var(--code-deep); padding:12px; }
  .markdown-preview pre code { padding:0; background:transparent; }
  .markdown-preview blockquote { border-left:3px solid var(--line); color:var(--dim);
                                 padding-left:12px; }
  .markdown-preview a { color:var(--blue); text-underline-offset:2px; }
  .markdown-preview del { color:var(--dim); }
  .markdown-preview hr { margin:1.2em 0; border:0; border-top:1px solid var(--line); }
  .markdown-preview li:has(> input[type="checkbox"]) { list-style:none; }
  .markdown-preview li > input[type="checkbox"] { margin-right:.5em;
                                                    accent-color:var(--cyan); }
  .markdown-preview table { display:block; width:100%; margin:1em 0; overflow-x:auto;
                            border-collapse:separate;
                            border-spacing:0; border:1px solid var(--line);
                            border-radius:8px; overflow:hidden; }
  .markdown-preview th, .markdown-preview td { padding:8px 11px; text-align:left;
                                               border-right:1px solid var(--line);
                                               border-bottom:1px solid var(--line); }
  .markdown-preview th:last-child, .markdown-preview td:last-child { border-right:0; }
  .markdown-preview tr:last-child td { border-bottom:0; }
  .markdown-preview th { color:var(--txt); background:var(--card-2); font-weight:750; }
  .markdown-preview tbody tr:nth-child(even) td { background:var(--card); }

  body.dock-open:not(.standalone) .tab-panel { margin-right:var(--agent-dock-width); }
  .agent-dock { position:fixed; z-index:18; top:var(--agent-dock-top); right:0;
                bottom:var(--cc-visual-viewport-bottom,0px);
                max-height:calc(var(--cc-visual-viewport-height,100dvh) - var(--agent-dock-top));
                padding-right:env(safe-area-inset-right,0px);
                width:var(--agent-dock-width); min-width:320px; display:flex;
                flex-direction:column; overflow:hidden; border-left:1px solid var(--line);
                background:var(--conversation-shell); box-shadow:-18px 0 38px var(--shadow-color);
                transform:translateX(102%); visibility:hidden;
                transition:transform .18s ease,visibility 0s linear .18s; }
  .agent-dock.open { transform:none; visibility:visible; transition-delay:0s; }
  .dock-resize-handle { position:absolute; top:0; bottom:0; left:-3px; }
  .dock-header { position:relative; flex:0 0 auto; min-height:76px; display:grid;
                 grid-template-columns:minmax(0,1fr) 30px; grid-template-rows:auto auto;
                 align-items:center; gap:7px 9px; container-type:inline-size;
                 padding:9px 10px 9px 14px; border-bottom:1px solid var(--line);
                 background:var(--composer-bg); }
  .dock-identity { grid-column:1/-1; grid-row:1; min-width:0; display:flex;
                   align-items:center; gap:7px; }
  .dock-state-label { flex:0 0 auto; color:var(--ui-text-soft);
                      font:600 12px/1.2 ui-monospace,Menlo,monospace; }
  .dock-title { min-width:0; flex:1 1 auto; overflow:hidden; text-overflow:ellipsis;
                white-space:nowrap; font-size:14px; line-height:1.25; }
  .dock-engine { min-width:0; flex:0 1 auto; }
  .dock-engine[hidden] { display:none; }
  .dock-engine .engine-chip { max-width:112px; padding:2px 7px; }
  .dock-engine .engine-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .dock-actions { grid-column:1; grid-row:2; min-width:0; display:flex;
                  align-items:center; justify-content:flex-start; gap:7px; }
  .dock-header .button { min-height:30px; flex:0 0 auto; padding:6px 8px;
                        font-size:12px; }
  .dock-picker-back { max-width:92px; overflow:hidden; text-overflow:ellipsis;
                      white-space:nowrap; }
  .dock-close { grid-column:2; grid-row:2; width:30px; height:30px;
                padding:0 !important; font-size:18px !important; }
  @container (max-width:379px) {
    .dock-identity { align-items:flex-start; }
    .dock-title { min-width:0; max-height:2.5em; overflow:hidden; text-overflow:clip;
                  white-space:normal; overflow-wrap:anywhere; }
    .dock-engine { margin-top:1px; }
  }
  .dock-picker { min-height:0; flex:1; overflow:auto; padding:8px;
                 background:var(--conversation-bg); }
  .dock-picker-search { position:sticky; z-index:2; top:0; width:100%; min-width:0;
                        margin-bottom:8px; background:var(--ui-panel); box-shadow:none; }
  .dock-picker-search:focus-within { border-color:var(--ui-accent); box-shadow:none; }
  .dock-picker-list { display:grid; gap:3px; }
  .dock-agent-option { width:100%; min-width:0; display:grid; gap:5px; padding:10px;
                       border-color:transparent; background:transparent; text-align:left; }
  .dock-agent-option:hover, .dock-agent-option:focus-visible {
    border-color:var(--line); background:var(--accent-faint); }
  .dock-agent-option-title { min-width:0; display:flex; align-items:center; gap:8px; }
  .dock-agent-option-name { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis;
                            white-space:nowrap; color:var(--txt); font-size:13px; }
  .dock-agent-option-snippet { overflow:hidden; color:var(--dim); font-size:11.5px;
                               line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
  .dock-picker-empty { margin:28px 12px; color:var(--dim); text-align:center; }
  .dock-assistant-controls { flex:0 0 auto; display:grid;
                             grid-template-columns:minmax(0,1fr) auto; gap:8px;
                             align-items:center; padding:10px 12px;
                             border-bottom:1px solid var(--line);
                             background:var(--composer-bg); }
  .dock-assistant-controls[hidden] { display:none; }
  .dock-assistant-scope-copy { min-width:0; display:grid; gap:2px; }
  .dock-assistant-scope-copy strong { color:var(--txt); font-size:12px; }
  .dock-assistant-scope-copy span { color:var(--dim); font-size:10.5px; }
  .dock-assistant-channel-toggle { min-height:30px; padding:5px 9px;
                                   color:var(--txt-soft); font-size:11px; }
  .dock-assistant-channel-toggle[aria-checked="true"] {
    border-color:var(--accent-border); background:var(--accent-soft); color:var(--cyan); }
  .dock-assistant-transparency { grid-column:1/-1; border:1px solid var(--line);
                                 border-radius:7px; background:var(--muted-bg); }
  .dock-assistant-transparency summary { padding:7px 9px; color:var(--dim);
                                         cursor:pointer; font-size:10.5px; }
  .dock-assistant-transparency pre { max-height:210px; overflow:auto; margin:0;
                                     padding:9px; border-top:1px solid var(--line);
                                     color:var(--dim); font:10px/1.45 var(--mono);
                                     white-space:pre-wrap; overflow-wrap:anywhere; }
  .dock-transcript { min-height:0; flex:1; overflow:auto; display:flex;
                     flex-direction:column; align-items:stretch; gap:9px; padding:16px 14px;
                     background:var(--conversation-bg); color:var(--txt); }
  .dock-transcript-shell { min-height:0; flex:1 1 auto; }
  .dock-transcript .transcript-block { max-width:100%; }
  .dock-transcript .transcript-operator { width:92%; }
  .session-transcript-loading { min-height:100%; flex:1 1 auto; display:grid;
                                place-items:center; }
  .session-transcript-loading-spinner { width:28px; height:28px;
                                        border:3px solid var(--line); border-top-color:var(--cyan);
                                        border-radius:50%; animation:session-loading-spin .8s linear infinite; }
  @keyframes session-loading-spin { to { transform:rotate(360deg); } }
  @media (prefers-reduced-motion:reduce) {
    .session-transcript-loading-spinner { animation:none; border-top-color:var(--cyan); }
  }
  .transcript-origin-chip { display:inline-flex; align-items:center; margin-left:7px;
                            padding:1px 5px; border:1px solid var(--accent-border);
                            border-radius:999px; background:var(--accent-faint);
                            color:var(--cyan); font-size:9px; font-weight:650;
                            letter-spacing:.01em; vertical-align:middle; }
  .dock-agent-status { flex:0 0 auto; min-height:29px; display:flex; align-items:center;
                       justify-content:center; border-top:1px solid var(--line); padding:5px 12px;
                       background:var(--status-bg); color:var(--dim); font-size:11.5px; }
  .dock-agent-status[data-state="working"] { color:var(--blue); }
  .dock-agent-status[data-state="needs_input"] { color:var(--amber); }
  .dock-agent-status[data-state="awaiting_approval"] {
    color:var(--amber);
    background:var(--warning-soft);
    font-weight:700;
  }
  .dock-composer { flex:0 0 auto; max-height:var(--cc-visual-viewport-height,100dvh);
                   padding:10px 12px max(12px,env(safe-area-inset-bottom,0px));
                   border-top:1px solid var(--line);
                   background:var(--composer-bg); }
  .dock-composer textarea { min-height:96px; max-height:280px; resize:none; overflow-y:hidden; }
  /* T302: one fixed control row — never wrap across dock widths. */
  .dock-composer-row { display:flex; align-items:center; justify-content:flex-end;
                       flex-wrap:nowrap; gap:8px; margin-top:7px; min-width:0; }
  .dock-composer-row > .composer-attachment-actions { flex:0 0 auto; }
  .dock-composer-row > .model-cluster { flex:1 1 auto; min-width:0; margin-right:0; }
  .dock-composer-row > .dock-result:empty { display:none; }
  .dock-composer-row > #dock-instruct-submit { flex:0 0 auto; margin-left:auto; }
  .dock-result { min-width:0; flex:1 1 auto; color:var(--dim); font-size:11px; }
  .dock-force { margin-top:7px; color:var(--amber); font-size:11.5px; }
  .dock-force .button { margin-left:5px; padding:4px 7px; font-size:11px; }

  body.standalone { padding:0; overflow:hidden; }
  body.standalone > .topbar,
  body.standalone > .tab-bar,
  body.standalone > .tab-panel,
  body.standalone > #routine-overlay,
  body.standalone > #settings-drawer,
  body.standalone > #restore-overlay { display:none; }
  body.standalone #session-overlay { position:static; min-height:100dvh; padding:0; background:var(--bg); }
  body.standalone #session-overlay .panel { width:100%; height:100dvh; max-height:none;
                                           border:0; border-radius:0; box-shadow:none; }
  body.standalone #session-close { display:none; }
  body.standalone-agent .agent-dock { display:none; }
  body.standalone-agent:not(.agent-projection-dock) { display:flex; flex-direction:column; min-height:100dvh; }
  body.standalone-agent:not(.agent-projection-dock) > .topbar {
    order:0; display:flex; flex:0 0 auto;
  }
  body.standalone-agent:not(.agent-projection-dock) #session-overlay {
    order:1; flex:1 1 auto; min-height:0; overflow:hidden;
  }
  body.standalone-agent:not(.agent-projection-dock) #session-overlay .panel {
    height:100%; min-height:0;
  }
  body.standalone-agent:not(.agent-projection-dock) #session-overlay .detail-body {
    display:flex; min-height:0; flex:1 1 auto; overflow:hidden;
  }
  body.standalone-agent:not(.agent-projection-dock) #session-overlay .conversation {
    width:100%; min-width:0; min-height:0; flex:1 1 auto;
  }
  .standalone-session-actions { display:flex; align-items:center; gap:6px; min-width:0;
                                 flex:0 1 auto; }
  .standalone-session-identity { display:flex; align-items:baseline; gap:5px; min-width:0;
                                 max-width:220px; color:var(--dim); font-size:11px; }
  .standalone-session-breadcrumb { flex:0 0 auto; color:var(--dim); font-size:10px;
                                   letter-spacing:.04em; text-transform:uppercase; }
  .standalone-session-identity strong { min-width:0; overflow:hidden; color:var(--txt);
                                        font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
  .standalone-session-actions .button { min-height:30px; padding:5px 8px; font-size:11px;
                                        white-space:nowrap; }
  .standalone-session-end { border-color:var(--danger-border); color:var(--red); }

  @media (max-width:820px) {
    .topbar { min-height:62px; align-items:center; padding:10px 16px; }
    .topbar h1 { font-size:18px; }
    .brand-mark { width:30px; height:30px; }
    .health:not(.reconnecting) { display:none; }
    .topbar-actions { gap:8px; }
    .standalone-session-actions { gap:4px; }
    .standalone-session-identity { max-width:130px; }
    .standalone-session-actions .button { min-height:28px; padding:4px 6px; font-size:10.5px; }
    .legend-popover { position:fixed; top:64px; right:10px; }
    #meta { display:none; }
    #launch-open { padding:8px 10px; font-size:12px; }
    .tab-bar { order:3; min-height:58px; padding:5px 8px max(5px,env(safe-area-inset-bottom));
               border-top:1px solid var(--line); border-bottom:0; }
    .tab-link { min-width:0; flex:1; border:0; border-radius:7px; padding:10px 6px;
                font-size:12px; }
    .tab-count { min-width:17px; min-height:17px; margin-left:2px; font-size:9px; }
    .tab-link[aria-selected="true"] { background:var(--accent-soft); }
    .tab-panel { order:2; padding:16px; }
    body.dock-open:not(.standalone) .tab-panel { margin-right:0; }
    .overlay { padding:max(2vh,env(safe-area-inset-top,0px))
                        max(3vw,env(safe-area-inset-right,0px))
                        max(2vh,env(safe-area-inset-bottom,0px))
                        max(3vw,env(safe-area-inset-left,0px)); }
    .panel { height:96vh; }
    .detail-body { display:flex; flex-direction:column; overflow-y:auto; }
    .routine-header-actions { flex-wrap:wrap; justify-content:flex-end; }
    #routine-setup-overlay { padding:12px; }
    #routine-setup-overlay .modal-panel {
      width:calc(100vw - 24px); max-width:calc(100vw - 24px);
      max-height:calc(100dvh - 24px);
    }
    .routine-setup-modal-body { padding:16px 12px; }
    .routine-setup { grid-template-columns:1fr; }
    .routine-setup-help, #routine-setup-result { grid-column:1; }
    .routine-detail-body { display:flex; flex-direction:column; }
    .app-detail-body { grid-template-columns:1fr; }
    .run-list { flex:0 0 auto; max-height:32vh; border-right:0; border-bottom:1px solid var(--line); }
    #run-log { flex:1 1 auto; }
    .conversation { flex:0 0 auto; min-height:55vh; }
    #transcript { padding:16px 14px; gap:9px; }
    .transcript-block { max-width:100%; }
    .transcript-operator { width:92%; }
    .controls { flex:0 0 auto; overflow:visible; border-left:0; border-top:1px solid var(--line); }
    .settings-drawer { width:100vw; }
    .settings-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .system-spec-grid, .performance-grid { grid-template-columns:1fr; }
    .storage-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .agent-dock { z-index:40; top:0; width:100vw; min-width:0; }
    .dock-resize-handle { display:none; }
    .card-quick-actions { opacity:1; pointer-events:auto; transform:none; }
    .approval-card-header { display:grid; gap:8px; }
    .approval-kind { justify-self:start; }
    .approval-actions .button { min-height:44px; flex:1 1 auto; }
    /* T219: genuinely narrow → 2×2; phone-narrow stacks to one column below. */
    .assistant-brain-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .conn-pane-title-row { align-items:flex-start; }
    .connection-add .button { min-height:44px; }
    .secret-add-form { grid-template-columns:1fr; }
  }
  @media (max-width:520px) {
    .assistant-brain-cards { grid-template-columns:1fr; }
  }