/* V4.7: ordinary conversational Normal response versus sequential forced review. */
:root { color-scheme:light; --page:#edf2f8; --paper:#fff; --ink:#172b44; --muted:#4c5f75; --line:#d5dfeb; --soft:#f3f6fa; --blue:#245ac2; --blue-wash:#edf3ff; --purple:#7040aa; --purple-wash:#f4edff; --focus:#375b83; --nav:#172b44; --nav-muted:#d7e3f1; --control-border:#b6c6d8; --hover:#e8eff7; --radius-control:10px; --radius-card:12px; --radius-shell:16px; --inspector-width:clamp(350px,32vw,470px); }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { min-height:100%; scroll-behavior:auto; scrollbar-color:var(--control-border) transparent; }
body { margin:0; background:var(--page); color:var(--ink); font:15px/1.65 "Segoe UI", "Microsoft YaHei", Arial, sans-serif; }
::selection { background:#d7e7f7; color:var(--ink); }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; color:inherit; max-width:100%; overflow-wrap:anywhere; }
button:disabled { cursor:not-allowed; }
button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.sfv-modal-content:focus-visible { outline:2px solid var(--category); outline-offset:-3px; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-weight:600; line-height:1.35; letter-spacing:-.025em; }
h1 { font-size:30px; } h2 { font-size:23px; } h3 { font-size:17px; }
p { margin-bottom:16px; }
svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none; }
button.primary,.send-prompt { border:1px solid var(--nav); border-radius:var(--radius-control); background:var(--nav); color:white; padding:12px 20px; min-height:46px; font-weight:600; box-shadow:0 4px 12px #15294424; transition:background-color .18s ease,box-shadow .18s ease,border-color .18s ease; }
button.primary:hover:not(:disabled),.send-prompt:hover:not(:disabled) { background:#29466b; border-color:#29466b; box-shadow:0 7px 18px #1529442c; }
button.primary:active:not(:disabled),.send-prompt:active:not(:disabled) { box-shadow:0 2px 7px #15294420; }
button.primary:disabled,.send-prompt:disabled { background:var(--soft); color:var(--muted); border-color:var(--line); box-shadow:none; }
.app { width:min(1320px,calc(100% - 48px)); margin:30px auto 68px; min-height:calc(100dvh - 100px); background:var(--paper); border:0; border-radius:var(--radius-shell); box-shadow:0 18px 64px #233e621c; container:study-shell / inline-size; }
.top { display:flex; flex-wrap:wrap; align-items:center; gap:18px; min-height:84px; padding:20px 32px; background:var(--nav); color:#fff; border-radius:var(--radius-shell) var(--radius-shell) 0 0; }
.chat-name { display:flex; align-items:center; gap:12px; min-width:0; flex:1 1 260px; }
.chat-name b { font-size:15px; display:block; }
.chat-name div > span { display:block; color:var(--nav-muted); font-size:12px; }
.chat-icon { width:12px; height:12px; border-radius:3px; background:#e5edf7; flex:none; box-shadow:0 0 0 4px #ffffff17; }
.study-progress { display:flex; align-items:center; gap:14px; font-size:12px; color:var(--nav-muted); }
.progress-track { background:#ffffff35; width:96px; height:5px; border-radius:5px; overflow:hidden; }
.progress-track span { display:block; height:100%; background:#e5edf7; border-radius:inherit; }
.language-toggle { position:fixed; right:22px; top:6px; z-index:30; display:flex; align-items:center; gap:7px; border:1px solid var(--line); border-radius:20px; background:var(--paper); min-height:44px; padding:8px 12px; font-size:12px; }
.language-toggle:disabled { color:var(--muted); cursor:default; }
.language-icon { width:16px; height:16px; }
.prototype-label { position:fixed; bottom:12px; left:20px; max-width:calc(100% - 90px); margin:0; z-index:10; padding:4px 8px; background:#fffffff2; border-radius:5px; color:var(--muted); font-size:11px; }
.start { padding:68px 32px 80px; }
.start-card { max-width:740px; margin:0 auto; }
.start h1 { max-width:630px; font-size:clamp(26px,3.2vw,38px); margin-bottom:22px; }
.start-card > p { color:var(--muted); max-width:690px; }
.language-choice-title span { display:block; margin-top:8px; font-size:.72em; letter-spacing:0; }
.language-choice-note span { display:block; }
.language-options { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; max-width:520px; }
.language-choice { flex:1 1 160px; min-height:64px; padding:16px 24px; border:1px solid var(--control-border); border-radius:var(--radius-control); background:var(--paper); font-size:20px; font-weight:600; }
.language-choice:hover { border-color:var(--nav); background:var(--soft); }
.mode-note { font-size:13px; }
.study-outline { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:30px 0; }
.study-outline > span { display:flex; align-items:flex-start; gap:10px; padding:15px 12px; background:var(--soft); border-radius:var(--radius-control); min-width:0; }
.study-outline b { display:grid; place-items:center; width:23px; height:23px; flex:none; background:white; border-radius:50%; font-size:12px; }
.study-outline em { font-style:normal; font-size:13px; }
.assignment-note { border-top:1px solid var(--line); padding-top:22px; margin-bottom:24px; }
.assignment-note strong { font-size:13px; }
.assignment-note p { color:var(--muted); font-size:13px; margin:6px 0 0; }
.task-screen { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; min-height:calc(100dvh - 186px); }
body.information-visible .task-screen { grid-template-columns:minmax(0,1fr) 290px; }
body.decision-visible .task-screen { grid-template-columns:minmax(0,1fr) minmax(360px,440px); }
.task-content { min-width:0; min-height:calc(100dvh - 186px); padding:24px 28px 28px; display:flex; flex-direction:column; container:task-main / inline-size; }
.messages { display:grid; gap:12px; width:100%; max-width:850px; margin:0 auto 14px; }
.message { min-width:0; padding:15px 19px; border-radius:var(--radius-card); background:white; }
.message.user { width:min(82%,720px); justify-self:end; background:var(--soft); border-radius:12px 12px 4px 12px; }
.message.ai { width:min(92%,820px); justify-self:start; border:1px solid var(--line); border-radius:12px 12px 12px 4px; }
.message b { font-size:12px; font-weight:600; display:block; margin-bottom:5px; color:var(--muted); }
.message p { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.65; }
.message.generating { color:var(--muted); }
.thinking-dots { display:inline-flex; gap:5px; padding-top:10px; }
.thinking-dots i { width:5px; height:5px; background:#8491a6; border-radius:50%; animation:thinking-pulse 1.1s ease-in-out infinite; }
.thinking-dots i:nth-child(2) { animation-delay:.15s; } .thinking-dots i:nth-child(3) { animation-delay:.3s; }
@keyframes thinking-pulse { 50% { opacity:.3; } }
.workspace-context { width:100%; max-width:850px; align-self:center; background:var(--soft); padding:10px 14px; margin:0 auto 18px; border-radius:var(--radius-control); }
.workspace-context-title { font-size:13px; }
.workspace-context p { color:var(--muted); font-size:13px; margin:3px 0 0; }
.chat-composer { width:100%; max-width:850px; align-self:center; margin:26px auto 0; border:1px solid var(--control-border); padding:14px 16px; border-radius:var(--radius-card); background:white; box-shadow:0 8px 28px #1d385511; transition:border-color .18s ease,box-shadow .18s ease; }
.chat-composer:hover,.chat-composer:focus-within { border-color:var(--focus); box-shadow:0 10px 30px #1d38551b; }
.task-content > .chat-composer:not([hidden]) { margin-top:auto; }
.composer-heading { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; color:var(--muted); font-size:12px; margin-bottom:12px; }
.composer-control { display:flex; align-items:flex-end; gap:14px; }
.composer-control textarea { flex:1; min-width:0; width:100%; min-height:72px; max-height:180px; background:var(--soft); padding:12px; border:0; border-radius:var(--radius-control); color:var(--ink); resize:vertical; line-height:1.55; }
.send-prompt { display:inline-flex; gap:7px; align-items:center; justify-content:center; }
.passive-review { width:100%; max-width:850px; align-self:center; margin:2px auto 0; }
.normal-response-message { width:min(92%,820px); }
.normal-response-copy p { margin:0; line-height:1.72; }
.normal-response-copy p + p { margin-top:13px; }
.normal-chat .final-recommendation-message { padding:15px 19px; }
.normal-chat .final-recommendation-message b { font-size:12px; color:var(--muted); margin-bottom:5px; }
.passive-review .task-actions { width:min(92%,820px); margin:14px 0 0; justify-content:flex-end; }
.review-surface { width:100%; max-width:850px; align-self:center; margin:0 auto; }
.review-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:16px; }
.review-header h2 { margin-bottom:8px; }
.review-header p { font-size:13px; color:var(--muted); margin-bottom:0; }
.review-status,.sfv-progress { font-size:12px; white-space:nowrap; color:var(--muted); padding:5px 9px; background:var(--soft); border-radius:5px; }
.passive-content { display:grid; gap:16px; }
.information-section { --category:var(--blue); --category-wash:var(--blue-wash); min-width:0; }
.information-verification { --category:var(--purple); --category-wash:var(--purple-wash); }
.information-section > h3 { display:flex; align-items:center; min-height:48px; background:var(--category); color:white; padding:10px 16px; margin:0 0 9px; border-radius:8px; font-size:16px; }
.section-description { color:var(--muted); font-size:13px; line-height:1.55; margin-bottom:10px; }
.information-list { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.information-list li { background:var(--category-wash); border-radius:7px; padding:9px 12px; display:grid; grid-template-columns:minmax(135px,30%) minmax(0,1fr); gap:14px; }
.information-list strong { font-size:14px; font-weight:600; color:var(--category); }
.information-list li > span { font-size:13px; color:#4f5968; overflow-wrap:anywhere; line-height:1.55; }
.information-section > .marker-label { display:none; }
.information-marker { display:inline-flex; align-items:center; gap:9px; min-width:0; }
.marker-symbol { width:9px; height:9px; flex:none; display:inline-block; }
.marker-basis { border-radius:50%; background:var(--blue); }
.marker-verification { border:2px solid var(--purple); transform:rotate(45deg); width:8px; height:8px; margin-inline:1px; }
.marker-label { padding:7px 11px; border-radius:6px; font-size:12px; background:var(--blue-wash); }
.marker-label[data-category="verification"] { background:var(--purple-wash); }
.task-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:22px; }
.task-sidebar { min-width:0; align-self:stretch; border-left:1px solid var(--line); padding:24px 18px; background:#fbfcfe; border-radius:0 0 16px 0; }
.information-legend h2 { font-size:15px; margin-bottom:18px; }
.legend-entry { padding:15px; border-radius:8px; margin-bottom:12px; background:var(--blue-wash); }
.legend-entry + .legend-entry { background:var(--purple-wash); }
.legend-entry strong { font-size:13px; font-weight:600; }
.legend-description { font-size:12px; margin:10px 0 0; color:#4f5968; line-height:1.75; }
.legend-note { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.legend-note p { font-size:12px; color:var(--muted); margin-bottom:12px; }
.conversation-history { margin:24px 0; border-top:1px solid var(--line); padding-top:18px; }
.conversation-history summary { cursor:pointer; font-size:13px; font-weight:600; padding-block:6px; }
.history-messages { display:grid; gap:10px; margin-top:12px; }
.history-messages .message { padding:12px; border-radius:6px; }
.history-messages .message b { font-size:11px; } .history-messages .message p { font-size:12px; }
.sfv-steps { list-style:none; padding:0; margin:0 0 18px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.sfv-step { display:flex; align-items:center; gap:8px; min-width:0; padding:8px 4px 10px; border-bottom:2px solid var(--line); background:transparent; }
.sfv-step-number { display:grid; place-items:center; width:22px; height:22px; border:1px solid #bdc6d3; border-radius:50%; font-size:12px; flex:none; }
.sfv-step strong { display:block; font-size:12px; font-weight:600; overflow-wrap:anywhere; }
.sfv-step small { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:11px; margin-top:2px; }
.sfv-step.active,.sfv-step.complete { border-bottom-color:var(--nav); }
.sfv-step.active .sfv-step-number,.sfv-step.complete .sfv-step-number { background:var(--nav); color:white; border-color:var(--nav); }
.sfv-step.locked { color:#687181; }
.step-lock { width:7px; height:6px; border:1px solid currentColor; border-radius:1px; position:relative; margin-top:3px; flex:none; }
.step-lock::before { content:""; position:absolute; width:5px; height:4px; left:0; top:-5px; border:1px solid currentColor; border-bottom:0; border-radius:4px 4px 0 0; }
.sfv-active-step { border:1px solid var(--line); border-radius:var(--radius-card); background:#f9fbfe; display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,38%); align-items:center; gap:20px; padding:18px 20px; }
#sfv-step-content { min-width:0; } #sfv-step-content h3 { margin-bottom:4px; } #sfv-step-content p { margin:0; font-size:13px; }
.sfv-confirmation-footer { min-width:0; } .sfv-confirmation-footer p { font-size:12px; line-height:1.45; color:var(--muted); margin:0 0 8px; } .sfv-confirmation-footer button { width:100%; }
.sfv-gated-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; margin-top:12px; } .sfv-gated-actions button { width:auto; min-width:190px; min-height:42px; padding:8px 14px; font-size:13px; box-shadow:none; }
.confirmation-receipts { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin:10px 0; padding:0; }
.confirmation-receipts li { display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:7px; background:var(--soft); }
.confirmation-receipts strong { font-size:13px; font-weight:600; } .confirmation-receipts small { display:block; font-size:11px; color:var(--muted); margin-top:3px; }
.receipt-check { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; border:1px solid #8392a7; flex:none; font-size:12px; }
.updated-recommendation { width:100%; max-width:850px; align-self:center; margin:24px auto 0; } .final-recommendation-message { padding:24px; } .final-recommendation-message b { color:var(--ink); font-size:16px; }
.recommendation-markers { display:flex; gap:10px; flex-wrap:wrap; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
/* The browser keeps background controls inert while a required dialog is open. */
body.review-modal-open { overflow:hidden; }
.sfv-modal { --category:var(--blue); --category-wash:var(--blue-wash); position:fixed; inset:0; margin:auto; border:0; padding:0; width:min(680px,calc(100% - 32px)); max-width:none; max-height:calc(100dvh - 40px); color:var(--ink); background:white; border-radius:16px; box-shadow:0 28px 90px #15294352; overflow:hidden; }
.sfv-modal:not([open]) { display:none; } .sfv-modal[open] { display:flex; flex-direction:column; }
.sfv-modal[data-category="verification"] { --category:var(--purple); --category-wash:var(--purple-wash); }
.sfv-modal::backdrop { background:rgba(17,33,54,.44); }
.sfv-modal-header { background:var(--category); color:white; padding:16px 22px 14px; flex:none; }
.sfv-modal-meta { display:flex; justify-content:space-between; align-items:center; gap:14px; font-size:12px; margin-bottom:8px; color:#fff; }
.sfv-modal-track { display:flex; gap:6px; } .sfv-modal-track i { width:27px; height:3px; border-radius:2px; background:#dce2eb; }
.sfv-modal[data-category="basis"] .sfv-modal-track i:first-child,.sfv-modal[data-category="verification"] .sfv-modal-track i:last-child { background:white; }
.sfv-modal-category { display:inline-flex; gap:9px; align-items:center; padding:3px 8px; border-radius:4px; background:white; color:var(--category); font-size:12px; margin-bottom:5px; }
.sfv-modal-category .marker-basis { background:var(--category); } .sfv-modal-category .marker-verification { border-color:var(--category); }
.sfv-modal h2 { font-size:21px; margin:0 0 4px; } .sfv-modal-header p { margin:0; font-size:13px; }
.sfv-modal-content { padding:16px 22px; overflow-y:auto; min-height:0; overscroll-behavior:contain; scrollbar-gutter:stable; scroll-padding-bottom:16px; }
.sfv-modal-content .section-description { margin-bottom:10px; } .sfv-modal-content .information-list { margin:0; } .sfv-modal-content .information-list li { padding:10px 12px; }
.sfv-modal-footer { background:white; border-top:1px solid var(--line); padding:12px 22px 16px; flex:none; }
.sfv-modal-footer p { font-size:12px; color:var(--muted); margin:0 0 12px; }
.sfv-modal-footer .primary { width:100%; background:var(--nav); border-color:var(--nav); font-size:14px; }
.sfv-modal-footer .primary:hover:not(:disabled) { background:#29466b; } .sfv-modal-footer .primary:focus-visible { outline-color:var(--focus); }
/* Decision choices remain neutral; blue and purple identify information only. */
.decision-panel { min-width:0; border-top:1px solid var(--line); padding-top:26px; } .decision-card { min-width:0; }
.decision-card h1 { font-size:25px; margin-bottom:12px; } .decision-card h2 { font-size:23px; }
.decision-card > section > p,.decision-card > form > p { color:var(--muted); font-size:13px; }
.choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:22px 0; }
.choices button { min-width:0; min-height:50px; padding:11px 8px; border:1px solid var(--control-border); border-radius:var(--radius-control); background:white; font-size:13px; font-weight:600; transition:border-color .18s ease,background-color .18s ease; }
.choices button:hover:not(.selected) { border-color:var(--focus); background:var(--hover); }
.choices button.selected { color:white; background:var(--ink); border-color:var(--ink); }
.decision-panel label { display:block; margin-top:20px; font-size:13px; }
.required,.optional { font-size:11px; color:var(--muted); margin-left:5px; white-space:nowrap; }
.decision-panel textarea { display:block; width:100%; margin-top:8px; padding:12px; border:1px solid #cdd4de; border-radius:7px; background:white; color:var(--ink); resize:vertical; min-height:84px; }
.confidence-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; margin-top:12px; }
input[type="range"] { width:100%; min-width:0; margin:0; height:28px; accent-color:var(--ink); } input[type="range"].rating-unanswered { accent-color:#8792a3; }
.confidence-row output { min-width:64px; font-size:12px; color:var(--muted); text-align:right; }
.decision-action { display:block; width:100%; margin-top:24px; } .decision-status { font-size:12px; color:var(--muted); margin:12px 0 0; min-height:20px; }
.decision-panel fieldset { min-width:0; margin:24px 0; padding:0; border:0; }
.decision-panel legend { font-size:14px; font-weight:600; max-width:100%; padding:0; }
.decision-panel fieldset > p { color:var(--muted); font-size:12px; margin:7px 0 12px; }
.issue-options,.compare-options { display:grid; gap:8px; margin-top:13px; }
.issue-options label,.compare-options label { display:flex; align-items:flex-start; gap:10px; background:white; padding:11px 12px; border:1px solid var(--line); border-radius:7px; margin:0; cursor:pointer; }
.issue-options label:has(input:checked),.compare-options label:has(input:checked) { background:var(--hover); border-color:var(--control-border); }
input[type="checkbox"],input[type="radio"] { width:16px; height:16px; margin:3px 0 0; flex:none; accent-color:var(--ink); }
.rating-fields { display:grid; } .rating-field { border-top:1px solid var(--line); padding:20px 0; } .decision-panel .rating-field { margin:0; }
.rating-field small { display:block; font-size:11px; color:var(--muted); margin-top:6px; }
/* Both conditions use the same full-width response area after the decision. */
body.assessment-visible .task-content { min-height:0; }
body.assessment-visible .task-sidebar { border-radius:0; }
.assessment-panel { grid-column:1 / -1; min-width:0; padding:40px 32px 48px; border-top:1px solid var(--line); background:var(--paper); border-radius:0 0 var(--radius-shell) var(--radius-shell); scroll-margin-top:24px; }
.assessment-content { width:100%; max-width:1008px; min-width:0; margin:0 auto; container:assessment-area / inline-size; }
.assessment-content h1 { font-size:28px; margin-bottom:24px; }
.assessment-content h2 { font-size:22px; }
.assessment-content label { display:block; font-size:16px; }
.assessment-content textarea { display:block; width:100%; min-height:96px; margin-top:8px; padding:12px; border:1px solid var(--control-border); border-radius:var(--radius-control); background:var(--paper); color:var(--ink); resize:vertical; font-size:16px; }
.assessment-content > form > p,.assessment-content > section > p { color:var(--muted); }
.assessment-content fieldset { min-width:0; padding:0; border:0; margin:0 0 32px; }
.assessment-content legend { font-size:17px; font-weight:600; line-height:1.5; padding:0; max-width:100%; }
.assessment-content fieldset > p { color:var(--muted); font-size:14px; margin:8px 0 16px; }
.assessment-content .issue-options label,.assessment-content .compare-options label { display:flex; align-items:center; gap:12px; min-height:48px; padding:12px 14px; font-size:15px; }
.assessment-content input[type="checkbox"],.assessment-content input[type="radio"] { margin:0; width:18px; height:18px; }
.assessment-content .rating-group-title { font-size:22px; margin:4px 0 4px; }
.assessment-content .rating-field { min-width:0; padding:20px 0; border-top:0; border-bottom:1px solid var(--line); }
.assessment-content .rating-question { max-width:75ch; margin:0; line-height:1.5; }
.assessment-content .rating-question-text { display:inline; }
.assessment-content .rating-scale-anchors { font-size:13px; margin-top:8px; }
.assessment-content .confidence-row { gap:24px; margin-top:4px; }
.assessment-content input[type="range"] { height:44px; cursor:pointer; }
.assessment-content output { min-width:104px; font-size:14px; font-weight:600; font-variant-numeric:tabular-nums; }
.assessment-content .workload-group { margin:32px 0 0; }
.assessment-content .workload-group > legend { font-size:22px; margin-bottom:4px; }
.assessment-content .workload-group > p { max-width:75ch; line-height:1.6; margin:10px 0; }
.assessment-content .workload-group > .workload-translation-note { font-size:13px; margin-bottom:8px; }
.workload-dimension { display:block; font-weight:600; margin-bottom:4px; }
.assessment-content .workload-field .rating-question-text { font-size:15px; }
.assessment-content .workload-field { margin:0; }
.assessment-content .workload-field > legend { font-size:16px; width:100%; }
.assessment-content .workload-field .rating-scale-anchors { display:flex; justify-content:space-between; gap:16px; margin:12px 0 4px; }
.workload-ruler { display:grid; grid-template-columns:repeat(21,minmax(44px,1fr)); gap:2px; }
.assessment-content .ruler-option { display:block; position:relative; min-width:44px; min-height:52px; margin:0; cursor:pointer; }
.assessment-content .ruler-option input { position:absolute; inset:0; width:100%; height:100%; opacity:0; margin:0; cursor:pointer; }
.ruler-mark { position:relative; display:flex; align-items:center; justify-content:center; min-height:52px; padding-bottom:12px; color:var(--ink); font-size:13px; font-variant-numeric:tabular-nums; border-radius:5px; border-bottom:1px solid var(--control-border); transition:background-color .18s ease,color .18s ease; pointer-events:none; }
.ruler-mark::after { content:""; position:absolute; width:1px; height:8px; background:var(--control-border); bottom:0; left:50%; }
.ruler-mark[data-major-tick="true"]::after { height:13px; background:var(--ink); }
.ruler-option:hover .ruler-mark { background:var(--hover); }
.ruler-option:has(input:checked) .ruler-mark { background:var(--nav); color:var(--paper); border-bottom-color:var(--nav); font-weight:600; }
.ruler-option:has(input:checked) .ruler-mark::after { background:var(--paper); }
.ruler-option:has(input:focus-visible) .ruler-mark { outline:3px solid var(--focus); outline-offset:-3px; }
.assessment-content .workload-selected-value { display:block; min-width:0; margin-top:8px; font-size:14px; text-align:right; }
@container assessment-area (max-width:963px) { .workload-ruler { grid-template-columns:repeat(7,minmax(44px,1fr)); gap:1px; } }
@container assessment-area (max-width:313px) { .workload-ruler { grid-template-columns:repeat(3,minmax(44px,1fr)); gap:4px; } }
.assessment-content #comments-label { display:inline-block; margin-top:24px; }
.assessment-content .decision-status { font-size:14px; }
.assessment-content .decision-action { width:auto; min-width:200px; margin:20px 0 0 auto; }
.assessment-content .completion button { width:auto; min-width:200px; }
.assessment-content .completion { padding:4px 0; }
.assessment-content .rapid-review-stage { padding:0; }
.assessment-content .rapid-review-stage > p { font-size:15px; }
.assessment-content .rapid-review-stage label { font-size:16px; }
.completion { padding:16px 0; } .completion button { width:100%; }
.rapid-review-stage { padding:16px 0; }
.rapid-review-stage h1 { font-size:25px; margin-bottom:12px; }
.rapid-review-stage > p { color:var(--muted); font-size:13px; line-height:1.6; }
.rapid-review-stage .rapid-review-context { color:var(--ink); background:var(--soft); border-radius:var(--radius-control); padding:12px 14px; margin:14px 0 22px; }
.rapid-review-stage label { display:block; font-size:14px; font-weight:600; }
.rapid-review-stage textarea { display:block; width:100%; min-height:92px; margin-top:10px; padding:12px; border:1px solid var(--control-border); border-radius:var(--radius-control); background:white; color:var(--ink); resize:vertical; }
.rapid-review-actions { display:flex; gap:10px; margin-top:22px; }
.rapid-review-actions button { flex:1; min-height:44px; }
.rapid-review-actions button:not(.primary) { border:1px solid var(--control-border); border-radius:var(--radius-control); background:white; color:var(--ink); }
/* Researcher controls. */
.facilitator { position:fixed; bottom:16px; right:20px; z-index:40; }
.console-toggle { display:grid; place-items:center; border:1px solid #cdd4de; border-radius:50%; width:42px; height:42px; background:white; }
.console { position:absolute; right:0; bottom:54px; padding:22px; width:min(360px,calc(100vw - 32px)); max-height:calc(100dvh - 88px); overflow-y:auto; border:1px solid var(--line); border-radius:12px; background:white; box-shadow:0 10px 35px #1a21321a; }
.console p { font-size:12px; color:var(--muted); margin:8px 0 14px; } .sequence-controls { display:grid; gap:7px; }
.sequence-controls button,.inspector-launch { min-height:39px; padding:8px 11px; border:1px solid var(--line); background:var(--soft); border-radius:6px; font-size:12px; text-align:left; }
.sequence-controls button.selected { background:var(--ink); color:white; border-color:var(--ink); }
.inspector-launch { margin-top:12px; width:100%; background:var(--soft); color:var(--ink); }
.session-inspector { position:fixed; top:0; bottom:0; right:0; z-index:50; display:none; width:var(--inspector-width); max-width:100%; background:white; border-left:1px solid #cdd4de; box-shadow:-10px 0 35px #202b4010; overflow:hidden; }
.session-inspector.open { display:flex; flex-direction:column; }
.inspector-header { display:flex; align-items:flex-start; gap:14px; padding:24px 22px 15px; flex:none; }
.inspector-header > div { min-width:0; flex:1; } .inspector-live { display:block; font-size:11px; color:var(--muted); margin-bottom:9px; }
.inspector-header h2 { font-size:21px; margin-bottom:9px; } .inspector-header p { font-size:12px; color:var(--muted); margin-bottom:0; }
.inspector-close { width:34px; height:34px; border-radius:6px; background:var(--soft); border:0; flex:none; font-size:22px; line-height:1; }
.inspector-tabs { display:flex; gap:6px; padding:0 22px 16px; border-bottom:1px solid var(--line); flex:none; }
.inspector-tabs button { flex:1; border:0; padding:9px 6px; border-radius:6px; font-size:12px; background:var(--soft); } .inspector-tabs button.active { background:var(--ink); color:white; }
.inspector-content { flex:1; min-height:0; overflow:auto; padding:20px; }
.inspector-privacy { padding:14px 22px; font-size:11px; color:var(--muted); margin:0; border-top:1px solid var(--line); flex:none; }
.inspector-summary-card { border:1px solid var(--line); border-radius:8px; padding:17px; margin-bottom:15px; } .inspector-summary-card h3 { font-size:15px; margin-bottom:13px; }
.inspector-summary-card dl { display:grid; grid-template-columns:minmax(75px,1fr) minmax(0,1.6fr); gap:10px; margin:0; font-size:12px; }
.inspector-summary-card dt { color:var(--muted); } .inspector-summary-card dd { margin:0; overflow-wrap:anywhere; }
.inspector-raw { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font:11px/1.65 Consolas,monospace; } .inspector-empty { color:var(--muted); font-size:13px; }
.inspector-timeline { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.timeline-event { display:grid; grid-template-columns:27px minmax(0,1fr); gap:10px; } .timeline-marker { display:flex; flex-direction:column; align-items:center; }
.timeline-dot { display:grid; place-items:center; width:25px; height:25px; background:#e9edf4; border-radius:50%; font-size:11px; flex:none; }
.timeline-rail { width:1px; background:var(--line); flex:1; margin-top:8px; }
.timeline-card { padding:13px; border:1px solid var(--line); border-radius:7px; min-width:0; } .timeline-card header { display:flex; gap:10px; justify-content:space-between; }
.timeline-card h3 { font-size:12px; margin-bottom:4px; } .timeline-category,.timeline-card time { font-size:11px; color:var(--muted); } .timeline-card time { white-space:nowrap; }
.timeline-card p { font-size:12px; overflow-wrap:anywhere; margin:10px 0; white-space:pre-wrap; } .timeline-chips { display:flex; gap:6px; flex-wrap:wrap; }
.timeline-chips span { font-size:11px; padding:3px 5px; background:var(--soft); border-radius:3px; }
body.inspector-docked .app { width:calc(100% - var(--inspector-width) - 48px); margin-left:24px; margin-right:calc(var(--inspector-width) + 24px); }
body.inspector-docked .facilitator { right:calc(var(--inspector-width) + 20px); } body.inspector-docked .language-toggle { right:calc(var(--inspector-width) + 22px); }
@container task-main (max-width:720px) { .sfv-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } .sfv-active-step { grid-template-columns:minmax(0,1fr); gap:12px; } }
@container study-shell (max-width:800px) {
  body.information-visible .task-screen,body.decision-visible .task-screen { grid-template-columns:minmax(0,1fr); }
  .task-sidebar { border-left:0; border-top:1px solid var(--line); border-radius:0 0 16px 16px; padding:26px 32px; }
  .decision-panel { max-width:680px; margin:0 auto; }
  .information-legend { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .information-legend h2,.legend-note { grid-column:1 / -1; } .information-legend h2 { margin-bottom:0; } .legend-entry { margin:0; } .legend-note { margin-top:0; padding-top:12px; }
  .study-outline { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@container study-shell (max-width:650px) {
  .information-list li { grid-template-columns:minmax(0,1fr); gap:3px; }
  .confirmation-receipts { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:1050px) {
  body.inspector-docked .app { width:calc(100% - 32px); margin:30px 16px 68px; }
  body.inspector-docked .facilitator { right:20px; } body.inspector-docked .language-toggle { right:22px; }
  .session-inspector { width:min(470px,100%); }
}
@media (max-width:600px) {
  .app { width:calc(100% - 20px); margin:38px 10px 64px; border-radius:12px; } .top { padding:18px; gap:12px; } .chat-name { flex-basis:100%; }
  .study-progress { flex:1; justify-content:flex-end; } .progress-track { width:55px; } .preview-badge { font-size:11px; }
  .start { padding:34px 20px 42px; } .start h1 { font-size:27px; } .study-outline { gap:9px; } .study-outline > span { padding:12px 9px; }
  .task-content { padding:22px 16px; } .task-sidebar { padding:24px 16px; } .information-legend { grid-template-columns:1fr; }
  .message { padding:16px; font-size:14px; } .workspace-context { padding:16px; } .review-header { flex-wrap:wrap; gap:12px; } .review-header h2 { font-size:22px; }
  .information-section > h3 { font-size:16px; padding:10px 12px; } .information-list li { padding:10px 12px; } .sfv-gated-actions { flex-direction:column; } .sfv-gated-actions button { width:100%; }
  .sfv-active-step { padding:14px; }
  .composer-control { flex-direction:column; align-items:stretch; } .chat-composer { padding:14px; } .composer-control textarea { min-height:88px; } .send-prompt { align-self:flex-end; }
  .decision-panel textarea,.composer-control textarea { font-size:16px; } .final-recommendation-message { padding:18px; }
  .assessment-panel { padding:28px 18px 36px; }
  .assessment-content h1 { font-size:25px; margin-bottom:20px; }
  .assessment-content legend { font-size:16px; }
  .assessment-content .rating-group-title,.assessment-content .workload-group > legend { font-size:21px; }
  .assessment-content .confidence-row { gap:12px; }
  .assessment-content output { min-width:82px; font-size:13px; }
  .assessment-content .decision-action,.assessment-content .completion button { width:100%; min-width:0; }
  .assessment-content .rapid-review-actions { flex-direction:column; }
  .sfv-modal { width:calc(100% - 24px); max-height:calc(100dvh - 24px); border-radius:10px; } .sfv-modal-header { padding:20px; } .sfv-modal h2 { font-size:23px; } .sfv-modal-meta { margin-bottom:14px; }
  .sfv-modal-content { padding:18px 16px; } .sfv-modal-footer { padding:14px 20px 18px; } .sfv-modal-footer .primary { font-size:13px; padding:11px 12px; }
  .prototype-label { left:8px; font-size:11px; } .facilitator { right:12px; }
}
@media (max-height:620px) {
  .sfv-modal { max-height:calc(100dvh - 16px); } .sfv-modal-header { padding:12px 20px; } .sfv-modal-meta { margin-bottom:7px; } .sfv-modal-category { display:none; }
  .sfv-modal h2 { font-size:21px; margin-bottom:5px; } .sfv-modal-header p { font-size:12px; } .sfv-modal-footer { padding:10px 20px 12px; } .sfv-modal-footer p { font-size:11px; margin-bottom:8px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; scroll-behavior:auto !important; } }
@media (forced-colors:active) { .information-list li,.legend-entry,.sfv-step,.confirmation-receipts li { border:1px solid CanvasText; } .sfv-modal { border:2px solid CanvasText; } button:disabled { color:GrayText; } .ruler-mark { border:1px solid CanvasText; } .ruler-option:has(input:checked) .ruler-mark { background:Highlight; color:HighlightText; forced-color-adjust:none; } }