:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #07101f;
  color: #f4f7fc;
  --bg: #07101f;
  --panel: #0d192b;
  --panel-2: #111f34;
  --line: #243753;
  --muted: #93a5bf;
  --blue: #3777ff;
  --blue-soft: #142e5e;
  --lime: #b9ea77;
  --green: #52d49b;
  --amber: #f2bd68;
  --red: #ff8585;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 60% -20%, #16386f 0, transparent 35%), var(--bg); }
button, input, select { font: inherit; }
button { border: 0; color: inherit; cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #6c9bff; outline-offset: 2px; }
button:disabled { opacity: .55; cursor: wait; }
h1, h2, h3, p { margin-top: 0; }
small, .muted { color: var(--muted); }

.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 28px; background: radial-gradient(circle at 15% 0, #174a95 0, transparent 32%); }
.auth-panel { width: min(520px, 100%); }
.brand { color: #8fb5ff; font-weight: 900; letter-spacing: .16em; font-size: 13px; }
.auth-panel h1 { margin: 14px 0 18px; font-size: clamp(36px, 7vw, 64px); line-height: .98; letter-spacing: -.045em; }
.lead { color: #b4c1d5; line-height: 1.65; font-size: 18px; }
.card, .panel { border: 1px solid var(--line); background: color-mix(in srgb, var(--panel) 94%, transparent); border-radius: 20px; box-shadow: 0 18px 60px #0003; }
.auth-form { display: grid; gap: 14px; padding: 24px; margin-top: 30px; }
input, select { width: 100%; color: #f6f8ff; background: #091425; border: 1px solid #304563; border-radius: 12px; padding: 13px 15px; }
input::placeholder { color: #7588a5; }
.primary, .secondary, .ghost { min-height: 42px; border-radius: 11px; padding: 10px 16px; font-weight: 760; white-space: nowrap; }
.primary { background: var(--blue); }
.secondary { background: #172842; border: 1px solid #2b4264; }
.ghost { background: transparent; color: #afbdd1; }
.wide { width: 100%; }
.form-error { min-height: 20px; color: #ffaaaa; }

.application-shell { min-height: 100vh; display: grid; grid-template-columns: 250px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 25px 16px 18px; border-right: 1px solid #20324e; background: #081322f4; z-index: 10; }
.sidebar-brand { display: flex; gap: 12px; align-items: center; padding: 0 8px 27px; }
.sidebar-brand div { display: grid; gap: 3px; }
.sidebar-brand strong { font-size: 14px; letter-spacing: .08em; }
.sidebar-brand small { font-size: 9px; letter-spacing: .12em; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: white; font-weight: 900; background: linear-gradient(135deg, #2568f5, #6b9bff); box-shadow: 0 8px 30px #246bfe55; }
.main-navigation { display: grid; gap: 5px; }
.main-navigation button { min-height: 46px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 10px; text-align: left; border-radius: 11px; background: transparent; color: #99abc4; padding: 0 12px; }
.main-navigation button:hover { background: #13233a; color: #e7edf7; }
.main-navigation button.active { color: #fff; background: linear-gradient(90deg, #1d4d9c, #173159); box-shadow: inset 3px 0 #76a4ff; }
.main-navigation i { font-style: normal; font-size: 18px; text-align: center; }
.main-navigation b { min-width: 24px; padding: 2px 7px; border-radius: 99px; text-align: center; color: #afbdd1; background: #20304a; font-size: 11px; }
.remote-mode { margin-top: auto; display: flex; gap: 10px; align-items: center; padding: 14px; border: 1px solid #203852; background: #0d1e30; border-radius: 13px; }
.remote-mode div, .sync-info div { display: grid; gap: 3px; }
.remote-mode strong, .sync-info strong { font-size: 12px; }
.remote-mode small, .sync-info small { font-size: 10px; }
.status-dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px #52d49b18, 0 0 16px #52d49b99; }

.workspace { min-width: 0; }
.topbar { min-height: 75px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 14px clamp(20px, 4vw, 46px); border-bottom: 1px solid #1f314c; background: #081322cc; backdrop-filter: blur(15px); position: sticky; top: 0; z-index: 8; }
.sync-info, .topbar-actions, .user-chip { display: flex; align-items: center; gap: 11px; }
.user-chip { padding-left: 6px; }
.user-chip div { display: grid; }
.user-chip strong { font-size: 12px; }
.user-chip small { font-size: 10px; }
.user-avatar, .avatar { display: grid; place-items: center; border-radius: 50%; color: #eaf0ff; font-weight: 850; background: linear-gradient(145deg, #264c82, #142a49); border: 1px solid #365c8e; }
.user-avatar { width: 34px; height: 34px; }
.avatar { width: 44px; height: 44px; flex: 0 0 auto; }
.view-content { width: min(1500px, 100%); margin: 0 auto; padding: 36px clamp(20px, 4vw, 46px) 80px; }
.view-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 22px; margin: 0 0 28px; }
.view-heading h1 { font-size: clamp(30px, 4vw, 48px); letter-spacing: -.04em; margin: 7px 0 10px; }
.view-heading p { margin: 0; max-width: 790px; color: #a7b5ca; line-height: 1.55; }
.eyebrow { color: #81aaff; text-transform: uppercase; letter-spacing: .12em; font-size: 10px; font-weight: 850; }
.readonly-badge { padding: 8px 12px; border-radius: 99px; color: #aabbd2; border: 1px solid #314662; background: #101e31; font-size: 12px; font-weight: 700; }
.info-banner { display: flex; align-items: flex-start; gap: 13px; border: 1px solid #244e87; background: #0e2545; border-radius: 15px; padding: 15px 18px; margin-bottom: 20px; }
.info-banner > span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: var(--blue); font-weight: 800; }
.info-banner strong { display: block; font-size: 13px; margin-bottom: 3px; }
.info-banner p { margin: 0; color: #a9bdd9; font-size: 12px; line-height: 1.5; }

.kpi-grid, .modal-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 18px; }
.kpi-card { min-width: 0; padding: 19px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, #101d31, #0b1728); }
.kpi-card > span { color: #8fa2be; font-size: 11px; font-weight: 700; }
.kpi-card > strong { display: block; margin: 9px 0 6px; font-size: 30px; letter-spacing: -.035em; }
.kpi-card > small { display: block; font-size: 10px; line-height: 1.45; }
.kpi-card.blue { box-shadow: inset 0 3px var(--blue); }
.kpi-card.lime { box-shadow: inset 0 3px var(--lime); }
.dashboard-grid { display: grid; gap: 18px; margin-top: 18px; }
.dashboard-grid.two-one { grid-template-columns: 1.55fr 1fr; }
.dashboard-grid.equal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.panel { padding: 21px; min-width: 0; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 17px; }
.panel-heading h2 { margin: 5px 0 0; font-size: 19px; letter-spacing: -.02em; }
.counter { min-width: 34px; padding: 6px 9px; border-radius: 10px; text-align: center; color: #c7d5e9; background: #192a43; font-size: 12px; }
.readiness-list, .compact-list { display: grid; }
.readiness-row, .compact-row { width: 100%; display: flex; align-items: center; gap: 12px; text-align: left; padding: 12px 4px; border-bottom: 1px solid #1b2c44; background: transparent; }
.readiness-row:last-child, .compact-row:last-child { border-bottom: 0; }
.readiness-row:hover, button.compact-row:hover { background: #12213a; }
.row-identity { width: 160px; display: grid; gap: 3px; }
.row-identity strong, .compact-row strong { font-size: 12px; }
.row-identity small, .compact-row small { font-size: 10px; }
.progress-track { flex: 1; min-width: 80px; height: 7px; overflow: hidden; background: #1d2c42; border-radius: 99px; }
.progress-track i, .metric-line i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #3978ff, #7ea8ff); }
.readiness-row > b { width: 38px; font-size: 12px; }
.grow { min-width: 0; flex: 1; display: grid; gap: 3px; }
.chevron { color: #667d9e; font-size: 21px; }
.exercise-code { min-width: 42px; display: inline-grid; place-items: center; align-self: flex-start; padding: 6px 8px; border-radius: 8px; color: #a9c5ff; background: #18366b; font-size: 10px; font-weight: 850; }
.session-score { color: var(--lime); }
.compact-row.static { cursor: default; }
.connection-icon { width: 12px; height: 12px; border-radius: 50%; background: #62728a; box-shadow: 0 0 0 4px #62728a18; }
.connection-icon.online { background: var(--green); box-shadow: 0 0 0 4px #52d49b18; }
.connection-icon.stale { background: var(--amber); }
.state-label, .status-badge { width: max-content; padding: 5px 9px; border-radius: 99px; color: #b5c2d4; background: #22324a; font-size: 10px; font-weight: 800; }
.state-label.online, .status-badge.completed { color: #9beac8; background: #174735; }
.state-label.stale { color: #f4d393; background: #4b3920; }

.filter-bar { display: grid; grid-template-columns: minmax(260px, 1fr) 220px 220px; gap: 12px; margin-bottom: 18px; }
.roster-table { display: grid; }
.pilot-row { display: grid; grid-template-columns: minmax(280px, 1.5fr) repeat(3, minmax(85px, .5fr)) 90px auto; gap: 15px; align-items: center; padding: 15px 6px; border-bottom: 1px solid #1e304a; }
.pilot-row:last-child { border-bottom: 0; }
.pilot-row.disabled { opacity: .55; }
.pilot-identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pilot-identity > div { display: grid; gap: 3px; min-width: 0; }
.pilot-identity strong { font-size: 14px; }
.pilot-identity small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pilot-identity em { color: #6f87a8; font-size: 9px; font-style: normal; }
.pilot-stat { display: grid; gap: 4px; }
.pilot-stat span { color: #8295b1; font-size: 9px; }
.pilot-stat b { font-size: 15px; }
.readiness-chip { display: grid; justify-items: center; padding: 8px; border-radius: 12px; background: #173056; border: 1px solid #28518d; }
.readiness-chip strong { color: #dce8ff; }
.readiness-chip small { font-size: 8px; }

.session-table { display: grid; }
.session-table-row { width: 100%; display: grid; grid-template-columns: 52px minmax(260px, 1fr) 90px 105px 90px 20px; align-items: center; gap: 14px; text-align: left; padding: 14px 6px; background: transparent; border-bottom: 1px solid #1d2e47; }
.session-table-row:hover { background: #112039; }
.session-table-row:last-child { border-bottom: 0; }
.session-main, .session-meta { display: grid; gap: 4px; }
.session-main strong { font-size: 13px; }
.session-main small, .session-meta span { color: var(--muted); font-size: 10px; }
.session-meta b { font-size: 14px; }

.skill-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.skill-card { display: grid; grid-template-columns: auto 1fr auto; gap: 9px; align-items: center; padding: 11px; border: 1px solid #223751; border-radius: 12px; background: #0b1728; }
.skill-card strong { font-size: 11px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.skill-card small { grid-column: 2; font-size: 9px; }
.skill-card > b { grid-row: 1 / 3; grid-column: 3; color: var(--lime); font-size: 18px; }
.metric-bars { display: grid; gap: 14px; }
.metric-bar-row { display: grid; grid-template-columns: 100px 1fr 32px; align-items: center; gap: 11px; }
.metric-bar-row > span { color: #a8b5c8; font-size: 11px; }
.metric-bar-row > b { text-align: right; font-size: 11px; }
.metric-line { height: 7px; border-radius: 99px; background: #1b2a40; overflow: hidden; }
.error-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.error-card, .error-list article { display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid #2c3c51; border-radius: 12px; background: #101a2a; }
.error-card > b, .error-list article > b { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #ffd3a0; background: #49351f; }
.error-card div, .error-list article div { display: grid; gap: 3px; }
.error-card strong, .error-list strong { font-size: 11px; }
.error-card small, .error-list small { font-size: 9px; }

.knowledge-grid, .test-grid, .station-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.knowledge-card, .test-card, .station-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, #0f1c2f, #0b1728); }
.card-topline, .test-meta, .station-card-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.card-topline small { font-size: 9px; }
.knowledge-card h2, .test-card h2, .station-card h2 { margin: 16px 0 10px; font-size: 18px; }
.knowledge-summary, .test-head p { color: #a4b2c6; font-size: 12px; line-height: 1.55; }
.knowledge-card details { margin-top: 18px; border-top: 1px solid #263650; padding-top: 14px; }
summary { cursor: pointer; color: #a8c4ff; font-size: 12px; font-weight: 750; }
.knowledge-body { margin: 14px 0 0; color: #c0ccdd; line-height: 1.65; font-size: 12px; white-space: pre-wrap; }
.test-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.test-card.disabled { opacity: .62; }
.test-head { display: flex; justify-content: space-between; gap: 18px; }
.test-head > div:first-child { flex: 1; }
.test-total { flex: 0 0 80px; height: 76px; display: grid; place-content: center; text-align: center; border-radius: 15px; background: #153365; }
.test-total strong { font-size: 22px; }
.test-total small { font-size: 9px; }
.test-meta { padding: 11px 0; border-top: 1px solid #263650; border-bottom: 1px solid #263650; color: #91a4bd; font-size: 10px; }
.test-results-preview { min-height: 45px; padding: 10px 0; }
.test-result-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; padding: 7px 0; font-size: 11px; }
.test-result-row small { font-size: 9px; }
.station-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.station-card-head { align-items: flex-start; }
.station-card-head h2 { margin-top: 6px; }
.station-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin: 18px 0; }
.station-details div { display: grid; gap: 3px; padding: 11px; border-radius: 11px; background: #0a1626; }
.station-details dt { color: #7f93af; font-size: 9px; }
.station-details dd { margin: 0; font-size: 12px; font-weight: 750; }
.station-note { margin: 0; color: #8193ab; line-height: 1.55; font-size: 10px; }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 28px; background: #020713d9; backdrop-filter: blur(8px); }
.modal { width: min(1050px, 100%); max-height: calc(100vh - 56px); overflow: auto; border: 1px solid #314968; border-radius: 22px; background: #0b1627; box-shadow: 0 30px 100px #000b; }
.modal-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px 24px; border-bottom: 1px solid #263953; background: #0c182af5; backdrop-filter: blur(12px); }
.modal-head h2 { margin: 6px 0 0; font-size: 24px; }
.modal-close { width: 38px; height: 38px; padding: 0; border-radius: 11px; background: #1a2940; font-size: 24px; }
.modal-body { padding: 24px; }
.modal-pilot-identity { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.modal-pilot-identity .avatar { width: 52px; height: 52px; }
.modal-pilot-identity > div { display: grid; gap: 4px; }
.modal-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.modal-section { margin-top: 18px; padding: 18px; border: 1px solid #243752; border-radius: 16px; background: #0c192a; }
.modal-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.readiness-skill-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.readiness-skill-grid article { display: flex; gap: 10px; align-items: center; padding: 11px; border: 1px solid #2c3d56; border-radius: 12px; background: #101d2f; }
.readiness-skill-grid article.mastered { border-color: #2d7257; background: #102b24; }
.readiness-skill-grid strong { font-size: 10px; }
.readiness-skill-grid small { font-size: 8px; }
.readiness-skill-grid article > b { color: var(--green); }
.policy-note, .video-note { margin: 14px 0 0; padding: 11px 13px; border-radius: 11px; color: #a8b8ce; background: #142640; font-size: 10px; line-height: 1.55; }
.error-list { display: grid; gap: 9px; }
.session-modal-intro { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 12px; padding: 15px; border-radius: 14px; background: #111f33; }
.session-modal-intro > div { display: grid; gap: 4px; }
.session-modal-intro span { color: var(--muted); font-size: 9px; }
.attempt-list { display: grid; gap: 15px; margin-top: 17px; }
.attempt-card { padding: 18px; border: 1px solid #263b59; border-radius: 16px; background: #0e1b2e; }
.attempt-head { display: flex; justify-content: space-between; gap: 15px; }
.attempt-head h3 { margin: 5px 0 0; font-size: 16px; }
.attempt-score { text-align: right; }
.attempt-score strong { display: block; color: var(--lime); font-size: 28px; }
.attempt-score small { font-size: 9px; }
.attempt-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: 14px 0; }
.attempt-facts div { display: grid; gap: 4px; padding: 9px; border-radius: 9px; background: #091526; }
.attempt-facts span { color: var(--muted); font-size: 8px; }
.attempt-facts b { font-size: 11px; }
.criteria-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 15px; }
.criteria-list > div { display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid #343f4c; border-radius: 10px; }
.criteria-list > div.complete { border-color: #2b664f; background: #102820; }
.criteria-list > div > span { color: var(--green); }
.criteria-list strong { font-size: 10px; }
.criteria-list small { display: block; font-size: 8px; margin-top: 2px; }
.events-details { margin-top: 15px; border-top: 1px solid #283952; padding-top: 12px; }
.event-list { display: grid; gap: 8px; margin-top: 11px; }
.event { padding: 11px; border-left: 3px solid #6681a5; background: #111f31; border-radius: 7px; }
.event.warning { border-color: var(--amber); }
.event.critical { border-color: var(--red); }
.event.positive { border-color: var(--green); }
.event > div { display: flex; justify-content: space-between; gap: 12px; }
.event strong { font-size: 10px; }
.event span, .event small { color: var(--muted); font-size: 8px; }
.event p { margin: 6px 0; font-size: 9px; }
.next-step { margin-top: 14px; padding: 12px; border-radius: 10px; background: #142b50; }
.next-step strong { font-size: 10px; }
.next-step p { margin: 5px 0 0; color: #b7c7de; font-size: 10px; }
.modal-description { color: #acbad0; }
.test-submission-list { display: grid; gap: 9px; }
.submission { border: 1px solid #293d59; border-radius: 12px; background: #0e1b2e; }
.submission summary { display: flex; align-items: center; gap: 15px; padding: 13px; list-style: none; }
.submission summary::-webkit-details-marker { display: none; }
.submission.pending { opacity: .65; }
.wrong-answer-list { display: grid; gap: 9px; padding: 0 13px 13px; }
.wrong-answer-list article { padding: 12px; border-radius: 10px; background: #161f2d; }
.wrong-answer-list strong { font-size: 11px; }
.wrong-answer-list p, .wrong-answer-list small { margin: 7px 0 0; font-size: 9px; }
.correct-answer { color: #99e2bf; }
.perfect-result { color: var(--green); font-weight: 750; }
.empty-state { grid-column: 1 / -1; min-height: 180px; display: grid; place-content: center; justify-items: center; text-align: center; padding: 30px; color: #8fa1bb; }
.empty-state > span { font-size: 32px; color: #5e789d; }
.empty-state h3 { margin: 9px 0 5px; color: #d3dceb; }
.empty-state p { margin: 0; font-size: 11px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 200; padding: 13px 17px; border: 1px solid #2e6d55; border-radius: 12px; color: #c6f1dc; background: #143a2e; box-shadow: 0 15px 50px #0008; font-size: 12px; }
.toast.danger { border-color: #794148; color: #ffd3d3; background: #422329; }

@media (max-width: 1180px) {
  .application-shell { grid-template-columns: 205px minmax(0, 1fr); }
  .sidebar-brand small { display: none; }
  .pilot-row { grid-template-columns: minmax(240px, 1fr) repeat(2, 85px) 85px auto; }
  .pilot-row .pilot-stat:nth-of-type(3) { display: none; }
  .knowledge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .readiness-skill-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .application-shell { display: block; }
  .sidebar { position: sticky; top: 0; width: 100%; height: auto; padding: 10px 14px; border-right: 0; border-bottom: 1px solid #20324e; }
  .sidebar-brand, .remote-mode { display: none; }
  .main-navigation { display: flex; overflow-x: auto; gap: 5px; }
  .main-navigation button { grid-template-columns: 20px auto auto; min-width: max-content; padding: 0 11px; }
  .topbar { position: static; }
  .sync-info { display: none; }
  .topbar-actions { width: 100%; justify-content: flex-end; }
  .dashboard-grid.two-one, .dashboard-grid.equal, .modal-columns { grid-template-columns: 1fr; }
  .kpi-grid, .modal-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pilot-row { grid-template-columns: minmax(220px, 1fr) 80px 75px auto; }
  .pilot-row .pilot-stat:nth-of-type(2), .pilot-row .pilot-stat:nth-of-type(3) { display: none; }
  .session-table-row { grid-template-columns: 48px 1fr 85px 20px; }
  .session-table-row .session-meta, .session-table-row .status-badge { display: none; }
  .filter-bar { grid-template-columns: 1fr 1fr; }
  .filter-bar .search-input { grid-column: 1 / -1; }
  .error-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .test-grid, .station-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .topbar { padding: 10px 14px; }
  .topbar .user-chip { display: none; }
  .view-content { padding: 25px 14px 60px; }
  .view-heading { align-items: flex-start; flex-direction: column; }
  .view-heading h1 { font-size: 32px; }
  .kpi-grid, .modal-kpi-grid { grid-template-columns: 1fr 1fr; }
  .kpi-card { padding: 14px; }
  .kpi-card > strong { font-size: 23px; }
  .filter-bar { grid-template-columns: 1fr; }
  .filter-bar .search-input { grid-column: auto; }
  .panel { padding: 15px; }
  .pilot-row { grid-template-columns: 1fr auto; }
  .pilot-row .pilot-stat, .pilot-row .readiness-chip { display: none; }
  .session-table-row { grid-template-columns: 42px 1fr 16px; gap: 9px; }
  .session-table-row .status-badge { display: none; }
  .skill-grid, .knowledge-grid, .error-grid, .readiness-skill-grid { grid-template-columns: 1fr; }
  .modal-backdrop { padding: 0; place-items: stretch; }
  .modal { width: 100%; max-height: 100vh; border-radius: 0; }
  .modal-body { padding: 15px; }
  .session-modal-intro { grid-template-columns: 1fr; }
  .attempt-facts, .criteria-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-bar-row { grid-template-columns: 85px 1fr 28px; }
}