/* Render the selected text in the page; keep the native picker and keyboard behavior. */
.fe-clinical__select {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  min-height: 50px;
  padding: 12px 40px 12px 12px;
  border: 1px solid var(--fe-learning-border);
  border-radius: 9px;
  background: var(--fe-learning-surface);
  color: var(--fe-learning-text);
  line-height: 1.5;
}
.fe-clinical__select-value {
  display: block;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  pointer-events: none;
}
.fe-clinical__select::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-75%) rotate(45deg);
  pointer-events: none;
}
.fe-clinical [data-case-form="start"] .fe-clinical__select select {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100% !important;
  min-height: 100%;
  max-height: none !important;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  cursor: pointer;
  font: inherit;
}
.fe-clinical__select:focus-within {
  outline: 3px solid var(--fe-learning-orange);
  outline-offset: 3px;
}
@media (forced-colors: active) {
  .fe-clinical__select { border-color: ButtonText; }
  .fe-clinical__select:focus-within { outline-color: Highlight; }
}
.fe-clinical {
  max-width: 1020px;
  min-width: 0;
  margin-inline: auto;
  padding: clamp(16px, 3vw, 36px);
  padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px));
  color: var(--fe-learning-text);
}
.fe-clinical__card,
.fe-clinical__review,
.fe-clinical__patient {
  min-width: 0;
  overflow-wrap: anywhere;
  border: 1px solid var(--fe-learning-border);
  border-radius: 16px;
  background: var(--fe-learning-surface);
  color: var(--fe-learning-text);
  box-shadow: var(--fe-learning-shadow-soft);
  padding: clamp(18px, 3vw, 30px);
  margin-block: 16px;
}
.fe-clinical__card form { display: grid; gap: 16px; }
.fe-clinical__card form > label,
.fe-clinical__session-options > label { display: grid; gap: 7px; font-weight: 650; }
.fe-clinical__card select,
.fe-clinical__card textarea {
  width: 100%;
  max-width: 100%;
  padding: 12px;
  border: 1px solid var(--fe-learning-border);
  border-radius: 9px;
  font: inherit;
  background: var(--fe-learning-surface);
  color: var(--fe-learning-text);
}
.fe-clinical [data-case-form="start"] select {
  box-sizing: border-box;
  height: auto;
  min-height: 50px;
  max-height: none;
  padding: 12px 36px 12px 12px;
  line-height: 1.5;
}
.fe-clinical__card textarea { min-height: 150px; resize: vertical; }
.fe-clinical__card fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
.fe-clinical__card legend { font-weight: 700; margin-bottom: 8px; }
.fe-clinical__card fieldset label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
  padding: 13px;
  margin-block: 8px;
  border: 1px solid var(--fe-learning-border);
  border-radius: 10px;
  cursor: pointer;
}
.fe-clinical__card fieldset label:has(input:checked) {
  border-color: var(--fe-learning-orange);
  background: var(--fe-learning-orange-soft);
}
.fe-clinical__card fieldset label:hover { border-color: var(--fe-learning-orange); }
.fe-clinical__card fieldset input { flex: none; margin-top: .28em; accent-color: var(--fe-learning-orange); }
.fe-clinical :is(input, select, textarea, button, summary, a):focus-visible {
  outline: 3px solid var(--fe-learning-orange);
  outline-offset: 3px;
}
.fe-clinical button:disabled { opacity: .55; cursor: not-allowed; }
.fe-clinical__patient { padding: 0; }
.fe-clinical__patient summary { list-style: none; cursor: pointer; padding: 13px 18px; display: grid; gap: 3px; }
.fe-clinical__patient summary::-webkit-details-marker { display: none; }
.fe-clinical__patient summary span { font-size: .9rem; color: var(--fe-learning-muted); }
.fe-clinical__patient summary small { color: var(--fe-learning-orange); }
.fe-clinical__patient > p { padding: 0 18px 18px; white-space: pre-line; }
.fe-clinical__patient-hide { display: none; }
.fe-clinical__patient[open] .fe-clinical__patient-excerpt,
.fe-clinical__patient[open] .fe-clinical__patient-show { display: none; }
.fe-clinical__patient[open] .fe-clinical__patient-hide { display: block; }
.fe-clinical__stage-nav { margin-block: 20px; }
.fe-clinical__stage-nav ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(108px, 1fr)); gap: 7px; padding: 0; list-style: none; }
.fe-clinical__stage-nav li { min-width: 0; display: flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--fe-learning-muted); }
.fe-clinical__stage-nav li > span:first-child {
  flex: none; display: grid; place-items: center; width: 25px; height: 25px;
  border: 1px solid var(--fe-learning-border); border-radius: 50%;
}
.fe-clinical__stage-nav li.is-current { font-weight: 700; color: var(--fe-learning-text); }
.fe-clinical__stage-nav li.is-current > span:first-child,
.fe-clinical__stage-nav li.is-done > span:first-child { background: var(--fe-learning-orange-soft); border-color: var(--fe-learning-orange); }
.fe-clinical__stage-mobile { display: none; }
.fe-clinical__review article { border-top: 1px solid var(--fe-learning-border); padding-block: 18px; }
.fe-clinical__review h4 { margin: 16px 0 4px; color: var(--fe-learning-text); }
.fe-clinical__review ul { padding-inline-start: 22px; }
.fe-clinical__feedback { padding: 16px; border-radius: 10px; background: var(--fe-learning-surface-soft); }
.fe-clinical__metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.fe-clinical__metrics > div { display: grid; padding: 12px; border: 1px solid var(--fe-learning-border); border-radius: 10px; }
.fe-clinical__metrics strong { font-size: 1.2rem; color: var(--fe-learning-orange); }
.fe-clinical__metrics small { color: var(--fe-learning-muted); }
.fe-clinical__progress { font-weight: 700; }
.fe-clinical .fe-learning-app__button { margin: 8px 8px 8px 0; }
@media (max-width: 600px) {
  .fe-clinical__stage-nav ol { display: flex; gap: 7px; }
  .fe-clinical__stage-nav li { flex: 1; }
  .fe-clinical__stage-nav li > span:not(:first-child) { display: none; }
  .fe-clinical__stage-nav li > span:first-child { width: 100%; height: 8px; border-radius: 99px; font-size: 0; }
  .fe-clinical__stage-mobile { display: block; }
  .fe-clinical__patient { position: static; }
}
@media (max-width: 390px) {
  .fe-clinical { padding: 14px; }
  .fe-clinical .fe-learning-app__button { width: 100%; margin-inline: 0; }
  .fe-clinical__metrics { grid-template-columns: 1fr; }
}

.fe-clinical .fe-learning-app__header {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  max-width: none;
}
.fe-clinical .fe-learning-app__header > .fe-clinical__heading {
  flex: 1 1 240px;
  min-width: 0;
  overflow-wrap: anywhere;
}
.fe-clinical .fe-learning-app__header > .fe-clinical__header-actions {
  flex: 0 1 auto;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%;
  min-width: 0;
  margin-inline-start: auto;
}
.fe-clinical .fe-clinical__header-actions .fe-learning-app__button {
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
  min-height: 44px;
  margin: 0;
  font-size: .85rem;
  font-weight: 650;
  white-space: normal;
}
.fe-clinical__resume, .fe-clinical__confirm {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px;
  padding: clamp(18px, 3vw, 28px); margin-block: 24px;
  border: 1px solid var(--fe-learning-orange); border-radius: 16px; background: var(--fe-learning-orange-soft);
}
.fe-clinical__confirm { display: block; }
.fe-clinical__resume h3, .fe-clinical__confirm h3 { margin: 4px 0 8px; }
.fe-clinical__resume p { margin: 0 0 6px; }
.fe-clinical__catalog { margin-block: 32px; }
.fe-clinical__catalog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.fe-clinical__catalog-grid .fe-clinical__card { display: flex; flex-direction: column; margin: 0; }
.fe-clinical__catalog-grid h4 { font-size: 1.15rem; line-height: 1.45; margin: 6px 0 12px; }
.fe-clinical__catalog-grid button { align-self: flex-start; margin-top: auto !important; }
.fe-clinical [data-case-form="start"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fe-clinical [data-case-form="start"] > p { grid-column: 1 / -1; margin: 0; }
.fe-clinical [data-case-form="start"] > button { justify-self: start; }
.fe-clinical__card h3 { line-height: 1.5; margin: 8px 0 24px; }
.fe-clinical__card fieldset label { line-height: 1.6; padding: 16px; }
.fe-clinical__hint { color: var(--fe-learning-muted); font-size: .9rem; margin: 0; }
.fe-clinical__model { padding-inline-start: 24px; margin: 12px 0 24px; }
.fe-clinical__model li { padding-inline-start: 4px; margin-block: 12px; line-height: 1.7; }
.fe-clinical__feedback { padding: clamp(18px, 3vw, 28px); margin: 20px 0; line-height: 1.7; }
.fe-clinical__feedback h4 { margin: 20px 0 8px; }
.fe-clinical__review article { padding-block: 28px; line-height: 1.7; }
.fe-clinical__stage-nav ol { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.fe-clinical__stage-nav li { flex-direction: column; align-items: flex-start; line-height: 1.5; }
.fe-clinical__stage-nav li > span:first-child { width: 32px; height: 32px; font-weight: 700; }
.fe-clinical__stage-nav li.is-current > span:first-child { background: var(--fe-learning-orange); color: var(--fe-learning-surface); border-width: 2px; }
.fe-clinical__stage-mobile { display: block; font-weight: 650; margin-bottom: 16px; }
@media (max-width: 700px) {
  .fe-clinical__catalog-grid, .fe-clinical [data-case-form="start"] { grid-template-columns: 1fr; }
  .fe-clinical__stage-nav ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .fe-clinical__stage-nav li { align-items: stretch; }
  .fe-clinical__stage-nav li > span:first-child { width: 100%; height: 8px; }
  .fe-clinical__resume { align-items: flex-start; }
}

.fe-clinical__text{white-space:pre-line;line-height:1.7}
.fe-clinical__verdict{font-size:1.05rem;font-weight:750;border:2px solid;border-radius:10px;padding:12px 16px}
.fe-clinical__verdict.is-correct{color:#176344;background:#e9f7ee;border-color:#25875d}
.fe-clinical__verdict.is-incorrect{color:#942f2f;background:#fff0ef;border-color:#bf4949}
.fe-clinical__verdict.is-open{color:var(--fe-learning-text);background:var(--fe-learning-surface-soft);border-color:var(--fe-learning-border)}
.fe-clinical__choices{list-style:none;padding:0!important;display:grid;gap:10px}
.fe-clinical__choices li{display:grid;gap:5px;padding:14px;border:1px solid var(--fe-learning-border);border-left:5px solid var(--fe-learning-border);border-radius:8px}
.fe-clinical__choices li.is-correct{border-left-color:#25875d;background:#e9f7ee;color:#176344}
.fe-clinical__choices li.is-incorrect{border-left-color:#bf4949;background:#fff0ef;color:#942f2f}
.fe-clinical__choices li.is-missed{border-left-color:#ab720a;background:#fff8e7;color:#785006}
.fe-clinical__choices strong{font-size:.9rem}
.fe-clinical__sources li {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-block: 14px;
  overflow-wrap: anywhere;
}
.fe-clinical__source-citation { flex: 1 1 230px; min-width: 0; }
.fe-clinical__sources .fe-clinical__source-link {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  max-width: 100%;
  margin-inline-start: auto;
  padding: 8px 12px;
  border: 1px solid var(--fe-learning-border);
  border-radius: 6px;
  background: transparent;
  color: var(--fe-learning-text);
  font-size: .85rem;
  font-weight: 650;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
}
.fe-clinical__sources .fe-clinical__source-link:hover {
  border-color: var(--fe-learning-orange);
  background: var(--fe-learning-surface-soft);
  color: var(--fe-learning-text);
}
.fe-clinical__sources .fe-clinical__source-link:focus-visible {
  outline: 3px solid var(--fe-learning-orange);
  outline-offset: 3px;
}
.fe-clinical__catalog-grid h4,.fe-clinical__catalog-grid p,.fe-clinical__catalog-grid button{white-space:normal;overflow:visible;text-overflow:clip;-webkit-line-clamp:unset;max-height:none;height:auto;overflow-wrap:anywhere;min-width:0}
.fe-clinical__stage-nav ol{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
@media(max-width:700px){.fe-clinical__stage-nav ol{grid-template-columns:repeat(3,minmax(0,1fr))}}
.fe-clinical__model li{white-space:pre-line}

/* Keep case content on the learning palette, including theme-level form styles. */
.fe-learning-page .fe-learning-app .fe-clinical :is(h2, h3, h4, label, legend, summary) {
  color: var(--fe-learning-text);
}
.fe-learning-page .fe-learning-app .fe-clinical :is(select, textarea) {
  background: var(--fe-learning-surface);
  color: var(--fe-learning-text);
  border-color: var(--fe-learning-border);
}
.fe-clinical textarea::placeholder { color: var(--fe-learning-muted); opacity: 1; }
.fe-clinical__details summary {
  cursor: pointer;
  min-height: 44px;
  padding-block: 10px;
  font-weight: 650;
}
.fe-clinical__details { border-top: 1px solid var(--fe-learning-border); margin-top: 16px; }
.fe-clinical__details .fe-clinical__sources { margin-block: 8px; }
.fe-clinical__sources a { display: inline-flex; align-items: center; min-height: 44px; color: var(--fe-learning-orange); }
.fe-clinical__resume {
  padding: 12px 18px;
  margin-block: 16px;
  gap: 12px;
  background: var(--fe-learning-surface-soft);
  border-color: var(--fe-learning-border);
}
.fe-clinical__resume > div { flex: 1 1 240px; min-width: 0; }
.fe-clinical__resume h3 { font-size: 1rem; line-height: 1.45; margin: 0; }
.fe-clinical__resume .fe-learning-app__eyebrow { margin-bottom: 3px; }
.fe-clinical__resume .fe-learning-app__button { margin: 0; flex-shrink: 0; }

.fe-clinical .fe-learning-app__button { min-height: 44px; }
.fe-clinical__metrics { margin-top: 12px; }
.fe-clinical__metrics strong { line-height: 1.6; }
.fe-clinical__card > h3 { margin-bottom: 12px; }
.fe-clinical__catalog { margin-block: 20px; }
html[data-fe-theme="dark"] .fe-clinical {
  --fe-case-correct-text: #a2e7c2;
  --fe-case-correct-bg: #17382b;
  --fe-case-correct-border: #6ac89b;
  --fe-case-incorrect-text: #ffc2bd;
  --fe-case-incorrect-bg: #482423;
  --fe-case-incorrect-border: #ed9189;
  --fe-case-missed-text: #ffdfa0;
  --fe-case-missed-bg: #40331c;
  --fe-case-missed-border: #d9af5a;
}
.fe-clinical__verdict.is-correct,
.fe-clinical__choices li.is-correct {
  color: var(--fe-case-correct-text, #176344);
  background: var(--fe-case-correct-bg, #e9f7ee);
  border-color: var(--fe-case-correct-border, #25875d);
}
.fe-clinical__verdict.is-incorrect,
.fe-clinical__choices li.is-incorrect {
  color: var(--fe-case-incorrect-text, #942f2f);
  background: var(--fe-case-incorrect-bg, #fff0ef);
  border-color: var(--fe-case-incorrect-border, #bf4949);
}
.fe-clinical__choices li.is-missed {
  color: var(--fe-case-missed-text, #785006);
  background: var(--fe-case-missed-bg, #fff8e7);
  border-color: var(--fe-case-missed-border, #ab720a);
}
.fe-clinical__choices :is(strong, span) { color: inherit; }

@media (max-width: 600px) {
  .fe-clinical__resume { padding: 12px 14px; }
}
.fe-clinical__session-options {
  grid-column: 1 / -1;
  min-width: 0;
  padding-block: 12px;
  border-block: 1px solid var(--fe-learning-border);
}
.fe-clinical__session-options summary {
  cursor: pointer;
  font-weight: 650;
  min-height: 32px;
}
.fe-clinical__session-options > label { margin-top: 12px; max-width: 400px; }
.fe-clinical__session-options > p { margin: 12px 0 0; color: var(--fe-learning-muted); }

.fe-clinical__progress-details summary { cursor: pointer; font-weight: 650; }
.fe-clinical__progress-details[open] > p { margin-top: 16px; }
/* Discussion and released patient findings stay within the learning surface. */
.fe-clinical .fe-clinical__comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.fe-clinical .fe-clinical__comparison>section{min-width:0;overflow-wrap:anywhere}
.fe-clinical .fe-clinical__reveal{border-inline-start:3px solid currentColor;padding:1rem;margin:1rem 0;overflow-wrap:anywhere}
.fe-clinical [data-case-form="reflection"]{margin-block:1.25rem}
.fe-clinical [data-case-form="reflection"] label{display:block;margin-block:.75rem;overflow-wrap:anywhere}
.fe-clinical [data-case-form="reflection"] select,.fe-clinical select[name="confidence"]{display:block;max-width:100%;min-height:44px;margin-top:.5rem}
.fe-clinical nav[aria-label="Nawigacja omówienia"]{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:1rem}
@media(max-width:600px){.fe-clinical .fe-clinical__comparison{gap:.75rem}.fe-clinical .fe-clinical__select-value{overflow-wrap:anywhere;white-space:normal}}

/* Compact answer discussion cards, shared by the player and final review. */
.fe-clinical .fe-clinical__feedback { background:transparent; padding:0; }
.fe-clinical .fe-clinical__discussion { display:grid; gap:14px; }
.fe-clinical .fe-clinical__discussion nav[aria-label="Nawigacja omówienia"] { gap:8px; margin:0 0 2px; }
.fe-clinical__discussion nav a { display:inline-flex; align-items:center; min-height:40px; padding:6px 12px; border:1px solid var(--fe-learning-border); border-radius:999px; color:var(--fe-learning-text); background:var(--fe-learning-surface); font-size:.85rem; font-weight:650; text-decoration:none; }
.fe-clinical__discussion nav a:hover { border-color:var(--fe-learning-orange); background:var(--fe-learning-orange-soft); }
.fe-clinical .fe-clinical__answer-card { padding:18px; border:1px solid var(--fe-learning-border); border-radius:12px; background:var(--fe-learning-surface-soft); }
.fe-clinical .fe-clinical__answer-key { border-inline-start:3px solid var(--fe-learning-orange); background:var(--fe-learning-surface); }
.fe-clinical .fe-clinical__answer-card h4 { margin:0 0 10px; font-size:1rem; line-height:1.5; }
.fe-clinical .fe-clinical__answer-card :is(p,ul) { margin-block:0; }
.fe-clinical .fe-clinical__choice-counts { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.fe-clinical__choice-counts span { padding:4px 10px; border:1px solid var(--fe-learning-border); border-radius:8px; font-size:.85rem; }
.fe-clinical .fe-clinical__discussion .fe-clinical__details { margin:0; padding:0 16px; border:1px solid var(--fe-learning-border); border-radius:12px; background:var(--fe-learning-surface); }
.fe-clinical .fe-clinical__discussion .fe-clinical__details summary { padding-block:12px; }
.fe-clinical .fe-clinical__discussion .fe-clinical__details > p { margin:4px 0 16px; }
.fe-clinical .fe-clinical__reflection { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0; padding:12px 16px; border:1px solid var(--fe-learning-border); border-radius:12px; background:var(--fe-learning-surface-soft); }
.fe-clinical .fe-clinical__reflection > label { display:flex; align-items:center; gap:8px; margin:0; flex:1 1 160px; font-size:.9rem; }
.fe-clinical .fe-clinical__reflection > button { margin:0; width:auto; padding:9px 14px; font-size:.85rem; }
.fe-clinical .fe-clinical__reflection > fieldset { flex:1 1 100%; min-width:0; }
.fe-clinical .fe-clinical__reflection input[type="checkbox"] { flex:none; margin:0; }
.fe-clinical .fe-clinical__review-step { padding:22px; margin-top:18px; border:1px solid var(--fe-learning-border); border-radius:14px; background:var(--fe-learning-surface); }
.fe-clinical .fe-clinical__review-step > .fe-clinical__text { margin-bottom:16px; }
.fe-clinical .fe-clinical__discussion :is(section,details) { scroll-margin-top:100px; }
@media(max-width:760px) {
 .fe-clinical .fe-clinical__comparison { grid-template-columns:1fr; gap:12px; }
 .fe-clinical .fe-clinical__review-step { padding:16px; }
 .fe-clinical .fe-clinical__reflection > button { width:100%; }
}
.fe-clinical .fe-clinical__dictation { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin:10px 0 14px; }
.fe-clinical .fe-clinical__dictation > .fe-clinical__hint { flex:1 1 260px; margin:0; font-size:.85rem; }
.fe-clinical .fe-clinical__dictation button { display:inline-flex; gap:8px; align-items:center; margin:0; width:auto; }
.fe-clinical .fe-clinical__dictation button[aria-pressed="true"] { border-color:var(--fe-learning-orange); background:var(--fe-learning-orange-soft); }
.fe-clinical .fe-clinical__dictation-status { flex:1 1 100%; margin:0; font-size:.9rem; }
.fe-clinical .fe-clinical__dictation-status:empty { display:none; }
