.hrm-page .hero-visual {
  width: min(960px, 100%);
}

.hrm-page .visual-disclaimer {
  margin: 14px 4px 2px;
  color: #a1a1a6;
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
}

.hrm-page .panel:focus {
  outline: none;
}

.hrm-window {
  overflow: hidden;
  border-radius: 28px;
  background: #f7f7f9;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.16);
}

.hrm-window-bar {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  color: #6e6e73;
  background: #ececf0;
  font-size: 12px;
}

.hrm-window-bar strong {
  color: #303035;
  font-size: 12px;
}

.hrm-window-bar > span:last-child {
  margin-left: auto;
  color: #8e8e93;
}

.window-dots {
  display: flex;
  gap: 7px;
}

.window-dots i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ff5f57;
}

.window-dots i:nth-child(2) {
  background: #febc2e;
}

.window-dots i:nth-child(3) {
  background: #28c840;
}

.hrm-mock-shell {
  display: grid;
  grid-template-columns: 174px minmax(0, 1fr);
  min-height: 430px;
  background: #f8f8fb;
}

.hrm-mock-side {
  padding: 22px 16px;
  border-right: 1px solid rgba(0, 0, 0, 0.08);
  background: #f1f1f4;
}

.hrm-mock-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  color: #303035;
  font-size: 12px;
}

.hrm-mock-brand span {
  width: 20px;
  height: 20px;
  border-radius: 7px;
  background: linear-gradient(145deg, #0071e3, #5e5ce6);
  box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.7);
}

.hrm-side-item {
  height: 31px;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 4px 0;
  padding: 0 9px;
  border-radius: 8px;
  color: #74757b;
  font-size: 10px;
}

.hrm-side-item i {
  width: 10px;
  height: 10px;
  border: 1.5px solid #aaabb2;
  border-radius: 3px;
}

.hrm-side-item.active {
  color: #0071e3;
  background: #fff;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.05);
}

.hrm-side-item.active i {
  border-color: #0071e3;
  background: #dfeeff;
}

.hrm-side-divider {
  height: 1px;
  margin: 17px 4px;
  background: #dedee3;
}

.hrm-mock-main {
  min-width: 0;
  padding: 22px 24px;
  background: linear-gradient(145deg, #fbfbfd, #eef4ff);
}

.hrm-main-head,
.hrm-progress-head,
.hrm-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.hrm-main-head strong,
.hrm-main-head span {
  display: block;
}

.hrm-main-head strong {
  color: #303035;
  font-size: 14px;
}

.hrm-main-head span {
  margin-top: 4px;
  color: #8e8e93;
  font-size: 10px;
}

.hrm-avatar {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #0071e3;
  font-size: 9px;
}

.hrm-metric-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 24px 0 21px;
}

.hrm-metric-row > div {
  padding: 12px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 11px;
  background: #fff;
}

.hrm-metric-row span,
.hrm-metric-row b,
.hrm-metric-row em {
  display: block;
}

.hrm-metric-row span {
  color: #8e8e93;
  font-size: 9px;
}

.hrm-metric-row b {
  margin: 3px 0;
  color: #303035;
  font-size: 22px;
}

.hrm-metric-row em {
  color: #148a36;
  font-size: 8px;
  font-style: normal;
}

.hrm-progress-head,
.hrm-table-head {
  color: #303035;
  font-size: 10px;
}

.hrm-progress-head span,
.hrm-table-head span {
  color: #0071e3;
  font-size: 9px;
}

.hrm-stage-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0 18px;
}

.hrm-stage-row > div {
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 9px;
  background: #fff;
}

.hrm-stage-row b,
.hrm-stage-row strong {
  display: block;
}

.hrm-stage-row b {
  color: #6e6e73;
  font-size: 9px;
  font-weight: 500;
}

.hrm-stage-row strong {
  margin: 2px 0 6px;
  color: #303035;
  font-size: 15px;
}

.hrm-stage-row span {
  width: 100%;
  height: 4px;
  display: block;
  border-radius: 4px;
  background: #dcecff;
}

.hrm-stage-row div:nth-child(2) span {
  width: 68%;
  background: #b6d9ff;
}

.hrm-stage-row div:nth-child(3) span {
  width: 45%;
  background: #8fc4ff;
}

.hrm-stage-row div:nth-child(4) span {
  width: 25%;
  background: #0071e3;
}

.hrm-table-card {
  padding: 12px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 12px;
  background: #fff;
}

.hrm-table-line {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  margin-top: 11px;
}

.hrm-table-line i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: #d9eaff;
}

.hrm-table-line:nth-child(3) i {
  background: #bfdfff;
}

.hrm-table-line:nth-child(4) i {
  background: #8fc4ff;
}

.hrm-table-line > span {
  width: 70%;
  height: 7px;
  border-radius: 5px;
  background: #d2d3d8;
}

.hrm-table-line b {
  padding: 4px 6px;
  border-radius: 5px;
  color: #0071e3;
  background: #eef6ff;
  font-size: 8px;
}

.hrm-table-line small {
  color: #8e8e93;
  font-size: 8px;
}

.hrm-page .story-body {
  min-width: 0;
}

.story-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 30px 0;
}

.story-card-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.story-card-grid > article {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--soft-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.045);
}

.story-card-grid > article > span {
  display: block;
  margin-bottom: 10px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.story-card-grid h4 {
  margin: 0 0 8px;
  font-size: 19px;
}

.story-card-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.72;
}

.role-task-grid > article > strong {
  display: block;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--soft-line);
  color: #3a3a3c;
  font-size: 12px;
  line-height: 1.65;
}

.story-subtitle {
  max-width: 760px;
  margin: 42px 0 20px;
  font-size: 22px;
}

.experience-needs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--soft-line);
}

.experience-needs span,
.mini-tags span {
  padding: 7px 10px;
  border: 1px solid #dce7f8;
  border-radius: 999px;
  color: #4a4a50;
  background: #f5f9ff;
  font-size: 12px;
  font-weight: 650;
}

.problem-distribution {
  margin: 28px 0 14px;
  padding: 16px 20px 15px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.problem-distribution-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  color: var(--muted);
  font-size: 12px;
}

.problem-distribution-head > span:first-child {
  color: var(--blue);
  font-weight: 750;
}

.problem-distribution-head strong {
  color: var(--ink);
  font-size: 14px;
}

.problem-distribution-bar {
  height: 8px;
  display: grid;
  grid-template-columns: 58fr 42fr 60fr 52fr;
  gap: 2px;
  overflow: hidden;
  margin-top: 10px;
  border-radius: 999px;
  background: var(--line);
}

.problem-segment {
  display: block;
  min-width: 0;
}

.problem-segment-fault,
.problem-legend-fault i {
  background: #b7d9f5;
}

.problem-segment-product,
.problem-legend-product i {
  background: #75afe4;
}

.problem-segment-interaction,
.problem-legend-interaction i {
  background: #0068cc;
}

.problem-segment-visual,
.problem-legend-visual i {
  background: #368cd8;
}

.problem-distribution-legend {
  display: grid;
  grid-template-columns: 58fr 42fr 60fr 52fr;
  gap: 2px;
  margin-top: 12px;
}

.problem-distribution-legend > div {
  padding-right: 16px;
}

.problem-distribution-legend > div:last-child {
  padding-right: 0;
}

.problem-distribution-legend > div,
.problem-distribution-legend span {
  min-width: 0;
}

.problem-distribution-legend span {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.problem-distribution-legend i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
}

.problem-distribution-legend b {
  color: var(--ink);
  font-size: 14px;
}

.problem-distribution-legend strong {
  overflow: hidden;
  color: #4a4a50;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.problem-distribution-legend small {
  display: block;
  overflow: hidden;
  margin: 3px 0 0 13px;
  color: #8e8e93;
  font-size: 10px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.evidence-chain {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 24px 0 0;
  padding: 18px;
  border: 1px solid var(--soft-line);
  border-radius: 18px;
  background: #f7f7f9;
}

.evidence-chain > div {
  min-width: 0;
  padding: 13px 14px;
  border-radius: 13px;
  background: #fff;
}

.evidence-chain span,
.evidence-chain strong {
  display: block;
}

.evidence-chain span {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.evidence-chain strong {
  font-size: 12px;
  line-height: 1.55;
}

.evidence-chain i {
  color: var(--blue);
  font-style: normal;
}

.persona-logic {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.persona-logic {
  margin: 30px 0 20px;
}

.persona-logic article {
  padding: 24px;
  border: 1px solid var(--soft-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.045);
}

.persona-logic span {
  display: block;
  margin-bottom: 12px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.persona-logic h4,
.persona-logic p {
  margin-top: 0;
}

.persona-logic h4 {
  margin-bottom: 8px;
  font-size: 20px;
}

.persona-logic p,
.story-note {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 14px;
}

.story-note {
  max-width: var(--reading);
  padding-top: 16px;
  border-top: 1px solid var(--soft-line);
}

.strategy-bridge {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 30px 0;
}

.strategy-bridge article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--soft-line);
  border-radius: 18px;
  background: #fff;
}

.strategy-bridge > article > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--blue);
  background: #eef6ff;
  font-size: 12px;
  font-weight: 750;
}

.strategy-bridge h4 {
  margin: 0 0 4px;
  font-size: 18px;
}

.strategy-bridge p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.task-shift,
.system-growth {
  display: grid;
  align-items: stretch;
  gap: 14px;
  margin: 34px 0 20px;
}

.task-shift {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.system-growth {
  grid-template-columns: repeat(2, auto minmax(0, 1fr)) auto minmax(0, 1fr);
}

.task-shift > div,
.system-growth > div {
  padding: 24px;
  border: 1px solid var(--soft-line);
  border-radius: 22px;
  background: #fff;
}

.task-shift > div:last-child {
  border-color: #b9dbff;
  background: #f6fbff;
}

.task-shift > i,
.system-growth > i {
  align-self: center;
  color: var(--blue);
  font-style: normal;
}

.task-shift span,
.system-growth span {
  display: block;
  margin-bottom: 10px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.task-shift strong,
.system-growth strong {
  display: block;
  font-size: 16px;
  line-height: 1.65;
}

.task-shift p,
.system-growth p {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.framework-rules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  margin: 22px 0 34px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.12);
}

.framework-rules > div {
  min-width: 0;
  padding: 24px;
  background: #111214;
}

.framework-rules span,
.framework-rules strong {
  display: block;
}

.framework-rules span {
  margin-bottom: 8px;
  color: #9edaff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.framework-rules strong {
  font-size: 19px;
}

.framework-rules p {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 12px;
  line-height: 1.65;
}

.mini-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--soft-line);
}

.mini-tags span {
  padding: 6px 9px;
  font-size: 11px;
}

.compact-head {
  margin-bottom: 42px;
}

.insight-section,
.solution-section,
.result-section {
  margin-top: 96px;
  padding-top: 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.insight-section:first-of-type,
.result-section:first-of-type {
  margin-top: 0;
}

.card-index,
.solution-heading > span {
  display: block;
  margin-bottom: 8px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.hrm-page #insights .insight-section {
  margin-top: 72px;
}

.hrm-page #insights .insight-section:first-of-type {
  margin-top: 0;
}

.hrm-page #insights .compact-head {
  margin-bottom: 28px;
}

.research-route {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px 190px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.research-route-sources {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.research-route-sources article {
  min-width: 0;
  padding: 18px 20px;
  border-right: 1px solid var(--line);
}

.research-route-sources article:last-child {
  border-right: 0;
}

.research-route-sources span,
.research-route-output > span,
.translation-input > span,
.translation-lens > span,
.translation-output > span,
.axis-block-head > div > span {
  display: block;
  margin-bottom: 7px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.research-route-sources strong,
.research-route-sources small,
.research-route-output strong,
.research-route-output small {
  display: block;
}

.research-route-sources strong {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.45;
}

.research-route-sources small {
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.research-route > i,
.insight-translation > i {
  display: grid;
  place-items: center;
  color: var(--blue);
  background: #f6f8fb;
  font-size: 18px;
  font-style: normal;
}

.research-route-output {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 20px;
  background: #eef6ff;
}

.research-route-output b {
  color: var(--blue);
  font-size: 28px;
  line-height: 1;
}

.research-route-output strong {
  margin-top: 4px;
  color: var(--ink);
  font-size: 14px;
}

.research-route-output small {
  margin-top: 6px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.problem-distribution-insights {
  margin: 16px 0 0;
}

.priority-method,
.example-trace {
  margin-top: 16px;
  padding: 17px 20px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fafbfd;
}

.priority-method-head,
.example-trace-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 13px;
}

.priority-method-head > span,
.example-trace-head > span {
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.priority-method-head > strong,
.example-trace-head > strong {
  color: var(--ink);
  font-size: 15px;
}

.priority-method-head > p {
  margin: 0 0 0 auto;
  color: var(--muted);
  font-size: 11px;
}

.priority-method-flow,
.example-trace-flow {
  display: grid;
  align-items: stretch;
}

.priority-method-flow {
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
}

.example-trace-flow {
  grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 0.9fr) 24px minmax(0, 1.25fr);
}

.priority-method-flow > div,
.example-trace-flow > div {
  min-width: 0;
  padding: 12px 14px;
  border-left: 2px solid #b7d9f5;
  background: #fff;
}

.priority-method-flow > i,
.example-trace-flow > i {
  display: grid;
  place-items: center;
  color: var(--blue);
  font-size: 14px;
  font-style: normal;
}

.priority-method-flow small,
.priority-method-flow strong,
.priority-method-flow span,
.example-trace-flow small,
.example-trace-flow strong {
  display: block;
}

.priority-method-flow small,
.example-trace-flow small {
  margin-bottom: 5px;
  color: var(--blue);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.06em;
}

.priority-method-flow strong,
.example-trace-flow strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.45;
}

.priority-method-flow span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.example-trace {
  background: #f7fbff;
}

.work-context-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--line);
}

.work-context-strip > div {
  min-width: 0;
  padding: 15px 18px;
  background: #fff;
}

.work-context-strip b,
.work-context-strip span {
  display: block;
}

.work-context-strip b {
  color: var(--blue);
  font-size: 18px;
}

.work-context-strip span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}

.role-task-block {
  margin-top: 16px;
}

.axis-block-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
  padding: 0 2px;
}

.axis-block-head h3,
.axis-block-head p {
  margin: 0;
}

.axis-block-head h3 {
  font-size: 20px;
}

.axis-block-head p {
  color: var(--muted);
  font-size: 11px;
}

.role-task-matrix-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.role-task-matrix-wrap:focus-visible,
.hrm-process-diagram:focus-visible {
  outline: 2px solid rgba(0, 113, 227, 0.45);
  outline-offset: 3px;
}

.role-task-matrix {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.role-task-matrix caption {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.role-task-column {
  width: 164px;
}

.role-task-matrix th,
.role-task-matrix td {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

.role-task-matrix tr > *:last-child {
  border-right: 0;
}

.role-task-matrix tbody tr:last-child > * {
  border-bottom: 0;
}

.role-task-matrix thead th {
  padding: 0;
  background: #f3f4f6;
  color: var(--ink);
}

.role-task-corner {
  position: sticky;
  left: 0;
  z-index: 4;
  padding: 15px 16px !important;
  background: #f3f4f6 !important;
}

.role-task-corner span,
.role-task-corner strong,
.role-task-head span,
.role-task-head strong {
  display: block;
}

.role-task-corner span,
.role-task-head span {
  margin-bottom: 4px;
  color: #9edaff;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.role-task-corner span {
  color: var(--blue);
}

.role-task-corner strong {
  color: var(--ink);
  font-size: 15px;
}

.role-task-head {
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 14px 16px;
  color: #fff;
}

.role-task-matrix thead th:nth-child(2) .role-task-head {
  background: linear-gradient(135deg, #35315f, #7567df);
}

.role-task-head.is-primary {
  background: linear-gradient(135deg, #0068c9, #4aafe8);
}

.role-task-matrix thead th:nth-child(4) .role-task-head {
  background: linear-gradient(135deg, #176b45, #59b987);
}

.role-task-head span {
  color: rgba(255, 255, 255, 0.72);
}

.role-task-head strong {
  font-size: 14px;
}

.role-task-matrix tbody th {
  position: sticky;
  left: 0;
  z-index: 2;
  padding: 13px 16px;
  background: #f3f4f6;
}

.role-task-matrix tbody th span,
.role-task-matrix tbody th strong {
  display: block;
}

.role-task-matrix tbody th span {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
}

.role-task-matrix tbody th strong {
  font-size: 13px;
}

.role-task-matrix td {
  height: 58px;
  padding: 12px 16px;
  color: #4a4a50;
  font-size: 12px;
  line-height: 1.55;
}

.role-task-matrix td.is-active {
  color: var(--ink);
  font-weight: 650;
}

.role-task-matrix td:nth-child(2).is-active {
  background: #f2f0ff;
  box-shadow: inset 0 3px 0 rgba(94, 92, 230, 0.32);
}

.role-task-matrix td:nth-child(3).is-active {
  background: #eef7ff;
  box-shadow: inset 0 3px 0 rgba(0, 113, 227, 0.3);
}

.role-task-matrix td:nth-child(4).is-active {
  background: #eef9f2;
  box-shadow: inset 0 3px 0 rgba(47, 156, 92, 0.3);
}

.role-task-empty {
  color: #c7c7cc;
  font-size: 17px;
}

.proficiency-task-section {
  margin-top: 28px;
}

.proficiency-task-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.proficiency-task-card {
  --task-color: #5e5ce6;
  --task-soft: #f2f0ff;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.proficiency-task-card:nth-child(2) {
  --task-color: #0071e3;
  --task-soft: #eef7ff;
}

.proficiency-task-card:nth-child(3) {
  --task-color: #278653;
  --task-soft: #eef9f2;
}

.proficiency-task-card header {
  min-height: 112px;
  padding: 18px 20px;
  background: linear-gradient(135deg, #35315f, #7567df);
  color: #fff;
}

.proficiency-task-card:nth-child(2) header {
  background: linear-gradient(135deg, #0068c9, #4aafe8);
}

.proficiency-task-card:nth-child(3) header {
  background: linear-gradient(135deg, #176b45, #59b987);
}

.proficiency-task-card header span,
.proficiency-task-card header small {
  display: block;
}

.proficiency-task-card header span {
  color: rgba(255, 255, 255, 0.74);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.proficiency-task-card header h4 {
  margin: 12px 0 3px;
  color: #fff;
  font-size: 19px;
}

.proficiency-task-card header small {
  color: rgba(255, 255, 255, 0.68);
  font-size: 11px;
}

.proficiency-task-card dl {
  margin: 0;
  padding: 4px 20px 8px;
}

.proficiency-task-card dl > div {
  padding: 13px 0;
  border-top: 1px solid var(--soft-line);
}

.proficiency-task-card dl > div:first-child {
  border-top: 0;
}

.proficiency-task-card dl > div:last-child {
  margin: 0 -20px -8px;
  padding: 13px 20px 16px;
  background: var(--task-soft);
}

.proficiency-task-card dt {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.proficiency-task-card dd {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.55;
}

.proficiency-task-card dl > div:last-child dd {
  color: var(--task-color);
  font-weight: 650;
}

.insight-translation {
  display: grid;
  grid-template-columns: minmax(150px, 0.7fr) 38px minmax(270px, 1.2fr) 38px minmax(300px, 1.35fr);
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.translation-input,
.translation-lens,
.translation-output {
  min-width: 0;
  padding: 20px 22px;
}

.translation-input {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #eef6ff;
}

.translation-input b,
.translation-input strong {
  display: block;
}

.translation-input b {
  color: var(--blue);
  font-size: 32px;
  line-height: 1;
}

.translation-input strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 15px;
}

.translation-input p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.translation-lens > strong {
  display: block;
  color: var(--ink);
  font-size: 17px;
}

.translation-lens dl {
  margin: 12px 0 0;
}

.translation-lens dl > div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid var(--soft-line);
}

.translation-lens dt {
  color: var(--muted);
  font-size: 11px;
}

.translation-lens dd {
  margin: 0;
  color: #4a4a50;
  font-size: 12px;
  line-height: 1.45;
}

.translation-output ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.translation-output li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 8px 0;
  border-top: 1px solid var(--soft-line);
}

.translation-output li:first-child {
  border-top: 0;
}

.translation-output li > b {
  color: var(--blue);
  font-size: 10px;
}

.translation-output strong,
.translation-output small {
  display: block;
}

.translation-output strong {
  color: var(--ink);
  font-size: 13px;
}

.translation-output small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.hrm-page #solutions .section-head {
  margin-bottom: 36px;
}

.solution-roadmap {
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.solution-roadmap article {
  display: grid;
  grid-template-columns: 42px minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  padding: 20px 4px;
  border-top: 1px solid var(--line);
}

.solution-roadmap article:first-child {
  border-top: 0;
}

.solution-roadmap article > b {
  color: var(--blue);
  font-size: 18px;
  font-weight: 750;
}

.solution-roadmap article > div {
  min-width: 0;
}

.solution-roadmap span,
.solution-action-grid span,
.task-principle-strip span,
.system-rollout span,
.system-decision > div > span,
.system-path-list span,
.visual-specimen > span {
  display: block;
  margin-bottom: 7px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.solution-roadmap strong {
  display: block;
  color: #4a4a50;
  font-size: 13px;
  line-height: 1.6;
}

.solution-roadmap h3 {
  margin: 0 0 4px;
  color: var(--ink);
  font-size: 19px;
}

.solution-roadmap p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.hrm-page #solutions .solution-section {
  margin-top: 72px;
  padding-top: 30px;
}

.hrm-page #solutions .solution-section:first-of-type {
  border-top: 0;
}

.solution-heading {
  max-width: 860px;
  margin: 0 0 28px;
}

.solution-heading h2 {
  max-width: 820px;
  margin: 8px 0 14px;
  font-size: clamp(32px, 3.4vw, 40px);
  line-height: 1.32;
}

.solution-heading p {
  max-width: 800px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.75;
}

.solution-action-grid,
.task-principle-strip,
.visual-language-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.solution-action-grid article,
.task-principle-strip > div {
  min-width: 0;
  padding: 20px;
  border-left: 1px solid var(--line);
}

.solution-action-grid article:first-child,
.task-principle-strip > div:first-child {
  border-left: 0;
}

.solution-action-grid h3 {
  margin: 0 0 9px;
  font-size: 18px;
}

.solution-action-grid p,
.task-principle-strip p,
.system-path-list p,
.visual-specimen p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.solution-action-grid article > b {
  display: block;
  margin-top: 16px;
  padding-top: 13px;
  border-top: 1px solid var(--soft-line);
  color: #4a4a50;
  font-size: 12px;
  line-height: 1.55;
}

.solution-evidence-grid {
  display: grid;
  gap: 18px;
}

.solution-evidence-grid {
  margin-top: 22px;
}

.solution-evidence-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.solution-evidence-grid-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.solution-proof,
.system-proof-figure,
.solution-final-figure {
  min-width: 0;
  margin: 0;
}

.solution-proof img,
.system-proof-figure img,
.solution-final-figure img {
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background: #f4f6f9;
}

.solution-proof img {
  border-radius: 12px;
}

.solution-proof figcaption,
.solution-final-figure figcaption {
  display: grid;
  gap: 3px;
  max-width: none;
  margin: 12px 4px 0;
  text-align: left;
}

.solution-proof figcaption strong,
.solution-final-figure figcaption strong {
  color: var(--ink);
  font-size: 13px;
}

.solution-proof figcaption span,
.solution-final-figure figcaption span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.task-principle-strip {
  margin-bottom: 22px;
  background: #f7f9fc;
}

.task-principle-strip strong {
  display: block;
  margin-bottom: 7px;
  color: var(--ink);
  font-size: 17px;
}

.hrm-process-figure {
  max-width: none;
  margin: 0 0 22px;
}

.hrm-process-diagram {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.hrm-diagram-heading {
  min-width: 920px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 19px 22px;
  border-bottom: 1px solid var(--line);
  background: #f3f4f6;
}

.hrm-diagram-heading > div span,
.hrm-diagram-heading > div strong {
  display: block;
}

.hrm-diagram-heading > div span {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.hrm-diagram-heading > div strong {
  font-size: 18px;
}

.hrm-diagram-heading > small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  text-align: right;
}

.hrm-swimlane-grid {
  min-width: 920px;
}

.hrm-swimlane-stages,
.hrm-swimlane-row {
  display: grid;
  grid-template-columns: 160px repeat(5, minmax(0, 1fr));
}

.hrm-swimlane-stages {
  min-height: 68px;
  background: #202329;
  color: #fff;
}

.hrm-swimlane-stages > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 12px 13px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.hrm-swimlane-stages .hrm-stage-corner {
  border-left: 0;
  color: rgba(255, 255, 255, 0.6);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.hrm-swimlane-stages span {
  margin-bottom: 4px;
  color: #9edaff;
  font-size: 9px;
  font-weight: 750;
}

.hrm-swimlane-stages strong {
  font-size: 11px;
  line-height: 1.35;
}

.hrm-swimlane-row {
  border-bottom: 1px solid var(--line);
}

.hrm-swimlane-row:last-child {
  border-bottom: 0;
}

.hrm-lane-owner {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 15px 14px;
  border-right: 1px solid var(--line);
}

.hrm-lane-owner > span {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
  color: var(--blue);
  font-size: 10px;
  font-weight: 800;
}

.hrm-lane-owner strong,
.hrm-lane-owner small {
  display: block;
}

.hrm-lane-owner strong {
  color: var(--ink);
  font-size: 12px;
}

.hrm-lane-owner small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.admin-lane .hrm-lane-owner {
  background: #f1efff;
}

.recruiter-lane .hrm-lane-owner {
  background: #eaf4ff;
}

.department-lane .hrm-lane-owner {
  background: #eef9f2;
}

.system-lane .hrm-lane-owner {
  background: #f1f1f4;
}

.admin-lane .hrm-lane-owner > span {
  color: #5e5ce6;
}

.recruiter-lane .hrm-lane-owner > span {
  color: #0071e3;
}

.department-lane .hrm-lane-owner > span {
  color: #278653;
}

.system-lane .hrm-lane-owner > span {
  color: #6e6e73;
}

.hrm-lane-cell {
  min-width: 0;
  min-height: 102px;
  padding: 15px 13px;
  border-right: 1px solid var(--line);
  background: #fbfbfc;
}

.hrm-lane-cell:last-child {
  border-right: 0;
}

.hrm-lane-cell.is-active {
  position: relative;
  background: #f4f9ff;
}

.hrm-lane-cell.is-active::before {
  content: "";
  position: absolute;
  top: 0;
  right: 13px;
  left: 13px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: rgba(0, 113, 227, 0.35);
}

.admin-lane .hrm-lane-cell.is-active {
  background: #f6f4ff;
}

.admin-lane .hrm-lane-cell.is-active::before {
  background: rgba(94, 92, 230, 0.38);
}

.recruiter-lane .hrm-lane-cell.is-active {
  background: #f1f8ff;
}

.department-lane .hrm-lane-cell.is-active {
  background: #f2fbf5;
}

.department-lane .hrm-lane-cell.is-active::before {
  background: rgba(39, 134, 83, 0.38);
}

.system-lane .hrm-lane-cell.is-active {
  background: #f3f3f6;
}

.system-lane .hrm-lane-cell.is-active::before {
  background: rgba(110, 110, 115, 0.38);
}

.hrm-lane-cell.is-empty {
  background: #f8f8fa;
}

.hrm-lane-cell strong,
.hrm-lane-cell small {
  display: block;
}

.hrm-lane-cell strong {
  margin-top: 4px;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.hrm-lane-cell small {
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.hrm-process-figure figcaption {
  max-width: none;
  margin: 12px 4px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.65;
  text-align: left;
}

.system-rollout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.system-rollout > div {
  min-width: 0;
  padding: 20px 18px;
}

.system-rollout > div:last-child {
  background: #f2f7ff;
}

.system-rollout > i {
  display: grid;
  place-items: center;
  color: #8e8e93;
  font-size: 14px;
  font-style: normal;
}

.system-rollout strong,
.system-rollout small {
  display: block;
}

.system-rollout strong {
  color: var(--ink);
  font-size: 17px;
}

.system-rollout small {
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.system-decision {
  display: grid;
  grid-template-columns: minmax(240px, 0.68fr) minmax(0, 1.32fr);
  align-items: center;
  gap: 18px;
  margin: 18px 0 24px;
  padding: 15px 0;
  border-left: 3px solid var(--blue);
  background: #f7f8fa;
}

.system-decision > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding-left: 18px;
}

.system-decision > div > span {
  margin: 0;
  white-space: nowrap;
}

.system-decision > div > strong {
  color: var(--ink);
  font-size: 14px;
}

.system-decision > p {
  margin: 0;
  padding-right: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
  text-align: left;
}

.system-evidence-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.68fr) minmax(0, 1.32fr);
  align-items: stretch;
  gap: 18px;
}

.system-path-list {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.system-path-list article {
  padding: 20px;
  border-top: 1px solid var(--line);
}

.system-path-list article:first-child {
  border-top: 0;
}

.system-path-list h3,
.visual-specimen h3 {
  margin: 0 0 8px;
  font-size: 18px;
}

.system-proof-figure img {
  height: 100%;
  min-height: 320px;
  box-shadow: none;
}

.system-proof-figure figcaption {
  max-width: none;
  text-align: left;
}

.visual-language-board {
  color: #f5f7fa;
  background: #171a20;
  border-color: #292e38;
}

.visual-specimen {
  min-width: 0;
  padding: 22px;
  border-left: 1px solid #303641;
}

.visual-specimen:first-child {
  border-left: 0;
}

.visual-specimen h3 {
  color: #f5f7fa;
}

.visual-specimen p {
  color: #aeb5c0;
}

.visual-palette > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin: 22px 0 18px;
}

.visual-palette i {
  height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9px;
}

.visual-palette .swatch-blue {
  background: #0071e3;
}

.visual-palette .swatch-gray {
  background: #e9edf2;
}

.visual-palette .swatch-warm {
  background: #fbfaf7;
}

.visual-palette .swatch-ink {
  background: #3a3d44;
}

.visual-type > div {
  display: grid;
  gap: 8px;
  margin-top: 20px;
}

.visual-type strong,
.visual-type b,
.visual-type em,
.visual-type small {
  display: block;
  color: #f5f7fa;
  font-style: normal;
}

.visual-type strong {
  font-size: 23px;
  line-height: 1.2;
}

.visual-type b {
  font-size: 17px;
}

.visual-type em {
  color: #c8cdd5;
  font-size: 13px;
}

.visual-type small {
  color: #8f98a6;
  font-size: 11px;
}

.visual-feedback > div {
  display: grid;
  gap: 9px;
  margin-top: 18px;
}

.visual-feedback p {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid #303641;
  border-radius: 10px;
  background: #20242c;
}

.visual-feedback p > i {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(0, 113, 227, 0.2);
  box-shadow: inset 0 0 0 1px rgba(87, 168, 255, 0.32);
}

.visual-feedback p span,
.visual-feedback p strong,
.visual-feedback p small {
  display: block;
}

.visual-feedback p strong {
  color: #f5f7fa;
  font-size: 12px;
}

.visual-feedback p small {
  margin-top: 2px;
  color: #98a1ad;
  font-size: 10px;
}

.solution-final-figure {
  margin-top: 22px;
}

.result-grid-hrm {
  margin-bottom: 30px;
}

.result-grid-hrm .result {
  min-height: 130px;
}

.result-grid-hrm .result b {
  font-size: 27px;
}

.result-grid-hrm .result span {
  line-height: 1.7;
}

.hrm-page #results > .shell > .section-head {
  max-width: 860px;
  margin: 64px 0 48px;
}

.hrm-page #results > .shell > .section-head h2 {
  font-size: clamp(38px, 4.2vw, 52px);
}

.hrm-page #results > .shell > .section-head p {
  font-size: 18px;
}

.hrm-page #results .compact-head {
  margin-bottom: 26px;
}

.hrm-page #results .compact-head h2 {
  font-size: 32px;
  line-height: 1.35;
}

.result-summary,
.result-trace-section {
  margin-top: 72px;
}

.hrm-page #results .result-section {
  margin-top: 48px;
}

.result-summary:first-of-type {
  margin-top: 0;
}

.result-ledger {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.result-ledger > article {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  align-items: start;
  gap: 28px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
}

.result-ledger > article:first-child {
  border-top: 0;
}

.result-ledger header {
  min-width: 0;
}

.result-ledger header span,
.result-delivery-path article > span,
.result-source-heading span {
  display: block;
  margin-bottom: 7px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.result-ledger header h3 {
  margin: 0 0 6px;
  font-size: 20px;
}

.result-ledger header p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.result-ledger dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
}

.result-ledger > article:nth-child(2) dl {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.result-ledger dl > div {
  min-width: 0;
  padding: 2px 18px;
  border-left: 1px solid var(--line);
}

.result-ledger dl > div:first-child {
  padding-left: 0;
  border-left: 0;
}

.result-ledger dt {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.result-ledger dd {
  margin: 0;
}

.result-ledger dd strong,
.result-ledger dd small {
  display: block;
}

.result-ledger dd strong {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.4;
}

.result-ledger dd small {
  margin-top: 4px;
  color: var(--blue);
  font-size: 11px;
  line-height: 1.4;
}

.result-source-detail {
  margin-top: 28px;
}

.result-source-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 13px;
}

.result-source-heading h3,
.result-source-heading p {
  margin: 0;
}

.result-source-heading h3 {
  font-size: 20px;
}

.result-source-heading p {
  color: var(--muted);
  font-size: 11px;
}

.result-source-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.result-source-table-wrap:focus-visible {
  outline: 2px solid rgba(0, 113, 227, 0.45);
  outline-offset: 3px;
}

.result-source-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.result-source-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.result-source-metric-column {
  width: 31%;
}

.result-source-period-column {
  width: 21%;
}

.result-source-table th,
.result-source-table td {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

.result-source-table tr > *:last-child {
  border-right: 0;
}

.result-source-table tbody tr:last-child > * {
  border-bottom: 0;
}

.result-source-table thead th {
  padding: 10px 16px;
  background: #edf5ff;
  color: #176fbd;
  font-size: 11px;
  font-weight: 700;
}

.result-source-table tbody th,
.result-source-table tbody td {
  padding: 11px 16px;
  color: #4a4a50;
  font-size: 12px;
  line-height: 1.5;
}

.result-source-table tbody th {
  background: #fafbfc;
  color: var(--ink);
  font-weight: 650;
}

.result-source-table small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.5;
}

.result-source-boundary {
  margin: 13px 2px 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.7;
}

.result-source-boundary strong {
  color: var(--ink);
}

.strategy-result-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.strategy-result-table-wrap:focus-visible {
  outline: 2px solid rgba(0, 113, 227, 0.45);
  outline-offset: 3px;
}

.strategy-result-table {
  width: 100%;
  min-width: 900px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.strategy-result-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.strategy-result-column {
  width: 184px;
}

.strategy-result-table th,
.strategy-result-table td {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.strategy-result-table tr > *:last-child {
  border-right: 0;
}

.strategy-result-table tbody tr:last-child > * {
  border-bottom: 0;
}

.strategy-result-table thead th {
  padding: 13px 16px;
  background: #f3f4f6;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.08em;
}

.strategy-result-table tbody th {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 0;
  padding: 18px 16px;
  background: #f7f8fa;
  box-shadow: inset 4px 0 0 var(--strategy-color);
}

.strategy-result-table tbody th span,
.strategy-result-table tbody th strong,
.strategy-result-table tbody th small {
  display: block;
}

.strategy-result-table tbody th span {
  margin-bottom: 8px;
  color: var(--strategy-color);
  font-size: 11px;
  font-weight: 750;
}

.strategy-result-table tbody th strong {
  color: var(--ink);
  font-size: 14px;
  line-height: 1.45;
}

.strategy-result-table tbody th small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: 0.06em;
}

.strategy-result-table tbody td {
  padding: 18px 16px;
  color: #4a4a50;
  font-size: 12px;
  line-height: 1.65;
}

.strategy-result-table tbody td strong,
.strategy-result-table tbody td small {
  display: block;
}

.strategy-result-table tbody td strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.55;
}

.strategy-result-table tbody td small {
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.strategy-result-framework {
  --strategy-color: #5e5ce6;
}

.strategy-result-flow {
  --strategy-color: #0071e3;
}

.strategy-result-system {
  --strategy-color: #278653;
}

.strategy-result-visual {
  --strategy-color: #b86b00;
}

.result-delivery-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.result-delivery-path article {
  min-width: 0;
  padding: 18px 0 0;
  border-top: 2px solid rgba(0, 113, 227, 0.24);
}

.result-delivery-path h3 {
  margin: 0 0 13px;
  font-size: 20px;
}

.result-delivery-path ul {
  margin: 0;
  padding-left: 18px;
}

.result-delivery-path li {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}

.result-delivery-path li:last-child {
  margin-bottom: 0;
}

.reflection-section {
  padding-bottom: 34px;
}

.hrm-page #results .principles {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0;
}

@media (max-width: 980px) {
  .story-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .persona-logic {
    grid-template-columns: minmax(0, 1fr);
  }

  .result-ledger > article {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .result-ledger dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .result-ledger > article:nth-child(2) dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .result-delivery-path {
    grid-template-columns: minmax(0, 1fr);
  }

  .hrm-page #results .principles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .solution-roadmap article {
    grid-template-columns: 38px minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
  }

  .solution-roadmap article > div:last-child {
    grid-column: 2 / -1;
  }

  .solution-action-grid,
  .system-evidence-layout,
  .visual-language-board {
    grid-template-columns: minmax(0, 1fr);
  }

  .solution-action-grid article,
  .visual-specimen {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .solution-action-grid article:first-child,
  .visual-specimen:first-child {
    border-top: 0;
  }

  .visual-specimen {
    border-color: #303641;
  }

  .system-rollout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .system-rollout > i {
    display: none;
  }

  .system-rollout > div {
    border-top: 1px solid var(--line);
  }

  .system-rollout > div:nth-of-type(-n + 2) {
    border-top: 0;
  }

  .system-decision {
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
  }

  .system-proof-figure img {
    height: auto;
    min-height: 0;
  }

  .strategy-bridge {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-shift,
  .system-growth {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-shift > i,
  .system-growth > i {
    display: none;
  }

  .hrm-stage-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .research-route,
  .insight-translation {
    grid-template-columns: minmax(0, 1fr);
  }

  .research-route > i,
  .insight-translation > i {
    display: none;
  }

  .research-route-output,
  .translation-lens,
  .translation-output {
    border-top: 1px solid var(--line);
  }
}

@media (max-width: 640px) {
  .hrm-window-bar > span:last-child {
    display: none;
  }

  .hrm-mock-shell {
    grid-template-columns: 104px minmax(0, 1fr);
    min-height: 280px;
  }

  .hrm-mock-side {
    padding: 15px 8px;
  }

  .hrm-mock-brand {
    margin-bottom: 16px;
  }

  .hrm-mock-brand b {
    font-size: 9px;
  }

  .hrm-side-item {
    height: 25px;
    gap: 6px;
    padding: 0 6px;
    font-size: 8px;
  }

  .hrm-mock-main {
    padding: 15px 10px;
  }

  .hrm-main-head strong {
    font-size: 11px;
  }

  .hrm-main-head span,
  .hrm-avatar {
    display: none;
  }

  .hrm-metric-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    margin: 15px 0;
  }

  .hrm-metric-row > div {
    min-width: 0;
    padding: 7px;
  }

  .hrm-metric-row span {
    overflow: hidden;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hrm-metric-row b {
    font-size: 15px;
  }

  .hrm-metric-row em {
    font-size: 7px;
  }

  .hrm-stage-row {
    gap: 5px;
  }

  .hrm-stage-row > div {
    padding: 7px;
  }

  .hrm-stage-row b {
    font-size: 8px;
  }

  .hrm-stage-row strong {
    font-size: 12px;
  }

  .hrm-table-card {
    padding: 8px;
  }

  .hrm-table-line {
    gap: 5px;
  }

  .hrm-table-line small {
    display: none;
  }

  .story-card-grid,
  .story-card-grid.two,
  .persona-logic {
    grid-template-columns: minmax(0, 1fr);
  }

  .result-ledger dl,
  .result-ledger > article:nth-child(2) dl {
    grid-template-columns: minmax(0, 1fr);
  }

  .result-ledger dl > div {
    padding: 10px 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .result-ledger dl > div:first-child {
    padding-top: 0;
    border-top: 0;
  }

  .result-source-heading {
    align-items: start;
    flex-direction: column;
    gap: 4px;
  }

  .hrm-page #results .principles {
    grid-template-columns: minmax(0, 1fr);
  }

  .evidence-chain,
  .framework-rules {
    grid-template-columns: minmax(0, 1fr);
  }

  .evidence-chain > i {
    display: none;
  }

  .problem-distribution {
    padding: 15px 16px 14px;
  }

  .problem-distribution-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
  }

  .problem-distribution-legend > div {
    padding-right: 0;
  }

  .hrm-page #insights .compact-head,
  .hrm-page #results .compact-head {
    margin-bottom: 24px;
  }

  .research-route-sources,
  .work-context-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .research-route-sources article {
    border-right: 0;
    border-bottom: 0;
  }

  .research-route-sources article:first-child {
    grid-column: 1 / -1;
    border-bottom: 1px solid var(--line);
  }

  .research-route-sources article:nth-child(2) {
    border-right: 1px solid var(--line);
  }

  .research-route-output,
  .translation-input,
  .translation-lens,
  .translation-output {
    padding: 18px;
  }

  .axis-block-head {
    align-items: start;
    flex-direction: column;
    gap: 4px;
  }

  .proficiency-task-board {
    grid-template-columns: minmax(0, 1fr);
  }

  .translation-lens dl > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  .priority-method-head,
  .example-trace-head {
    align-items: start;
    flex-direction: column;
    gap: 4px;
  }

  .priority-method-head > p {
    margin-left: 0;
  }

  .priority-method-flow,
  .example-trace-flow {
    grid-template-columns: minmax(0, 1fr);
  }

  .priority-method-flow > i,
  .example-trace-flow > i {
    display: none;
  }

  .priority-method-flow > div,
  .example-trace-flow > div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .priority-method-flow > div:first-child,
  .example-trace-flow > div:first-child {
    border-top: 0;
  }

  .solution-section,
  .insight-section,
  .result-section {
    margin-top: 72px;
  }

  .solution-heading h2 {
    font-size: 30px;
  }

  .solution-heading p {
    font-size: 15px;
  }

  .hrm-page #results .compact-head h2 {
    font-size: 28px;
  }

  .solution-roadmap article {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 12px;
    padding: 18px 0;
  }

  .solution-roadmap article > b {
    grid-row: 1 / 4;
  }

  .solution-roadmap article > div,
  .solution-roadmap article > div:last-child {
    grid-column: 2;
  }

  .solution-action-grid,
  .task-principle-strip,
  .solution-evidence-grid-two,
  .solution-evidence-grid-three,
  .system-rollout {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-principle-strip > div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .task-principle-strip > div:first-child {
    border-top: 0;
  }

  .system-rollout > div,
  .system-rollout > div:nth-of-type(-n + 2) {
    border-top: 1px solid var(--line);
  }

  .system-rollout > div:first-of-type {
    border-top: 0;
  }

}

@media print {
  .hrm-page .hero-visual {
    padding: 0;
    background: #fff;
    box-shadow: none;
  }

  .hrm-window,
  .persona-logic article {
    box-shadow: none;
  }

  .research-route,
  .problem-distribution-insights,
  .priority-method,
  .work-context-strip,
  .role-task-matrix-wrap,
  .proficiency-task-card,
  .insight-translation,
  .example-trace,
  .solution-roadmap article,
  .solution-action-grid,
  .task-principle-strip,
  .hrm-process-diagram,
  .system-rollout,
  .system-decision,
  .system-evidence-layout,
  .visual-language-board,
  .solution-final-figure {
    break-inside: avoid;
  }

  .solution-section,
  .result-section {
    break-inside: avoid;
  }
}
