/* Hylē v4 · new-research lane: wizard, templates, research.
   Sizes come only from the 9-step type scale; colour only from tokens. */

/* ============================== Shared ============================== */
.pg-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 28px 0 24px; }
.pg-head-copy { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pg-head-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.pg-head-actions .btn { border-radius: var(--r-md); }
.btn-primary .kbd, .plan-start .kbd { background: rgba(255,255,255,.14); color: rgba(255,255,255,.78); border-color: rgba(255,255,255,.18); box-shadow: none; }
.dot-shared { background: conic-gradient(from 200deg, var(--brand-blue), var(--brand-orange), var(--brand-blue)); }
body.sheet-open { overflow: hidden; }
/* The system live rule's sheen widens the document; clip it until the system does (round2/SYSTEM-REQUESTS.md). */
.app { overflow-x: clip; }
.warn-txt { color: var(--warning); }
/* Flat section heads (shared with home) */
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 0 8px 10px; border-bottom: 1px solid var(--hairline); }
.sec-title { font-size: var(--fs-ui); font-weight: 600; color: var(--ink); letter-spacing: var(--ls-ui); }
.sec-link { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-small); font-weight: 500; color: var(--accent-ink); white-space: nowrap; }
.sec-link svg { width: 14px; height: 14px; transition: transform var(--d-2) var(--ease-out); }
.sec-link:hover svg { transform: translateX(2px); }
/* An app head without actions: keep the lede on its own line under the title */
.app-head .app-head-title:only-child, .nr-head .app-head-title { flex-basis: 100%; }
.gap-txt { color: var(--warning); font-weight: 500; }

/* Figure thumbnails: drawn marks, tinted by field */
.fig-thumb { --fc: var(--accent); display: inline-block; flex: none; width: 46px; height: 30px; padding: 3px 4px; border-radius: 7px; color: var(--fc);
  background: color-mix(in srgb, var(--fc) 6%, var(--raised)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--fc) 15%, transparent); }
.fig-thumb.md { width: 64px; height: 42px; padding: 4px 5px; border-radius: 9px; }
.fig-thumb.lg { width: 100%; height: auto; aspect-ratio: 64 / 38; padding: 8px 10px; border-radius: 10px; }
.fig-thumb svg { width: 100%; height: 100%; overflow: visible; }
/* Larger renders read as charts: a faint plot grid, strokes that stay crisp at any size. */
.fig-thumb.xl, .fig-thumb.poster { display: block; background-color: color-mix(in srgb, var(--fc) 5%, var(--raised));
  background-image: linear-gradient(color-mix(in srgb, var(--fc) 10%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--fc) 10%, transparent) 1px, transparent 1px);
  background-size: 25% 25%; background-position: -1px -1px; }
.fig-thumb.xl { width: 112px; height: 70px; padding: 8px 10px; border-radius: var(--r-md); }
.fig-thumb.poster { width: 100%; height: auto; aspect-ratio: 16 / 10; padding: 16px 20px; border-radius: var(--r-md); background-size: 12.5% 20%; }
.fig-thumb.lg svg *, .fig-thumb.xl svg *, .fig-thumb.poster svg * { vector-effect: non-scaling-stroke; }
.fig-thumb.xl .fl { stroke-width: 1.75; } .fig-thumb.xl .fw { stroke-width: 2.6; } .fig-thumb.xl .fr { stroke-width: 6; }
.fig-thumb.poster .fd { r: .78px; }
.fig-thumb.poster .fl { stroke-width: 2.25; } .fig-thumb.poster .fw { stroke-width: 3.2; } .fig-thumb.poster .fr { stroke-width: 10; } .fig-thumb.poster .fe { stroke-width: 1.25; } .fig-thumb.poster .fx { stroke-width: 1.25; }
.fig-thumb.lg .fl { stroke-width: 2; } .fig-thumb.lg .fd { r: 1.35px; }
.fig-thumb[data-f="bio"] { --fc: var(--field-bio); } .fig-thumb[data-f="med"] { --fc: var(--field-med); } .fig-thumb[data-f="aiml"] { --fc: var(--field-aiml); }
.fig-thumb[data-f="eng"] { --fc: var(--field-eng); } .fig-thumb[data-f="sci"] { --fc: var(--field-sci); } .fig-thumb[data-f="quant"] { --fc: var(--field-quant); }
.fig-thumb[data-f="biz"] { --fc: var(--field-biz); } .fig-thumb[data-f="policy"] { --fc: var(--field-policy); } .fig-thumb[data-f="ir"] { --fc: var(--field-ir); }
.fig-thumb[data-f="soc"] { --fc: var(--field-soc); } .fig-thumb[data-f="law"] { --fc: var(--field-law); } .fig-thumb[data-f="hum"] { --fc: var(--field-hum); }
.fig-thumb .fx { fill: none; stroke: currentColor; stroke-opacity: .26; stroke-width: 1; }
.fig-thumb .fz { fill: none; stroke: var(--ink-3); stroke-opacity: .7; stroke-width: .8; stroke-dasharray: 2 2.5; }
.fig-thumb .fl { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fig-thumb .fw { stroke-width: 2.4; }
.fig-thumb .fe { fill: none; stroke: currentColor; stroke-opacity: .42; stroke-width: 1; }
.fig-thumb .fr { fill: none; stroke: currentColor; stroke-opacity: .26; stroke-width: 4.5; stroke-linecap: round; }
.fig-thumb .fd, .fig-thumb .fh { fill: currentColor; stroke: none; }
.fig-thumb .fq { fill-opacity: .38; }
.fig-thumb .fv { fill: currentColor; fill-opacity: .16; stroke: currentColor; stroke-width: 1.1; }
.fig-thumb .fd.fo, .fig-thumb .fh.fo { fill: var(--brand-orange); fill-opacity: 1; }
.fig-thumb .fv.fo { fill: var(--brand-orange); stroke: var(--brand-orange); }
.fig-thumb .fl.fo { stroke: var(--brand-orange); stroke-dasharray: 3 2.5; }
.fig-thumb .fr.fo { stroke: var(--brand-orange); stroke-opacity: .55; }
.fig-thumb .fo-s { stroke: var(--brand-orange); }


/* ============================== Wizard ============================== */
.nr-head { padding: 16px 0 18px; }
.nr-grid { gap: 32px; }
.nr-left { min-width: 0; }
.nr-composer form { padding: 18px 18px 12px 22px; }
.q-wrap { position: relative; }
.nr-composer textarea, .q-mirror { display: block; width: 100%; min-height: 84px; max-height: 260px; border: 0; padding: 4px 0; font-family: var(--font-sans); font-size: var(--fs-lead); line-height: 1.5; letter-spacing: var(--ls-lead); white-space: pre-wrap; overflow-wrap: break-word; word-break: normal; }
.nr-composer textarea { position: relative; z-index: 1; resize: none; background: transparent; color: var(--ink); caret-color: var(--accent); }
.q-mirror { position: absolute; inset: 0; z-index: 0; overflow: hidden; color: transparent; pointer-events: none; }
.q-mirror mark { color: transparent; border-radius: 4px; padding: 1px 0; box-decoration-break: clone; -webkit-box-decoration-break: clone; animation: nr-mark var(--d-5) var(--ease-out) both; }
.q-mirror .m-term { background: linear-gradient(transparent 62%, rgba(18,117,216,.16) 62%); }
.q-mirror .m-hit { background: linear-gradient(transparent 58%, rgba(225,145,54,.32) 58%); }
@keyframes nr-mark { from { background-size: 0% 100%; } to { background-size: 100% 100%; } }
.q-mirror mark { background-repeat: no-repeat; }
.nr-composer textarea::placeholder { color: var(--ink-3); }
.nr-composer textarea:focus-visible { outline: none; }
.nr-composer textarea[readonly] { color: var(--ink-2); }
.nr-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; }
.nr-status { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-2); min-width: 0; }
.nr-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-4); flex: none; transition: background var(--d-3); }
.nr-status.is-busy { color: var(--accent-ink); }
.nr-status.is-busy .nr-pulse { background: var(--accent); animation: pulse 1.2s var(--ease-in-out) infinite; }
.nr-status.is-busy [data-status-text]::after { content: "…"; display: inline-block; width: 0; overflow: hidden; vertical-align: bottom; animation: nr-dots 1.1s steps(3, end) infinite; }
@keyframes nr-dots { to { width: 1.1em; } }
.nr[data-stage="ready"] .nr-pulse { background: var(--success); }
.nr[data-stage="started"] .nr-pulse { background: var(--accent); animation: pulse 1.6s infinite; }
.nr-bar-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.nr-bar-actions .btn { border-radius: var(--r-md); }
.nr[data-stage="ready"] .nr-analyse, .nr[data-stage="started"] .nr-analyse { display: none; }
.nr-examples .chip[aria-pressed="true"] .dot { box-shadow: 0 0 0 2px rgba(255,255,255,.7); }
.nr-privacy { display: flex; align-items: center; gap: 8px; margin: 12px 6px 0; }
.nr-privacy svg { width: 14px; height: 14px; flex: none; }

/* Suggestions */
.nr-suggest { margin-top: 28px; }
.sg-top { display: flex; align-items: center; gap: 10px; margin: 0 4px 10px; min-height: 32px; }
.sg-top h2 { font-weight: 600; color: var(--ink); }
.sg-all { margin-left: auto; }
.sg-list { border-top: 1px solid var(--hairline); }
.sg { position: relative; border-bottom: 1px solid var(--hairline); border-radius: var(--r-lg); transition: background var(--d-3) var(--ease-out), box-shadow var(--d-3) var(--ease-out); }
.sg-head { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto auto; align-items: center; gap: 14px; min-height: 64px; padding: 10px 10px 10px 8px; }
.sg-ico { position: relative; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--sunken); color: var(--ink-2); transition: background var(--d-3), color var(--d-3); }
.sg-ico svg { width: 16px; height: 16px; grid-area: 1 / 1; transition: opacity var(--d-3), transform var(--d-3) var(--ease-out); }
.sg-ico .ico-done { opacity: 0; transform: scale(.5); }
.sg.is-accepted .sg-ico { background: var(--success-tint); color: var(--success); }
.sg.is-accepted .sg-ico .ico-idle { opacity: 0; transform: scale(.5); }
.sg.is-accepted .sg-ico .ico-done { opacity: 1; transform: none; }
.sg.needs-choice:not(.is-ghost) .sg-ico { background: var(--warning-tint); color: var(--warning); }
.sg-toggle { display: flex; flex-direction: column; gap: 2px; min-width: 0; min-height: 44px; justify-content: center; text-align: left; border-radius: var(--r-sm); }
.sg-toggle:disabled { cursor: default; }
.sg-label { color: var(--ink-3); }
.sg-value { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: var(--ink); overflow: hidden; }
.sg-value .dot { display: inline-block; width: 7px; height: 7px; margin-right: 8px; vertical-align: 1px; }
.sg-value .tpl-id { margin-right: 4px; }
.sg-value .ink-3 { white-space: normal; }
.sg-state { padding: 3px 9px; border-radius: var(--r-pill); white-space: nowrap; font-weight: 500; }
.sg-state:empty { display: none; }
.sg-state[data-s="suggested"] { background: var(--info-tint); color: var(--accent-ink); }
.sg-state[data-s="accepted"] { background: var(--success-tint); color: var(--success); }
.sg-state[data-s="edited"] { background: var(--sunken); color: var(--ink); }
.sg-state[data-s="needs"] { background: var(--warning-tint); color: var(--warning); }
.sg-accept { border-radius: var(--r-md); }
.sg-accept .kbd { height: 18px; min-width: 18px; }
.sg.is-ghost .sg-label { color: var(--ink-3); }
.sg.is-ghost .sg-value { color: var(--ink-3); }
.sg.is-ghost .sg-ico { color: var(--ink-4); }

.sg.is-open { background: var(--raised); box-shadow: var(--e-2); border-bottom-color: transparent; margin: 4px -8px; }
.sg.is-open .sg-head { padding-left: 16px; padding-right: 18px; }
.sg.is-open .sg-value { white-space: normal; }

.sg-body { padding: 2px 22px 20px 62px; display: flex; flex-direction: column; gap: 14px; }
.sg-row { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 32px; }
.sg-row-top { align-items: start; }
.sg-row-top .sg-k { padding-top: 8px; }
.sg-k { color: var(--ink-3); }
.sg-block { display: flex; flex-direction: column; gap: 8px; }
.sg-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sg-chips .dot { width: 7px; height: 7px; }
.chip[aria-pressed="true"] .dot { box-shadow: 0 0 0 1.5px rgba(255,255,255,.85); }
.hits { display: flex; flex-wrap: wrap; gap: 6px; }
.hit { padding: 2px 8px; border-radius: 6px; background: var(--selection); color: var(--ink); font-size: var(--fs-small); font-weight: 500; }
.conf { display: inline-flex; align-items: center; gap: 10px; }
.conf-bar { width: 120px; height: 6px; border-radius: 6px; background: var(--sunken-2); overflow: hidden; }
.conf-bar b { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--brand-blue), var(--brand-orange)); transition: width var(--d-5) var(--ease-out); }
[data-field-select] { width: max-content; }
[data-field-select] .select-trigger { background: var(--sunken); border-color: transparent; box-shadow: none; }
[data-field-select] .listbox { width: 260px; max-height: 260px; }
.terms { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.term { display: inline-flex; align-items: center; gap: 2px; height: 32px; padding: 0 4px 0 12px; border-radius: var(--r-pill); background: var(--sunken); font-size: var(--fs-small); font-weight: 500; color: var(--ink); }
.term button { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-3); transition: background var(--d-2), color var(--d-2); }
.term button:hover { background: rgba(20,20,19,.08); color: var(--ink); }
.term button svg { width: 13px; height: 13px; }
.term-add { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: var(--r-pill); border: 1px dashed var(--hairline-strong); color: var(--ink-3); }
.term-add:focus-within { border-color: var(--accent); border-style: solid; box-shadow: var(--focus-ring); }
.term-add svg { width: 13px; height: 13px; }
.term-add input { width: 116px; border: 0; background: transparent; font-size: var(--fs-small); color: var(--ink); }
.term-add input:focus-visible { outline: none; }
.term-add input::placeholder { color: var(--ink-3); }
.seg-sm button { min-height: 28px; padding: 0 12px; font-size: var(--fs-small); }
.tpl-opts { display: flex; flex-direction: column; gap: 8px; }
.tpl-opt { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto auto; align-items: center; gap: 14px; width: 100%; padding: 10px 12px 10px 14px; border-radius: var(--r-md); text-align: left; background: var(--raised); box-shadow: inset 0 0 0 1px var(--hairline); transition: box-shadow var(--d-2), background var(--d-2), transform var(--d-1) var(--ease-press); }
.tpl-opt:hover { box-shadow: inset 0 0 0 1px var(--hairline-strong); }
.tpl-opt:active { transform: scale(.99); }
.tpl-opt[aria-checked="true"] { background: var(--accent-tint); box-shadow: inset 0 0 0 1.5px var(--accent); }
.radio-dot { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--ink-4); background: var(--raised); transition: border var(--d-2) var(--ease-out); }
.tpl-opt[aria-checked="true"] .radio-dot { border: 5.5px solid var(--accent); }
.tpl-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tpl-main b { font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tpl-main b .tpl-id { margin-right: 8px; font-weight: 500; }
.tpl-main .t-small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tpl-line { display: flex; align-items: center; gap: 8px; }
.tpl-id { color: var(--ink-3); }
.tpl-tag { padding: 1px 8px; border-radius: var(--r-pill); background: var(--raised); color: var(--accent-ink); font-weight: 500; box-shadow: inset 0 0 0 1px var(--info-line); }
.tpl-figs { display: flex; gap: 6px; }
.sg-more { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; color: var(--accent-ink); font-weight: 500; }
.sg-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.sg-more svg { width: 14px; height: 14px; }
.src-list { display: flex; flex-direction: column; gap: 2px; margin: 0 -10px; }
.src-row { display: flex; width: 100%; min-height: 52px; padding: 6px 10px; border-radius: var(--r-md); transition: background var(--d-2); }
.src-row:hover { background: var(--sunken); }
.src-row .grow { display: flex; flex-direction: column; gap: 1px; }
.src-row b { font-weight: 500; }
.rec { color: var(--accent-ink); font-weight: 500; }
.depth-seg { align-self: flex-start; }
.depth-est { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; border-radius: var(--r-md); background: var(--surface); box-shadow: inset 0 0 0 1px var(--hairline); }
.depth-est div { padding: 10px 14px; border-left: 1px solid var(--hairline); }
.depth-est div:first-child { border-left: 0; }
.depth-est dt { color: var(--ink-3); }
.depth-est dd { margin: 2px 0 0; color: var(--ink); }
.depth-est.is-over div:last-child dd { color: var(--warning); }
.depth-warn { display: flex; gap: 8px; align-items: flex-start; color: var(--warning); }
.depth-warn svg { width: 15px; height: 15px; flex: none; margin-top: 1px; }
.cap-fld { gap: 6px; }
.cap-ctl { width: 200px; min-height: 44px; padding: 0 4px; }
.cap-ctl input { width: 56px; flex: none; height: 42px; padding: 0; text-align: center; font-variant-numeric: tabular-nums; font-weight: 500; }
.cap-ctl .cap-unit { flex: 1; }
.cap-ctl .icon-btn { width: 36px; height: 36px; }
.sg-keys { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 14px 6px 0; }
.sg-keys > span { display: inline-flex; align-items: center; gap: 4px; }

/* Plan document */
.nr-plan { position: sticky; top: calc(var(--topbar-h) + 16px); z-index: 2; }
.plan-card { position: relative; border-radius: var(--r-xl); background: var(--raised); box-shadow: var(--e-2); overflow: hidden; }
.plan-head { display: flex; align-items: center; gap: 10px; padding: 14px 18px 14px 20px; border-bottom: 1px solid var(--hairline); }
.plan-id { margin-left: auto; }
.plan-close { display: none; }
.plan-titlebox { padding: 18px 20px 6px; display: flex; flex-direction: column; gap: 12px; }
.plan-q { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; transition: color var(--d-3); }
.plan-q.is-empty { color: var(--ink-2); }
.plan-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.pm { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: var(--r-pill); background: var(--sunken); color: var(--ink-3); transition: background var(--d-3), color var(--d-3), box-shadow var(--d-3); }
.pm svg { width: 13px; height: 13px; }
.pm .dot { width: 7px; height: 7px; }
.pm.is-set { background: var(--raised); color: var(--ink); box-shadow: inset 0 0 0 1px var(--hairline-strong); }
.plan-steps { position: relative; padding: 6px 20px 10px; }
.plan-rail { position: absolute; left: 32px; top: 26px; bottom: 44px; width: 2px; border-radius: 2px; background: var(--hairline); }
.plan-rail-fill { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, var(--brand-blue), var(--brand-orange)); transform-origin: top; transform: scaleY(0); }
.ps { position: relative; display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 14px; padding: 12px 0; }
.ps-n { position: relative; z-index: 1; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--raised); color: var(--ink-3); box-shadow: inset 0 0 0 1.5px var(--hairline-strong); transition: background var(--d-3), color var(--d-3), box-shadow var(--d-3); }
.ps.is-drafted .ps-n { color: var(--accent-ink); box-shadow: inset 0 0 0 1.5px var(--accent); background: var(--raised); }
.ps.is-confirmed .ps-n { color: #fff; background: var(--ink); box-shadow: none; }
.ps-main { min-width: 0; padding-top: 3px; }
.ps-title { font-weight: 600; color: var(--ink); }
.ps.is-pending .ps-title { color: var(--ink-3); }
.ps-sub { color: var(--ink-2); }
.ps-body { margin-top: 10px; }
.ps-ghost { display: block; height: 8px; width: 86%; border-radius: 5px; background: var(--sunken); margin-bottom: 8px; }
.ps-ghost.short { width: 54%; margin-bottom: 0; }
.ps-list { display: flex; flex-direction: column; gap: 6px; }
.ps-list li { position: relative; padding-left: 14px; font-size: var(--fs-small); line-height: var(--lh-small); color: var(--ink-2); }
.ps-list li::before { content: ""; position: absolute; left: 2px; top: 8px; width: 4px; height: 4px; border-radius: 50%; background: var(--ink-4); }
.ps-line { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--ink-2); }
.ps-line + .ps-line { margin-top: 2px; }
.ps-terms { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.ps-terms span { padding: 2px 7px; border-radius: 6px; background: var(--sunken); font-family: var(--font-mono); font-size: var(--fs-mono); color: var(--ink-2); }
.ps-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ps-fig { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ps-fig .fig-thumb.md { width: 100%; height: auto; aspect-ratio: 64 / 40; }
.ps-fig .t-small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps-checks { display: flex; flex-direction: column; gap: 6px; }
.ps-checks li { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--ink-2); }
.ps-checks svg { width: 14px; height: 14px; color: var(--accent); flex: none; }
.plan-foot { padding: 16px 20px 20px; border-top: 1px solid var(--hairline); background: var(--surface); }
.est { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.est-cell { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.est-cell b { font-weight: 600; white-space: nowrap; }
.budget-bar { display: flex; height: 6px; margin: 14px 0 8px; border-radius: 6px; background: var(--sunken-2); overflow: hidden; }
.bb-used { width: 40%; background: var(--ink-4); }
.bb-est { width: 0; background: linear-gradient(90deg, var(--brand-blue), var(--brand-orange)); transition: width var(--d-5) var(--ease-out); }
.bb-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.bb-legend span { display: inline-flex; align-items: center; gap: 6px; }
.bb-legend .num { margin-left: auto; }
.sw { width: 8px; height: 8px; border-radius: 2px; }
.sw-used { background: var(--ink-4); }
.sw-est { background: linear-gradient(90deg, var(--brand-blue), var(--brand-orange)); }
.plan-alert { margin-top: 14px; }
.plan-alert .grow { font-size: var(--fs-small); line-height: var(--lh-small); }
.al-actions { display: inline-flex; gap: 12px; margin-left: 4px; }
.plan-note { display: block; margin-top: 12px; padding-left: 12px; border-left: 2px solid var(--hairline-strong); }
.plan-start { margin-top: 16px; border-radius: var(--r-md); }
.plan-start .kbd:first-of-type { margin-left: 6px; }
.plan-done { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 22px 20px 20px; border-top: 1px solid var(--hairline); background: var(--surface); }
.plan-done .progress { width: 100%; }
.done-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--success); color: #fff; box-shadow: 0 0 0 6px var(--success-tint); }
.done-mark svg { width: 22px; height: 22px; stroke-width: 2.4; }
.done-steps { flex-wrap: wrap; row-gap: 6px; }
.done-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.done-actions .btn { border-radius: var(--r-md); }
.plan-bar { display: none; }
.plan-card.is-started .ps-body { display: none; }
.plan-card.is-started .ps { padding: 8px 0; }
.plan-card.is-started .plan-rail { top: 20px; bottom: 24px; }
.plan-card.is-started .ps-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-card.is-started .plan-q { -webkit-line-clamp: 2; }
.plan-card.is-started .done-steps { display: none; }

@media (max-width: 1024px) {
  .nr-grid { grid-template-columns: minmax(0, 1fr); }
  .nr-plan { display: none; position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: var(--z-dialog); max-height: 88dvh; overflow: auto; border-radius: var(--r-xl) var(--r-xl) 0 0; box-shadow: var(--e-4); }
  .nr-plan.is-sheet { display: block; visibility: visible !important; }
  .nr-plan .plan-card { border-radius: var(--r-xl) var(--r-xl) 0 0; box-shadow: none; }
  .nr-plan .plan-card::before { content: ""; display: block; width: 40px; height: 4px; margin: 10px auto 0; border-radius: 4px; background: var(--hairline-strong); }
  .plan-close { display: inline-grid; margin-right: -6px; }
  .plan-id { margin-left: auto; }
  [data-plan-scrim] { z-index: calc(var(--z-dialog) - 1); }
  .plan-bar { position: fixed; z-index: var(--z-nav); left: 50%; transform: translateX(-50%); bottom: 16px; width: min(560px, calc(100% - 2 * var(--gutter))); display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 8px; border-radius: var(--r-lg); background: rgba(255,255,255,.94); -webkit-backdrop-filter: saturate(1.4) blur(16px); backdrop-filter: saturate(1.4) blur(16px); box-shadow: var(--e-3); }
  .plan-bar-open { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 6px; border-radius: var(--r-md); text-align: left; }
  .plan-bar-text { display: flex; flex-direction: column; min-width: 0; }
  .plan-bar-text b { font-weight: 600; }
  .plan-bar-text .t-small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .plan-bar-ring { position: relative; width: 40px; height: 40px; flex: none; display: grid; place-items: center; }
  .plan-bar-ring svg { position: absolute; inset: 0; width: 40px; height: 40px; transform: rotate(-90deg); }
  .plan-bar-ring circle { fill: none; stroke: var(--sunken-2); stroke-width: 3; }
  .plan-bar-ring .pb-fill { stroke: var(--accent); stroke-linecap: round; stroke-dasharray: 94.2; stroke-dashoffset: 94.2; transition: stroke-dashoffset var(--d-5) var(--ease-out); }
  .plan-bar-ring .t-mono { position: relative; letter-spacing: 0; }
  .plan-bar-start { border-radius: var(--r-md); flex: none; min-width: 92px; }
  .nr-main { padding-bottom: 140px; }
}
@media (max-width: 1024px) {
  .plan-bar { background: var(--raised); box-shadow: 0 -1px 0 var(--hairline); padding: 6px var(--gutter); }
  .nr-main { padding-bottom: calc(var(--safe-bottom) + 32px); }
}
@media (max-width: 640px) {
  .nr-head { padding: 12px 0 18px; }
  .nr-composer form { padding: 14px 14px 10px 16px; }
  .nr-composer textarea, .q-mirror { font-size: var(--fs-body); min-height: 96px; letter-spacing: var(--ls-body); }
  .hide-xs { display: none; }
  .nr-lede { display: none; }
  .nr-bar { gap: 6px; margin-right: -4px; }
  .nr-status { flex: 1; min-width: 0; }
  .nr-status [data-status-text] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nr-attach { width: 44px; padding: 0; }
  .sg-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -14px; padding: 0 14px 2px; scrollbar-width: none; }
  .sg-chips::-webkit-scrollbar { display: none; }
  .sg-chips > * { flex: none; }
  .nr-examples { flex-wrap: nowrap; overflow-x: auto; padding: 12px 16px; scrollbar-width: none; }
  .nr-examples::-webkit-scrollbar { display: none; }
  .nr-examples > * { flex: none; }
  .nr-suggest { margin-top: 22px; }
  .sg-head { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 10px; padding: 8px 10px 8px 12px; }
  .sg-state { display: none; }
  .sg-body { padding: 4px 14px 18px; }
  .sg-row { grid-template-columns: 1fr; gap: 6px; }
  .sg-row .sg-k:empty { display: none; }
  .sg-row-top .sg-k { padding-top: 0; }
  .tpl-figs { display: none; }
  .tpl-opt { gap: 12px; }
  .term { height: 44px; padding-right: 0; }
  .term button { width: 44px; height: 44px; }
  .term-add { height: 44px; }
  .sg-more { min-height: 44px; }
  .depth-seg { align-self: stretch; }
  .depth-est div { padding: 10px; }
  .cap-ctl { width: 100%; }
  .cap-ctl .icon-btn { width: 44px; height: 44px; }
  .sg-keys { display: none; }
  .sg-all { min-height: 44px; }
  .plan-steps { padding: 4px 16px 8px; }
  .plan-rail { left: 28px; }
  .plan-head, .plan-titlebox, .plan-foot, .plan-done { padding-left: 16px; padding-right: 16px; }
  .bb-legend .num { margin-left: 0; width: 100%; }
  .done-actions .btn { flex: 1; }
  .plan-start .kbd { display: none; }
}


/* ---------- Round 2 · Compose: the composer leads; idle shows worked examples, never a skeleton ---------- */
.nr-composer textarea, .q-mirror { font-size: var(--fs-heading); letter-spacing: var(--ls-heading); line-height: 1.45; }
.nr-analyse { border-radius: var(--r-md); gap: 8px; }
.nr-analyse .kbd { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.22); box-shadow: none; }
.nr-attach { border-radius: var(--r-md); }
.nr-privacy { margin: 12px 8px 0; }
.nr-examples-rich { margin-top: 36px; }
.nr-examples-rich .sec-head { border-bottom: 0; padding-bottom: 0; }
.nr:not([data-stage="idle"]) .nr-examples-rich { display: none; }
.nr[data-stage="idle"] .nr-suggest { display: none; }
.ex-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.ex-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 16px; border-radius: var(--r-lg); background: var(--raised); box-shadow: var(--e-1); text-align: left; transition: box-shadow var(--d-3) var(--ease-out), transform var(--d-3) var(--ease-out); }
.ex-card:hover { box-shadow: var(--e-2); transform: translateY(-2px); }
.ex-card:active { transform: translateY(0) scale(.99); }
.ex-top { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--ink-2); }
.ex-top .dot { width: 7px; height: 7px; }
.ex-top .t-mono { margin-left: auto; color: var(--ink-3); }
.ex-q { font-size: var(--fs-ui); line-height: 1.45; font-weight: 500; color: var(--ink); text-wrap: pretty; }
.ex-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: auto; }
.ex-figs .fig-thumb.md { width: 100%; height: auto; aspect-ratio: 64 / 42; }
.ex-go { display: flex; align-items: center; gap: 6px; font-size: var(--fs-small); font-weight: 600; color: var(--accent-ink); }
.ex-go svg { width: 14px; height: 14px; transition: transform var(--d-3) var(--ease-out); }
.ex-card:hover .ex-go svg { transform: translate(2px, -2px); }

/* Suggestions: statements Hylē made from your question, each with an accept / edit chip */
.sg-accept { min-height: var(--ctl-sm); padding: 0 12px; border-radius: var(--r-pill); font-size: var(--fs-small); gap: 6px; }
.sg-accept.btn-secondary { background: var(--accent-tint); color: var(--accent-ink); border-color: var(--info-line); }
.sg-accept.btn-secondary:hover { background: var(--accent-tint-2); }
.sg-accept.btn-secondary::before { content: ""; width: 12px; height: 12px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat; }
.sg-accept.btn-ghost { color: var(--ink-2); }
.sg-accept .kbd { display: none; background: var(--raised); }
.sg.is-open .sg-accept .kbd { display: inline-flex; }
.sg-state[data-s="suggested"], .sg-state[data-s="accepted"] { display: none; }
.sg-fly { position: fixed; z-index: var(--z-toast); display: inline-flex; align-items: center; gap: 6px; height: 28px; max-width: 300px; padding: 0 12px; overflow: hidden; border-radius: var(--r-pill); background: var(--ink); color: #fff; font-size: var(--fs-small); font-weight: 500; white-space: nowrap; pointer-events: none; box-shadow: var(--e-3); }
.sg-fly .ink-3 { color: rgba(255,255,255,.72); }
.sg-fly .tpl-id { color: rgba(255,255,255,.72); }

/* Plan, idle: what the four stages will do, stated plainly (no placeholder bars) */
.ps-body:empty { display: none; }
/* Desktop: the plan stays in view as it grows; its middle scrolls, the estimate and Start never leave the screen */
@media (min-width: 1025px) {
  .nr:not([data-stage="idle"]) .plan-card { display: flex; flex-direction: column; max-height: calc(100dvh - var(--topbar-h) - 150px); min-height: 480px; }
  .nr:not([data-stage="idle"]) .plan-scroll { flex: 1 1 auto; min-height: 140px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .nr:not([data-stage="idle"]) .plan-head, .nr:not([data-stage="idle"]) .plan-foot, .nr:not([data-stage="idle"]) .plan-done { flex: none; }
  .plan-scroll { mask-image: linear-gradient(#000 calc(100% - 20px), transparent); -webkit-mask-image: linear-gradient(#000 calc(100% - 20px), transparent); }
  .nr[data-stage="idle"] .plan-scroll { mask-image: none; -webkit-mask-image: none; }
}
.tpl-figs .fig-thumb { width: 60px; height: 38px; padding: 4px 5px; border-radius: 8px; }
.plan-q.is-empty { color: var(--ink-2); }
.nr[data-stage="idle"] .plan-card { background: transparent; box-shadow: none; overflow: visible; }
.nr[data-stage="idle"] .plan-head { padding: 0 0 12px; }
.nr[data-stage="idle"] .plan-titlebox { padding: 16px 0 4px; }
.nr[data-stage="idle"] .plan-q { font-size: var(--fs-ui); font-weight: 400; line-height: var(--lh-ui); letter-spacing: var(--ls-ui); }
.nr[data-stage="idle"] .plan-meta, .nr[data-stage="idle"] .est, .nr[data-stage="idle"] .plan-start { display: none; }
.nr[data-stage="idle"] .plan-steps { padding: 4px 0 8px; }
.nr[data-stage="idle"] .plan-rail { left: 12px; top: 24px; bottom: 28px; }
.nr[data-stage="idle"] .ps { padding: 10px 0; }
.nr[data-stage="idle"] .ps-title { color: var(--ink); }
.nr[data-stage="idle"] .ps-sub { color: var(--ink-2); }
.nr[data-stage="idle"] .plan-foot { padding: 14px 0 0; background: transparent; }
.nr[data-stage="idle"] .budget-bar { margin-top: 0; }

@media (max-width: 1180px) and (min-width: 1025px) {
  .l-compose.nr-grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; }
  .ex-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) { .ex-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .sec-link { min-height: 44px; margin: -12px 0; } }
@media (max-width: 640px) {
  .nr-composer textarea, .q-mirror { font-size: var(--fs-body); letter-spacing: var(--ls-body); line-height: 1.55; }
  .nr-examples-rich { margin-top: 28px; }
  .ex-grid { gap: 10px; }
  .ex-card { padding: 14px; gap: 10px; }
  .ex-figs { grid-template-columns: repeat(3, 72px); }
  .ex-go { min-height: 24px; }
  .nr-analyse { min-width: 92px; }
  .sg-accept { min-height: 44px; padding: 0 14px; }
  .sg-chips { -webkit-mask: linear-gradient(90deg, #000 calc(100% - 40px), transparent); mask: linear-gradient(90deg, #000 calc(100% - 40px), transparent); }
}

/* ============================== Research · List ============================== */
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-tint-2); animation: pulse 1.6s infinite; }
.rs-live-meta { color: var(--accent-ink); font-weight: 500; }
.rs-live-meta.is-idle { color: var(--ink-2); font-weight: 400; }
.rs-live-meta.is-idle .live-dot { background: var(--ink-4); box-shadow: none; animation: none; }
@media (min-width: 1181px) { .rs-layout.l-list.has-inspector { grid-template-columns: minmax(0, 1fr) 372px; gap: 32px; } .is-empty-ws .rs-layout.l-list.has-inspector { grid-template-columns: minmax(0, 1fr); } }
.rs-toolbar { gap: 10px; }
.rs-toolbar { flex-wrap: nowrap; }
.rs-toolbar .control-search { width: auto; flex: 1 1 150px; min-width: 0; max-width: 340px; }
.rs-sort .select-trigger .value { white-space: nowrap; }
.seg-n { margin-left: 5px; font-size: var(--fs-small); font-variant-numeric: tabular-nums; color: var(--ink-3); }
.rs-status button { display: inline-flex; align-items: center; }
.rs-sort { margin-left: auto; }
.rs-sort .select-trigger { gap: 8px; padding: 0 12px; background: transparent; border-color: transparent; box-shadow: none; }
.rs-sort .select-trigger .chev { display: none; }
.rs-sort .select-trigger:hover { background: var(--sunken); }
.chev-lead { width: 15px; height: 15px; color: var(--ink-2); }
.rs-sort .listbox { left: auto; right: 0; min-width: 200px; }

.rs-list { min-width: 0; }
.rs-group { margin-top: 22px; }
.rs-group:first-child { margin-top: 14px; }
.rs-group-h { display: flex; align-items: baseline; gap: 8px; padding: 0 8px 8px; border-bottom: 1px solid var(--hairline); font-size: var(--fs-small); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.rs-group-h .num { letter-spacing: 0; }
.rs-group-h .num { font-weight: 500; color: var(--ink-3); }
.rs-row { --fc: var(--accent); width: 100%; grid-template-columns: 36px minmax(0, 1fr) auto; min-height: 68px; padding: 12px 10px 12px 12px; text-align: left; }
.rs-row[data-f="bio"] { --fc: var(--field-bio); } .rs-row[data-f="med"] { --fc: var(--field-med); } .rs-row[data-f="aiml"] { --fc: var(--field-aiml); }
.rs-row[data-f="eng"] { --fc: var(--field-eng); } .rs-row[data-f="sci"] { --fc: var(--field-sci); } .rs-row[data-f="quant"] { --fc: var(--field-quant); }
.rs-row[data-f="biz"] { --fc: var(--field-biz); } .rs-row[data-f="policy"] { --fc: var(--field-policy); } .rs-row[data-f="ir"] { --fc: var(--field-ir); }
.rs-row[data-f="soc"] { --fc: var(--field-soc); } .rs-row[data-f="law"] { --fc: var(--field-law); } .rs-row[data-f="hum"] { --fc: var(--field-hum); }
.rs-row[aria-selected="true"] { background: var(--accent-tint); }
.rs-row[aria-selected="true"]:hover { background: var(--accent-tint-2); }
.rs-row.is-new { animation: rs-new 2.4s var(--ease-out) 1; }
@keyframes rs-new { 0% { background: var(--accent-tint-2); } 100% { background: transparent; } }
.rs-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--r-md); background: color-mix(in srgb, var(--fc) 10%, var(--raised)); color: var(--fc); }
.rs-mark svg { width: 17px; height: 17px; }
.rs-mark.is-draft { background: transparent; color: var(--fc); }
.rs-row.is-draft { min-height: 60px; }
.rs-row.has-fig { grid-template-columns: 96px minmax(0, 1fr) auto; min-height: 84px; }
.rs-fig { display: grid; place-items: center; width: 96px; height: 64px; border-radius: 8px; background: var(--raised); box-shadow: inset 0 0 0 1px var(--hairline); }
.rs-kindtag { font-size: var(--fs-small); color: var(--ink-2); }
.rs-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rs-title-line { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.rs-run { flex: none; color: var(--ink-3); }
.rs-stage { color: var(--accent-ink); font-weight: 500; }
.rs-kind { color: var(--ink); font-weight: 500; }
.rs-meta { gap: 18px; }
.rs-ev { width: 116px; display: flex; justify-content: flex-end; gap: 10px; }
.rs-ev > span { display: inline-flex; align-items: center; gap: 4px; }
.rs-ev svg { width: 13px; height: 13px; color: var(--ink-3); }
.rs-ev .gap, .rs-ev .gap svg { color: var(--warning); }
.rs-st { width: 96px; display: flex; }
.rs-prog { display: flex; align-items: center; gap: 8px; }
.rs-prog .progress { flex: 1; height: 4px; }
.rs-prog .num { font-weight: 600; color: var(--ink); font-size: var(--fs-small); font-variant-numeric: tabular-nums; }
.rs-when { width: 68px; text-align: right; }

/* The running study: one row that is a live job record — stage track with what each stage produced, and the figure it has drawn. */
.rs-row.rs-live { display: grid; grid-template-columns: minmax(0, 1fr) 252px; grid-template-areas: "top top" "track fig"; gap: 14px 24px; align-items: start;
  margin: 8px 0 10px; padding: 16px 18px 18px 20px; border-radius: var(--r-lg); background: var(--raised); box-shadow: var(--e-2); border-bottom: 0; }
.rs-row.rs-live:hover { background: var(--raised); }
.rs-row.rs-live[aria-selected="true"] { background: var(--raised); box-shadow: var(--e-2), 0 0 0 1.5px var(--accent); }
.rs-row.rs-live::before { top: 18px; bottom: 18px; }
.rs-live-top { grid-area: top; display: flex; align-items: center; gap: 14px; min-width: 0; }
.rs-live-tag { display: inline-flex; align-items: center; gap: 7px; flex: none; height: 26px; padding: 0 10px; border-radius: var(--r-pill); background: var(--accent-tint); font-size: var(--fs-small); font-weight: 600; color: var(--accent-ink); }
.rs-live-top .rs-title-line { flex: 1 1 auto; }
.rs-live-top .list-row-title { font-size: 18px; }
.rs-live-top .rs-prog { flex: none; width: 168px; }
.rs-track { grid-area: track; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 10px; min-width: 0; }
.rs-seg { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rs-seg-bar { position: relative; height: 4px; border-radius: 4px; background: var(--sunken-2); overflow: hidden; }
.rs-seg.is-done .rs-seg-bar { background: var(--ink); }
.rs-seg.is-active .rs-seg-bar { background: color-mix(in srgb, var(--accent) 22%, var(--sunken-2)); }
.rs-seg.is-active .rs-seg-bar::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, var(--accent) 45%, var(--brand-orange) 60%, transparent); background-size: 50% 100%; background-repeat: no-repeat; animation: rs-sweep 2.2s var(--ease-in-out, ease-in-out) infinite; }
@keyframes rs-sweep { from { background-position: -60% 0; } to { background-position: 160% 0; } }
.rs-seg-k { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: var(--fs-small); font-weight: 600; color: var(--ink); }
.rs-seg-k svg { width: 13px; height: 13px; color: var(--success); }
.rs-seg.is-todo .rs-seg-k { color: var(--ink-2); font-weight: 500; }
.rs-seg.is-active .rs-seg-k { color: var(--accent-ink); }
.rs-seg-v { font-size: var(--fs-small); line-height: 1.4; color: var(--ink-2); }
.rs-seg.is-active .rs-seg-v { color: var(--ink); }
.rs-live-fig { grid-area: fig; display: flex; flex-direction: column; gap: 6px; padding: 8px 8px 6px; border-radius: var(--r-md); background: var(--paper); box-shadow: inset 0 0 0 1px var(--hairline); }
.rs-live-cap { font-family: var(--font-mono); font-size: var(--fs-mono); color: var(--ink-2); }
@media (prefers-reduced-motion: reduce) { .rs-seg.is-active .rs-seg-bar::after { animation: none; background-position: 50% 0; } }

/* Inspector · lead figure and the rest */
.dt-lead { display: flex; flex-direction: column; gap: 8px; padding: 12px 12px 10px; border-radius: var(--r-md); background: var(--paper); box-shadow: inset 0 0 0 1px var(--hairline); color: var(--ink); transition: box-shadow var(--d-2); }
.dt-lead:hover { box-shadow: inset 0 0 0 1px var(--hairline-strong), var(--e-1); }
.dt-lead-plot { display: block; }
.dt-lead-cap { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: var(--fs-small); }
.dt-lead-cap b { font-weight: 600; }
.dt-lead-cap .t-mono { color: var(--ink-2); flex: none; }
.dt-more { display: flex; flex-direction: column; margin-top: 6px; }
.dt-more a { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: var(--fs-small); font-weight: 500; color: var(--ink); }
.dt-more .cf-thumb.dt-mini { width: 48px; }
.dt-more a > span:not(.cf-thumb) { flex: 1; }
.dt-more svg { width: 14px; height: 14px; color: var(--ink-3); }
.dt-live { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: var(--fs-desc); color: var(--ink); }
.dt-live b { font-weight: 600; color: var(--accent-ink); }
.dt-live-n { margin-left: auto; font-size: var(--fs-small); color: var(--ink-2); }

.rs-rail { top: calc(var(--topbar-h) + 20px); }
.rs-detail { display: flex; flex-direction: column; gap: 16px; padding: 20px; border-radius: var(--r-lg); background: var(--raised); box-shadow: var(--e-1); }
@media (min-width: 1181px) { .rs-detail { max-height: calc(100dvh - var(--topbar-h) - 40px); overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; } }
.dt-head { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--ink-2); }
.dt-run { margin-left: auto; color: var(--ink-3); }
.dt-badge { margin-left: auto; }
.dt-tools { position: relative; display: flex; align-items: center; gap: 2px; margin: -8px -10px -8px 4px; }
.dt-tools .icon-btn { width: 36px; height: 36px; }
.dt-tools svg { width: 16px; height: 16px; }
.dt-close { display: none; }
.dt-title { margin-top: -6px; text-wrap: balance; }
.dt-actions { position: relative; display: flex; align-items: center; gap: 8px; }
.dt-actions .btn { border-radius: var(--r-md); }
.dt-actions .btn { min-width: 0; }
.dt-actions .btn-primary { flex: 1 1 auto; justify-content: center; }
.dt-menu { right: 0; left: auto; top: calc(100% + 6px); transform-origin: top right; }
.menu .menu-item.danger, .menu .menu-item.danger svg { color: var(--danger); }
.dt-q { font-size: var(--fs-ui); line-height: var(--lh-ui); color: var(--ink-2); }
.dt-live { display: flex; padding: 9px 12px; border-radius: var(--r-md); background: var(--sunken); }
.dt-live-m { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1 0; }
.dt-live { flex-wrap: nowrap !important; }
.dt-live-msg { font-size: var(--fs-small); color: var(--ink-2); }
.dt-queued { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--ink-2); }
.dt-queued svg { width: 15px; height: 15px; color: var(--ink-3); }
.dt-k { margin-bottom: 8px; font-size: var(--fs-small); font-weight: 600; color: var(--ink-2); }
.dt-claim { font-size: var(--fs-ui); line-height: 1.5; color: var(--ink); }
.dt-figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dt-fig { display: flex; flex-direction: column; gap: 6px; min-width: 0; color: var(--ink); }
.dt-fig .fig-thumb.lg { aspect-ratio: 64 / 40; transition: box-shadow var(--d-2), transform var(--d-2) var(--ease-out); }
.dt-fig:hover .fig-thumb.lg { transform: translateY(-1px); box-shadow: var(--e-2); }
.dt-fig > span:last-child { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: var(--fs-small); font-weight: 500; }
.dt-fig > span:last-child svg { width: 14px; height: 14px; color: var(--ink-3); flex: none; }
.dt-facts { margin: 0; padding-top: 6px; border-top: 1px solid var(--hairline); }
.dt-facts > div { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 7px 0; align-items: baseline; font-size: var(--fs-desc); }
.dt-facts dt { color: var(--ink-3); }
.dt-facts dd { margin: 0; color: var(--ink); min-width: 0; overflow-wrap: anywhere; }
.dt-facts .t-mono { color: var(--ink-2); }
.dt-note { display: flex; gap: 8px; font-size: var(--fs-small); color: var(--ink-2); }
.dt-note svg { width: 14px; height: 14px; flex: none; margin-top: 2px; color: var(--ink-3); }
.dt-keys { display: flex; flex-wrap: wrap; gap: 6px 16px; padding-top: 12px; border-top: 1px solid var(--hairline); font-size: var(--fs-small); color: var(--ink-3); }
.dt-keys > span { display: inline-flex; align-items: center; gap: 4px; }
.dt-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 12px; text-align: center; font-size: var(--fs-small); color: var(--ink-2); }
.dt-empty svg { width: 22px; height: 22px; color: var(--ink-3); }

.rs-state { padding: 56px 24px; }
.state-ex { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 6px; }
.state-btns { justify-content: center; margin-top: 10px; }
.rs-state .btn { margin-top: 0; }
.rs-skeleton { padding: 8px 0 12px; }
.sk-row { display: flex; align-items: center; gap: 14px; padding: 16px 8px; border-bottom: 1px solid var(--hairline); }
.sk-mark { width: 36px; height: 36px; border-radius: var(--r-md); flex: none; }
.sk-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.sk-col { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.sk-line { height: 10px; }
.sk-thin { height: 8px; }
.sk-badge { width: 64px; height: 22px; border-radius: var(--r-sm); flex: none; }
.dialog .btn-danger:hover { background: #9e3c30; }
.is-empty-ws .rs-toolbar, .is-empty-ws .rs-rail, .is-empty-ws .rs-actions { display: none; }
.is-empty-ws .rs-layout { grid-template-columns: minmax(0, 1fr); }

@media (max-width: 1180px) {
  .rs-rail { display: none; position: fixed; z-index: var(--z-dialog); left: 0; right: 0; bottom: 0; top: auto; max-height: 86dvh; overflow: auto; overscroll-behavior: contain; }
  .rs-rail.is-sheet { display: block; visibility: visible !important; opacity: 1 !important; }
  .rs-rail .rs-detail { border-radius: var(--r-xl) var(--r-xl) 0 0; box-shadow: var(--e-4); padding: 10px 20px calc(24px + env(safe-area-inset-bottom)); max-width: 640px; margin: 0 auto; }
  .rs-rail .rs-detail::before { content: ""; display: block; width: 40px; height: 4px; margin: 0 auto 4px; border-radius: 4px; background: var(--hairline-strong); }
  .dt-close { display: inline-grid; }
  .dt-keys { display: none; }
  [data-rs-scrim] { z-index: calc(var(--z-dialog) - 1); }
}
@media (max-width: 860px) {
  .rs-ev { display: none; }
}
@media (max-width: 640px) {
  .rs-actions { display: none; }
  .rs-toolbar { position: static; display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: 8px; border-bottom: 0; padding-bottom: 4px; }
  .rs-toolbar .control-search { max-width: none; }
  .rs-toolbar .trail { display: none; }
  .rs-status { grid-column: 1 / -1; grid-row: 2; }
  .rs-status button { flex: 1; justify-content: center; padding: 0 6px; }
  .rs-sort { margin-left: 0; grid-column: 2; grid-row: 1; }
  .rs-sort .select-trigger { width: 44px; min-height: 44px; padding: 0; justify-content: center; background: var(--sunken); }
  .rs-sort .select-trigger .value, .rs-sort .select-trigger .chev { display: none; }
  .rs-sort .chev-lead { width: 18px; height: 18px; }
  .rs-group-h { padding: 0 0 8px; }
  .rs-row { grid-template-columns: 36px minmax(0, 1fr); column-gap: 14px; padding: 12px 0 12px 4px; }
  .rs-row.is-running { padding-left: 10px; }
  .rs-row .list-row-meta { grid-column: 2; gap: 12px; }
  .rs-st, .rs-when { width: auto; }
  .rs-prog { width: 168px; }
  .rs-row .list-row-sub { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .dt-actions .btn { min-height: 44px; }
  .dt-tools .icon-btn { width: 44px; height: 44px; }
  .dt-facts > div { grid-template-columns: 84px minmax(0, 1fr); }
  .rs-skeleton { padding: 8px 0 12px; }
}


/* =====================================================================================================
   Round 3 · wizard: the landing's hero composition inside the app. The question is asked on the live field
   (title and lede in white on the veiled blue side, the composer on paper), and the plan card stands on its edge.
   This is the page's one field moment.
   ===================================================================================================== */
.nr-atmo { position: relative; isolation: isolate; }
/* Round 4B · the field is the room: it runs edge to edge behind the title, the composer and the plan, then fades into paper.
   Nothing sits across a hard edge; what follows the field (examples) starts on paper. */
.nr-field { position: absolute; z-index: -1; top: 0; height: var(--nr-field-h, 470px); border-radius: 0;
  --col: calc(100vw - var(--sidebar-w)); width: var(--col); left: calc((100% - var(--col)) / 2); right: auto;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 100px), transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 100px), transparent 100%); }
.nr-atmo .nr-suggest { margin-top: 40px; }
.nr-field .veil { background: linear-gradient(90deg, rgba(8,18,40,.5) 0%, rgba(8,18,40,.24) 40%, rgba(8,18,40,.06) 72%), linear-gradient(180deg, rgba(8,18,40,.22), rgba(8,18,40,0) 46%); }
.nr-atmo .nr-head { padding: 44px 0 28px; }
.nr-atmo .nr-head .t-title { color: #fff; font-size: clamp(36px, 3.4vw, 48px); }
.nr-atmo .nr-head .app-head-lede { color: #fff; max-width: 68ch; text-wrap: pretty; }
.nr-atmo .nr-composer { box-shadow: 0 2px 6px rgba(5,15,40,.16), 0 30px 60px -30px rgba(5,15,40,.55); }
.nr-atmo .nr-grid { padding-inline: 0; }
/* privacy sits inside the composer, on paper */
.nr-composer .nr-privacy { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 22px 12px; border-top: 1px solid var(--hairline); font-size: var(--fs-small); color: var(--ink-2); }
.nr-composer .nr-privacy svg { width: 14px; height: 14px; flex: none; color: var(--ink-3); }
.nr-examples-rich { margin-top: 64px; }
/* Idle plan = a night instrument: what the four stages will do, the budget, and nothing pretending to be content. */
.nr-atmo .nr[data-stage="idle"] .plan-card { padding: 18px 20px 18px; background: var(--brand-night); color: #fff; box-shadow: inset 0 0 0 1px var(--night-edge), 0 30px 70px -30px rgba(5,15,40,.7); overflow: hidden; }
.nr[data-stage="idle"] .plan-head { border-bottom-color: var(--night-edge); }
.nr[data-stage="idle"] .plan-head .t-eyebrow { color: var(--on-dark-2); }
.nr[data-stage="idle"] .plan-head .badge.plain { background: rgba(255,255,255,.1); color: var(--on-dark-2); box-shadow: none; }
.nr[data-stage="idle"] .plan-id { color: var(--on-dark-3); }
.nr[data-stage="idle"] .plan-q.is-empty { color: var(--on-dark-2); }
.nr[data-stage="idle"] .ps-n { background: transparent; color: var(--on-dark-2); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.3); }
.nr[data-stage="idle"] .ps-title { color: #fff; }
.nr[data-stage="idle"] .ps-sub { color: var(--on-dark-2); }
.nr[data-stage="idle"] .plan-rail { background: rgba(255,255,255,.16); }
.nr[data-stage="idle"] .plan-foot { border-top-color: var(--night-edge); }
.nr[data-stage="idle"] .budget-bar { background: rgba(255,255,255,.14); }
.nr[data-stage="idle"] .bb-used { background: rgba(255,255,255,.5); }
.nr[data-stage="idle"] .sw-used { background: rgba(255,255,255,.5); }
.nr[data-stage="idle"] .bb-legend { color: var(--on-dark-2); }
.nr[data-stage="idle"] .ps { padding: 8px 0; }
.nr-atmo .plan-head > * { white-space: nowrap; }
/* worked examples: one real figure each */
.ex-fig { display: flex; flex-direction: column; gap: 6px; margin-top: auto; padding: 10px 10px 8px; border-radius: var(--r-md); background: var(--paper); box-shadow: inset 0 0 0 1px var(--hairline); }
.ex-fig:empty { display: none; }
.ex-cap { font-family: var(--font-mono); font-size: var(--fs-mono); color: var(--ink-2); }
.ex-card { gap: 14px; padding: 18px; }
.ex-q { font-size: var(--fs-row); line-height: 1.42; }
/* phone-only plan peek (the desktop plan is beside the composer; on the phone it docks once there is a plan) */
.nr-peek { display: none; }
@media (max-width: 1180px) { .nr-atmo .nr-grid { padding-inline: 0; } }
@media (max-width: 1024px) { .nr-field { --col: 100vw; } }
@media (max-width: 1024px) {
  .nr[data-stage="idle"] .nr-peek { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 12px; padding: 12px 14px; border-radius: var(--r-lg); background: var(--brand-night); color: var(--on-dark-2); font-size: var(--fs-small); box-shadow: inset 0 0 0 1px var(--night-edge); }
  .nr-peek li { display: inline-flex; align-items: center; gap: 6px; }
  .nr-peek li:first-child { flex-basis: 100%; gap: 8px; justify-content: space-between; }
  .nr-peek b { color: #fff; font-weight: 600; font-size: var(--fs-ui); }
  .nr-peek .pk-n { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.3); font-size: 12px; font-variant-numeric: tabular-nums; }
}
@media (max-width: 640px) {
  .nr-field { --nr-field-h: 440px; }
  .nr-atmo .nr-suggest { margin-top: 28px; }
  .nr-atmo .nr-head { padding: 28px 0 18px; }
  .nr-atmo .nr-head .t-title { font-size: 34px; }
  .nr-composer .nr-privacy { padding: 10px 16px 12px; align-items: flex-start; }
  .nr-composer .nr-privacy svg { margin-top: 3px; }
  .nr-examples-rich { margin-top: 36px; }
  .ex-grid { display: flex; grid-template-columns: none; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 14px calc(var(--gutter) * -1) 0; padding: 4px var(--gutter) 12px; scroll-padding-inline: var(--gutter); scrollbar-width: none; }
  .ex-grid::-webkit-scrollbar { display: none; }
  .ex-card { flex: 0 0 82%; scroll-snap-align: start; }
}



/* Research · tablet and phone */
@media (max-width: 900px) {
  .rs-row.rs-live { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "track" "fig"; }
  .rs-live-fig { max-width: 320px; }
}
@media (max-width: 640px) {
  .rs-row.rs-live { margin: 6px 0 8px; padding: 14px 14px 16px 16px; gap: 12px; }
  .rs-live-top { flex-wrap: wrap; gap: 8px 10px; }
  .rs-live-top .rs-title-line { flex-basis: 100%; order: 2; }
  .rs-live-top .rs-prog { order: 3; flex: 1 1 auto; width: auto; }
  .rs-track { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; }
  .rs-live-fig { max-width: none; }
  .rs-row.has-fig { grid-template-columns: 72px minmax(0, 1fr); column-gap: 14px; }
  .rs-fig { width: 72px; height: 52px; }
  .rs-fig .cf-svg { width: 64px; height: auto; }
  .rs-row.is-draft { grid-template-columns: 28px minmax(0, 1fr); }
  .rs-mark.is-draft { width: 28px; }
}


.nr[data-stage="idle"] .plan-head .badge.plain { display: none; }
.dt-live { font-size: var(--fs-small); }
.rs-toolbar { box-shadow: -14px 0 0 var(--paper), 14px 0 0 var(--paper); }
@media (max-width: 640px) { .rs-toolbar { box-shadow: none; } }
.rs-live-fig .cf-svg { width: 100%; height: auto; }

/* ============================== Templates · Gallery (audit-fix B) ==============================
   Deep Research leads as a featured card; every template is a card whose figures are drawn by one renderer (specimens.css).
   The field rail is one scrolling row that sticks under the top bar. Desktop: a 2-up gallery beside a sticky poster preview;
   tablet: the gallery fills the width and the preview is a sheet; phone: each field is a swipeable shelf. */
.field-glyph[data-f="shared"] { --fg: var(--brand-blue); background: linear-gradient(135deg, rgba(18,117,216,.14), rgba(225,145,54,.16)); }
.tp-actions .btn { border-radius: var(--r-md); }
.tp-head .app-head-actions { gap: 10px; }
.tp-head .tp-search { width: 320px; flex: none; background: rgba(20,20,19,.035); border-color: transparent; box-shadow: none; }
.tp-head .tp-search:focus-within { background: var(--raised); box-shadow: 0 0 0 1px rgba(20,20,19,.12), 0 0 0 4px var(--accent-tint-2); }
.tp-search input::placeholder { color: var(--ink-3); }
.tp-clear { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-right: 2px; border-radius: 8px; color: var(--ink-2); }
.tp-clear:hover { background: rgba(20,20,19,.06); color: var(--ink); }
.tp-clear svg { width: 15px; height: 15px; }
.tp-clear:not([hidden]) + .kbd { display: none; }
.tp-ask { font-weight: 600; }
.tp-meta .tp-shown { padding: 2px 8px; border-radius: var(--r-pill); background: var(--accent-tint); color: var(--accent-ink); font-weight: 500; }
.tp-meta .tp-shown .num { font-variant-numeric: tabular-nums; }

/* Field rail */
.tp-bar { position: sticky; top: var(--topbar-h); z-index: 6; margin: 0 calc(var(--gutter) * -1); padding: 10px var(--gutter); background: rgba(250,249,245,.97); -webkit-backdrop-filter: saturate(1.4) blur(16px); backdrop-filter: saturate(1.4) blur(16px); border-bottom: 1px solid var(--hairline); }
.tp-index { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; scrollbar-width: none; scroll-padding-inline: 40px; -webkit-mask: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask: linear-gradient(90deg, #000 calc(100% - 48px), transparent); padding-right: 40px; }
.tp-index::-webkit-scrollbar { display: none; }
.tp-ix { --fg: var(--ink-2); position: relative; flex: none; display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px 0 8px; border-radius: var(--r-pill); border: 1px solid rgba(20,20,19,.09); background: rgba(255,255,255,.7); font-size: var(--fs-small); font-weight: 500; color: var(--ink-2); white-space: nowrap; transition: background var(--d-2), border-color var(--d-2), color var(--d-2); }
.tp-ix:first-child { padding-left: 12px; }
.tp-ix:hover { background: var(--raised); border-color: rgba(20,20,19,.16); color: var(--ink); }
.tp-ix-dot { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; background: color-mix(in srgb, var(--fg) 13%, #fff); color: var(--fg); }
.tp-ix-dot svg { width: 13px; height: 13px; stroke-width: 2; }
.tp-ix .count { font-variant-numeric: tabular-nums; color: var(--ink-3); }
.tp-ix.is-inview { border-color: color-mix(in srgb, var(--fg) 45%, transparent); color: var(--ink); background: var(--raised); }
.tp-ix[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.tp-ix[aria-pressed="true"] .count { color: rgba(255,255,255,.66); }
.tp-ix[aria-pressed="true"] .tp-ix-dot { background: rgba(255,255,255,.16); color: #fff; }
.tp-ix.is-zero { opacity: .45; }
.tp-ix[data-f="bio"] { --fg: var(--field-bio); } .tp-ix[data-f="med"] { --fg: var(--field-med); } .tp-ix[data-f="aiml"] { --fg: var(--field-aiml); } .tp-ix[data-f="eng"] { --fg: var(--field-eng); }
.tp-ix[data-f="sci"] { --fg: var(--field-sci); } .tp-ix[data-f="quant"] { --fg: var(--field-quant); } .tp-ix[data-f="biz"] { --fg: var(--field-biz); } .tp-ix[data-f="policy"] { --fg: var(--field-policy); }
.tp-ix[data-f="ir"] { --fg: var(--field-ir); } .tp-ix[data-f="soc"] { --fg: var(--field-soc); } .tp-ix[data-f="law"] { --fg: var(--field-law); } .tp-ix[data-f="hum"] { --fg: #6f7d3f; } .tp-ix[data-f="shared"] { --fg: var(--brand-blue); }

/* Layout */
@media (min-width: 1181px) { .tp-layout.l-list.has-inspector { grid-template-columns: minmax(0, 1fr) clamp(380px, 34%, 440px); gap: 28px; } }
.tp-layout { margin-top: 20px; }
.tp-list { min-width: 0; }

/* Featured: Deep Research */
.tp-feature { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 24px; align-items: center; padding: 26px 26px 26px 28px; border-radius: var(--r-xl); overflow: hidden;
  background: radial-gradient(120% 140% at 100% 0%, rgba(18,117,216,.13), transparent 58%), radial-gradient(90% 120% at 0% 110%, rgba(225,145,54,.12), transparent 60%), var(--raised); box-shadow: var(--e-2); }
.tp-feature::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(18,117,216,.22) .8px, transparent 1.2px); background-size: 8px 8px; -webkit-mask: linear-gradient(110deg, transparent 40%, #000 75%); mask: linear-gradient(110deg, transparent 40%, #000 75%); opacity: .55; }
.tp-feature[hidden] { display: none; }
.tpf-copy { position: relative; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tpf-eyebrow { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); font-weight: 600; color: var(--ink-2); }
.tpf-title { font-family: var(--font-display); font-size: 32px; line-height: 1.12; letter-spacing: -.024em; font-weight: 500; color: var(--ink); }
.tpf-desc { font-size: var(--fs-desc); line-height: var(--lh-desc); color: var(--ink-2); max-width: 46ch; text-wrap: pretty; }
.tpf-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.tpf-acts .btn { border-radius: var(--r-md); }
.tpf-art { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.tpf-fig { display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 6px 6px 6px; border-radius: 12px; background: rgba(255,255,255,.86); box-shadow: 0 1px 2px rgba(20,20,19,.05), 0 10px 24px -14px rgba(11,24,48,.3), 0 0 0 1px rgba(20,20,19,.06); }
.tpf-fig .spx { border-radius: 8px; }
.tpf-fig-l { padding: 0 4px; font-size: var(--fs-small); font-weight: 500; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Field sections */
.tp-group { --fg: var(--ink-2); margin-top: 32px; }
.tp-feature + div > .tp-group:first-child, .tp-group:first-child { margin-top: 28px; }
.tp-group-h { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.tp-group-h h2 { font-family: var(--font-display); font-size: 22px; line-height: 1.25; font-weight: 500; letter-spacing: -.014em; color: var(--ink); }
.tp-group-n { margin-left: auto; padding: 2px 9px; border-radius: var(--r-pill); background: rgba(20,20,19,.05); font-size: var(--fs-small); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.tp-group-n .num { font-weight: 600; color: var(--ink); }
.tp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 16px; }

/* Template card */
.tpc { --fg: var(--ink-2); position: relative; display: flex; flex-direction: column; min-width: 0; text-align: left; border-radius: 16px; background: var(--raised); box-shadow: var(--e-1); overflow: hidden; transition: box-shadow var(--d-3) var(--ease-out), transform var(--d-3) var(--ease-out); -webkit-tap-highlight-color: transparent; }
.tpc[data-f="bio"], .tp-group[data-f="bio"] { --fg: var(--field-bio); } .tpc[data-f="med"], .tp-group[data-f="med"] { --fg: var(--field-med); } .tpc[data-f="aiml"], .tp-group[data-f="aiml"] { --fg: var(--field-aiml); }
.tpc[data-f="eng"], .tp-group[data-f="eng"] { --fg: var(--field-eng); } .tpc[data-f="sci"], .tp-group[data-f="sci"] { --fg: var(--field-sci); } .tpc[data-f="quant"], .tp-group[data-f="quant"] { --fg: var(--field-quant); }
.tpc[data-f="biz"], .tp-group[data-f="biz"] { --fg: var(--field-biz); } .tpc[data-f="policy"], .tp-group[data-f="policy"] { --fg: var(--field-policy); } .tpc[data-f="ir"], .tp-group[data-f="ir"] { --fg: var(--field-ir); }
.tpc[data-f="soc"], .tp-group[data-f="soc"] { --fg: var(--field-soc); } .tpc[data-f="law"], .tp-group[data-f="law"] { --fg: var(--field-law); } .tpc[data-f="hum"], .tp-group[data-f="hum"] { --fg: #6f7d3f; } .tpc[data-f="shared"], .tp-group[data-f="shared"] { --fg: var(--brand-blue); }
.tpc:hover { transform: translateY(-2px); box-shadow: var(--e-3); }
.tpc:active { transform: translateY(0) scale(.99); }
.tpc:focus-visible { outline: none; box-shadow: var(--e-2), 0 0 0 2px var(--paper), 0 0 0 4px var(--accent); }
.tpc[aria-selected="true"] { box-shadow: 0 0 0 2px var(--fg), var(--e-2); }
.tpc-art { display: grid; grid-template-columns: 1.7fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; height: 156px; padding: 12px; background: linear-gradient(180deg, color-mix(in srgb, var(--fg) 10%, #fbfaf6), color-mix(in srgb, var(--fg) 4%, #fbfaf6)); border-bottom: 1px solid rgba(20,20,19,.05); }
.tpc-art .spx { aspect-ratio: auto; height: 100%; min-height: 0; background: var(--raised); box-shadow: 0 1px 2px rgba(20,20,19,.05), 0 0 0 1px rgba(20,20,19,.05); }
.tpc-art .tpc-lead { grid-row: 1 / span 2; }
.tpc-art[data-n="2"] .tpc-sub { grid-row: 1 / span 2; }
.tpc-art[data-n="1"] { grid-template-columns: 1fr; }
.tpc-art .spx-svg { transition: transform var(--d-4) var(--ease-out); }
.tpc:hover .tpc-lead .spx-svg { transform: scale(1.04); }
.tpc-body { display: flex; flex-direction: column; gap: 6px; flex: 1; padding: 12px 16px 16px; }
.tpc-top { display: flex; align-items: center; gap: 8px; }
.tpc-id { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: 6px; background: rgba(20,20,19,.05); font-size: 11px; font-weight: 500; letter-spacing: .04em; color: var(--ink-2); }
.tpc-n { font-size: var(--fs-small); color: var(--ink-3); }
.tpc-title { font-size: var(--fs-row); line-height: 22px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); min-height: 44px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-bottom: 1px; text-wrap: pretty; }
.tpc-figs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.tpc-chip { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 7px; border-radius: 6px; background: rgba(20,20,19,.045); font-size: 12px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.tpc-chip.is-lead { background: color-mix(in srgb, var(--fg) 11%, #fff); color: color-mix(in srgb, var(--fg) 70%, var(--ink)); }
.tpc-chip.is-lead::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--fg); }
.tpc-chip.is-more { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); }
.tpc-go { position: absolute; top: 18px; right: 18px; width: 30px; height: 30px; padding: 7px; border-radius: 10px; background: rgba(255,255,255,.92); color: var(--ink); box-shadow: 0 2px 8px -2px rgba(20,20,19,.2); opacity: 0; transform: translateY(4px); transition: opacity var(--d-2), transform var(--d-3) var(--ease-out); }
.tpc:hover .tpc-go, .tpc:focus-visible .tpc-go, .tpc[aria-selected="true"] .tpc-go { opacity: 1; transform: none; }

/* Empty */
.tp-layout:has(.tp-empty:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
.tp-layout:has(.tp-empty:not([hidden])) .tp-preview { display: none; }
.tp-empty { padding: 64px 24px; }
.tp-empty .row { justify-content: center; margin-top: 12px; }
.tp-empty .link { font-size: inherit; }

/* Preview (poster) */
.tp-preview { top: calc(var(--topbar-h) + 72px); }
.tp-card { --fg: var(--ink-2); display: flex; flex-direction: column; gap: 16px; max-height: calc(100dvh - var(--topbar-h) - 88px); overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 20px 22px 0; border-radius: var(--r-xl); background: var(--raised); box-shadow: 0 1px 2px rgba(20,20,19,.04), 0 16px 36px -16px rgba(11,24,48,.22), 0 0 0 1px rgba(20,20,19,.06); }
.tp-card[data-f="bio"] { --fg: var(--field-bio); } .tp-card[data-f="med"] { --fg: var(--field-med); } .tp-card[data-f="aiml"] { --fg: var(--field-aiml); } .tp-card[data-f="eng"] { --fg: var(--field-eng); }
.tp-card[data-f="sci"] { --fg: var(--field-sci); } .tp-card[data-f="quant"] { --fg: var(--field-quant); } .tp-card[data-f="biz"] { --fg: var(--field-biz); } .tp-card[data-f="policy"] { --fg: var(--field-policy); }
.tp-card[data-f="ir"] { --fg: var(--field-ir); } .tp-card[data-f="soc"] { --fg: var(--field-soc); } .tp-card[data-f="law"] { --fg: var(--field-law); } .tp-card[data-f="hum"] { --fg: #6f7d3f; } .tp-card[data-f="shared"] { --fg: var(--brand-blue); }
.tp-card::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; border-radius: var(--r-xl) var(--r-xl) 0 0; background: var(--fg); opacity: .85; }
.tp-preview .tp-card { position: relative; }
.tpp-none { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 48px 16px; text-align: center; font-size: var(--fs-desc); color: var(--ink-2); }
.tpp-none svg { width: 22px; height: 22px; color: var(--ink-3); }
.tpp-head { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); }
.tpp-field { color: var(--ink-2); font-weight: 500; }
.tpp-head .tpc-id { margin-left: auto; }
.tpp-close { display: none; }
.tpp-title { margin-top: -6px; text-wrap: balance; }
.tpp-hero { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.tpp-frame { display: block; padding: 10px; border-radius: 14px; background: linear-gradient(180deg, color-mix(in srgb, var(--fg) 9%, #fbfaf6), color-mix(in srgb, var(--fg) 3%, #fbfaf6)); }
.tpp-frame .spx { background: var(--raised); box-shadow: 0 1px 2px rgba(20,20,19,.05), 0 0 0 1px rgba(20,20,19,.05); }
.tpp-hero figcaption { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.tpp-cap-l { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tpp-cap-l b { font-size: var(--fs-ui); font-weight: 600; color: var(--ink); }
.tpp-prov { font-size: var(--fs-small); color: var(--ink-2); }
.tpp-hero-n { flex: none; font-size: var(--fs-small); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.tpp-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.tpp-strip[data-n="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tpp-strip[data-n="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tpp-strip[data-n="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tpp-fig { position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 4px; border-radius: 12px; text-align: left; transition: box-shadow var(--d-2), background var(--d-2); }
.tpp-fig .spx { aspect-ratio: 4 / 3; border-radius: 8px; background: #fbfaf6; }
.tpp-fig:hover { background: var(--sunken); }
.tpp-fig[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--accent); background: var(--accent-tint); }
.tpp-fig[aria-pressed="true"]::after { content: ""; position: absolute; top: 8px; right: 8px; width: 14px; height: 14px; border-radius: 50%; background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.tpp-fig > span:last-child { padding: 0 2px; font-size: 12px; font-weight: 500; line-height: 16px; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tpp-fig[aria-pressed="true"] > span:last-child { color: var(--ink); }
.tpp-k { margin-bottom: 8px; font-size: 12px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-2); }
.tpp-subq { display: flex; flex-direction: column; gap: 6px; counter-reset: q; }
.tpp-subq li { position: relative; padding-left: 26px; font-size: var(--fs-desc); line-height: var(--lh-desc); color: var(--ink-2); counter-increment: q; }
.tpp-subq li::before { content: counter(q); position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 6px; background: rgba(20,20,19,.05); font-family: var(--font-mono); font-size: 11px; color: var(--ink-2); }
.tpp-setup { border: 1px solid var(--hairline); border-radius: 12px; background: #fbfaf6; }
.tpp-setup summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 10px; min-height: 48px; padding: 8px 12px; cursor: pointer; list-style: none; border-radius: 12px; }
.tpp-setup summary:hover { background: rgba(20,20,19,.03); }
.tpp-setup summary::-webkit-details-marker { display: none; }
.tpp-setup-t { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-ui); font-weight: 600; color: var(--ink); white-space: nowrap; }
.tpp-setup-t svg { width: 16px; height: 16px; color: var(--accent); }
.tpp-setup-sum { grid-column: 1 / 3; grid-row: 2; min-width: 0; font-size: var(--fs-small); line-height: 18px; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tpp-setup-chev { grid-column: 3; grid-row: 1; width: 16px; height: 16px; color: var(--ink-3); transition: transform var(--d-3) var(--ease-out); }
.tpp-setup[open] .tpp-setup-chev { transform: rotate(180deg); }
.tpp-form { display: flex; flex-direction: column; gap: 14px; padding: 6px 12px 14px; }
.tpp-form .control textarea { height: auto; }
.tpp-effort { align-self: flex-start; }
.tpp-note { display: flex; gap: 8px; padding: 10px 12px; border-radius: var(--r-md); background: var(--sunken); font-size: var(--fs-small); color: var(--ink-2); }
.tpp-note svg { width: 15px; height: 15px; flex: none; margin-top: 2px; color: var(--ink-3); }
.tpp-actions { position: sticky; bottom: 0; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin: auto -22px 0; padding: 12px 22px 14px; background: rgba(255,255,255,.96); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-top: 1px solid var(--hairline); }
.tpp-actions .btn { border-radius: var(--r-md); justify-content: center; min-height: 42px; }
.tpp-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2px 12px; font-size: var(--fs-small); color: var(--ink-2); }
.tpp-alt { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-weight: 600; color: var(--accent-ink); }
.tpp-alt svg { width: 14px; height: 14px; }
.tpp-alt:hover { text-decoration: underline; text-underline-offset: 3px; }
.tp-card { overflow-x: hidden; }
[data-sheet-scrim] { z-index: calc(var(--z-dialog) - 1); }

@media (max-width: 1180px) {
  .tp-preview:not(.is-sheet) { display: none; }
  .tp-preview.is-sheet { position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: var(--z-dialog); display: block; visibility: visible !important; opacity: 1 !important; }
  .tp-preview.is-sheet .tp-card { max-width: 640px; margin: 0 auto; max-height: 88dvh; border-radius: var(--r-xl) var(--r-xl) 0 0; box-shadow: var(--e-4); padding: 10px 20px 0; }
  .tp-preview.is-sheet .tp-card::before { content: ""; display: block; flex: none; width: 40px; height: 4px; margin: 0 auto -4px; border-radius: 4px; background: var(--hairline-strong); }
  .tp-preview.is-sheet .tpp-close { display: inline-grid; margin: -8px -10px -8px 0; }
  .tp-preview.is-sheet .tpp-actions { margin: auto -20px 0; padding: 12px 20px calc(14px + env(safe-area-inset-bottom)); }
  .tp-preview.is-sheet .tp-card::after { display: none; }
  .tp-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
}
@media (max-width: 860px) {
  .tp-feature { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .tp-head .tp-search { width: 100%; height: 44px; }
  .tp-actions { flex: 1 1 100%; }
  .tp-actions .tp-ask { display: none; }
  .tp-search .kbd { display: none; }
  .tp-bar { padding: 8px var(--gutter); }
  .tp-index { gap: 6px; }
  .tp-ix { height: 44px; }
  .tp-layout { margin-top: 16px; }
  .tp-feature { gap: 16px; padding: 18px 16px 16px; border-radius: 18px; }
  .tpf-title { font-size: 26px; }
  .tpf-desc { font-size: var(--fs-small); line-height: 1.5; }
  .tpf-art { order: -1; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto; gap: 6px; }
  .tpf-fig:nth-child(4) { display: none; }
  .tpf-fig { padding: 4px; border-radius: 10px; }
  .tpf-fig-l { display: none; }
  .tpf-acts .btn { flex: 1 1 auto; justify-content: center; min-height: 44px; }
  .tp-group { margin-top: 28px; }
  .tp-group-h { margin-bottom: 10px; }
  .tp-group-h h2 { font-size: 19px; }
  /* each field is a shelf: swipe sideways, the next card peeks */
  .tp-grid { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 82%; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin: 0 calc(var(--gutter) * -1); padding: 4px var(--gutter) 10px; scroll-padding-inline: var(--gutter); }
  .tp-grid::-webkit-scrollbar { display: none; }
  .tp-grid:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 16px; }
  .tpc { scroll-snap-align: start; }
  .tpc:hover { transform: none; }
  .tpc-art { height: 150px; }
  .tpc-go { opacity: 1; transform: none; width: 32px; height: 32px; }
  .tp-preview.is-sheet .tp-card { padding-left: 16px; padding-right: 16px; }
  .tp-preview.is-sheet .tpp-actions { margin: auto -16px 0; padding-left: 16px; padding-right: 16px; }
  .tpp-alt { min-height: 44px; }
  .tpp-strip { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}


/* ============================== Wizard · audit-fix B ==============================
   One elevation system on the field: the composer and the idle plan are both paper cards (the plan turns into the working
   document once Hylē has read the question). Attach opens in place; Read and the status say whether there is anything to read. */
.nr-field { --nr-field-h: 420px; -webkit-mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 170px), transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 170px), transparent 100%); }
.nr-field { background-image: linear-gradient(in oklch 100deg, #0d3b8a, #2e5fb0 52%, #c47a35); }
.nr-atmo .nr-head { padding: 32px 0 22px; }
.nr-atmo .nr-composer { box-shadow: 0 1px 2px rgba(5,15,40,.06), 0 14px 32px -12px rgba(5,15,40,.22), 0 0 0 1px rgba(20,20,19,.08), inset 0 1px 0 rgba(255,255,255,.6); }
.nr-composer { position: relative; }
.nr-composer textarea { min-height: 84px; }
/* status: idle = hollow ring, typing = live accent dot */
.nr-pulse { background: transparent; box-shadow: inset 0 0 0 1.5px var(--ink-3); }
.nr-status.is-typing { color: var(--ink); }
.nr-status.is-typing .nr-pulse, .nr-status.is-busy .nr-pulse { background: var(--accent); box-shadow: 0 0 0 0 rgba(16,108,202,.4); animation: nr-live 1.4s var(--ease-in-out) infinite; }
@keyframes nr-live { 0% { box-shadow: 0 0 0 0 rgba(16,108,202,.45); } 100% { box-shadow: 0 0 0 7px rgba(16,108,202,0); } }
@media (prefers-reduced-motion: reduce) { .nr-status .nr-pulse { animation: none !important; } }
/* Read: muted until there is a question */
.nr-analyse { height: 40px; font-weight: 600; transition: background var(--d-2), color var(--d-2); }
.nr-analyse[aria-disabled="true"] { background: #e9e6dd; color: #57534b; box-shadow: none; cursor: not-allowed; opacity: 1; pointer-events: auto; }
.nr-analyse[aria-disabled="true"] .kbd { display: none; }
/* Attach button + count */
.nr-attach { position: relative; gap: 6px; height: 40px; border: 1px solid rgba(20,20,19,.12); background: var(--raised); }
.nr-attach:hover, .nr-attach[aria-expanded="true"] { background: var(--sunken); }
.nr-attach[aria-expanded="true"] { box-shadow: 0 0 0 3px var(--accent-tint); border-color: rgba(16,108,202,.4); }
.nr-att-n { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--accent); color: #fff; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.nr-att-n[hidden] { display: none; }
/* attached chips, above the action row */
.nr-attached { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 2px; }
.nr-attached[hidden] { display: none; }
.att-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; height: 32px; padding: 0 4px 0 6px; border-radius: 10px; background: var(--sunken); box-shadow: inset 0 0 0 1px rgba(20,20,19,.06); font-size: var(--fs-small); }
.att-chip .file-badge { --s: 22px; }
.att-chip .file-badge::after { display: none; }
.att-chip-ic { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: var(--accent-tint); color: var(--accent-ink); }
.att-chip-ic svg { width: 13px; height: 13px; }
.att-chip-ic[data-kind="csv"], .att-chip-ic[data-kind="tsv"], .att-chip-ic[data-kind="xlsx"] { background: rgba(13,111,98,.1); color: #0d6f62; }
.att-chip-ic[data-kind="json"], .att-chip-ic[data-kind="txt"], .att-chip-ic[data-kind="md"] { background: rgba(20,20,19,.06); color: var(--ink-2); }
.att-chip-ic[data-kind="pdf"] { background: rgba(166,61,49,.1); color: #a63d31; }
.att-chip-t { min-width: 0; max-width: 220px; font-weight: 500; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-inline-end: .14em; }
.att-chip-m { color: var(--ink-2); white-space: nowrap; font-size: 12px; }
.att-chip button { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; color: var(--ink-2); }
.att-chip button:hover { background: rgba(20,20,19,.08); color: var(--ink); }
.att-chip button svg { width: 14px; height: 14px; }
/* the popover: anchored under the composer's action row, right-aligned with Attach */
.nr-att { position: absolute; z-index: 30; right: 16px; top: calc(100% - 52px); width: 400px; max-width: calc(100% - 32px); display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 16px; background: var(--raised); box-shadow: 0 2px 6px rgba(20,20,19,.06), 0 24px 48px -16px rgba(11,24,48,.32), 0 0 0 1px rgba(20,20,19,.08); }
.nr-att[hidden] { display: none; }
.att-head { display: flex; align-items: center; gap: 8px; }
.att-grab { display: none; }
.att-t { flex: 1; font-size: var(--fs-ui); font-weight: 600; color: var(--ink); }
.att-x { margin: -6px -6px -6px 0; }
.att-drop { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px; border-radius: 12px; border: 1.5px dashed #c9c4b8; background: rgba(20,20,19,.02); cursor: pointer; transition: border-color var(--d-2), background var(--d-2); }
.att-drop:hover, .att-drop.is-over { border-color: var(--accent); background: var(--accent-tint); }
.att-drop:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.att-drop-ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--raised); color: var(--accent-ink); box-shadow: 0 0 0 1px rgba(20,20,19,.08); }
.att-drop-ic svg { width: 18px; height: 18px; }
.att-drop-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.att-drop-t b { font-size: var(--fs-small); font-weight: 600; color: var(--ink); }
.att-drop-t span { font-size: 12px; line-height: 16px; color: var(--ink-2); }
.att-sec { display: flex; flex-direction: column; gap: 8px; }
.att-sec-h { display: flex; justify-content: space-between; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); }
.att-count { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.att-search { height: 36px; background: rgba(20,20,19,.035); border-color: transparent; box-shadow: none; }
.att-list { display: flex; flex-direction: column; max-height: 216px; overflow: auto; overscroll-behavior: contain; margin: 0 -6px; }
.att-row { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr) 22px; align-items: center; gap: 10px; min-height: 48px; padding: 6px; border-radius: 10px; cursor: pointer; }
.att-row:hover { background: var(--sunken); }
.att-row input { position: absolute; left: 6px; top: 50%; opacity: 0; width: 1px; height: 1px; margin: 0; }
.att-row:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: -2px; }
.att-row-t { display: flex; flex-direction: column; min-width: 0; }
.att-row-t b { font-size: var(--fs-small); font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-inline-end: .14em; }
.att-row-t span { font-size: 12px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.att-check { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; box-shadow: inset 0 0 0 1.5px #c9c4b8; color: transparent; transition: background var(--d-2), box-shadow var(--d-2); }
.att-check svg { width: 14px; height: 14px; stroke-width: 3; }
.att-row:has(input:checked) { background: var(--accent-tint); }
.att-row:has(input:checked) .att-check { background: var(--accent); box-shadow: none; color: #fff; }
.att-none { padding: 12px 6px; font-size: var(--fs-small); color: var(--ink-2); }
.att-link { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 8px; height: 44px; padding: 0 4px 0 12px; border-radius: 12px; box-shadow: inset 0 0 0 1px rgba(20,20,19,.12); }
.att-link:focus-within { box-shadow: inset 0 0 0 1px rgba(16,108,202,.5), 0 0 0 3px var(--accent-tint); }
.att-link-ic svg { width: 16px; height: 16px; color: var(--ink-2); }
.att-link input { min-width: 0; height: 100%; border: 0; background: transparent; font-size: var(--fs-small); color: var(--ink); outline: none; }
.att-link input::placeholder { color: var(--ink-3); }
.att-err { margin-top: -4px; font-size: 12px; color: var(--danger); }
.att-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--hairline); }
.att-open { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: var(--fs-small); font-weight: 500; color: var(--ink-2); }
.att-open svg { width: 14px; height: 14px; }
.att-open:hover { color: var(--accent-ink); }
.att-foot .btn { min-width: 84px; justify-content: center; }
.nr-att-scrim { z-index: calc(var(--z-dialog) - 1); }

/* Idle plan: a light card with what the four stages will do; no run ID, no estimate, nothing pretending to be content */
.nr-atmo .nr[data-stage="idle"] .plan-card { padding: 16px 18px; color: var(--ink); background: rgba(255,255,255,.9); -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3);
  box-shadow: 0 1px 2px rgba(5,15,40,.06), 0 14px 32px -12px rgba(5,15,40,.22), 0 0 0 1px rgba(20,20,19,.08); overflow: hidden; }
.nr[data-stage="idle"] .plan-head { border-bottom-color: var(--hairline); }
.nr[data-stage="idle"] .plan-head .t-eyebrow { color: var(--ink-2); }
.nr[data-stage="idle"] .plan-head .badge.plain { display: inline-flex; align-items: center; gap: 6px; background: transparent; color: var(--ink-2); padding: 0; font-weight: 500; }
.nr[data-stage="idle"] .plan-head .badge.plain::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: nr-live 1.6s var(--ease-in-out) infinite; }
.nr[data-stage="idle"] .plan-id { display: none; }
.nr[data-stage="idle"] .plan-q.is-empty { color: var(--ink-2); font-size: var(--fs-small); line-height: 1.5; }
.nr[data-stage="idle"] .ps { padding: 6px 0; }
.nr[data-stage="idle"] .ps-n { background: var(--raised); color: var(--ink-3); box-shadow: inset 0 0 0 1.5px #d4cfbe; }
.nr[data-stage="idle"] .ps-title { color: var(--ink-2); font-weight: 500; }
.nr[data-stage="idle"] .ps-sub { color: var(--ink-3); font-size: var(--fs-small); max-width: none; text-wrap: pretty; }
.nr[data-stage="idle"] .plan-rail { background: var(--hairline); }
.nr[data-stage="idle"] .plan-foot { border-top-color: var(--hairline); }
.nr[data-stage="idle"] .plan-foot .est, .nr[data-stage="idle"] .plan-start { display: none; }
.ps.is-pending .ps-title { color: var(--ink-3); }
.ps.is-drafted .ps-title { font-weight: 600; }
/* one budget component: used = the rail's gradient, this study = hatched accent; one summary line */
.bb-sum { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 4px; font-size: var(--fs-small); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.bb-sum b { font-size: var(--fs-ui); font-weight: 600; color: var(--ink); }
.budget-bar { height: 6px; margin: 8px 0 8px; background: #e6e2d8; }
.bb-used, .nr[data-stage="idle"] .bb-used { background: linear-gradient(90deg, var(--brand-blue), var(--brand-orange)); }
.sw-used, .nr[data-stage="idle"] .sw-used { background: linear-gradient(90deg, var(--brand-blue), var(--brand-orange)); }
.bb-est { background: repeating-linear-gradient(135deg, var(--accent) 0 3px, rgba(16,108,202,.45) 3px 6px); }
.sw-est { background: repeating-linear-gradient(135deg, var(--accent) 0 2px, rgba(16,108,202,.45) 2px 4px); }
.nr[data-stage="idle"] .budget-bar { background: #e6e2d8; }
.nr[data-stage="idle"] .bb-legend { color: var(--ink-2); }
.bb-legend { gap: 4px 16px; font-size: 12px; }
.bb-legend [hidden] { display: none; }

/* Worked examples: full width under the composer and plan, each with its study's labelled figure */
.nr-examples-rich { margin-top: 36px; }
.nr-examples-rich .sec-head { align-items: center; padding: 0 2px 14px; }
.nr-examples-rich .sec-title { font-family: var(--font-display); font-size: 22px; line-height: 1.25; font-weight: 500; letter-spacing: -.014em; }
.ex-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ex-card { border-radius: 16px; padding: 18px 18px 16px; box-shadow: var(--e-1); transition: transform var(--d-3) var(--ease-out), box-shadow var(--d-3); }
.ex-card:hover { transform: translateY(-2px); box-shadow: var(--e-3); }
.ex-top { display: flex; align-items: center; gap: 8px; }
.ex-q { font-size: 15px; line-height: 22px; font-weight: 500; color: var(--ink); text-wrap: pretty; }
.ex-fig { padding: 10px 10px 8px; background: #f6f4ee; box-shadow: none; border-radius: 12px; }
.ex-fig .cf-svg { display: block; max-width: 100%; height: auto; }
.ex-cap { display: flex; flex-direction: column; gap: 1px; font-family: var(--font-sans); font-size: 12px; line-height: 16px; color: var(--ink-2); }
.ex-cap .t-mono { font-size: 11px; color: var(--ink-3); }
.ex-go { gap: 6px; font-size: var(--fs-small); }
.ex-go svg { width: 14px; height: 14px; }
.ex-card:hover .ex-go svg { transform: translateY(-2px); }

@media (max-width: 1024px) {
  .nr[data-stage="idle"] .nr-peek { background: rgba(255,255,255,.9); color: var(--ink-2); box-shadow: 0 0 0 1px rgba(20,20,19,.08), 0 10px 24px -14px rgba(5,15,40,.25); }
  .nr-peek b { color: var(--ink); }
  .nr-peek .pk-n { box-shadow: inset 0 0 0 1.5px #d4cfbe; color: var(--ink-2); }
  .ex-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .nr-field { --nr-field-h: 380px; }
  .nr-field .veil { background: linear-gradient(180deg, rgba(8,18,40,.5) 0%, rgba(8,18,40,.42) 45%, rgba(8,18,40,.1) 80%), linear-gradient(90deg, rgba(8,18,40,.25), rgba(8,18,40,.12)); }
  .nr-atmo .nr-head { padding: 24px 0 16px; }
  .nr-atmo .nr-head .app-head-lede { display: block; margin-top: 8px; font-size: 15px; line-height: 22px; color: #fff; }
  .nr-composer textarea { min-height: 72px; }
  .nr-bar { gap: 8px; }
  .nr-attach, .nr-analyse { height: 44px; min-width: 44px; }
  .nr-attach { width: auto; padding: 0 12px; }
  .nr-composer .nr-privacy { font-size: 13px; line-height: 18px; color: #3f3e39; }
  .nr-att-scrim { z-index: calc(var(--z-dialog) + 1); }
  .nr-att.is-sheet { position: fixed; z-index: calc(var(--z-dialog) + 2); left: 0; right: 0; bottom: 0; top: auto; width: auto; max-width: none; max-height: 88dvh; overflow: auto; border-radius: 20px 20px 0 0; padding: 10px 16px calc(16px + env(safe-area-inset-bottom)); box-shadow: var(--e-4); }
  .nr-att.is-sheet .att-grab { display: block; position: absolute; left: 50%; top: 6px; width: 40px; height: 4px; margin-left: -20px; border-radius: 4px; background: var(--hairline-strong); }
  .nr-att.is-sheet .att-head { padding-top: 8px; }
  .att-row { min-height: 52px; }
  .att-list { max-height: 30dvh; }
  .att-link { height: 48px; }
  .att-link .btn { min-height: 40px; }
  .att-foot .btn { min-height: 44px; }
  .att-open { min-height: 44px; }
  .att-chip { height: 36px; }
  .att-chip button { width: 32px; height: 32px; }
  .ex-grid { display: flex; }
  .ex-card { flex: 0 0 84%; }
  .nr-examples-rich .sec-title { font-size: 19px; }
}


/* ============================== Research · audit-fix B ==============================
   One leading 64×44 slot on every row (own figure · planned figure · place in line), fixed status and date tracks,
   two-line questions, one selection signal. The running study is a compact live row: its stage track carries progress,
   the inspector carries its figure. */
@media (min-width: 1025px) { .rs-actions .btn-primary { display: none; } }
.rs-toolbar { position: sticky; top: var(--topbar-h); z-index: 5; margin: 0 -14px; padding: 10px 14px; background: rgba(250,249,245,.97); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--hairline); box-shadow: none; border-radius: 0; }
.rs-toolbar .control-search { flex: 1 1 200px; min-width: 176px; max-width: 280px; background: rgba(20,20,19,.035); border-color: transparent; box-shadow: none; }
.rs-sort .select-trigger { height: 36px; padding: 0 10px 0 12px; border-radius: 8px; border: 1px solid rgba(20,20,19,.1); background: var(--raised); }
.rs-sort .select-trigger .chev { display: inline-block; width: 14px; height: 14px; color: var(--ink-2); }
.rs-sort .select-trigger .value::before { content: "Sort: "; color: var(--ink-2); font-weight: 400; }
.rs-group { scroll-margin-top: calc(var(--topbar-h) + 72px); margin-top: 26px; }
.rs-group-h { padding: 0 6px 8px; font-size: 12px; letter-spacing: .07em; color: var(--ink-2); border-bottom: 0; }
.rs-group-h .num { font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.rs-rows { display: flex; flex-direction: column; gap: 2px; }
.rs-row.has-lead { grid-template-columns: 64px minmax(0, 1fr) auto 16px; column-gap: 16px; align-items: center; min-height: 80px; padding: 10px 10px 10px 10px; border-radius: 12px; border-bottom: 0; box-shadow: none; transition: background var(--d-2), box-shadow var(--d-2); }
.rs-row.has-lead:hover { background: rgba(20,20,19,.03); }
.rs-row.has-lead:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--accent); }
.rs-row.has-lead[aria-selected="true"], .rs-row.has-lead[aria-selected="true"]:hover { background: var(--raised); box-shadow: 0 0 0 1px rgba(16,108,202,.35), 0 6px 16px -10px rgba(11,24,48,.25); }
.rs-row::before { display: none !important; }
.rs-lead { position: relative; display: grid; place-items: center; width: 64px; height: 44px; border-radius: 9px; background: var(--raised); box-shadow: 0 0 0 1px rgba(20,20,19,.07); overflow: hidden; }
.rs-lead.is-fig .cf-svg { width: 60px; height: 40px; }
.rs-lead.is-queued { background: var(--sunken); color: var(--ink-2); box-shadow: inset 0 0 0 1.5px #d8d3c6; }
.rs-lead.is-queued svg { width: 18px; height: 18px; }
.rs-lead.is-planned { background: color-mix(in srgb, var(--fc, var(--ink-3)) 7%, #fbfaf6); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--fc, var(--ink-3)) 22%, transparent); }
.rs-lead.is-planned .spx { width: 100%; height: 100%; aspect-ratio: auto; }
.rs-lead.is-planned .spx-svg { opacity: .82; filter: saturate(.8); padding: 4px; }
.rs-kl-st, .rs-kl-when { display: none; }
.rs-sort .select-trigger { width: auto; }
.rs-sort .select-trigger .value { overflow: visible; text-overflow: clip; max-width: none; }
.rs-toolbar .control-search input::placeholder { color: var(--ink-3); }
.rs-lead-kind { position: absolute; right: 3px; bottom: 3px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 6px; background: var(--raised); color: var(--fc, var(--ink-2)); box-shadow: 0 1px 3px rgba(20,20,19,.18); }
.rs-lead-kind svg { width: 11px; height: 11px; }
.rs-lead[data-f="bio"] { --fc: var(--field-bio); } .rs-lead[data-f="quant"] { --fc: var(--field-quant); } .rs-lead[data-f="policy"] { --fc: var(--field-policy); } .rs-lead[data-f="aiml"] { --fc: var(--field-aiml); }
.rs-text { gap: 3px; }
.rs-row .list-row-title { font-size: var(--fs-row); line-height: 22px; font-weight: 600; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-bottom: 1px; }
.rs-run { font-size: 11px; }
.rs-kindline { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--ink-2); }
.rs-kindline .dot { width: 6px; height: 6px; }
.rs-row .list-row-sub { font-size: var(--fs-small); line-height: 18px; color: var(--ink-2); white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-bottom: 1px; text-overflow: clip; }
.rs-meta { gap: 12px; }
.rs-st { width: 92px; justify-content: flex-start; }
.rs-st .badge { height: 24px; font-size: 12px; }
.rs-when { width: 64px; font-size: var(--fs-small); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.rs-chev { width: 16px; height: 16px; color: var(--ink-4); transition: transform var(--d-2), color var(--d-2); }
.rs-row:hover .rs-chev, .rs-row[aria-selected="true"] .rs-chev { color: var(--ink-2); transform: translateX(2px); }
/* the running study: compact live row */
.rs-row.rs-live { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "track"; gap: 14px; margin: 4px 0 8px; padding: 14px 16px 16px; border-radius: 14px; background: var(--raised); box-shadow: 0 0 0 1px rgba(20,20,19,.07), 0 6px 16px -10px rgba(11,24,48,.2); }
.rs-row.rs-live[aria-selected="true"] { box-shadow: 0 0 0 1px rgba(16,108,202,.45), 0 8px 22px -12px rgba(11,24,48,.3); }
.rs-live-top { gap: 12px; }
.rs-live-top .field-glyph { --s: 32px; }
.rs-live-top .list-row-title { font-size: 17px; -webkit-line-clamp: 1; }
.rs-live-tag { gap: 8px; height: 28px; padding: 0 10px 0 9px; font-size: 13px; }
.rs-pct { min-width: 4ch; text-align: right; color: var(--ink); font-variant-numeric: tabular-nums; }
.rs-track { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 8px; }
.rs-seg { gap: 4px; }
.rs-seg-bar { height: 4px; background: #e9e6dd; }
.rs-seg.is-done .rs-seg-bar { background: var(--field-bio); }
.rs-seg.is-active .rs-seg-bar { background: color-mix(in srgb, var(--accent) 16%, #e9e6dd); }
.rs-seg.is-active .rs-seg-bar::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p, 50%); border-radius: inherit; background: var(--accent); transition: width .6s var(--ease-out); }
.rs-seg.is-active .rs-seg-bar::after { opacity: .5; }
.rs-seg-k { margin-top: 2px; font-size: 13px; }
.rs-seg-k svg { color: var(--field-bio); }
.rs-seg-v { font-size: 12px; line-height: 16px; text-wrap: balance; }
.rs-live-fig { display: none; }
/* inspector */
.rs-rail { top: calc(var(--topbar-h) + 72px); }
@media (min-width: 1181px) { .rs-detail { max-height: calc(100dvh - var(--topbar-h) - 92px); } }
.rs-detail { border-radius: 16px; box-shadow: 0 1px 2px rgba(20,20,19,.04), 0 14px 32px -16px rgba(11,24,48,.2), 0 0 0 1px rgba(20,20,19,.06); }
.dt-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.dt-more a { display: flex; flex-direction: column; align-items: stretch; gap: 6px; min-height: 0; padding: 6px; border-radius: 12px; background: #f6f4ee; transition: background var(--d-2); }
.dt-more a:hover { background: var(--sunken-2); }
.dt-spx { aspect-ratio: 16 / 10; }
.dt-more-t { display: flex; flex-direction: column; gap: 1px; padding: 0 4px 2px; }
.dt-more-t b { font-size: 13px; font-weight: 600; }
.dt-more-t span { font-size: 12px; color: var(--ink-2); }
.dt-lead-cap { flex-direction: column; gap: 2px; }
.dt-lead-cap b { font-size: 13px; line-height: 18px; }
.dt-lead-cap .t-mono { font-size: 11px; }
.dt-facts > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 10px 16px; padding: 10px 0; }
.dt-facts .t-mono { white-space: nowrap; }
.dt-keys { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--ink-2); }
.dt-keys > span { display: inline-flex; align-items: center; gap: 4px; }
.dt-keys .kbd { min-width: 20px; height: 20px; padding: 0 5px; font-size: 11px; border: 1px solid #d8d3c6; box-shadow: 0 1px 0 #d8d3c6; border-radius: 5px; background: var(--raised); }
.dt-keys-del { margin-left: auto; color: var(--danger); }
@media (max-width: 1180px) { .rs-toolbar { margin: 0 calc(var(--gutter) * -1); padding: 8px var(--gutter); } }
@media (max-width: 640px) {
  .rs-actions .btn-secondary { display: none; }
  .rs-actions .btn-primary { min-height: 40px; padding: 0 14px; }
  .rs-actions .btn-primary .kbd { display: none; }
  .rs-row.has-lead { grid-template-columns: 52px minmax(0, 1fr); column-gap: 12px; align-items: start; min-height: 88px; padding: 12px 6px; }
  .rs-lead { width: 52px; height: 40px; margin-top: 2px; }
  .rs-lead.is-fig .cf-svg { width: 48px; height: 34px; }
  .rs-row .rs-meta { display: none; }
  .rs-kl-st, .rs-kl-when { display: inline; }
  .rs-kl-st { color: var(--success); }
  .rs-st { width: auto; } .rs-when { width: auto; text-align: left; }
  .rs-chev { display: none; }
  .rs-row .list-row-sub { -webkit-line-clamp: 1; }
  .rs-row.rs-live { margin: 4px 0 8px; padding: 14px; }
  .rs-live-top { flex-wrap: wrap; }
  .rs-live-top .rs-title-line { flex: 1 1 calc(100% - 44px); order: 0; }
  .rs-live-tag { order: 2; }
  .rs-track { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 6px; }
  .rs-seg-v { display: none; }
  .rs-seg.is-active .rs-seg-v { display: block; position: absolute; left: 0; right: 0; top: auto; bottom: 0; }
  .rs-track { position: relative; padding-bottom: 20px; }
  .rs-seg-k { font-size: 12px; }
}