/* Work uses the same canvas, surfaces, type and controls as the conversation. */
.work-page { min-width: 0; overscroll-behavior: contain; }
.work-container { width: 100%; max-width: 1160px; margin: 0 auto; padding: 28px 28px 48px; overflow-wrap: anywhere; }
.work-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.work-header > div { min-width: 0; }
.work-header h1 { margin: 4px 0; font-family: var(--display, var(--font)); font-size: 30px; font-weight: 560; line-height: 1.15; }
.work-eyebrow { font-size: 12px; color: var(--secondary); margin: 10px 0 6px; }
.work-header select { width: auto; max-width: 100%; }
.work-toggle { display: flex; align-items: center; gap: 7px; }
.work-notice { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--raised); border-radius: 12px; padding: 12px 16px; margin: 0 0 20px; }
.work-notice[hidden] { display: none; }
.work-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 260px; padding: 36px 20px; text-align: center; color: var(--secondary); }
.work-empty h2 { font: 560 23px var(--display, var(--font)); text-transform: none; letter-spacing: -.02em; color: var(--ink); margin: 4px 0; }
.work-empty p { max-width: 430px; margin: 0 0 8px; }
.work-link { font-size: 13px; color: var(--secondary); text-underline-offset: 3px; }
.work-pre { white-space: pre-wrap; }
.work-error { color: var(--destructive); }
.work-overflow { position: relative; }
.work-overflow > .card { position: absolute; z-index: 10; right: 0; top: 100%; width: max-content; max-width: 280px; display: grid; gap: 10px; box-shadow: var(--shadow-2); }
.work-warning { display: flex; align-items: flex-start; gap: 8px; color: var(--attention); font-size: 13px; }
.work-warning svg { flex: none; margin-top: 2px; }
.nx-review { padding: 18px; border: 1px solid var(--hairline); border-radius: var(--radius); background: var(--surface); }
.work-caption { display: block; color: var(--secondary); font-size: 12px; margin: 6px 0 14px; }
.work-pair-panels { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.work-pair { container-type: inline-size; }
@container (min-width: 560px) { .work-pair-panels { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.work-image-panel { min-width: 0; }
.work-image-panel h4 { font-size: 13px; font-weight: 560; margin: 0; color: var(--secondary); }
.work-image-stage { position: relative; height: 440px; width: 100%; background: var(--canvas); border-radius: 10px; overflow: hidden; }
.work-image-stage img { display: block; width: 100%; height: 100%; object-fit: contain; }
.work-unavailable { display: flex; align-items: center; justify-content: center; padding: 24px; min-height: 140px; color: var(--secondary); background: var(--canvas); border-radius: 10px; }
.work-checks { margin: 0; padding: 0; list-style: none; }
.work-checks li { padding: 14px 0; border-top: 1px solid var(--hairline); }
.work-checks li:first-child { border-top: 0; }
.work-check-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.work-check-line strong { flex: 1; font-weight: 560; min-width: 120px; }
.work-check-line .btn { margin-left: auto; }
.work-check-status { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.work-checks p { margin: 5px 0; font-size: 13px; color: var(--secondary); }
.work-checks details { font-size: 12px; }
.work-checks pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 240px; overflow-y: auto; padding: 12px; background: var(--canvas); border-radius: 8px; }
.work-data-scroll { overflow-x: auto; max-width: 100%; overscroll-behavior-x: contain; }
.work-data-scroll table { border-collapse: collapse; min-width: 100%; font-size: 13px; }
.work-data-scroll th, .work-data-scroll td { text-align: left; padding: 12px; border-top: 1px solid var(--hairline); vertical-align: top; min-width: 130px; max-width: 260px; overflow-wrap: anywhere; }
.work-data-scroll th { font-weight: 560; }
.work-data-scroll tbody th { position: sticky; left: 0; background: var(--surface); box-shadow: 1px 0 var(--hairline); }
.work-flow { padding: 0; list-style: none; }
.work-flow h3 { font-size: 15px; margin-top: 24px; }
.work-attachment + .work-attachment, .work-decision + .work-decision { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--hairline); }
.work-dialog { width: min(640px, calc(100% - 32px)); max-height: calc(100dvh - 48px); padding: 0; border: 1px solid var(--hairline); border-radius: 20px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow-2); }
.work-dialog::backdrop { background: rgba(29,29,31,.35); }
.work-dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; gap: 16px; border-bottom: 1px solid var(--hairline); }
.work-dialog-head h2 { margin: 0; font-size: 17px; color: var(--ink); text-transform: none; letter-spacing: 0; }
.work-dialog-body { padding: 20px 22px 24px; }
.work-setting-section { border-top: 1px solid var(--hairline); padding-top: 12px; }
.work-setting-section summary { margin-bottom: 12px; }
@media (max-width: 719px) {
  .work-container { padding: 20px 16px 32px; }
  .work-header { align-items: flex-start; flex-direction: column; gap: 16px; margin-bottom: 22px; }
  .work-header h1 { font-size: 27px; }
  .work-header > .actions-row { width: 100%; }
  .nx-review { padding: 14px; }
  .work-image-stage { height: 390px; }
  .work-check-line { gap: 6px; }
  .work-dialog-head, .work-dialog-body { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) { .work-page * { scroll-behavior: auto; } }

/* A persistent session workspace. Only transcripts and boards scroll. */
.work-page { overflow: hidden; }
.work-workspace { height: 100%; min-height: 0; display: grid; grid-template-columns: 280px minmax(0, 1fr); overflow: hidden; }
.work-session { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.work-session .work-header { padding: 16px 18px; margin: 0; gap: 10px; border-bottom: 1px solid var(--hairline); flex-wrap: wrap; }
.work-top { flex: none; }
.work-top .work-notice { margin: 8px; font-size: 12px; }
@media (max-width: 719px) {
  .work-workspace { display: flex; }
  .work-workspace > .work-sessions, .work-workspace > .work-session { width: 100%; flex: 1; }
  .work-workspace > .work-session { display: none; }
  .work-workspace.has-session > .work-sessions, .work-workspace.is-new > .work-sessions { display: none; }
  .work-workspace.has-session > .work-session, .work-workspace.is-new > .work-session { display: flex; }
}

/* =====================================================================
   Work, second iteration: its own sidebar, the conversation with its
   technical cards, the switcher and settings. Same canvas, type and
   controls as the rest of Nexus; nothing here shouts.
   ===================================================================== */
.work-page, .work-dialog, .work-popover, .work-menu {
  --diff-add: #edf6ee; --diff-add-edge: #deeee1; --diff-del: #fdf0f0; --diff-del-edge: #f8e1e2; --diff-gutter: #faf9f7;
}
.work-page [hidden], .work-dialog [hidden], .work-popover [hidden] { display: none !important; }
.work-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.work-busy { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--secondary); }
.work-chevron { flex: none; display: grid; place-items: center; color: var(--tertiary); transition: transform 0.12s; }
[aria-expanded="true"] > .work-chevron { transform: rotate(90deg); }
.work-delta { display: inline-flex; gap: 6px; font: 560 12px/1 var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.work-delta .add { color: var(--verified); }
.work-delta .del { color: var(--destructive); }
.work-delta .none { color: var(--tertiary); font-weight: 450; }
.work-card-note { margin: 0; font-size: 12px; line-height: 1.45; color: var(--tertiary); }
.work-card-note.bad { color: var(--destructive); }
.work-card-note.warn { color: var(--attention); }
.work-page .link-btn, .work-dialog .link-btn { padding: 2px 0; }
.work-page button:focus-visible, .work-dialog button:focus-visible, .work-popover button:focus-visible, .work-page a:focus-visible, .work-dialog summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

/* Session state as a glyph: amber ring, green check in a circle, dotted ring, then check, pause, cross. */
.work-glyph { display: block; flex: none; color: var(--tertiary); }
.work-glyph.is-needs_you { color: var(--attention); }
.work-glyph.is-failed { color: var(--destructive); }
.work-glyph.is-ready { color: var(--verified); }
.work-glyph.is-working, .work-glyph.is-sent_back, .work-glyph.is-approved { color: var(--secondary); }
.work-glyph.is-done { color: var(--secondary); }
.work-glyph-spin { transform-origin: 9px 9px; animation: work-spin 7s linear infinite; }
@keyframes work-spin { to { transform: rotate(360deg); } }

/* ---------- sidebar ---------- */
.work-sessions { display: flex; flex-direction: column; min-width: 0; min-height: 0; border-right: 1px solid var(--hairline); background: rgba(251, 250, 247, 0.55); }
.work-side-head { flex: none; display: grid; gap: 8px; padding: 16px 16px 6px; }
.work-side-top { display: flex; align-items: center; gap: 8px; height: 32px; }
.work-home { flex: none; display: grid; place-items: center; width: 28px; height: 28px; margin-left: -3px; border-radius: 8px; transition: background 0.12s; }
.work-home:hover { background: var(--fill); }
.work-home img { display: block; width: 22px; height: 22px; }
.work-side-title { flex: 1; font-size: 13px; font-weight: 560; color: var(--secondary); }
.work-side-more { width: 32px; height: 32px; margin-right: -7px; border-radius: 9px; color: var(--secondary); }
.work-switcher {
 display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; height: 40px; padding: 0 10px 0 12px;
 text-align: left;

}
.work-switcher svg { flex: none; color: var(--tertiary); }
.work-switcher-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Lines up with the session rows below: the plus sits in their glyph column. */
.work-new-session {
 display: flex; align-items: center; gap: 10px; height: 34px; margin: 0 -8px; padding: 0 10px;
 text-align: left;
}
.work-new-session svg { flex: none; width: 18px; color: var(--secondary); }
.work-side-jobs:empty { display: none; }
.work-side-jobs { display: grid; gap: 4px; }
.work-side-job { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; border: 0; border-radius: 9px; background: var(--fill); color: var(--secondary); font-size: 12px; text-align: left; cursor: pointer; }
.work-side-job span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Rows fade out under the header as they scroll, so nothing is cut off hard. */
.work-side-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 8px 16px; -webkit-mask-image: linear-gradient(to bottom, transparent, #000 10px); mask-image: linear-gradient(to bottom, transparent, #000 10px); }
.work-side-label { display: flex; align-items: baseline; gap: 6px; margin: 20px 10px 8px; font: 500 11px/1 var(--font); letter-spacing: 0; text-transform: none; color: var(--secondary); }
.work-side-list > .work-side-section:first-child > .work-side-label { margin-top: 10px; }
.work-side-count { color: var(--tertiary); font-variant-numeric: tabular-nums; }
.work-side-project + .work-side-project { margin-top: 14px; border-top: 1px solid var(--hairline); }
.work-side-project-name { display: flex; align-items: baseline; gap: 6px; margin: 14px 10px 0; font: 600 12.5px/1.3 var(--font); letter-spacing: 0; text-transform: none; color: var(--ink); }
.work-side-project-name > button { min-width: 0; margin: -3px -6px; padding: 3px 6px; border: 0; border-radius: 7px; background: none; color: inherit; font: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.work-side-project-name > button:hover { background: var(--fill); }
.work-side-project-name .work-side-count { font-weight: 500; font-size: 11px; }
.work-side-project .work-side-label { margin-top: 12px; }
.work-session-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; }
.work-session-item { position: relative; border-radius: 10px; transition: background 0.12s; }
.work-session-item:hover { background: var(--fill); }
.work-session-item.selected { background: var(--surface); box-shadow: inset 0 0 0 1px var(--hairline); }
.work-session-row { display: grid; grid-template-columns: 18px minmax(0, 1fr); column-gap: 10px; align-items: start; min-height: 54px; padding: 10px 10px; text-decoration: none; }
.work-session-glyph { display: grid; place-items: center; width: 18px; height: 18px; }
.work-session-text { display: grid; min-width: 0; }
.work-session-title { font-size: 13px; line-height: 18px; font-weight: 560; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-session-meta { display: flex; align-items: center; font-size: 11px; line-height: 16px; color: var(--secondary); white-space: nowrap; font-variant-numeric: tabular-nums; }
.work-session-meta { overflow: hidden; }
.work-session-meta > span { flex: none; white-space: pre; }
.work-session-meta > [hidden] { display: none; }
.work-session-meta .work-delta { display: inline; font: inherit; font-weight: 500; }
.work-session-meta .work-delta .del { margin-left: 0; }
.work-session-meta .work-delta .del::before { content: none; }
/* The row's menu shows on hover and focus, and always where there is no hover. */
.work-session-menu { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 7px; color: var(--secondary); opacity: 0; transition: opacity 0.12s; }
.work-session-item:hover .work-session-menu, .work-session-item:focus-within .work-session-menu, .work-session-menu[aria-expanded="true"] { opacity: 1; }
.work-session-item:hover .work-session-row, .work-session-item:focus-within .work-session-row, .work-session-item:has(.work-session-menu[aria-expanded="true"]) .work-session-row { padding-right: 34px; }
.work-session-item:has(.work-session-menu[aria-expanded="true"]):not(.selected) { background: var(--fill); }
@media (hover: none) { .work-session-menu { opacity: 1; } .work-session-row { padding-right: 34px; } }
input[type="text"].work-session-rename { width: calc(100% + 6px); height: 26px; margin: -4px 0 -4px -6px; padding: 0 6px; }
.work-session-item.is-renaming .work-session-row { align-items: center; }
/* Stopping from the list asks in the row itself. */
.work-session-item.is-confirming { background: #faf6ec; }
.work-session-confirm { display: grid; gap: 8px; margin-top: 2px; outline: none; }
.work-session-confirm-text { font-size: 12px; line-height: 1.4; color: var(--secondary); white-space: normal; }
.work-session-confirm-actions { display: flex; gap: 6px; margin-left: -2px; }
.work-session-confirm .btn.small { height: 28px; padding: 0 10px; }
.work-side-section[data-group="earlier"] .work-session-title { font-weight: 500; color: var(--secondary); }
.work-side-section[data-group="earlier"] .work-session-item.selected .work-session-title { color: var(--ink); }
.work-side-section[data-group="earlier"] .work-delta > span { color: var(--tertiary); }
.work-side-more-rows { display: block; margin: 4px 10px 0 38px; color: var(--tertiary); }
.work-side-empty { display: grid; gap: 6px; padding: 18px 10px; }
.work-side-empty strong { font-size: 13px; font-weight: 600; }
.work-side-empty p { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--secondary); }
.work-side-empty-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
@media (min-width: 720px) { .work-sessions .work-side-empty-actions.is-repeat { display: none; } }
.work-side-loading { display: grid; gap: 8px; padding: 14px 6px; }
.work-side-loading span, .work-opening-lines span, .work-skeleton span { display: block; border-radius: 8px; background: linear-gradient(100deg, var(--raised) 30%, #f7f5f1 50%, var(--raised) 70%) 0 0 / 300% 100%; animation: nx-shimmer 1.4s ease-in-out infinite; }
.work-side-loading span { height: 44px; border-radius: 10px; }
.work-side-foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 40px; padding: 6px 16px; border-top: 1px solid var(--hairline); }
.work-side-archived { color: var(--tertiary); font-size: 12px; }
.work-side-note { display: flex; align-items: center; gap: 7px; margin: 12px 10px 0; font-size: 12px; color: var(--secondary); }
.work-side-note + .work-side-section > .work-side-label { margin-top: 14px; }

/* ---------- menus and the project switcher ---------- */
.work-menu, .work-popover { position: fixed; z-index: 40; border: 1px solid var(--hairline); border-radius: 12px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow-2); animation: work-pop 0.12s ease-out; }
@keyframes work-pop { from { opacity: 0; } }
.work-menu { min-width: 184px; max-width: 290px; padding: 5px; }
.work-menu-item { display: flex; align-items: flex-start; gap: 9px; width: 100%; padding: 7px 10px; line-height: 18px; text-align: left; }
.work-menu-item:hover, .work-menu-item:focus-visible { outline: none; }
.work-menu-icon { flex: none; display: grid; place-items: center; height: 18px; color: var(--secondary); }
.work-menu-item.danger:not([aria-disabled="true"]) .work-menu-icon, .work-menu-item[aria-disabled="true"] .work-menu-icon { color: inherit; }
.work-menu-text { flex: 1; min-width: 0; display: grid; gap: 1px; }
.work-menu-note { font-size: 11.5px; line-height: 1.35; color: var(--tertiary); }
.work-menu-check { flex: none; display: grid; place-items: center; height: 18px; margin-left: auto; color: var(--ink); }
.work-menu-rule { height: 1px; margin: 5px 0; background: var(--hairline); }
.work-menu-info { padding: 6px 10px; font-size: 11.5px; line-height: 1.45; color: var(--tertiary); }
.work-switcher-pop { display: flex; flex-direction: column; overflow: hidden; }
.work-pop-search { flex: none; display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border-bottom: 1px solid var(--hairline); color: var(--tertiary); }
.work-pop-search input[type="text"] { flex: 1; min-width: 0; padding: 0; }
.work-switcher-list { flex: 1; min-height: 0; overflow-y: auto; list-style: none; margin: 0; padding: 5px; }
.work-switcher-option { display: flex; align-items: baseline; gap: 8px; padding: 7px 10px; border-radius: 8px; font-size: 13px; line-height: 18px; cursor: pointer; }
.work-switcher-option.active { background: var(--fill); }
.work-switcher-option-name { flex: none; max-width: 60%; font-weight: 560; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-switcher-option-repo { flex: 1; min-width: 0; font-size: 12px; color: var(--tertiary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-switcher-option .work-menu-check { align-self: center; }
.work-switcher-option.is-all:not(:last-child) { margin-bottom: 6px; }
.work-switcher-option.is-all:not(:last-child)::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; border-top: 1px solid var(--hairline); }
.work-switcher-option { position: relative; }
.work-switcher-none { padding: 14px 10px; font-size: 12.5px; color: var(--secondary); }
.work-pop-actions { flex: none; display: grid; padding: 5px; border-top: 1px solid var(--hairline); }
.work-pop-action { display: flex; align-items: center; gap: 9px; padding: 7px 10px; text-align: left; }
.work-pop-action svg { color: var(--secondary); }

/* ---------- the conversation ---------- */
.work-session { container-type: inline-size; }
.work-session .work-header { flex-wrap: nowrap; gap: 10px; min-height: 53px; padding: 10px 12px 10px 20px; }
.work-session .work-header > .icon-btn { display: none; flex: none; width: 34px; height: 34px; }
/* The title is a button that fills its heading exactly, so it is the title that truncates, and last. */
.work-session-heading { flex: 1; display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; margin-left: -6px; padding: 3px 0; }
.work-session .work-header h1 { flex: 0 1 auto; min-width: 0; margin: 0; font-size: 16px; font-weight: 560; line-height: 26px; letter-spacing: -0.012em; white-space: nowrap; }
.work-title { display: block; box-sizing: border-box; max-width: 100%; padding: 0 6px; margin: 0; font: inherit; letter-spacing: inherit; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-session .work-header h1:has(.work-title-input) { flex: 1 1 auto; max-width: 56ch; }
.work-session .work-header h1:has(.work-title-input) + .work-eyebrow { display: none; }
input[type="text"].work-title-input { display: block; width: 100%; height: 28px; margin: -1px 0; padding: 0 5px; font: inherit; letter-spacing: inherit; }
.work-session .work-eyebrow { flex: 1 100 0; min-width: 0; margin: 0; font-size: 12px; color: var(--tertiary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-confirm-host:empty { display: none; }
.work-session .work-header > .actions-row { flex: none; flex-wrap: nowrap; gap: 6px; width: auto; padding: 0; }
.work-state { display: inline-flex; align-items: center; gap: 6px; margin-right: 6px; white-space: nowrap; }
.work-session-actions { width: 30px; height: 30px; border-radius: 9px; color: var(--secondary); }
@container (max-width: 760px) { .work-header-branch { display: none; } }
@container (max-width: 640px) { .work-session .work-eyebrow { display: none; } }
@container (max-width: 460px) { .work-state > span { display: none; } }
.work-session { overflow: clip; }
.work-transcript { position: relative; flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 20px 16px; }
.work-column { width: 100%; max-width: 760px; margin: 0 auto; }
.work-earlier:not(:empty) { display: flex; justify-content: center; padding-top: 12px; }
.work-conversation .msg { margin: 20px 0; }
.work-conversation .bubble { max-width: 100%; }
.work-stream { white-space: pre-wrap; margin: 12px 0; font-size: 14px; }
.work-stream:empty, .work-attention:empty, .work-live-steps:empty { display: none; }
.work-attention { display: grid; gap: 10px; margin: 16px 0; }
/* Why the session waits, in the server's sentence, where he is about to type. */
.work-blocked { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; line-height: 1.45; color: var(--secondary); }
.work-operation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--hairline); border-radius: 14px; background: var(--surface); }
.work-steps { margin: 14px 0; color: var(--secondary); font-size: 12.5px; }
.work-steps summary { cursor: pointer; padding: 5px 0; }
.work-steps p, .work-steps details { margin: 5px 0 5px 12px; }
.work-composer.composer { flex: none; display: block; padding: 6px 20px max(14px, env(safe-area-inset-bottom)); box-shadow: none; }
.work-composer.composer > * { max-width: 760px; margin-inline: auto; }
.work-composer.composer textarea { min-width: 0; max-height: 240px; resize: none; }
.work-composer.composer .composer-foot { display: flex; min-height: 26px; font-size: 11.5px; line-height: 1.4; }
.work-opening { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.work-opening .work-header { min-height: 53px; }
.work-opening-lines { display: grid; gap: 12px; padding: 28px 20px; }
.work-opening-lines span { height: 14px; }
.work-opening-lines span:nth-child(1) { width: 46%; margin-left: auto; height: 38px; border-radius: 18px; }
.work-opening-lines span:nth-child(2) { width: 78%; }
.work-opening-lines span:nth-child(3) { width: 58%; }

/* A review that is ready: one card in the conversation, with the way in. */
.work-round { margin: 16px 0; padding: 12px; border: 1px solid var(--hairline); border-radius: 14px; background: var(--surface); }
.work-round.is-ready { border-color: rgba(31, 122, 53, 0.3); }
.work-round-head { display: flex; align-items: center; gap: 8px; min-height: 30px; }
.work-round-head strong { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 600; }
.work-round.is-ready .work-round-head .work-file-icon { color: var(--verified); }
.work-round-state { font-size: 12px; color: var(--tertiary); }
.work-round-summary { margin: 4px 0 0 26px; font-size: 13px; line-height: 1.5; color: var(--secondary); }
.work-round-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 0 26px; font-size: 12px; color: var(--tertiary); }
.work-round-meta .work-warning { font-size: 12px; }

/* New session: one question in the middle of the room. */
.work-new .work-header { display: none; }
.work-new-body { flex: 1; min-height: 0; overflow-y: auto; display: grid; place-items: center; padding: 24px 20px; }
.work-new-center { width: 100%; max-width: 640px; margin-top: -7vh; }
.work-new-title { margin: 0 0 6px; font-family: var(--display); font-size: 28px; font-weight: 560; line-height: 1.15; letter-spacing: -0.022em; }
.work-new-lede { margin: 0 0 18px; font-size: 13px; color: var(--tertiary); }
.work-new .work-composer.composer { padding: 0; }
.work-new .composer-foot { justify-content: space-between; }
select.work-new-project { width: auto; max-width: 220px; margin: 0; padding: 3px 8px; }
.work-new-suggested:empty { display: none; }
.work-new-hint { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 8px 12px; border: 1px dashed rgba(29, 29, 31, 0.16); border-radius: 11px; background: none; color: var(--secondary); font-size: 12.5px; text-align: left; cursor: pointer; }
.work-new-hint:hover { background: var(--fill); }
.work-new-hint > span { text-align: left; }
.work-new-hint .work-link { white-space: nowrap; font-size: inherit; }
.work-new .work-empty { min-height: 0; padding: 0; align-items: flex-start; text-align: left; }
.work-new .work-empty h2 { margin: 0; font-size: 24px; }
.work-advanced { width: min(620px, calc(100% - 32px)); }

/* ---------- technical cards ---------- */
.work-card { margin: 10px 0; border: 1px solid var(--hairline); border-radius: 14px; background: var(--surface); font-size: 13px; overflow: hidden; }
.work-card-head { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 12px; }
.work-card-title { flex: 1; min-width: 0; font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-card-aside { flex: none; font-size: 12px; color: var(--tertiary); font-variant-numeric: tabular-nums; }
.work-card > .work-card-note, .work-file-diff > .work-card-note, .work-diff-wrap > .work-card-note, .work-output-wrap > .work-card-note { padding: 8px 12px; border-top: 1px solid var(--hairline); }
.work-card-unknown { margin: 10px 0; padding: 9px 12px; border: 1px dashed rgba(29, 29, 31, 0.15); border-radius: 12px; font-size: 12.5px; color: var(--tertiary); }
.work-live-dot { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--secondary); animation: pulse-dot 1.6s ease-in-out infinite; }
.work-file-icon { flex: none; display: grid; place-items: center; width: 18px; color: var(--tertiary); }
/* File changes: the header's total, then one row per file that opens its diff. */
.work-file-list { list-style: none; margin: 0; padding: 0; }
.work-file { border-top: 1px solid var(--hairline); }
.work-file-row, .work-card-row { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 0 12px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background 0.12s; }
.work-file-row:hover, .work-card-row:hover { background: rgba(29, 29, 31, 0.028); }
.work-file-row:focus-visible, .work-card-row:focus-visible { outline-offset: -2px !important; }
.work-file-name { flex: none; max-width: 60%; font-family: inherit; font-weight: 560; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-file-dir { min-width: 0; font-size: 12px; color: var(--tertiary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-file-note { flex: none; font-size: 11.5px; color: var(--tertiary); white-space: nowrap; }
.work-file-end { flex: none; margin-left: auto; padding-left: 8px; }
.work-file-diff { border-top: 1px solid var(--hairline); }
.work-skeleton { display: grid; gap: 7px; padding: 12px; }
.work-skeleton span { height: 10px; border-radius: 5px; }
.work-skeleton span:nth-child(2) { width: 82%; }
.work-skeleton span:nth-child(3) { width: 61%; }
/* The diff: numbered lines, scrolling inside itself; added and removed lines have a sign and a tint. */
.work-diff { position: relative; max-height: min(62vh, 540px); overflow: auto; overscroll-behavior: contain; font: 12px/18px var(--mono); tab-size: 4; }
.work-diff-lines { min-width: 100%; border-collapse: collapse; }
.work-diff-line td { padding: 0; vertical-align: top; white-space: pre; }
.work-diff-no { position: sticky; left: 0; width: 36px; min-width: 36px; padding: 0 7px 0 3px !important; background: var(--diff-gutter); color: var(--tertiary); text-align: right; -webkit-user-select: none; user-select: none; font-variant-numeric: tabular-nums; }
.work-diff-no + .work-diff-no { left: 36px; box-shadow: 1px 0 0 var(--hairline); }
.work-diff-no::before, .work-diff-sign::before { content: attr(data-n); }
.work-diff-sign { width: 22px; min-width: 22px; text-align: center; color: var(--tertiary); -webkit-user-select: none; user-select: none; }
.work-diff-text { padding-right: 20px !important; }
.work-diff-line.add td { background: var(--diff-add); }
.work-diff-line.add .work-diff-no { background: var(--diff-add-edge); color: #3c6b47; }
.work-diff-line.add .work-diff-sign { color: var(--verified); }
.work-diff-line.del td { background: var(--diff-del); }
.work-diff-line.del .work-diff-no { background: var(--diff-del-edge); color: #9a4a50; }
.work-diff-line.del .work-diff-sign { color: var(--destructive); }
.work-diff-line.hunk td, .work-diff-line.note td { background: var(--diff-gutter); color: var(--tertiary); font-size: 11px; line-height: 24px; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.work-diff-line.hunk:first-child td { border-top: 0; }
.work-diff-line.note td { font-style: italic; }
/* A command: what ran, how it ended, how long it took. Output opens underneath. */
.work-command-text { flex: 1; min-width: 0; font: 12.5px/1.4 var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-outcome { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--secondary); white-space: nowrap; }
.work-outcome.bad { color: var(--destructive); }
.work-outcome .spinner { width: 12px; height: 12px; }
.work-outcome-mark { display: grid; place-items: center; color: var(--tertiary); }
.work-outcome-mark.ok { color: var(--verified); }
.work-outcome-mark.bad { color: var(--destructive); }
.work-outcome-time { color: var(--tertiary); font-variant-numeric: tabular-nums; }
.work-outcome-time::before { content: "·"; margin-right: 6px; }
.work-command-body { display: grid; gap: 6px; padding: 10px 0 0; border-top: 1px solid var(--hairline); }
.work-command-body > .work-card-note, .work-command-full { padding: 0 12px; }
.work-command-full { display: flex; align-items: flex-start; gap: 6px; }
.work-command-full code { flex: 1; min-width: 0; padding-top: 5px; font: 12.5px/1.5 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.work-command-output { margin-top: 4px; }
.work-command-output > .work-card-note { padding: 0 12px 12px; }
.work-output { margin: 0; max-height: 320px; overflow: auto; overscroll-behavior: contain; padding: 10px 12px; border-top: 1px solid var(--hairline); background: var(--diff-gutter); font: 12px/18px var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
/* Tests: counts in words, failures first. */
.work-test-counts { flex: none; display: inline-flex; gap: 12px; font-size: 12px; color: var(--secondary); }
.work-test-count b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.work-test-count.failed:not(.none), .work-test-count.failed:not(.none) b { color: var(--destructive); }
.work-test-count.did_not_run, .work-test-count.did_not_run b { color: var(--attention); }
.work-test-count.none, .work-test-count.none b { color: var(--tertiary); font-weight: 500; }
.work-test-failures { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--hairline); }
.work-test-failure { display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; }
.work-test-failure + .work-test-failure { border-top: 1px solid var(--hairline); }
.work-test-failure .work-outcome-mark { height: 18px; }
.work-test-failure strong { font-size: 13px; font-weight: 560; line-height: 18px; }
.work-test-failure p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--secondary); overflow-wrap: anywhere; }
.work-card-more { display: flex; align-items: center; gap: 6px; width: 100%; padding: 8px 12px; border: 0; border-top: 1px solid var(--hairline); background: none; color: var(--secondary); font-size: 12px; cursor: pointer; }
/* The plan: read-only. */
.work-plan-steps { list-style: none; margin: 0; padding: 0 12px 11px; display: grid; gap: 7px; }
.work-plan-step { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 18px; }
.work-plan-step .work-glyph { margin-top: 1px; }
.work-plan-step.done { color: var(--secondary); }
.work-plan-step.doing { font-weight: 560; }
/* Lookups: one quiet line that opens into what was read and searched. */
.work-card.work-lookups { border: 0; background: none; border-radius: 9px; }
.work-lookups .work-card-row { min-height: 32px; padding: 0 12px; border-radius: 9px; color: var(--secondary); }
.work-lookups .work-card-title { flex: 0 1 auto; font-weight: 500; }
.work-lookup-list { list-style: none; margin: 2px 0 4px; padding: 0 12px 0 38px; display: grid; gap: 5px; font-size: 12.5px; color: var(--secondary); }
.work-lookup-list li { display: flex; align-items: center; gap: 7px; min-width: 0; }
.work-lookup-list code { font: 12px var(--mono); overflow-wrap: anywhere; }
.work-lookup-query { color: var(--ink); }
/* A finished pass folds to one line; its file changes stay in view. */
.work-pass { margin: 14px 0; }
.work-pass-summary { display: flex; align-items: center; gap: 6px; max-width: 100%; margin-left: -8px; padding: 5px 10px 5px 6px; line-height: 18px; text-align: left; }
.work-pass-text { min-width: 0; }
.work-pass-text .bad { color: var(--destructive); }
.work-pass-text .warn { color: var(--attention); }
.work-pass-dot { color: var(--tertiary); }
.work-pass.is-folded > .work-card:not(.work-files) { display: none; }
.work-pass > .work-card:last-child { margin-bottom: 0; }
/* Compaction: a quiet line across the conversation. */
.work-compaction { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 12px; margin: 18px 0; }
.work-compaction::before, .work-compaction::after { content: ""; flex: 1; border-top: 1px solid var(--hairline); }
.work-compaction-line { order: 0; display: inline-flex; align-items: center; gap: 7px; padding: 4px 8px; border: 0; border-radius: 999px; background: none; color: var(--tertiary); font-size: 12px; cursor: pointer; }
.work-compaction-line:hover { color: var(--secondary); background: var(--fill); }
.work-compaction::after { order: 1; }
.work-compaction-detail { order: 2; flex: 0 0 100%; margin: 6px auto 0; max-width: 52ch; font-size: 12px; line-height: 1.5; color: var(--tertiary); text-align: center; }
/* Suggested settings: each command in plain words, the exact command under it, one Apply. */
.work-settings-card { border-color: rgba(29, 29, 31, 0.13); }
.work-settings-card .work-card-head { min-height: 44px; padding-right: 6px; }
.work-settings-card .work-settings-lede { margin: -4px 0 0; padding: 0 12px 11px 38px; font-size: 12.5px; color: var(--secondary); }
.work-setting-list { list-style: none; margin: 0; padding: 0; }
.work-setting { display: grid; gap: 4px; padding: 12px 12px 12px 38px; border-top: 1px solid var(--hairline); }
.work-setting-head { display: flex; align-items: center; gap: 8px; }
.work-setting-head strong { font-size: 13.5px; font-weight: 600; }
.work-setting-slot { padding: 1px 7px; border-radius: 999px; background: var(--fill); color: var(--secondary); font-size: 11px; }
.work-setting-reason { margin: 0; font-size: 13px; line-height: 1.45; color: var(--secondary); }
.work-setting-command { display: flex; align-items: center; gap: 4px; margin-top: 4px; padding: 3px 4px 3px 10px; border: 1px solid var(--hairline); border-radius: 9px; background: var(--canvas); }
.work-setting-command code { flex: 1; min-width: 0; padding: 4px 0; font: 12.5px/1.5 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.work-setting-edit { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; margin-top: 4px; }
.work-setting-edit label { font-size: 12px; }
.work-setting-edit .wide { grid-column: 1 / -1; }
.work-setting-edit textarea, .work-setting-edit input { width: 100%; min-width: 0; padding: 7px 9px; font: 12.5px/1.5 var(--mono); outline: none; }
.work-setting-edit textarea { resize: vertical; }
.work-setting-error { padding: 10px 12px 10px 38px; border-top: 1px solid var(--hairline); background: #fdf7f7; color: var(--destructive); font-size: 12.5px; }
.work-setting-error p { margin: 0; }
.work-setting-error ul { margin: 6px 0 0; padding: 0; list-style: none; color: var(--secondary); }
.work-setting-error code { font: 12px var(--mono); color: var(--ink); }
.work-settings-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 12px 10px 38px; border-top: 1px solid var(--hairline); }
.work-settings-foot .work-card-note, .work-settings-content .work-settings-foot .work-card-note { margin: 0 0 0 auto; text-align: right; }
.work-settings-card.is-settled .work-setting-head strong { font-weight: 560; }
.work-settings-card.is-settled .work-settings-lede { color: var(--ink); font-weight: 560; }

/* ---------- sheets: add a repository, new project, settings ---------- */
.work-sheet { width: min(540px, calc(100% - 32px)); max-height: min(80dvh, 720px); border-radius: 18px; overflow: hidden; box-shadow: 0 30px 90px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.04); }
.work-sheet[open] { display: flex; flex-direction: column; animation: work-pop 0.14s ease-out; }
.work-sheet::backdrop { background: rgba(24, 22, 20, 0.36); }
.work-sheet-head { flex: none; display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 10px 8px 20px; border-bottom: 1px solid var(--hairline); }
.work-sheet-head h2 { flex: 1; min-width: 0; margin: 0; font: 600 15px/1.3 var(--font); letter-spacing: 0; text-transform: none; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-sheet-head .icon-btn { width: 34px; height: 34px; }
.work-sheet-body { position: relative; flex: 1; min-height: 0; overflow-y: auto; padding: 18px 20px 20px; outline: none; }
.work-form { display: grid; gap: 12px; }
.work-form .actions-row { margin-top: 4px; }
.work-private { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 12.5px; color: var(--secondary); }
.work-private strong { color: var(--ink); font-weight: 600; }
.work-create-state, .work-create-confirm { display: grid; gap: 10px; }
.work-create-question { display: flex; align-items: flex-start; gap: 9px; margin: 0; font-size: 14.5px; line-height: 1.5; }
.work-create-confirm .work-create-question { display: block; font-size: 16px; }
.work-create-question .work-glyph { margin-top: 2px; }
/* Add a repository */
.work-repos { width: min(620px, calc(100% - 32px)); height: min(76dvh, 680px); }
.work-repos .work-sheet-body { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.work-repo-search { height: 46px; padding-right: 6px; }
.work-repo-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.work-repo-notices:empty { display: none; }
.work-repo-warning { display: flex; align-items: flex-start; gap: 8px; margin: 8px 10px 0; padding: 8px 10px; border-radius: 9px; background: #faf6ec; color: var(--attention); font-size: 12.5px; line-height: 1.45; }
.work-repo-warning svg { flex: none; margin-top: 2px; }
.work-repo-list, .work-choose-project { list-style: none; margin: 0; padding: 6px; }
.work-choose-project { padding: 0; margin: 0 -10px; }
.work-repo-row { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; padding: 7px 10px; font: inherit; text-align: left; }
.work-repo.is-off .work-repo-text, .work-repo.is-off .work-file-icon { opacity: 0.5; }
.work-repo-text { flex: 1; min-width: 0; display: grid; gap: 1px; }
.work-repo-name { display: flex; align-items: center; min-width: 0; font-size: 13.5px; font-weight: 560; line-height: 18px; white-space: nowrap; overflow: hidden; }
.work-repo-owner { color: var(--tertiary); font-weight: 450; }
.work-repo-private { flex: none; display: inline-flex; align-items: center; gap: 3px; margin-left: 8px; color: var(--tertiary); font-size: 11px; font-weight: 500; line-height: 16px; }
.work-repo-sub { font-size: 12px; line-height: 16px; color: var(--tertiary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-repo-state { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--tertiary); }
.work-repo-add { flex: none; padding: 3px 10px; border-radius: 8px; background: var(--fill); font-size: 12px; font-weight: 600; opacity: 0; transition: opacity 0.12s; }
.work-repo-row:hover .work-repo-add, .work-repo-row:focus-visible .work-repo-add { opacity: 1; }
@media (hover: none) { .work-repo-add { opacity: 1; } }
.work-repo > .work-card-note { padding: 0 10px 8px 38px; }
.work-repo-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 12px; padding: 12px 16px 16px; text-align: center; }
/* Work settings: sections on the left, one section at a time on the right. */
.work-settings { width: min(900px, calc(100% - 32px)); height: min(80dvh, 740px); max-height: 80dvh; }
.work-settings .work-sheet-body { display: grid; grid-template-columns: 190px minmax(0, 1fr); padding: 0; overflow: hidden; }
.work-settings-for { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 12px; color: var(--tertiary); }
select.work-settings-project { width: auto; max-width: 220px; padding: 5px 8px; }
.work-settings-nav { display: grid; align-content: start; gap: 2px; padding: 10px 8px; border-right: 1px solid var(--hairline); background: rgba(246, 244, 240, 0.6); overflow-y: auto; }
.work-settings-tab { display: flex; align-items: center; gap: 9px; width: 100%; padding: 7px 10px; line-height: 18px; text-align: left; }
.work-settings-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
select.work-settings-jump { display: none; }
.work-settings-content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 26px 26px; outline: none; }
.work-settings-content > section + section { margin-top: 22px; }
.work-settings-title { margin: 0 0 6px; font-family: var(--display); font-size: 21px; font-weight: 560; line-height: 1.2; letter-spacing: -0.018em; }
.work-settings-lede { margin: 0 0 14px; max-width: 62ch; font-size: 13px; line-height: 1.5; color: var(--secondary); }
.work-settings-subtitle { margin: 0 0 6px; font: 600 13px/1.4 var(--font); color: var(--ink); }
.work-settings-content > .work-settings-subtitle:not(:first-child), .work-settings-content ul + .work-settings-subtitle { margin-top: 20px; }
.work-settings-rule { margin: 26px 0 22px; border: 0; border-top: 1px solid var(--hairline); }
.work-settings-content .work-card-note { margin: 8px 0 0; font-size: 12.5px; }
.work-settings-content input[type="number"] { width: 100%; padding: 10px 12px; outline: none; }
.work-guide-text { min-height: 150px; resize: vertical; line-height: 1.55; }
.work-guide-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 8px; }
.work-guide-meta .work-card-note { margin: 0; }
.work-guide-meta .link-btn { margin-left: auto; }
.work-budget { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--secondary); font-variant-numeric: tabular-nums; }
.work-budget-text.bad { color: var(--destructive); }
.work-budget-bar { width: 64px; height: 4px; border-radius: 2px; background: var(--fill); overflow: hidden; }
.work-budget-bar span { display: block; height: 100%; border-radius: inherit; background: var(--secondary); }
.work-budget-bar span.bad { background: var(--destructive); }
.work-guide-history { margin-top: 10px; padding: 4px 12px; border: 1px solid var(--hairline); border-radius: 12px; }
.work-guide-version { padding: 7px 0; font-size: 13px; }
.work-guide-version + .work-guide-version { border-top: 1px solid var(--hairline); }
.work-guide-version summary span { color: var(--tertiary); }
.work-guide-version pre, .work-kept pre, .work-repo-file pre { margin: 8px 0; max-height: 220px; overflow: auto; padding: 10px 12px; border-radius: 9px; background: var(--canvas); font: 12px/1.6 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.work-kept { margin-top: 12px; padding: 12px; border: 1px dashed rgba(29, 29, 31, 0.18); border-radius: 12px; font-size: 13px; }
.work-repo-file { margin-top: 8px; border: 1px solid var(--hairline); border-radius: 12px; overflow: hidden; }
.work-repo-file summary { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; font-size: 13px; }
.work-repo-file summary code { font: 12.5px var(--mono); }
.work-repo-file summary .work-card-note { flex: 1; margin: 0; }
.work-repo-file[open] summary .work-chevron { transform: rotate(90deg); }
.work-repo-file pre { margin: 0; border-radius: 0; border-top: 1px solid var(--hairline); }
.work-repo-file > .btn { margin: 10px 12px; }
.work-save { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-height: 36px; margin-top: 14px; }
.work-save-status { flex: 1; margin: 0; font-size: 12.5px; line-height: 1.4; color: var(--tertiary); }
.work-save-status.bad { color: var(--destructive); }
.work-check-list { border: 1px solid var(--hairline); border-radius: 12px; overflow: hidden; }
.work-check { display: flex; align-items: center; gap: 10px; padding: 10px 12px; color: var(--ink); font-size: 13.5px; cursor: pointer; }
.work-check + .work-check { border-top: 1px solid var(--hairline); }
.work-check input { flex: none; width: 16px; height: 16px; margin: 0; accent-color: var(--ink); }
.work-check-text { flex: 1; min-width: 0; display: grid; }
.work-check-name { font-weight: 560; }
.work-check-sub { font-size: 12px; color: var(--tertiary); }
.work-check-state { flex: none; font-size: 12px; color: var(--attention); }
.work-enroll { margin-top: 10px; font-size: 13px; }
.work-enroll summary { display: inline-flex; align-items: center; gap: 6px; }
.work-enroll[open] summary { margin-bottom: 8px; }
.work-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 10px 0 0; }
/* One segmented control: a session's two views, how screens are compared, and the choices in settings. */
.work-segmented { margin-bottom: 16px; }
.work-model-runs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; margin: 12px 0 0; font-size: 13.5px; }
.work-model-runs strong { font-weight: 600; }
.work-project-list, .work-exclusions { list-style: none; margin: 12px 0 0; padding: 0; border: 1px solid var(--hairline); border-radius: 12px; overflow: hidden; }
.work-project-row, .work-exclusions li { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 6px 10px 6px 12px; }
.work-project-row + .work-project-row, .work-exclusions li + li { border-top: 1px solid var(--hairline); }
.work-exclusions li { min-height: 40px; justify-content: space-between; }
.work-exclusions code { font: 12.5px var(--mono); }
.work-exclusion-add { display: flex; gap: 8px; margin-top: 10px; }
.work-exclusion-add input { flex: 1; }
.work-exclusion-add .btn { height: auto; }
.work-project-actions { margin-bottom: 4px; }
.work-decided { margin-top: 10px; }
.work-settings-content .actions-row .link-btn + .link-btn { margin-left: 8px; }
.work-memory-search { border: 1px solid var(--hairline); border-radius: 11px; background: var(--canvas); }
.work-memory-list { margin-top: 12px; }
.work-memory-rows { box-shadow: none; border-radius: 12px; padding: 4px 14px; margin: 0; }

/* ---------- widths ---------- */
/* Phones: the list, the conversation and the review are each a full view. No app navigation returns. */
@media (max-width: 719px) {
  .work-session .work-header { flex-direction: row; align-items: center; padding: 8px 8px 8px 6px; gap: 6px; }
  .work-session-heading { margin-left: -2px; }
  .work-session .work-header > .icon-btn { display: inline-grid; }
  .work-session .work-header h1 { font-size: 15.5px; }
  .work-new .work-header { display: flex; justify-content: flex-start; }
  .work-new .work-header h1 { font-family: var(--font); font-size: 15.5px; }
  .work-new-hint { flex-wrap: wrap; }
  .work-new-body { place-items: end stretch; padding: 16px 12px max(12px, env(safe-area-inset-bottom)); }
  .work-new-center { margin-top: 0; }
  .work-new-title { font-size: 24px; }
  .work-transcript { padding: 0 14px 14px; }
  .work-composer.composer { padding: 6px 10px max(10px, env(safe-area-inset-bottom)); }
  .work-composer.composer .composer-foot { font-size: 11px; }
  .work-side-head { padding-top: max(12px, env(safe-area-inset-top)); }
  .work-session-row { min-height: 64px; padding-top: 14px; padding-bottom: 14px; }
  .work-session-title { font-size: 15px; line-height: 20px; }
  .work-session-meta { font-size: 12px; }
  .work-session-menu { width: 36px; height: 36px; right: 2px; }
  .work-session-row { padding-right: 42px !important; }
  .work-setting, .work-settings-foot, .work-setting-error { padding-left: 12px; }
  .work-settings-card .work-settings-lede { padding-left: 12px; }
  .work-setting-edit { grid-template-columns: minmax(0, 1fr); }
  .work-test-counts { flex-wrap: wrap; justify-content: flex-end; gap: 2px 10px; }
  .work-outcome > span:not(.work-outcome-mark):not(.work-outcome-time) { max-width: 16ch; overflow: hidden; text-overflow: ellipsis; }
  /* Sheets fill the screen; settings picks its section from a list. */
  .work-sheet, .work-settings, .work-repos { width: 100%; max-width: 100%; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .work-settings .work-sheet-body { display: flex; flex-direction: column; }
  .work-settings-nav { display: none; }
  select.work-settings-jump { display: block; flex: none; margin: 12px 16px 0; width: auto; }
  .work-settings-content { padding: 16px 16px 24px; }
  .work-settings-for > span { display: none; }
  .work-field-row { grid-template-columns: minmax(0, 1fr); }
  .work-diff-sheet .work-sheet-body { padding: 0; }
  .work-diff-sheet .work-diff { max-height: none; }
  .work-diff-sheet-meta { display: flex; align-items: center; gap: 10px; margin: 0; padding: 10px 14px; font-size: 12px; color: var(--tertiary); }
  .work-diff-sheet .work-file-diff { border-top: 1px solid var(--hairline); }
}
@media (prefers-reduced-motion: reduce) {
  .work-glyph-spin, .work-live-dot, .work-side-loading span, .work-opening-lines span, .work-skeleton span, .work-menu, .work-popover, .work-sheet[open] { animation: none; }
  .work-page *, .work-dialog *, .work-menu *, .work-popover * { transition: none !important; }
}

.work-session-time, .work-pass-time { color: var(--secondary); }
@media (max-width: 1099px) {
  .work-session .work-header { padding-top: 5px; padding-bottom: 5px; }
  .work-session-heading { display: block; padding: 0; }
  .work-session .work-eyebrow { display: block; padding-left: 6px; font-size: 11px; line-height: 12px; }
  .work-header-branch { display: none; }
  .work-session .work-header > .actions-row { transform: translateY(-6px); }
}
.work-blocked-detail { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; color: var(--secondary); }
.work-blocked > span { flex: 1; min-width: 0; }
.work-pass > .work-card { transition: opacity 160ms ease-out, transform 160ms ease-out, display 160ms allow-discrete; }
.work-pass.is-folded > .work-card:not(.work-files) { opacity: 0; transform: translateY(3px); }
@starting-style { .work-pass > .work-card { opacity: 0; transform: translateY(3px); } }
.work-pass:not(.is-folded) > .work-card { opacity: 1; transform: translateY(0); }

/* File review keeps all sideways scrolling inside the diff. */
.diff-view, .diff-body, .work-file-diff { min-width: 0; max-width: 100%; }
.diff-file-controls { display: flex; align-items: center; gap: 8px; padding: 0; flex: none; }
.diff-viewed { display: flex; align-items: center; gap: 8px; margin-right: auto; color: var(--secondary); font-size: 11px; cursor: pointer; }
.diff-viewed input { margin: 0; accent-color: var(--ink); }
.diff-file-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-bottom: 1px solid var(--hairline); }
.diff-file-head code { font: 12px/1.5 var(--mono); overflow-wrap: anywhere; min-width: 0; }
.diff-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 40px; padding: 4px 12px; color: var(--tertiary); font-size: 11px; }
.diff-split { display: none; }
.diff-view .work-diff { max-width: 100%; width: 100%; }
.diff-view .work-diff-lines { width: max-content; }
.diff-view .work-diff-no { position: static; }
.diff-view .work-diff-text { min-width: 40px; }
.diff-view .work-diff-text.add { background: var(--diff-add); }
.diff-view .work-diff-text.del { background: var(--diff-del); }
.diff-view mark { color: inherit; border-radius: 2px; }
.diff-view .add mark { background: color-mix(in srgb, var(--verified) 20%, transparent); }
.diff-view .del mark { background: color-mix(in srgb, var(--destructive) 18%, transparent); }
.diff-view .diff-separator { padding: 4px 12px; white-space: pre-wrap; }
.diff-context td { padding: 8px 12px; background: var(--canvas); }
.diff-more { margin: 8px 12px; }
@media (min-width: 1100px) {
  .diff-split { display: inline-flex; }
  .diff-view.is-split .work-diff-text { min-width: 240px; }
  .diff-view.is-split .work-diff-no:nth-child(3) { border-left: 1px solid var(--hairline); }
}

.work-file-row { position: relative; width: 100%; flex-wrap: nowrap; }
.work-file-diff[hidden] { display: none; }
@media (max-width: 719px) { .diff-file-head { flex-wrap: wrap; } }

.work-thinking { display:flex; align-items:center; gap:.65rem; color:var(--muted); padding:1rem 0; font-size:.9rem; }
.work-thinking-time { font-variant-numeric:tabular-nums; opacity:.7; }
.work-ack { color:var(--tertiary); font-size:12px; margin:0; }
.work-ack::before { content:"·"; margin-right:8px; }
.work-conversation .work-artifact img { display:block; max-width:min(100%,480px); max-height:320px; object-fit:contain; border-radius:10px; }
.work-ready-hero img { width:100%; max-height:240px; object-fit:contain; border-radius:8px; }
.work-header-status { display:flex; flex-wrap:wrap; gap:.5rem; margin:.2rem 0; color:var(--muted); font-size:.8rem; }
.work-header-status [data-work-elapsed] { font-variant-numeric:tabular-nums; }

/* One generous shortcut from the conversation into the saved review. */
.work-round.work-review-shortcut { padding: 0; overflow: hidden; border-color: var(--hairline); border-radius: 16px; cursor: pointer; }
.work-review-shortcut:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.work-review-band { height: 220px; display: flex; background: var(--raised); border-bottom: 1px solid var(--hairline); }
.work-review-thumb { position: relative; flex: 1; min-width: 0; overflow: hidden; }
.work-review-thumb + .work-review-thumb { border-left: 1px solid var(--hairline); }
.work-review-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.work-review-extra { position: absolute; right: 12px; bottom: 12px; padding: 4px 9px; border-radius: 8px; background: var(--ink); color: white; font-size: 13px; font-weight: 600; }
.work-review-shortcut-body { padding: 18px 20px; }
.work-review-shortcut .work-round-summary { margin: 0; color: var(--ink); font-size: 17px; font-weight: 600; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.work-review-shortcut .work-round-meta { margin: 8px 0 0; color: var(--secondary); }
.work-review-warning { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; color: var(--attention); font-size: 13px; }
.work-review-shortcut-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; }
.work-review-shortcut-foot .btn { min-height: 40px; }
.work-review-document { display: block; padding: 24px; }
.work-review-document strong { font-size: 15px; font-weight: 600; }
.work-review-document p { margin: 8px 0 0; color: var(--secondary); }
.work-review-document-preview { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }