/* A dedicated research exercise. All selectors are confined to its workspace. */
.research-workspace {--research-ink:rgba(0,0,0,.9);--research-muted:rgba(0,0,0,.55);--research-line:rgba(0,0,0,.1);--research-green:#07C160;--research-gray:#EDEDED;display:flex;flex-direction:column;gap:18px;padding:24px 0 12px;color:var(--research-ink);font:14px/1.5 'PingFang SC',-apple-system,BlinkMacSystemFont,'Microsoft YaHei',sans-serif;min-width:0;}
.research-workspace *,.research-workspace *::before,.research-workspace *::after {box-sizing:border-box;}
.research-workspace h1,.research-workspace h2,.research-workspace h3,.research-workspace p {margin:0;}
.research-workspace h1 {font-size:25px;line-height:1.35;font-weight:600;letter-spacing:-.6px;}
.research-workspace h2 {font-size:22px;line-height:1.4;font-weight:500;letter-spacing:-.3px;}
.research-workspace strong {font-weight:500;}
.research-workspace button {font:inherit;cursor:pointer;touch-action:manipulation;}
.research-workspace button:disabled {cursor:default;opacity:.4;}
.research-workspace button:focus-visible {outline:3px solid #07C160;outline-offset:3px;}
.research-workspace img {display:block;max-width:100%;}
.research-workspace .icon {width:19px;height:19px;flex-shrink:0;}
.research-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;}
.research-heading>.research-heading-copy {min-width:0;}
.research-heading p {font-size:14px;line-height:1.5;color:var(--research-muted);margin-top:4px;}
.research-crumb {display:flex;align-items:center;gap:7px;font-size:12px;color:var(--research-muted);margin-bottom:4px;}
.research-crumb button {padding:0;border:0;background:none;color:inherit;min-height:26px;text-align:left;}
.research-skill {display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;min-height:36px;padding:6px 11px;border:1px solid #d8dfd5;border-radius:7px;background:#FFFFFF;color:#52644e;font-size:13px;}
.research-steps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:4px;border:1px solid #dce1d5;border-radius:10px;background:rgba(255,255,255,.62);}
.research-steps button {position:relative;display:flex;align-items:center;justify-content:center;gap:9px;min-height:40px;padding:8px 12px;border:0;border-radius:7px;background:transparent;color:#7a8377;font-weight:500;}
.research-steps button+button::before {content:'';position:absolute;left:-1px;top:12px;bottom:12px;width:1px;background:#dce1d5;}
.research-steps button:is([aria-current='step'],[aria-pressed='true'],.is-active) {background:#FFFFFF;color:#163d33;box-shadow:0 2px 5px rgba(0,0,0,.05);}
.research-steps button:is([aria-current='step'],[aria-pressed='true'],.is-active)::before,.research-steps button:is([aria-current='step'],[aria-pressed='true'],.is-active)+button::before {background:transparent;}
.research-steps button>span:first-child,.research-steps button>b:first-child {font:500 12px/1 'SFMono-Regular',Consolas,monospace;letter-spacing:.2px;}
.research-steps button.is-complete {color:#41734b;}
.research-layout {display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;min-width:0;}
.research-canvas,.research-guide {min-width:0;border:1px solid #dce1d5;border-radius:14px;background:#FFFFFF;}
.research-canvas {display:flex;flex-direction:column;gap:18px;padding:24px;}
.research-guide {display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:24px;}
.research-scene-heading {display:flex;flex-direction:column;align-items:flex-start;gap:4px;}
.research-scene-heading .eyebrow,.research-kicker {font-size:11px;font-weight:500;letter-spacing:1.1px;color:var(--research-muted);line-height:1.5;}
.research-scene-heading h2 {font-size:24px;}
.research-scene-heading p {color:var(--research-muted);font-size:14px;line-height:1.5;max-width:42em;}
.research-guide>h2 {font-size:22px;}
.research-guide>p {font-size:14px;line-height:1.65;color:var(--research-muted);}
.research-guide .research-kicker {margin-bottom:-9px;}
.research-person {display:flex;align-items:center;gap:11px;min-width:0;}
.research-person img {width:40px;height:40px;object-fit:cover;border-radius:5px;flex:0 0 40px;}
.research-person>div {display:flex;flex-direction:column;min-width:0;gap:2px;}
.research-person strong {font-size:15px;line-height:1.4;}
.research-person small,.research-person p {font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-chat {padding:13px 15px;background:#EDEDED;border-radius:0 9px 9px 9px;}
.research-chat p {font-size:15px;line-height:1.65;}
.research-chat p+p {margin-top:8px;}
.research-objective {padding-top:16px;border-top:1px solid var(--research-line);}
.research-objective strong {font-size:14px;}
.research-objective p {font-size:14px;line-height:1.6;margin-top:5px;color:var(--research-muted);}
.research-guide-bottom {display:flex;flex-direction:column;gap:9px;margin-top:auto;padding-top:6px;}
.research-workspace .research-primary,.research-workspace .research-secondary {display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;padding:10px 14px;border:0;border-radius:8px;font-size:16px;font-weight:500;line-height:1.4;}
.research-workspace .research-primary {background:#07C160;color:#FFFFFF;}
.research-workspace .research-primary:hover:not(:disabled) {background:#06b35a;}
.research-workspace .research-secondary {background:rgba(0,0,0,.05);color:var(--research-ink);}
.research-workspace .research-secondary:hover:not(:disabled) {background:rgba(0,0,0,.08);}
.research-guide-bottom>p,.research-guide-bottom>small {font-size:13px;line-height:1.4;color:var(--research-muted);text-align:center;}
.research-note {font-size:13px;line-height:1.5;color:var(--research-muted);margin-top:auto!important;}
.research-footer {display:flex;align-items:center;justify-content:space-between;gap:16px;color:#788473;font-size:12px;line-height:1.5;}
.research-footer button {display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:4px 0;border:0;background:transparent;color:inherit;font-size:13px;}

/* The outer comparison adapts; each collection page stays 390 × 844. */
.research-versions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:22px;align-items:stretch;flex:1;min-height:0;min-width:0;}
.research-version {display:flex;flex-direction:column;gap:9px;min-width:0;min-height:0;}
.research-version>.phone-preview {flex:1;min-height:0;min-width:0;}
.research-version-label {display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-height:22px;flex:none;}
.research-version-label strong {font-size:15px;line-height:1.4;}
.research-version-label small {font-size:12px;line-height:1.4;color:var(--research-muted);}
.research-phone {box-sizing:border-box;display:flex;flex-direction:column;width:390px;height:844px;min-width:390px;max-width:390px;min-height:844px;max-height:844px;margin:0;background:#EDEDED;border:0;border-radius:0;overflow:hidden;color:rgba(0,0,0,.9);font:17px/1.4 -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;}
.research-phone-status {height:47px;flex:none;display:flex;align-items:flex-start;justify-content:space-between;padding:13px 27px 0;font-size:17px;line-height:22px;font-weight:600;letter-spacing:-.4px;}
.research-phone-status img {width:77.4px;height:13px;margin-top:4px;}
.research-phone-safe {display:flex;align-items:flex-end;justify-content:center;height:34px;flex:none;margin-top:auto;padding-bottom:9px;}
.research-phone-safe>span {width:134px;height:5px;border-radius:100px;background:rgba(0,0,0,.9);}
.research-appbar {display:flex;align-items:center;justify-content:space-between;gap:8px;height:44px;flex:none;padding:0 16px;font-size:17px;font-weight:500;line-height:1.4;}
.research-appbar>strong {flex:1;text-align:center;font-size:17px;}
.research-appbar img,.research-appbar svg {height:24px;width:24px;object-fit:contain;flex-shrink:0;}
.research-appbar img:first-child {width:12px;}
.research-search {display:flex;align-items:center;justify-content:center;flex:none;gap:6px;height:36px;margin:8px 12px 12px;padding:6px 12px;background:#FFFFFF;border-radius:8px;color:rgba(0,0,0,.35);font-size:17px;line-height:1.4;}
.research-search img,.research-search svg {width:15px;height:15px;flex-shrink:0;}
.research-tags {display:flex;flex:none;gap:8px;margin:0;padding:0 16px 16px;align-content:flex-start;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;}
.research-tags>span,.research-tags>button {display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:34px;padding:6px 12px;position:relative;border:0;border-radius:5px;background:#FFFFFF;color:rgba(0,0,0,.9);font-size:15px;line-height:1.4;white-space:nowrap;}
.research-tags.is-horizontal {flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;}
.research-tags.is-wrap {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
.research-tags .is-target,.research-tags .target {box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);}
.research-tags .is-found,.research-tags .is-active,.research-tags .is-tapped {background:#07C160;color:#FFFFFF;box-shadow:none;}
.research-tags .is-found::after,.research-tags .is-tapped::after {content:'';position:absolute;right:-4px;bottom:-5px;width:15px;height:15px;border:3px solid #FFFFFF;border-radius:50%;background:#07C160;box-shadow:0 0 0 2px #07C160;pointer-events:none;}
.research-saved {padding:0 16px 16px;display:grid;flex:none;gap:8px;}
.research-saved>article,.research-saved>.research-saved-item,.research-saved>div {display:flex;align-items:center;gap:12px;padding:14px;background:#FFFFFF;border-radius:6px;min-width:0;}
.research-saved strong {display:block;font-size:17px;line-height:1.4;font-weight:400;}
.research-saved small {display:block;font-size:14px;line-height:1.4;color:var(--research-muted);margin-top:6px;}
.research-thumb {display:grid;place-items:center;width:56px;height:56px;flex:0 0 56px;background:#EDEDED;border-radius:4px;position:relative;color:#07C160;}
.research-thumb svg,.research-thumb img {width:100%;height:100%;object-fit:cover;border-radius:3px;}
.research-thumb .icon {width:23px;height:23px;}

/* Watch the same person try each version. */
.research-replay-tabs {display:flex;gap:7px;align-items:center;}
.research-replay-tabs button {display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:7px 14px;border:1px solid var(--research-line);border-radius:7px;background:#FFFFFF;color:var(--research-muted);font-size:14px;line-height:1.4;}
.research-replay-tabs button[aria-pressed='true'] {background:#EDEDED;border-color:#cfd3d0;color:var(--research-ink);}
.research-replay-tabs button .icon {width:16px;height:16px;color:#07C160;}
.research-observation {display:grid;grid-template-columns:minmax(0,1fr) minmax(135px,.75fr);grid-template-rows:minmax(0,1fr);gap:24px;align-items:stretch;flex:1;min-width:0;min-height:0;}
.research-observation>.research-version {max-width:none;width:100%;min-height:0;justify-self:center;}
.research-timeline {display:flex;flex-direction:column;gap:0;align-self:center;min-width:0;}
.research-timeline>div,.research-timeline>li {position:relative;padding:8px 0 15px 20px;color:var(--research-muted);font-size:14px;line-height:1.5;list-style:none;}
.research-timeline>div::before,.research-timeline>li::before {content:'';position:absolute;left:1px;top:16px;width:7px;height:7px;border-radius:50%;background:#d2d6d3;}
.research-timeline>div:not(:last-child)::after,.research-timeline>li:not(:last-child)::after {content:'';position:absolute;top:26px;bottom:-7px;left:4px;width:1px;background:#dce1dd;}
.research-timeline .is-active {color:var(--research-ink);font-weight:500;}
.research-timeline .is-active::before {background:#07C160;box-shadow:0 0 0 4px rgba(7,193,96,.12);}
.research-timeline strong {display:block;font-size:14px;line-height:1.4;}
.research-timeline small {display:block;color:var(--research-muted);font-size:13px;line-height:1.4;margin-top:3px;}
.research-timer {display:flex;align-items:baseline;justify-content:flex-start;gap:8px;font-variant-numeric:tabular-nums;color:#07C160;}
.research-timer>strong,.research-timer>span,.research-timer>b {font-size:46px;font-weight:500;line-height:1.05;letter-spacing:-1.8px;}
.research-timer small {font-size:14px;color:var(--research-muted);letter-spacing:0;}
.research-observed-note {padding:10px 13px;border-left:3px solid #07C160;background:rgba(7,193,96,.05);font-size:14px;line-height:1.5;color:var(--research-ink);}

/* Concrete participant assignments, with the original layout still visible. */
.research-assignments {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.research-assignments>article,.research-assignments>.research-assignment,.research-assignments>.research-participant {padding:14px;border:1px solid var(--research-line);border-radius:9px;background:#FFFFFF;display:flex;flex-direction:column;gap:12px;min-width:0;}
.research-assignments .research-person img {width:32px;height:32px;flex-basis:32px;}
.research-assignments .research-person {gap:8px;}
.research-assignments .research-person strong {font-size:14px;}
.research-assignments .research-person small {font-size:12px;}
.research-path {display:flex;align-items:center;gap:7px;min-width:0;flex-wrap:wrap;}
.research-path>.icon {width:15px;height:15px;color:var(--research-muted);}
.research-path>span:not(.research-ticket) {color:var(--research-muted);font-size:14px;}
.research-ticket {display:flex;flex-direction:column;gap:2px;flex:1;min-width:66px;padding:7px 9px;border-radius:6px;background:#EDEDED;color:var(--research-ink);font-size:14px;line-height:1.4;}
.research-ticket strong {font-size:14px;}
.research-ticket small {font-size:13px;color:var(--research-muted);line-height:1.4;}
.research-mini-versions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:auto;}
.research-mini-versions .research-version {gap:6px;}
.research-mini-versions .research-version-label strong {font-size:14px;}
.research-mini-versions .research-phone {box-shadow:none;border-radius:7px;}
.research-mini-versions .research-appbar {min-height:34px;padding:6px 10px;font-size:14px;}
.research-mini-versions .research-appbar strong {font-size:14px;}
.research-mini-versions .research-search {min-height:29px;margin:0 8px 6px;padding:4px 8px;font-size:13px;}
.research-mini-versions .research-tags {padding:0 8px 8px;gap:5px;}
.research-mini-versions .research-tags>span,.research-mini-versions .research-tags>button {font-size:13px;min-height:27px;padding:4px 7px;}
.research-mini-versions .research-saved {padding:0 8px 8px;gap:5px;}
.research-mini-versions .research-saved>article,.research-mini-versions .research-saved>.research-saved-item,.research-mini-versions .research-saved>div {padding:7px;gap:7px;}
.research-mini-versions .research-saved strong {font-size:13px;}
.research-mini-versions .research-thumb {width:28px;height:28px;flex-basis:28px;}
.research-setting {min-width:0;margin:0;padding:0;border:0;display:flex;flex-direction:column;gap:6px;}
.research-setting legend {padding:0;margin-bottom:7px;font-size:14px;font-weight:500;line-height:1.4;}
.research-setting button,.research-conclusions button {position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%;min-height:48px;padding:10px 12px;text-align:left;border:1px solid var(--research-line);border-radius:7px;background:#FFFFFF;color:var(--research-ink);}
.research-setting button strong,.research-conclusions button strong {font-size:14px;line-height:1.4;font-weight:500;}
.research-setting button small,.research-conclusions button small {font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-setting button:is([aria-pressed='true'],[aria-checked='true'],.is-active,.is-selected),.research-conclusions button:is([aria-pressed='true'],[aria-checked='true'],.is-active,.is-selected) {border-color:var(--research-line);background:rgba(7,193,96,.09);box-shadow:none;}
.research-choice-explainer {font-size:13px;line-height:1.45;color:var(--research-muted);}

/* Observations stay legible as records rather than a decorative score. */
.research-records {width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px;line-height:1.5;}
.research-records th {font-weight:400;text-align:left;color:var(--research-muted);font-size:13px;padding:9px 10px;border-bottom:1px solid var(--research-line);}
.research-records td {padding:14px 10px;text-align:left;border-bottom:1px solid var(--research-line);vertical-align:middle;overflow-wrap:anywhere;}
.research-records th:first-child,.research-records td:first-child {padding-left:0;}
.research-records th:last-child,.research-records td:last-child {padding-right:0;}
.research-records strong {font-weight:500;font-variant-numeric:tabular-nums;}
.research-records small {display:block;font-size:12px;line-height:1.4;color:var(--research-muted);margin-top:3px;}
.research-records-grid {display:grid;gap:0;width:100%;}
.research-records-grid>div,.research-records-grid>article {display:grid;grid-template-columns:92px minmax(0,1fr) 58px;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--research-line);font-size:14px;}
.research-records-grid strong {font-variant-numeric:tabular-nums;}
.research-records-grid small {display:block;font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-time-bar {height:9px;min-width:0;width:100%;border-radius:3px;background:#EDEDED;}
.research-time-bar>i,.research-time-bar>span,.research-time-bar>div {display:block;height:100%;max-width:100%;border-radius:3px;background:#07C160;}
.research-evidence-note {font-size:14px;line-height:1.65;color:var(--research-muted);padding:14px 16px;background:#EDEDED;border-radius:8px;margin-top:auto!important;}
.research-conclusions {display:flex;flex-direction:column;gap:8px;}
.research-feedback {display:flex;flex-direction:column;gap:6px;padding:13px 15px;background:#EDEDED;border-radius:8px;font-size:14px;line-height:1.5;}
.research-feedback strong {font-size:15px;}
.research-feedback p {font-size:14px;color:var(--research-muted);line-height:1.55;}
.research-feedback.is-correct,.research-feedback.is-passed {background:rgba(7,193,96,.07);border-left:3px solid #07C160;}

@media(min-width:961px) and (min-height:620px) {
 .work-shell .research-workspace {min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:10px;padding:12px 0 6px;}
 .research-heading h1 {font-size:23px;}
 .research-layout {min-height:0;grid-template-columns:minmax(0,1fr) 330px;gap:16px;}
 .research-canvas,.research-guide {min-height:0;}
 .research-canvas {padding:20px;gap:14px;}
 .research-guide {padding:20px;gap:13px;}
 .research-versions {gap:18px;}
 .research-observation {gap:20px;}
 .research-heading .research-crumb {font-size:11px;}
 .research-footer {min-height:22px;}
 .research-footer button {min-height:26px;padding-block:2px;}
}
@media(min-width:961px) and (min-height:620px) and (max-height:760px) {
 .work-shell .research-workspace {gap:8px;padding:8px 0 4px;}
 .research-heading {gap:14px;}
 .research-heading>.research-heading-copy {display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 13px;align-items:center;}
 .research-heading .research-crumb {margin:0;grid-column:1;grid-row:1;font-size:11px;}
 .research-heading h1 {grid-column:2;grid-row:1;font-size:21px;line-height:1.4;}
 .research-heading p {grid-column:2;margin-top:2px;font-size:13px;line-height:1.4;}
 .research-skill {min-height:32px;padding:5px 9px;font-size:12px;}
 .research-steps {padding:3px;}
 .research-steps button {min-height:32px;padding:5px 10px;font-size:14px;}
 .research-steps button+button::before {top:8px;bottom:8px;}
 .research-layout {grid-template-columns:minmax(0,1fr) 320px;gap:14px;}
 .research-canvas {padding:14px 18px;gap:11px;}
 .research-guide {padding:15px 18px;gap:11px;}
 .research-scene-heading {gap:2px;}
 .research-scene-heading h2 {font-size:21px;line-height:1.35;}
 .research-scene-heading p {font-size:13px;line-height:1.4;}
 .research-guide>h2 {font-size:20px;line-height:1.35;}
 .research-guide>p {font-size:14px;line-height:1.5;}
 .research-chat {padding:10px 12px;}
 .research-chat p {font-size:14px;line-height:1.5;}
 .research-objective {padding-top:10px;}
 .research-objective p {font-size:14px;line-height:1.45;}
 .research-guide-bottom {gap:7px;padding-top:3px;}
 .research-workspace .research-primary,.research-workspace .research-secondary {min-height:42px;padding:8px 12px;font-size:15px;}
 .research-version {gap:6px;}
 .research-version-label {min-height:20px;}
 .research-version-label strong {font-size:14px;}
 .research-versions {gap:16px;}
 .research-note {font-size:12px;line-height:1.4;}
 .research-replay-tabs button {min-height:32px;padding:5px 11px;}
 .research-observation {grid-template-columns:minmax(185px,1fr) minmax(130px,.72fr);gap:16px;}
 .research-observation>.research-version {max-width:280px;}
 .research-timeline>div,.research-timeline>li {padding-bottom:12px;font-size:14px;}
 .research-timer>strong,.research-timer>span,.research-timer>b {font-size:38px;}
 .research-observed-note {padding:8px 10px;font-size:13px;}
 .research-assignments {gap:10px;}
 .research-assignments>article,.research-assignments>.research-assignment,.research-assignments>.research-participant {padding:10px;gap:9px;}
 .research-ticket {padding:5px 7px;min-width:60px;}
 .research-mini-versions {gap:12px;}
 .research-setting {gap:4px;}
 .research-setting legend {margin-bottom:5px;}
 .research-setting button {min-height:44px;padding:6px 9px;gap:1px;}
 .research-setting button strong {font-size:14px;line-height:1.3;}
 .research-setting button small {font-size:12px;line-height:1.35;}
 .research-choice-explainer {font-size:12px;line-height:1.4;}
 .research-records td {padding:11px 8px;}
 .research-records th {padding:7px 8px;}
 .research-records-grid>div,.research-records-grid>article {padding:11px 0;gap:10px;}
 .research-evidence-note {padding:10px 12px;font-size:14px;line-height:1.5;}
 .research-conclusions {gap:6px;}
 .research-conclusions button {padding:8px 10px;gap:2px;}
 .research-feedback {padding:10px 12px;gap:4px;}
 .research-feedback p {font-size:13px;line-height:1.45;}
}
@media(min-width:961px) and (max-width:1140px) {
 .research-layout {grid-template-columns:minmax(0,1fr) 305px;gap:12px;}
 .research-canvas {padding-inline:14px;}
 .research-guide {padding-inline:15px;}
 .research-heading h1 {font-size:20px;}
 .research-versions {gap:14px;}
 .research-version-label {gap:5px;flex-wrap:wrap;}
 .research-observation {gap:13px;}
 .research-assignments {gap:8px;}
 .research-path {gap:5px;}
 .research-ticket {min-width:57px;padding-inline:6px;}
}
@media(max-width:960px),(max-height:619px) {
 .research-workspace {display:flex;height:auto;min-height:0;padding:22px 0 15px;gap:16px;}
 .research-layout {grid-template-columns:minmax(0,1fr);gap:16px;}
 .research-canvas,.research-guide {height:auto;min-height:0;}
 .research-canvas {padding:22px;}
 .research-guide {padding:22px;gap:16px;}
 .research-heading {align-items:flex-start;}
 .research-heading h1 {font-size:24px;}
 .research-heading p {font-size:14px;line-height:1.5;}
 .research-guide-bottom {margin-top:5px;}
 .research-versions {flex:none;grid-template-rows:none;grid-auto-rows:auto;}
 .research-version>.phone-preview {flex:none;}
 .research-note {margin-top:4px!important;}
 .research-observation {grid-template-columns:minmax(0,1fr) minmax(150px,.65fr);}
 .research-mini-versions {margin-top:6px;}
 .research-setting button {min-height:52px;padding:10px 12px;}
 .research-setting button small {font-size:13px;}
 .research-evidence-note {margin-top:8px!important;}
 .research-footer {align-items:flex-start;}
}
@media(max-width:600px) {
 .research-workspace {gap:14px;padding-top:20px;}
 .research-heading {gap:10px;}
 .research-heading h1 {font-size:22px;line-height:1.4;}
 .research-heading p {font-size:13px;}
 .research-skill {font-size:12px;min-height:34px;padding:6px 8px;}
 .research-skill .icon {width:15px;height:15px;}
 .research-steps button {gap:6px;min-height:42px;padding:7px 5px;font-size:14px;}
 .research-steps button>span:first-child,.research-steps button>b:first-child {font-size:11px;}
 .research-canvas,.research-guide {padding:18px 16px;border-radius:11px;}
 .research-canvas {gap:17px;}
 .research-scene-heading h2 {font-size:22px;}
 .research-scene-heading p {font-size:14px;line-height:1.5;}
 .research-versions {grid-template-columns:minmax(0,1fr);gap:22px;}
 .research-version {width:100%;max-width:none;min-height:0;margin-inline:auto;}
 .research-version-label {min-height:23px;gap:8px;}
 .research-version-label strong {font-size:15px;}
 .research-version-label small {font-size:13px;}
 .research-observation {display:flex;flex-direction:column;align-items:stretch;gap:16px;}
 .research-observation>.research-version {max-width:none;}
 .research-timeline {align-self:stretch;}
 .research-timeline>div,.research-timeline>li {padding-bottom:12px;}
 .research-replay-tabs button {flex:1;min-height:42px;}
 .research-timer {justify-content:center;}
 .research-assignments {grid-template-columns:minmax(0,1fr);gap:10px;}
 .research-assignments>article,.research-assignments>.research-assignment,.research-assignments>.research-participant {padding:14px;gap:12px;}
 .research-path {flex-wrap:nowrap;gap:9px;}
 .research-ticket {padding:8px 10px;min-width:0;}
 .research-mini-versions {grid-template-columns:minmax(0,1fr);gap:16px;}
 .research-records {font-size:13px;}
 .research-records th {font-size:12px;padding:7px 5px;}
 .research-records td {padding:11px 5px;}
 .research-records-grid>div,.research-records-grid>article {grid-template-columns:70px minmax(0,1fr) 48px;gap:8px;font-size:14px;}
 .research-records-grid small {font-size:12px;}
 .research-footer {font-size:12px;gap:12px;}
 .research-footer>span {max-width:65%;}
}
@media(prefers-reduced-motion:reduce) {.research-workspace * {animation:none!important;transition:none!important;scroll-behavior:auto!important;}}

/* Concrete view markup: replay frames, paired trials and the swipe observation. */
.research-skill {flex-direction:column;align-items:flex-start;gap:1px;max-width:285px;}
.research-skill>span {font-size:11px;line-height:1.4;color:#788473;}
.research-skill>strong {font-size:12px;line-height:1.45;font-weight:500;}
.research-scene-heading>span {font-size:12px;line-height:1.4;color:var(--research-muted);}
.research-person>div>span {font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-tags>.is-selected {background:#07C160;color:#FFFFFF;box-shadow:none;}
.research-tags>.is-pointed::after {content:'';position:absolute;z-index:1;right:2px;bottom:-5px;width:14px;height:14px;border:3px solid #FFFFFF;border-radius:50%;background:#07C160;box-shadow:0 0 0 2px #07C160;pointer-events:none;}
.research-tags.is-horizontal.is-searching>span {transform:translateX(-160px);}
.research-swipe {padding:0 16px 12px;font-size:14px;line-height:1.4;color:var(--research-muted);flex:none;}
.research-thumb-paper {background:#EDEDED;color:rgba(0,0,0,.45);font-size:27px;line-height:1;}
.research-phone-success {margin:0 16px 16px;border-top:1px solid rgba(0,0,0,.07);padding-top:12px;color:#07C160;font-size:15px;line-height:1.4;text-align:center;flex:none;}
.research-timeline>.research-timer {display:flex;flex-direction:column;gap:5px;align-items:flex-start;padding:0 0 16px;color:#07C160;}
.research-timeline>.research-timer::before,.research-timeline>.research-timer::after {content:none;}
.research-timer>strong {font-size:46px;line-height:1;letter-spacing:-1.8px;}
.research-timer>strong>small {display:inline;font-size:14px;font-weight:400;margin-left:5px;letter-spacing:0;white-space:nowrap;}
.research-timer>span {font-size:12px;font-weight:400;line-height:1.4;letter-spacing:0;color:var(--research-muted);}
.research-timeline>.research-frame {display:flex;align-items:flex-start;gap:8px;padding:8px 0 11px;color:var(--research-muted);}
.research-timeline>.research-frame::before {content:none;}
.research-timeline>.research-frame::after {left:10px;top:32px;bottom:-4px;}
.research-frame>span {width:21px;height:21px;flex:0 0 21px;display:grid;place-items:center;font-size:12px;line-height:1;border-radius:50%;border:1px solid #d5dad6;background:#FFFFFF;font-variant-numeric:tabular-nums;}
.research-frame>div {min-width:0;}
.research-frame strong {font-size:14px;line-height:1.4;}
.research-frame p {font-size:13px;line-height:1.45;margin-top:4px;color:var(--research-muted);}
.research-frame.is-active {color:var(--research-ink);}
.research-frame.is-active>span {background:#07C160;color:#FFFFFF;border-color:#07C160;}
.research-frame.is-done>span {color:#07C160;border-color:#07C160;}
.research-observed-note {display:flex;align-items:baseline;gap:8px;}
.research-observed-note>strong {white-space:nowrap;flex-shrink:0;font-size:13px;}
.research-observed-note>span {font-size:14px;line-height:1.5;}
.research-first-results {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border-block:1px solid var(--research-line);padding:11px 0;}
.research-first-results>div {display:flex;flex-direction:column;gap:4px;}
.research-first-results span,.research-first-results small {font-size:12px;line-height:1.4;color:var(--research-muted);}
.research-first-results strong {font-size:24px;line-height:1.2;font-variant-numeric:tabular-nums;}
.research-guide .research-text-button {min-height:28px;padding:3px 6px;border:0;background:transparent;font-size:13px;color:var(--research-muted);}
.research-footer>div {display:flex;align-items:center;gap:16px;}
.research-mobile-context {display:none;}
.research-path>.research-only-one {font-size:13px;line-height:1.4;color:var(--research-muted);flex:1;}
.research-ticket.is-new {background:rgba(7,193,96,.07);}
.research-ticket>span {font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-evidence-note>strong {display:block;font-size:14px;line-height:1.4;margin-bottom:5px;color:var(--research-ink);}
.research-evidence-note>p {font-size:14px;line-height:1.6;}
.research-records-grid>article {grid-template-columns:90px minmax(0,1fr);gap:16px;}
.research-records-grid .research-person {flex-direction:column;align-items:flex-start;gap:7px;}
.research-records-grid .research-person img {width:32px;height:32px;flex-basis:32px;}
.research-record-pair {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;min-width:0;}
.research-trial {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;align-items:center;min-width:0;}
.research-trial>span {grid-column:1/-1;font-size:13px;line-height:1.4;color:var(--research-muted);}
.research-trial>strong {grid-column:2;grid-row:2;font-size:28px;line-height:1;font-variant-numeric:tabular-nums;color:var(--research-ink);}
.research-trial>strong>small {display:inline;font-size:12px;line-height:1;margin-left:3px;font-weight:400;}
.research-trial>p {grid-column:1/-1;font-size:13px;line-height:1.5;color:var(--research-muted);}
.research-time-track {grid-column:1;grid-row:2;height:7px;background:#EDEDED;border-radius:2px;min-width:0;}
.research-time-track>i {display:block;max-width:100%;height:100%;background:#07C160;border-radius:2px;}
.research-trial>.research-no-time {grid-column:1/-1;font-size:15px;line-height:1.4;}
.research-trial.is-empty {align-content:center;}
.research-trial.is-empty>p {color:rgba(0,0,0,.4);}
@media(min-width:961px) and (min-height:620px) and (max-height:760px) {
 .research-skill {max-width:245px;padding:5px 8px;}
 .research-skill>strong {font-size:11px;}
 .research-skill>span {font-size:10px;}
 .research-scene-heading>span {font-size:11px;}
 .research-timeline>.research-timer {padding-bottom:10px;gap:3px;}
 .research-timer>strong {font-size:37px;}
 .research-timer>span {font-size:11px;line-height:1.4;}
 .research-timeline>.research-frame {padding:6px 0 8px;gap:7px;}
 .research-frame p {font-size:12px;line-height:1.4;margin-top:2px;}
 .research-frame strong {font-size:13px;line-height:1.4;}
 .research-timeline>.research-frame::after {top:28px;}
 .research-first-results {padding:8px 0;gap:10px;}
 .research-first-results>div {gap:3px;}
 .research-first-results strong {font-size:22px;}
 .research-observed-note {padding:7px 10px;gap:6px;}
 .research-observed-note>span {font-size:13px;line-height:1.4;}
 .research-records-grid>article {grid-template-columns:67px minmax(0,1fr);gap:12px;padding:10px 0;}
 .research-record-pair {gap:15px;}
 .research-trial {gap:5px 8px;}
 .research-trial>span {font-size:12px;}
 .research-trial>strong {font-size:25px;}
 .research-trial>p {font-size:12px;line-height:1.4;}
 .research-evidence-note>p {font-size:14px;line-height:1.5;}
}
@media(max-width:600px) {
 .research-heading {flex-direction:column;align-items:stretch;gap:10px;}
 .research-skill {align-self:flex-start;max-width:100%;flex-direction:row;gap:7px;align-items:baseline;padding:5px 8px;min-height:0;}
 .research-skill>span {white-space:nowrap;}
 .research-skill>strong {font-size:11px;}
 .research-timeline>.research-timer {align-items:center;padding-bottom:12px;}
 .research-timeline>.research-frame {padding-bottom:14px;}
 .research-frame p {font-size:14px;line-height:1.5;}
 .research-timer>span {font-size:13px;}
 .research-observed-note {flex-direction:column;gap:4px;}
 .research-records-grid>article {grid-template-columns:minmax(0,1fr);gap:12px;padding:16px 0;}
 .research-records-grid .research-person {flex-direction:row;align-items:center;gap:9px;}
 .research-record-pair {gap:14px;}
 .research-trial>strong {font-size:27px;}
 .research-trial>span,.research-trial>p {font-size:13px;}
 .research-footer>div {gap:12px;flex-wrap:wrap;justify-content:flex-end;}
 .research-footer>span {max-width:48%;}
}
@media(max-width:960px) {
 .research-heading {flex-direction:column;align-items:stretch;gap:10px;}
 .research-heading>.research-heading-copy {display:block;}
 .research-skill {align-self:flex-start;max-width:100%;flex-direction:row;align-items:baseline;gap:7px;min-height:0;padding:5px 8px;}
 .research-skill>span {white-space:nowrap;}
 .research-skill>strong {font-size:12px;line-height:1.45;}
 .research-mobile-context {display:block;padding:13px 15px;border-left:3px solid #07C160;border-radius:0 6px 6px 0;background:#FFFFFF;font-size:15px;line-height:1.65;color:var(--research-ink);}
}

/* Desktop panels allocate their remaining height to the phone preview slot.
   The 390 × 844 contents stay unchanged; only the outer preview is fitted. */
.research-replay-back {display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
@media(min-width:961px) and (min-height:620px) and (max-height:760px) {
 .research-canvas {padding-block:10px;gap:8px;}
 .research-guide {padding-block:13px;gap:9px;}
 .research-guide .research-kicker {margin-bottom:-6px;}
 .research-guide-bottom {padding-top:0;}
 .research-workspace[data-research-stage='intro'] .research-versions {align-items:stretch;}
 .research-workspace[data-research-stage='intro'] .research-objective {padding-top:8px;}
 .research-workspace[data-research-stage='watch'] .research-canvas {gap:7px;}
 .research-workspace[data-research-stage='watch'] .research-observation {gap:12px;}
 .research-workspace[data-research-stage='watch'] .research-version {gap:4px;}
 .research-workspace[data-research-stage='watch'] .research-observed-note {padding-block:6px;}
 .research-workspace[data-research-stage='watch'] .research-replay-back .research-text-button {min-height:25px;padding-block:2px;}
 .research-workspace[data-research-stage='plan'] .research-guide {gap:6px;padding-block:10px;}
 .research-workspace[data-research-stage='plan'] .research-layout {grid-template-columns:minmax(0,1fr) 370px;}
 .research-workspace[data-research-stage='plan'] .research-setting {gap:4px;}
 .research-workspace[data-research-stage='plan'] .research-setting legend {margin-bottom:5px;}
 .research-workspace[data-research-stage='plan'] .research-setting button {min-height:32px;padding:5px 10px;}
 .research-workspace[data-research-stage='plan'] .research-setting button strong {font-size:14px;line-height:1.4;}
 .research-workspace[data-research-stage='result'] .research-guide {gap:7px;padding-block:12px;}
 .research-workspace[data-research-stage='result'] .research-layout {grid-template-columns:minmax(0,1fr) 340px;}
 .research-workspace[data-research-stage='result'] .research-setting {gap:5px;}
 .research-workspace[data-research-stage='result'] .research-setting button {min-height:40px;padding:7px 10px;}
 .research-workspace[data-research-stage='result'] .research-setting button strong {font-size:14px;line-height:1.4;font-weight:400;}
 .research-workspace[data-research-stage='result'] .research-feedback {padding:9px 11px;gap:4px;}
 .research-workspace[data-research-stage='result'] .research-guide-bottom {gap:5px;}
 .research-workspace[data-research-stage='result'] .research-guide-bottom .research-secondary {min-height:29px;padding:4px 8px;background:transparent;font-size:13px;color:var(--research-muted);}
}

/* One background entry beside the title; practice controls stay together. */
.research-background {display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:40px;padding:5px 0;border:0;background:none;color:#52644e;font:inherit;font-size:14px;line-height:1.5;white-space:nowrap;}
.research-background .icon {width:17px;height:17px;flex:none;}
.research-guide .research-history-tools {display:flex;align-items:center;gap:8px;padding-top:14px;border-top:1px solid var(--research-line);}
.research-guide .research-history-tools button {flex:1;justify-content:center;min-width:84px;min-height:38px;padding:7px 13px;border:1px solid #d8dfd5;border-radius:7px;background:#fff;font-size:14px;line-height:1.5;color:#52644e;}
.research-history-tools button:disabled {opacity:.45;cursor:default;}
.research-history-tools .icon {width:16px;height:16px;}
@media(max-width:960px),(max-height:619px) {
 .research-heading {flex-direction:row;align-items:flex-start;gap:12px;}
 .research-heading>.research-heading-copy {flex:1;}
 .research-background {min-height:38px;font-size:13px;gap:4px;}
 .research-background .icon {width:15px;height:15px;}
 .research-guide .research-history-tools button {min-height:44px;}
}

/* Outer learning actions use the shop brand. Simulated WeChat controls keep wx green. */
.research-workspace .research-primary { background: var(--ink); border-radius: var(--radius-control); transition: background 160ms ease, transform 160ms ease; }
.research-workspace .research-primary:hover:not(:disabled) { background: #214f40; }
.research-workspace .research-primary:active:not(:disabled) { transform: translateY(1px); }
.research-workspace .research-primary:focus-visible { outline-color: var(--ink); }
.research-footer,.research-steps button:not(.is-active):not([aria-current='step']) { color: var(--muted); }
.research-workspace .research-guide :focus-visible,
.research-workspace .research-steps :focus-visible,
.research-workspace .research-footer :focus-visible { outline-color: var(--ink); }