.runtime-tools { display: flex; gap: 8px; align-items: center; }
.runtime-chip { min-height: 40px; padding: 0 13px; border: 1px solid var(--line); border-radius: 999px; background: rgba(4,18,38,.68); color: #fff; cursor: pointer; font-weight: 750; }
.runtime-chip:hover, .runtime-chip[aria-pressed="true"] { background: rgba(20,74,105,.86); border-color: var(--cyan); }
.runtime-chip--evaluator { border-color: rgba(255,212,135,.58); }

.evaluator-panel { position: fixed; z-index: 80; inset-block: 0; inset-inline-end: 0; width: min(480px, 94vw); padding: 26px; overflow-y: auto; direction: rtl; background: rgba(3,15,31,.97); border-inline-start: 1px solid rgba(255,255,255,.2); box-shadow: -24px 0 80px rgba(0,0,0,.45); transform: translateX(105%); visibility: hidden; pointer-events: none; transition: transform .28s ease, visibility 0s linear .28s; }
[dir="ltr"] .evaluator-panel { direction: ltr; transform: translateX(-105%); }
.evaluator-panel.is-open { transform: translateX(0); visibility: visible; pointer-events: auto; transition-delay: 0s; }
.evaluator-panel__head { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.evaluator-panel__head p { margin: 0 0 4px; color: var(--gold); font-size: .78rem; font-weight: 850; }
.evaluator-panel__head h2 { margin: 0; font-size: 1.55rem; }
.evaluator-panel__close { min-width: 44px; min-height: 44px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.08); cursor: pointer; color: #fff; }
.evaluator-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.evaluator-stat { min-height: 92px; padding: 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; background: rgba(255,255,255,.05); }
.evaluator-stat span { display: block; margin-bottom: 8px; color: var(--muted); font-size: .76rem; }
.evaluator-stat strong { font-size: 1rem; line-height: 1.5; }
.evaluator-section { padding: 17px 0; border-top: 1px solid rgba(255,255,255,.14); }
.evaluator-section h3 { margin: 0 0 10px; font-size: 1rem; color: var(--gold); }
.evaluator-section p { margin: 0; color: var(--muted); line-height: 1.75; }
.evaluator-section__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.evaluator-section__head h3 { margin: 0; }
.evaluator-requirements { display: flex; flex-wrap: wrap; gap: 7px; direction: ltr; }
.evaluator-requirements code { padding: 6px 9px; border: 1px solid rgba(79,220,255,.32); border-radius: 8px; background: rgba(79,220,255,.09); color: #bff5ff; font-size: .72rem; }
.evaluator-note { margin-top: 9px !important; font-size: .7rem; color: #f2cc84 !important; }
.evaluator-acceptance { display: grid; gap: 9px; margin: 0; padding-inline-start: 22px; color: var(--muted); line-height: 1.65; }
.evaluator-acceptance li::marker { color: var(--gold); font-weight: 900; }
.evaluator-acceptance-log { display: grid; gap: 8px; max-height: 230px; overflow: auto; }
.evaluator-acceptance-log > div { display: grid; gap: 4px; padding: 10px 11px; border-inline-start: 3px solid var(--ok); border-radius: 9px; background: rgba(45,194,139,.09); }
.evaluator-acceptance-log strong { color: #dffdf0; font-size: .78rem; direction: ltr; text-align: start; }
.evaluator-acceptance-log span { color: var(--muted); font-size: .68rem; direction: ltr; text-align: start; }
.evaluator-controls { display: flex; flex-wrap: wrap; gap: 8px; }
.evaluator-log { display: grid; gap: 8px; max-height: 260px; overflow: auto; font-family: Consolas, monospace; direction: ltr; text-align: left; }
.evaluator-log div { padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.06); color: #d9f8ff; font-size: .73rem; line-height: 1.45; word-break: break-word; }
.evaluator-empty { color: var(--muted); font-family: inherit; direction: rtl; text-align: right; }

.transcript-dialog { width: min(680px, calc(100% - 32px)); max-height: 78vh; padding: 0; border: 1px solid rgba(255,255,255,.22); border-radius: 24px; background: #071a31; color: #fff; box-shadow: var(--shadow); }
.transcript-dialog::backdrop { background: rgba(0,8,20,.78); backdrop-filter: blur(9px); }
.transcript-dialog__inner { padding: 26px; direction: rtl; }
[dir="ltr"] .transcript-dialog__inner { direction: ltr; }
.transcript-dialog__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.transcript-dialog h2 { margin: 0; }
.transcript-dialog__body { margin-top: 18px; display: grid; gap: 13px; color: var(--muted); line-height: 1.8; }
.transcript-dialog__body p { margin: 0; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.1); }

.course-objective { position: absolute; inset-inline-start: clamp(20px,5vw,76px); inset-block-start: 18%; z-index: 4; padding: 8px 13px; border-radius: 999px; background: rgba(4,18,38,.62); color: rgba(255,255,255,.82); font-size: .76rem; backdrop-filter: blur(10px); }
.course-objective strong { color: var(--gold); }

body.high-contrast { --muted: #fff; --line: rgba(255,255,255,.7); --glass: rgba(0,0,0,.88); --glass-strong: #000; }
body.high-contrast .experience__media video { filter: contrast(1.2) saturate(.7) brightness(.65); }
body.reduced-motion *, body.reduced-motion *::before, body.reduced-motion *::after { animation: none !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
body.reduced-motion video { visibility: hidden; }

.pilot-panel { position: absolute; inset-inline-end: clamp(22px,5vw,76px); inset-block-start: 28%; width: min(500px, 40vw); padding: 22px; }
.pilot-panel[hidden] { display: none; }
.pilot-panel__kicker { margin: 0 0 6px; color: var(--gold); font-size: .78rem; font-weight: 850; }
.pilot-panel h3 { margin: 0 0 8px; font-size: clamp(1.35rem,2.2vw,2.2rem); line-height: 1.35; }
.pilot-panel__copy { margin: 0 0 15px; color: var(--muted); line-height: 1.75; }
.pilot-options { display: grid; gap: 9px; }
.pilot-option { width: 100%; padding: 12px 15px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.08); color: #fff; text-align: start; cursor: pointer; line-height: 1.55; }
.pilot-option:hover { border-color: var(--cyan); background: rgba(40,148,168,.2); }
.pilot-option:focus-visible, .sequence-list button:focus-visible, .runtime-chip:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.pilot-option.is-correct { border-color: var(--ok); background: rgba(45,194,139,.22); }
.pilot-option.is-wrong { border-color: var(--danger); background: rgba(220,76,87,.2); }
.pilot-actions { display: flex; gap: 9px; margin-top: 15px; }
.pilot-feedback { min-height: 1.6em; margin: 13px 0 0; color: #fff; line-height: 1.6; }
.pilot-feedback.is-success { color: var(--ok); }
.pilot-feedback.is-error { color: #ffb5b5; }
.sequence-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sequence-list button { min-height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255,255,255,.08); color: #fff; cursor: pointer; }
.sequence-answer { min-height: 54px; margin-top: 12px; padding: 10px; border: 1px dashed rgba(255,255,255,.36); border-radius: 14px; color: var(--muted); line-height: 1.8; }

@media (max-width: 900px) {
  .runtime-tools { flex-wrap: wrap; }
  .pilot-panel { inset-inline: 18px; width: auto; inset-block-start: 29%; }
  .course-objective { inset-inline: 18px; inset-block-start: 20%; width: fit-content; }
}
@media (max-width: 640px) {
  .runtime-chip { min-height: 36px; padding: 0 10px; font-size: .72rem; }
  .runtime-chip--evaluator { position: fixed; inset-inline-end: 12px; inset-block-end: 12px; z-index: 70; }
  .course-objective { display: none; }
  .pilot-panel { inset-block-start: 27%; padding: 17px; }
  .pilot-panel h3 { font-size: 1.25rem; }
  .evaluator-grid { grid-template-columns: 1fr; }
}