@font-face {
  font-family: "DIN Next LT Arabic";
  src: url("../fonts/DINNextLTArabic-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root{
  --blue:#00416B;--deep:#002343;--green:#00C08B;--green-dark:#008661;--white:#fff;
  --text:#2F3B3E;--text2:#4D5858;--muted:#6C787A;--line:#D4DEE0;--line-strong:#B8C6C9;
  --soft:#F7FAFA;--blue-soft:#EAF1F5;--success-soft:#E6F9F4;--error:#D02C2F;--error-soft:#FBEAEA;--warn:#A46600;--warn-soft:#FFF4DB;
  --label:14px;--body:16px;--subtitle:20px;--heading:24px;--display:32px;
  --font:"DIN Next LT Arabic","DIN Next","DINNextLTArabic","Helvetica Neue",Arial,sans-serif;
  --radius:16px;--btn-radius:12px;--shadow:0 18px 52px rgba(0,35,67,.22)
}
*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;font-family:var(--font);color:var(--text);background:#fff;-webkit-font-smoothing:antialiased}body{overflow:hidden}button{font:inherit}h1,h2,h3,h4,p{margin:0}.screen{width:100%;height:100%;min-height:680px;padding:6px;background:#fff}.frame{width:100%;height:100%;min-height:668px;border:1px solid var(--line);border-radius:16px;background:var(--soft);overflow:hidden}.btn{height:48px;min-width:118px;padding:0 20px;border-radius:var(--btn-radius);border:1px solid transparent;font-size:var(--body);font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;white-space:nowrap}.btn.primary{background:var(--green);color:#fff}.btn.primary:hover{background:var(--green-dark)}.btn.secondary{background:#fff;color:var(--blue);border-color:var(--blue)}.btn.secondary:hover{background:var(--blue-soft)}.btn:disabled{background:#F2F5F5!important;color:#97A4A6!important;border-color:#DCE4E6!important;cursor:not-allowed}.btn:focus-visible,.option-card:focus-visible,.matrix-choice:focus-visible,.case-card:focus-visible,.scene-tab:focus-visible{outline:3px solid rgba(0,192,139,.24);outline-offset:2px}

/* locked start */
.start{display:grid;grid-template-columns:minmax(420px,48%) minmax(0,52%);height:100%;background:#fff}.start-copy{padding:56px 48px 56px 56px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:16px}.start h1{font-size:var(--display);line-height:1.18;color:var(--blue);font-weight:700;max-width:590px}.start p{font-size:var(--body);line-height:1.5;color:var(--text2);max-width:570px}.start .btn{margin-top:8px}.start-art{display:flex;align-items:center;justify-content:center;padding:40px 48px 40px 8px;background:#fff;overflow:hidden}.start-art img{display:block;width:min(92%,780px);height:auto;object-fit:contain}

/* locked instructions */
.instructions{display:grid;grid-template-rows:minmax(0,1fr) 80px;height:100%}.instructions-main{padding:40px 48px 24px;display:flex;align-items:center;justify-content:center;min-height:0}.instructions-wrap{width:min(1180px,100%)}.instructions h1{font-size:var(--display);line-height:1.18;color:var(--blue);font-weight:700}.instructions-intro{font-size:var(--body);line-height:1.5;color:var(--text2);margin-top:12px;margin-bottom:24px;max-width:940px}.instruction-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.instruction-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;min-height:220px;display:flex;flex-direction:column;gap:14px}.instruction-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:var(--blue)}.instruction-icon svg{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:2.15;stroke-linecap:round;stroke-linejoin:round}.instruction-icon .accent{stroke:var(--green)}.instruction-card h2{font-size:var(--subtitle);line-height:1.18;color:var(--deep);font-weight:700}.instruction-card p{font-size:var(--body);line-height:1.5;color:var(--text2)}.instruction-note{margin-top:16px;border-left:4px solid var(--green);background:#fff;padding:14px 16px;border-radius:0 12px 12px 0;font-size:var(--body);line-height:1.5}.static-action{border-top:1px solid var(--line);background:#fff;padding:16px 24px;display:flex;justify-content:flex-end;align-items:center}

/* shared activity shell */
.activity{height:100%;display:grid;grid-template-rows:82px minmax(0,1fr) 76px;background:var(--soft)}.header{padding:14px 24px;border-bottom:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px}.header-copy{min-width:0}.header-copy h1{font-size:var(--heading);line-height:1.18;color:var(--blue);font-weight:700}.header-copy p{font-size:var(--label);line-height:1.35;color:var(--muted);margin-top:5px}.progress{display:flex;align-items:center;gap:12px;flex:0 0 auto}.progress strong{font-size:var(--label);line-height:1.35;color:var(--text2);font-weight:500}.progress-track{width:180px;height:8px;background:var(--line);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:var(--green);border-radius:999px;transition:width .2s ease}.content{min-height:0;padding:14px 12px;background:var(--soft);overflow:hidden}.rail{border-top:1px solid var(--line);background:#fff;padding:14px 18px;display:grid;grid-template-columns:1fr minmax(0,auto) 1fr;align-items:center;gap:16px}.rail-left{justify-self:start}.rail-note{justify-self:center;text-align:center;font-size:var(--label);line-height:1.35;color:var(--muted)}.rail-right{justify-self:end}

/* dashboard */
.dashboard{width:min(1420px,100%);height:100%;margin:0 auto;display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}.dashboard-intro{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:2px 4px}.dashboard-intro h2{font-size:var(--subtitle);line-height:1.2;color:var(--blue)}.dashboard-intro p{font-size:var(--body);line-height:1.5;color:var(--text2);margin-top:5px}.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-height:0}.case-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:16px;align-items:center;min-height:0}.case-card.completed{border-color:#A8DDCE;background:#FCFFFE}.case-portrait{width:92px;height:92px;border-radius:50%;overflow:hidden;border:3px solid var(--blue-soft);background:#fff}.case-portrait img{width:100%;height:100%;object-fit:cover}.case-main h3{font-size:var(--subtitle);line-height:1.2;color:var(--blue);font-weight:700}.case-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.chip{font-size:var(--label);line-height:1.3;color:var(--text2);background:#F4F7F7;padding:5px 9px;border-radius:999px}.case-setting{font-size:var(--body);line-height:1.45;color:var(--text2);margin-top:10px;max-width:640px}.case-side{display:flex;flex-direction:column;align-items:flex-end;gap:14px}.status{font-size:var(--label);font-weight:700;border-radius:999px;padding:6px 10px;background:#F2F5F5;color:var(--muted)}.status.done{background:var(--success-soft);color:var(--green-dark);border:1px solid #A7DECD}.case-card .btn{min-width:148px}

/* encounter evidence */
.evidence{width:min(1420px,100%);height:100%;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr)}.evidence-top{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}.trainee-id{display:flex;align-items:center;gap:12px;min-width:0}.mini-portrait{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid var(--blue-soft);flex:0 0 48px}.mini-portrait img{width:100%;height:100%;object-fit:cover}.trainee-id h2{font-size:var(--subtitle);line-height:1.2;color:var(--blue)}.trainee-id p{font-size:var(--label);line-height:1.35;color:var(--muted);margin-top:3px}.scene-tabs{display:flex;gap:8px}.scene-tab{height:40px;min-width:40px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text2);font-size:var(--label);font-weight:700;cursor:pointer}.scene-tab.active{border-color:var(--blue);background:var(--blue-soft);color:var(--blue)}.scene-tab.done{border-color:#A7DECD;color:var(--green-dark)}.scene-body{min-height:0;display:grid;grid-template-columns:minmax(360px,42%) minmax(0,58%);gap:0}.scene-image{min-height:0;background:#EEF4F6;overflow:hidden}.scene-image img{width:100%;height:100%;display:block;object-fit:cover}.scene-copy{padding:28px 30px;display:flex;flex-direction:column;justify-content:center}.scene-kicker{font-size:var(--label);line-height:1.35;color:var(--green-dark);font-weight:700;text-transform:uppercase}.scene-copy h3{font-size:var(--heading);line-height:1.2;color:var(--blue);margin-top:6px}.scene-copy p{font-size:var(--body);line-height:1.55;color:var(--text);margin-top:16px;max-width:760px}.scene-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px}.scene-context div{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:10px 12px}.scene-context b{display:block;font-size:var(--label);color:var(--blue);margin-bottom:3px}.scene-context span{font-size:var(--body);line-height:1.4;color:var(--text2)}

/* questions */
.question-wrap{width:min(1420px,100%);height:100%;margin:0 auto;display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}.case-strip{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px}.case-strip-id{display:flex;align-items:center;gap:10px}.case-strip-id img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:2px solid var(--blue-soft)}.case-strip h2{font-size:var(--subtitle);line-height:1.2;color:var(--blue)}.case-strip p{font-size:var(--label);line-height:1.35;color:var(--muted);margin-top:3px}.stage-label{font-size:var(--label);font-weight:700;color:var(--green-dark);background:var(--success-soft);padding:7px 10px;border-radius:999px;white-space:nowrap}.task-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 20px;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px}.task-card h3{font-size:var(--subtitle);line-height:1.25;color:var(--blue);font-weight:700}.task-card .task-help{font-size:var(--body);line-height:1.45;color:var(--text2);margin-top:5px}.options-grid{display:grid;gap:12px;min-height:0}.options-grid.four{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.options-grid.five{grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch}.option-card{width:100%;border:1.5px solid var(--line-strong);border-radius:16px;background:#fff;padding:16px;text-align:left;cursor:pointer;display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;align-items:center;color:var(--text);transition:border-color .15s,background .15s;min-width:0}.option-card:hover{border-color:#8FA6AC}.option-card.selected{border-color:var(--green);background:var(--success-soft)}.radio{width:26px;height:26px;border:2px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;background:#fff;flex:0 0 26px}.selected .radio{border-color:var(--green)}.selected .radio:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--green)}.option-card strong{font-size:var(--body);line-height:1.4;color:var(--deep);font-weight:700}.option-card small{display:block;font-size:var(--label);line-height:1.42;color:var(--text2);margin-top:6px}.options-grid.five .option-card{grid-template-columns:26px minmax(0,1fr);padding:14px 12px;align-content:center}.options-grid.five .option-card strong{font-size:var(--body)}

/* criteria matrix */
.matrix{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;align-self:stretch}.matrix-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(130px,.7fr) minmax(130px,.7fr);min-height:62px;border-top:1px solid var(--line)}.matrix-row:first-child{border-top:0}.matrix-head{background:var(--blue-soft);min-height:50px}.matrix-cell{padding:10px 14px;display:flex;align-items:center;border-left:1px solid var(--line)}.matrix-cell:first-child{border-left:0}.matrix-head .matrix-cell{justify-content:center;font-size:var(--label);line-height:1.3;color:var(--blue);font-weight:700;text-align:center}.matrix-head .matrix-cell:first-child{justify-content:flex-start}.criterion{font-size:var(--body);line-height:1.4;color:var(--text)}.matrix-choice{width:100%;height:100%;min-height:44px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;color:var(--text2);font-size:var(--body);font-weight:600}.matrix-choice .radio{width:24px;height:24px;flex-basis:24px}.matrix-choice.selected{color:var(--green-dark)}.matrix-choice.selected .radio{border-color:var(--green)}.matrix-choice.selected .radio:after{content:"";width:9px;height:9px;border-radius:50%;background:var(--green)}

/* feedback locked */
.feedback-overlay{position:absolute;inset:0;background:rgba(0,35,67,.32);z-index:50;display:flex;align-items:center;justify-content:center;padding:24px}.feedback-card{width:min(680px,calc(100% - 48px));max-height:calc(100% - 48px);background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:28px 32px 24px;display:grid;grid-template-rows:auto minmax(0,auto) auto;gap:18px;overflow:hidden}.feedback-status{text-align:center}.feedback-icon{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px}.feedback-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}.feedback-card.correct .feedback-icon{background:var(--success-soft);color:var(--green-dark)}.feedback-card.incorrect .feedback-icon{background:var(--error-soft);color:var(--error)}.feedback-card.partial .feedback-icon{background:var(--warn-soft);color:var(--warn)}.feedback-status h2{font-size:var(--heading);line-height:1.2;font-weight:700}.feedback-card.correct h2{color:var(--green-dark)}.feedback-card.incorrect h2{color:var(--error)}.feedback-card.partial h2{color:var(--warn)}.feedback-body{min-height:0;overflow:auto}.feedback-body p{font-size:var(--body);line-height:1.5;color:var(--text);text-align:left;direction:ltr}.feedback-actions{display:flex;justify-content:center}

/* summary */
.summary{height:100%;display:grid;grid-template-rows:minmax(0,1fr) 80px}.summary-main{padding:38px 48px 24px;overflow:auto}.summary-wrap{width:min(1180px,100%);margin:0 auto}.summary h1{font-size:var(--display);line-height:1.18;color:var(--blue)}.summary-intro{font-size:var(--body);line-height:1.5;color:var(--text2);margin-top:10px;max-width:840px}.summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}.summary-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:16px;padding:16px 18px}.summary-person{display:flex;align-items:center;gap:10px}.summary-person img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:2px solid var(--blue-soft)}.summary-person h2{font-size:var(--subtitle);line-height:1.2;color:var(--blue)}.summary-card .summary-detail{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:14px;font-size:var(--body);line-height:1.4}.summary-detail span{color:var(--text2)}.summary-detail strong{color:var(--deep);text-align:right}.takeaway{margin-top:16px;border-left:4px solid var(--green);padding:12px 16px;font-size:var(--body);line-height:1.5}.takeaway strong{color:var(--blue)}

/* completion */
.complete{height:100%;display:flex;align-items:center;justify-content:center;padding:32px;background:#F1FAF7}.complete-card{width:min(760px,100%);background:#fff;border-radius:24px;padding:42px 34px;text-align:center;border:1px solid #DDECE7}.complete-mark{width:76px;height:76px;border-radius:50%;background:var(--success-soft);color:var(--green-dark);display:grid;place-items:center;margin:0 auto 18px}.complete-mark svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.complete-card h1{font-size:var(--display);line-height:1.18;color:var(--blue)}.complete-card p{font-size:var(--body);line-height:1.5;color:var(--text2);margin:12px auto 0;max-width:580px}

@media(max-width:1200px){.start-copy{padding:48px 38px 48px 42px}.instructions-main{padding:32px 32px 20px}.header{padding:12px 20px}.progress-track{width:150px}.content{padding:12px 10px}.case-card{grid-template-columns:80px minmax(0,1fr) auto}.case-portrait{width:80px;height:80px}.scene-copy{padding:22px 24px}.options-grid.five{gap:8px}.options-grid.five .option-card{padding:12px 10px}.options-grid.five .option-card small{font-size:var(--label)}}
@media(max-width:900px){body{overflow:auto}#app{height:auto;min-height:680px}.screen{height:auto;min-height:680px;padding:0}.frame{border-radius:0;border-left:0;border-right:0;min-height:680px}.start{grid-template-columns:1fr;min-height:680px}.start-art{min-height:260px;padding:18px}.instructions{min-height:680px}.activity{min-height:680px;grid-template-rows:auto minmax(0,1fr) auto}.header{align-items:flex-start}.header-copy p{display:none}.content{overflow:auto}.case-grid{grid-template-columns:1fr}.case-card{min-height:132px}.scene-body{grid-template-columns:1fr;grid-template-rows:300px auto}.scene-context{grid-template-columns:repeat(2,minmax(0,1fr))}.question-wrap{height:auto;min-height:100%}.options-grid.five{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(112px,auto)}.options-grid.five .option-card:nth-child(4),.options-grid.five .option-card:nth-child(5){grid-column:auto}.task-card{min-height:420px}.matrix-row{grid-template-columns:minmax(0,1.45fr) minmax(115px,.72fr) minmax(115px,.72fr)}.rail{position:sticky;bottom:0;z-index:10}.summary-main{padding:32px 32px 22px}}
@media(max-width:700px){:root{--subtitle:18px;--heading:22px;--display:28px}.start-copy{padding:34px 20px 22px}.start-art{padding:12px 18px 24px}.instructions{grid-template-rows:auto auto}.instructions-main{padding:28px 18px 20px;align-items:flex-start}.instruction-grid{grid-template-columns:1fr}.instruction-card{min-height:0;padding:18px;display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:14px;row-gap:4px}.instruction-card .instruction-icon{grid-row:1/4}.instruction-card h2,.instruction-card p{grid-column:2}.static-action{position:sticky;bottom:0;z-index:10}.static-action .btn{width:100%}.header{padding:14px 16px;flex-wrap:wrap;gap:10px}.header-copy{width:100%}.progress{width:100%}.progress-track{flex:1;width:auto}.content{padding:12px 10px}.rail{grid-template-columns:1fr 1fr;padding:12px 14px;gap:10px}.rail-note{display:none}.rail-left,.rail-right{width:100%}.rail .btn{width:100%}.dashboard-intro{display:block}.case-card{grid-template-columns:64px minmax(0,1fr);padding:14px;gap:12px}.case-portrait{width:64px;height:64px}.case-side{grid-column:2;align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between}.case-side .btn{min-width:130px}.scene-body{grid-template-rows:240px auto}.scene-copy{padding:18px}.scene-context{grid-template-columns:1fr}.evidence-top{align-items:flex-start;flex-direction:column}.scene-tabs{width:100%}.scene-tab{flex:1}.case-strip{align-items:flex-start}.stage-label{display:none}.task-card{padding:16px;min-height:0}.options-grid.four{grid-template-columns:1fr;grid-template-rows:none}.options-grid.five{grid-template-columns:1fr;grid-auto-rows:auto}.option-card{min-height:68px}.matrix{overflow:auto}.matrix-row{min-width:620px}.feedback-overlay{position:fixed;padding:16px}.feedback-card{width:calc(100% - 16px);padding:22px 18px}.summary{grid-template-rows:auto auto;min-height:680px}.summary-main{padding:28px 18px 20px}.summary-grid{grid-template-columns:1fr}.static-action{padding:14px 18px}.summary .static-action .btn{width:100%}}
@media(max-width:480px){.case-meta{gap:6px}.chip{font-size:var(--label)}.case-setting{font-size:var(--body)}.scene-image{height:220px}.scene-body{display:block}.scene-copy{padding:16px}.matrix-row{min-width:560px}.feedback-card{max-height:calc(100vh - 24px)}.complete{min-height:680px;padding:24px 18px}.complete-card{padding:32px 24px}}

/* Narrow-layout matrix reflow: cardify instead of horizontal scrolling. */
@media(max-width:700px){
  .matrix{border:0;background:transparent;overflow:visible;display:grid;gap:10px}
  .matrix-head{display:none}
  .matrix-row:not(.matrix-head){min-width:0!important;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;min-height:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
  .matrix-row:not(.matrix-head) .matrix-cell{border-left:0;border-top:1px solid var(--line);padding:10px 12px;justify-content:center}
  .matrix-row:not(.matrix-head) .matrix-cell:first-child{grid-column:1/-1;border-top:0;justify-content:flex-start;background:var(--soft);font-weight:600}
  .matrix-row:not(.matrix-head) .matrix-cell:nth-child(3){border-left:1px solid var(--line)}
  .matrix-choice{min-height:48px}
}


/* rev1 — matrix comfort, original evidence-based terminology, partial-feedback reveal, summary hierarchy */
.criteria-task{padding:14px 18px 16px;gap:10px}
.criteria-task .task-help{margin-top:4px}
.matrix{align-self:start;border-radius:14px;overflow:hidden}
.matrix-row{grid-template-columns:minmax(0,1.52fr) minmax(210px,.74fr) minmax(230px,.80fr);min-height:56px}
.matrix-head{min-height:52px}
.matrix-cell{padding:9px 14px}
.matrix-head .matrix-cell{font-size:var(--label);line-height:1.25;font-weight:700}
.matrix-head .matrix-cell:not(:first-child){padding-left:10px;padding-right:10px}
.criterion{font-size:var(--body);line-height:1.35;color:var(--text);font-weight:400}
.matrix-choice{min-height:46px;font-size:var(--body);line-height:1.3;font-weight:500;color:var(--text2);gap:10px}
.matrix-choice .radio{width:24px;height:24px;flex-basis:24px}
/* Before feedback, selection is active/informational. Green is used only for confirmed correct classifications. */
.matrix-choice.selected{color:var(--blue);background:var(--blue-soft)}
.matrix-choice.selected .radio{border-color:var(--blue)}
.matrix-choice.selected .radio:after{background:var(--blue);width:9px;height:9px}
.matrix-choice.correct-selected{color:var(--green-dark)!important;background:var(--success-soft)!important;font-weight:700}
.matrix-choice.correct-selected .radio{border-color:var(--green)!important}
.matrix-choice.correct-selected .radio:after{background:var(--green)!important}
.matrix-row:last-child{min-height:62px}
.matrix-row:last-child .matrix-cell{padding-top:10px;padding-bottom:10px}

/* Summary: labels are primary; values are secondary descriptive information. */
.summary-card{padding:16px 18px 18px}
.summary-card .summary-detail{display:grid;grid-template-columns:1fr;gap:0;margin-top:14px;font-size:var(--body);line-height:1.4}
.summary-detail-row{display:grid;grid-template-columns:118px minmax(0,1fr);gap:18px;align-items:start;padding:9px 0;border-top:1px solid #E8EEEE}
.summary-detail-row:first-child{border-top:0;padding-top:4px}
.summary-label{color:var(--deep);font-weight:700}
.summary-value{color:var(--text2);font-weight:400;text-align:left;line-height:1.45}

@media(max-width:1100px){
  .matrix-row{grid-template-columns:minmax(0,1.42fr) minmax(190px,.74fr) minmax(210px,.80fr)}
}
@media(max-width:900px){
  .criteria-task{padding:14px 16px}
  .matrix-row{grid-template-columns:minmax(0,1.35fr) minmax(170px,.72fr) minmax(190px,.78fr)}
}
@media(max-width:700px){
  .criteria-task{padding:16px}
  .matrix-row:not(.matrix-head){grid-template-columns:1fr 1fr;grid-template-rows:auto auto}
  .matrix-row:not(.matrix-head) .matrix-cell:first-child{font-size:var(--body);line-height:1.35}
  .matrix-choice{background:#fff;min-height:50px}
  .matrix-choice.selected{background:var(--blue-soft)}
  .matrix-choice.correct-selected{background:var(--success-soft)!important}
  .summary-detail-row{grid-template-columns:104px minmax(0,1fr);gap:12px}
}
@media(max-width:480px){
  .summary-detail-row{grid-template-columns:1fr;gap:3px;padding:8px 0}
}


/* rev2 — criterion controls and no-scroll summary refinement */
/* Matrix cells are labelled by the column headers; keep only the radio control in each choice cell. */
.matrix-choice{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  background:transparent!important;
  color:var(--text2);
}
.matrix-choice > span:not(.radio){display:none!important}
/* Selection before Submit: indicate the choice only through the radio, never with a cell background. */
.matrix-choice.selected{background:transparent!important;color:var(--blue)!important}
.matrix-choice.selected .radio{border-color:var(--blue)!important;background:#fff!important}
.matrix-choice.selected .radio:after{content:"";width:9px;height:9px;border-radius:50%;background:var(--blue)!important}
/* After feedback: only confirmed correct selections receive a green background. */
.matrix-choice.correct-selected{background:var(--success-soft)!important;color:var(--green-dark)!important;font-weight:700}
.matrix-choice.correct-selected .radio{border-color:var(--green)!important;background:#fff!important}
.matrix-choice.correct-selected .radio:after{background:var(--green)!important}
.matrix-cell:has(.matrix-choice.correct-selected){background:var(--success-soft)!important}
/* Do not tint incorrect selected cells after feedback. */
.matrix-cell:has(.matrix-choice.selected:not(.correct-selected)){background:#fff}

/* Summary must fit the activity canvas without an internal scrollbar while retaining typography tokens. */
.summary{grid-template-rows:minmax(0,1fr) 72px!important;overflow:hidden!important}
.summary-main{
  padding:26px 40px 14px!important;
  overflow:hidden!important;
  min-height:0;
  display:flex;
  align-items:flex-start;
}
.summary-wrap{width:min(1220px,100%)!important;margin:0 auto;min-height:0}
.summary-intro{margin-top:8px!important;max-width:900px!important}
.summary-grid{gap:12px!important;margin-top:16px!important}
.summary-card{padding:13px 16px 14px!important}
.summary-person img{width:42px!important;height:42px!important}
.summary-card .summary-detail{margin-top:9px!important}
.summary-detail-row{padding:6px 0!important}
.takeaway{margin-top:12px!important;padding:9px 14px!important;line-height:1.45!important}
.summary .static-action{min-height:72px;padding:10px 18px!important}

@media(max-width:1200px){
  .summary-main{padding:24px 30px 12px!important}
  .summary-grid{margin-top:14px!important;gap:10px!important}
  .summary-card{padding:12px 14px 13px!important}
  .takeaway{margin-top:10px!important;padding:8px 12px!important}
}
@media(max-width:900px){
  .summary{grid-template-rows:auto auto!important;overflow:visible!important}
  .summary-main{padding:28px 24px 18px!important;overflow:visible!important}
  .summary-grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:700px){
  .summary-main{padding:26px 18px 16px!important}
  .summary-grid{grid-template-columns:1fr!important}
  .summary{overflow:visible!important}
  .matrix-choice{min-height:50px}
}

/* rev3 — persistent confirmed-correct matrix states */
.matrix-choice.correct-selected,
.matrix-choice.correct-selected.selected{
  background:var(--success-soft)!important;
  color:var(--green-dark)!important;
}
.matrix-choice.correct-selected .radio,
.matrix-choice.correct-selected.selected .radio{
  border-color:var(--green)!important;
  background:#fff!important;
}
.matrix-choice.correct-selected .radio:after,
.matrix-choice.correct-selected.selected .radio:after{
  background:var(--green)!important;
}
.matrix-cell:has(.matrix-choice.correct-selected){
  background:var(--success-soft)!important;
}
/* Incorrect/unconfirmed choices remain navy on white after feedback. */
.matrix-cell:has(.matrix-choice.selected:not(.correct-selected)){
  background:#fff!important;
}
.matrix-choice.selected:not(.correct-selected){
  background:transparent!important;
  color:var(--blue)!important;
}
.matrix-choice.selected:not(.correct-selected) .radio{
  border-color:var(--blue)!important;
  background:#fff!important;
}
.matrix-choice.selected:not(.correct-selected) .radio:after{
  background:var(--blue)!important;
}
/* Correct rows stay visibly confirmed and are protected during retry. */
.matrix-row.row-confirmed .matrix-choice[data-locked="true"]{cursor:default}
.matrix-row.row-confirmed .matrix-choice:not(.correct-selected){pointer-events:none}