.professor-learning-support {
  --support-ink: var(--ink, #242321);
  --support-muted: var(--muted, #6d6a64);
  --support-line: var(--line, #dedbd2);
  --support-paper: var(--paper, #fffdfa);
  --support-soft: #f6f4ee;
  --support-blue: #1f69ad;
  --support-violet: #5a45d6;
  --support-green: #217b4b;
  --support-red: #aa344a;
}

.learning-support-shell { overflow: hidden; }
.learning-support-head { padding: clamp(1.5rem, 4vw, 3.2rem); background: linear-gradient(135deg, #f7f3ff, #edf6fb); }
.learning-support-head h1 { margin: .2rem 0 .55rem; font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -.045em; }
.learning-support-head p { margin: 0; max-width: 72rem; color: var(--support-muted); font-size: 1.05rem; line-height: 1.6; }
.learning-support-tabs { display: flex; gap: .35rem; padding: .7rem clamp(1rem, 4vw, 3rem); overflow-x: auto; border-block: 1px solid var(--support-line); background: var(--support-paper); scrollbar-width: thin; }
.learning-support-tabs button { display: inline-flex; align-items: center; gap: .55rem; flex: 0 0 auto; min-height: 2.8rem; padding: .65rem 1rem; border: 0; border-radius: 999px; color: var(--support-muted); background: transparent; font: inherit; font-weight: 700; cursor: pointer; }
.learning-support-tabs button:hover { background: var(--support-soft); color: var(--support-ink); }
.learning-support-tabs button.is-active { color: #155d9d; background: #e5f0fa; box-shadow: inset 0 0 0 1px #bdd6ed; }
.learning-support-tabs button:focus-visible,
.learning-support-shell button:focus-visible,
.learning-support-shell a:focus-visible,
.learning-support-dialog button:focus-visible,
.learning-support-dialog input:focus-visible,
.learning-support-dialog select:focus-visible,
.learning-support-dialog textarea:focus-visible { outline: 3px solid #71aee2; outline-offset: 2px; }
.learning-support-panel { min-height: 28rem; padding: clamp(1.25rem, 3vw, 2.5rem); background: var(--support-paper); }
.learning-support-loading { min-height: 22rem; }
.learning-support-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-bottom: 1.4rem; }
.learning-support-section-head h2 { margin: .2rem 0 .4rem; font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.035em; }
.learning-support-section-head p { max-width: 58rem; margin: 0; color: var(--support-muted); line-height: 1.55; }
.learning-support-notice { margin: 1rem clamp(1rem, 4vw, 3rem) 0; padding: .8rem 1rem; border-radius: .7rem; background: #edf6ff; color: #155d9d; font-weight: 700; }
.learning-support-notice.is-error { background: #fff0f2; color: var(--support-red); }
.learning-support-notice.is-success { background: #ebf8f0; color: var(--support-green); }
.learning-support-grid { display: grid; gap: 1rem; }
.learning-support-grid.is-rubrics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.learning-support-grid.is-accommodations { grid-template-columns: repeat(auto-fit, minmax(min(100%, 25rem), 1fr)); }
.learning-support-card { min-width: 0; border: 1px solid var(--support-line); border-radius: 1.1rem; background: #fff; box-shadow: 0 5px 18px rgba(44, 42, 36, .045); }
.rubric-card { display: flex; flex-direction: column; padding: 1.15rem; }
.rubric-card > header { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.rubric-card h3 { margin: .45rem 0 .25rem; font-size: 1.25rem; }
.rubric-card p { margin: 0; color: var(--support-muted); line-height: 1.45; }
.rubric-card > header > strong { display: flex; flex-direction: column; align-items: flex-end; color: var(--support-blue); font-size: 1.55rem; }
.rubric-card > header > strong small { color: var(--support-muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.status-pill { display: inline-flex; padding: .25rem .55rem; border-radius: 999px; color: #6b5a12; background: #fff6cf; font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.status-pill.is-active, .status-pill.is-released { color: #17683e; background: #dff4e8; }
.status-pill.is-archived { color: #716f68; background: #eeece7; }
.rubric-card dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; margin: 1.2rem 0; }
.rubric-card dl div { padding: .65rem; border-radius: .7rem; background: var(--support-soft); }
.rubric-card dt { color: var(--support-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; }
.rubric-card dd { margin: .15rem 0 0; font-size: 1.15rem; font-weight: 800; }
.rubric-card footer { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: auto; padding-top: .25rem; }
.learning-support-callout, .learning-support-hint { display: flex; align-items: center; gap: .8rem; margin: 0 0 1.25rem; padding: .95rem 1rem; border-radius: .85rem; background: #eef6fd; color: #315a7c; }
.learning-support-callout { justify-content: space-between; border-left: 4px solid var(--support-blue); }
.learning-support-callout > div { display: flex; align-items: center; gap: .75rem; }
.learning-support-callout span, .learning-support-hint span { display: flex; flex-direction: column; gap: .1rem; line-height: 1.35; }
.learning-support-callout small { color: var(--support-muted); }
.learning-support-hint.is-sensitive { background: #f5f1fb; color: #5c4780; }
.learning-support-controls { display: flex; align-items: end; gap: .8rem; margin: 1.2rem 0; }
.learning-support-controls > label { display: grid; gap: .35rem; color: var(--support-muted); font-size: .78rem; font-weight: 800; }
.learning-support-search { position: relative; flex: 1; max-width: 36rem; }
.learning-support-search > i { position: absolute; left: .8rem; bottom: .8rem; color: var(--support-muted); }
.learning-support-controls input, .learning-support-controls select,
.learning-support-dialog input, .learning-support-dialog select, .learning-support-dialog textarea,
.accommodation-card input, .outcome-mapping-editor input, .outcome-mapping-editor select { width: 100%; min-height: 2.75rem; padding: .65rem .75rem; border: 1px solid #d3d0c7; border-radius: .65rem; color: var(--support-ink); background: #fff; font: inherit; box-sizing: border-box; }
.learning-support-search input { padding-left: 2.35rem; }
.learning-support-controls output { margin-left: auto; color: var(--support-muted); font-size: .86rem; }
.accommodation-card { padding: 1.1rem; }
.accommodation-card > header { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .75rem; align-items: center; }
.learning-support-avatar { display: grid; place-items: center; width: 2.65rem; height: 2.65rem; border-radius: .8rem; color: #155d9d; background: #e5f0fa; font-weight: 800; }
.accommodation-card h3 { margin: 0 0 .2rem; font-size: 1.05rem; }
.accommodation-card p { margin: 0; overflow: hidden; color: var(--support-muted); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.learning-support-switch { display: inline-flex; gap: .4rem; align-items: center; font-size: .82rem; font-weight: 800; }
.learning-support-switch input { width: 1.05rem; min-height: 1.05rem; }
.accommodation-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin-top: 1rem; }
.accommodation-fields label { display: grid; gap: .35rem; color: var(--support-muted); font-size: .76rem; font-weight: 800; }
.input-suffix { display: flex; align-items: center; border: 1px solid #d3d0c7; border-radius: .65rem; overflow: hidden; background: #fff; }
.input-suffix input { border: 0; border-radius: 0; }
.input-suffix b { padding-right: .65rem; color: var(--support-muted); white-space: nowrap; }
.accommodation-card > footer { display: flex; justify-content: space-between; align-items: center; gap: .8rem; margin-top: .9rem; }
.accommodation-card > footer small { color: var(--support-muted); }

.learning-support-dialog { width: min(70rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 0; border: 0; border-radius: 1.2rem; color: var(--support-ink); background: var(--support-paper); box-shadow: 0 24px 80px rgba(20, 20, 20, .28); }
.learning-support-dialog::backdrop { background: rgba(28, 30, 35, .62); backdrop-filter: blur(2px); }
.learning-support-dialog-form { display: flex; flex-direction: column; max-height: calc(100vh - 2rem); }
.learning-support-dialog-head { display: flex; justify-content: space-between; gap: 1rem; padding: 1.35rem 1.5rem; border-bottom: 1px solid var(--support-line); background: linear-gradient(135deg, #f7f3ff, #edf6fb); }
.learning-support-dialog-head h2 { margin: .2rem 0; font-size: 1.7rem; }
.learning-support-dialog-head p { max-width: 52rem; margin: 0; color: var(--support-muted); line-height: 1.45; }
.learning-support-dialog-body { padding: 1.35rem 1.5rem 1.8rem; overflow-y: auto; }
.learning-support-dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: .6rem; padding: .9rem 1.5rem; border-top: 1px solid var(--support-line); background: #fff; }
.learning-support-dialog-actions output { margin-right: auto; color: var(--support-muted); font-weight: 700; }
.learning-support-dialog-actions output.is-error { color: var(--support-red); }
.learning-support-dialog-actions output.is-success { color: var(--support-green); }
.learning-support-form-grid { display: grid; grid-template-columns: 2fr 1fr; gap: .85rem; }
.learning-support-form-grid label, .rubric-criterion-fields label, .rubric-level-row label { display: grid; gap: .35rem; color: var(--support-muted); font-size: .78rem; font-weight: 800; }
.learning-support-form-grid .is-wide, .rubric-criterion-fields .is-wide, .rubric-level-row .is-wide { grid-column: 1 / -1; }
.rubric-criteria { display: grid; gap: 1rem; margin: 1.2rem 0; }
.rubric-criterion-editor { margin: 0; padding: 1rem; border: 1px solid var(--support-line); border-radius: .9rem; background: var(--support-soft); }
.rubric-criterion-editor legend { display: flex; justify-content: space-between; align-items: center; width: calc(100% - .5rem); padding: 0 .25rem; font-weight: 800; }
.rubric-criterion-fields { display: grid; grid-template-columns: 2fr 1fr; gap: .7rem; }
.rubric-levels { display: grid; gap: .55rem; margin: 1rem 0 .7rem; }
.rubric-level-row { display: grid; grid-template-columns: minmax(9rem, 1fr) 7rem 2fr auto; gap: .55rem; align-items: end; padding: .7rem; border-radius: .75rem; background: #fff; }
.rubric-level-row .is-wide { grid-column: auto; }
.icon-button { display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; padding: 0; border: 1px solid var(--support-line); border-radius: .65rem; color: var(--support-muted); background: transparent; cursor: pointer; }
.icon-button:hover { color: var(--support-ink); background: var(--support-soft); }
.rubric-grade-summary { display: flex; align-items: baseline; gap: .55rem; margin-bottom: 1rem; padding: 1rem; border-radius: .85rem; color: #fff; background: linear-gradient(135deg, #286cae, #5948c8); }
.rubric-grade-summary strong { font-size: 1.7rem; }
.rubric-grade-criterion { margin: 0 0 1rem; padding: 1rem; border: 1px solid var(--support-line); border-radius: .9rem; }
.rubric-grade-criterion legend { display: flex; justify-content: space-between; gap: 1rem; width: calc(100% - .5rem); padding: 0 .25rem; }
.rubric-grade-criterion legend span { display: flex; flex-direction: column; }
.rubric-grade-criterion legend small { color: var(--support-muted); font-weight: 400; }
.rubric-grade-levels { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .6rem; margin: .8rem 0; }
.rubric-grade-levels label { cursor: pointer; }
.rubric-grade-levels input { position: absolute; opacity: 0; pointer-events: none; }
.rubric-grade-levels label > span { display: block; min-height: 5.4rem; padding: .8rem; border: 2px solid var(--support-line); border-radius: .75rem; background: #fff; }
.rubric-grade-levels input:checked + span { border-color: var(--support-violet); background: #f1efff; box-shadow: 0 0 0 2px rgba(90, 69, 214, .1); }
.rubric-grade-levels input:focus-visible + span { outline: 3px solid #71aee2; outline-offset: 2px; }
.rubric-grade-levels b { display: flex; justify-content: space-between; gap: .5rem; }
.rubric-grade-levels small { display: block; margin-top: .35rem; color: var(--support-muted); line-height: 1.35; }
.rubric-grade-feedback, .rubric-overall-feedback { display: grid; gap: .35rem; color: var(--support-muted); font-size: .78rem; font-weight: 800; }
.rubric-overall-feedback { margin-top: 1rem; }
.rubric-grade-audit { margin-top: 1rem; border-top: 1px solid var(--support-line); }
.rubric-grade-audit summary { display: flex; align-items: center; gap: .5rem; padding: 1rem 0; cursor: pointer; font-weight: 800; }
.rubric-grade-audit ol { margin: 0; padding-left: 1.5rem; }
.rubric-grade-audit li { display: grid; grid-template-columns: 1fr auto auto; gap: 1rem; padding: .5rem; }

.attainment-report, .outcome-mapping-editor, .outcome-catalogue { margin-bottom: 1rem; padding: 1.1rem; border: 1px solid var(--support-line); border-radius: 1rem; background: #fff; }
.attainment-report > header, .outcome-mapping-editor > header, .outcome-mapping-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.attainment-report h3, .outcome-mapping-editor h3, .outcome-mapping-head h4 { margin: 0 0 .25rem; }
.attainment-report p, .outcome-mapping-editor p, .outcome-mapping-head p { margin: 0; color: var(--support-muted); }
.attainment-report details { max-width: 34rem; }
.attainment-report summary { cursor: pointer; font-weight: 800; }
.attainment-report dl { display: grid; gap: .45rem; }
.attainment-report dl div { padding: .55rem; border-radius: .55rem; background: var(--support-soft); }
.attainment-report dt { font-weight: 800; }
.attainment-report dd { margin: .15rem 0 0; color: var(--support-muted); }
.attainment-group { margin-top: 1.2rem; }
.attainment-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .65rem; }
.attainment-card { padding: .8rem; border-left: 4px solid #aaa69d; border-radius: .65rem; background: var(--support-soft); }
.attainment-card.is-met { border-color: var(--support-green); }
.attainment-card.is-near { border-color: #b07b0b; }
.attainment-card.is-needs_attention { border-color: var(--support-red); }
.attainment-card header { display: flex; justify-content: space-between; gap: .7rem; }
.attainment-card header span { color: var(--support-muted); font-size: .76rem; font-weight: 800; text-transform: uppercase; }
.attainment-card header strong { color: var(--support-violet); font-size: 1.25rem; }
.attainment-card h4 { margin: .4rem 0; }
.attainment-card p, .attainment-card small { color: var(--support-muted); line-height: 1.35; }
.outcome-mapping-editor > section { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--support-line); }
.outcome-mapping-row { display: grid; grid-template-columns: minmax(9rem, 1fr) auto minmax(9rem, 1fr) 6rem auto; gap: .55rem; align-items: end; margin-top: .65rem; padding: .65rem; border-radius: .7rem; background: var(--support-soft); }
.outcome-mapping-row label { display: grid; gap: .25rem; color: var(--support-muted); font-size: .73rem; font-weight: 800; }
.outcome-mapping-arrow { align-self: center; color: var(--support-muted); }
.outcome-mapping-editor output { display: block; min-height: 1.3rem; margin-top: .7rem; color: var(--support-green); font-weight: 700; }
.outcome-mapping-editor output.is-error { color: var(--support-red); }
.outcome-catalogue > summary { display: flex; align-items: center; gap: .75rem; cursor: pointer; }
.outcome-catalogue > summary > span { display: flex; flex: 1; flex-direction: column; }
.outcome-catalogue > summary small { color: var(--support-muted); }
.outcome-catalogue-list { display: grid; gap: .5rem; margin-top: 1rem; }
.outcome-catalogue-list article { display: grid; grid-template-columns: auto 1fr; gap: .65rem; padding: .6rem; border-radius: .65rem; background: var(--support-soft); }
.outcome-catalogue-list article > span { font-weight: 800; }
.outcome-catalogue-list article div { display: flex; flex-direction: column; }
.outcome-catalogue-list small { color: var(--support-muted); }
.outcome-admin-forms { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
.outcome-admin-forms form { display: grid; gap: .55rem; padding: .8rem; border: 1px solid var(--support-line); border-radius: .7rem; }
.outcome-admin-forms h4 { margin: 0; }
.outcome-admin-forms label { display: grid; gap: .25rem; color: var(--support-muted); font-size: .78rem; font-weight: 800; }

.accessibility-summary { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; margin-bottom: 1rem; padding: 1rem; border-radius: .9rem; background: var(--support-soft); }
.accessibility-summary > article { display: flex; gap: .7rem; align-items: center; }
.accessibility-summary > article > i { display: grid; place-items: center; width: 2.7rem; height: 2.7rem; border-radius: .75rem; color: #fff; background: var(--support-green); }
.accessibility-summary > article.is-needs_attention > i { background: var(--support-red); }
.accessibility-summary > article.is-review > i { background: #a46f09; }
.accessibility-summary > article span { display: flex; flex-direction: column; }
.accessibility-summary > article small { color: var(--support-muted); }
.accessibility-summary dl { display: flex; gap: .6rem; margin: 0; }
.accessibility-summary dl div { min-width: 5rem; padding: .55rem; border-radius: .6rem; text-align: center; background: #fff; }
.accessibility-summary dt { color: var(--support-muted); font-size: .72rem; text-transform: uppercase; }
.accessibility-summary dd { margin: .15rem 0 0; font-size: 1.2rem; font-weight: 800; }
.accessibility-issue-list { display: grid; gap: .6rem; }
.accessibility-issue { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .8rem; align-items: center; padding: .85rem; border: 1px solid var(--support-line); border-left: 4px solid #b07b0b; border-radius: .75rem; background: #fff; }
.accessibility-issue.is-error { border-left-color: var(--support-red); }
.accessibility-issue-icon { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: .65rem; color: #90620c; background: #fff3d6; }
.accessibility-issue.is-error .accessibility-issue-icon { color: var(--support-red); background: #fff0f2; }
.accessibility-issue header { display: flex; gap: .4rem; }
.accessibility-issue header span { color: var(--support-muted); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.accessibility-issue code { font-size: .72rem; }
.accessibility-issue h3 { margin: .2rem 0; font-size: 1rem; }
.accessibility-issue p { margin: 0; color: var(--support-muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .learning-support-section-head, .learning-support-callout, .attainment-report > header, .outcome-mapping-editor > header, .outcome-mapping-head { align-items: stretch; flex-direction: column; }
  .learning-support-section-head button, .learning-support-callout button { width: 100%; justify-content: center; }
  .accommodation-fields, .learning-support-form-grid, .rubric-criterion-fields, .outcome-admin-forms { grid-template-columns: 1fr; }
  .learning-support-form-grid .is-wide, .rubric-criterion-fields .is-wide { grid-column: auto; }
  .rubric-level-row { grid-template-columns: minmax(0, 1fr) 6rem auto; }
  .rubric-level-row .is-wide { grid-column: 1 / -1; }
  .outcome-mapping-row { grid-template-columns: 1fr auto; }
  .outcome-mapping-row label { grid-column: 1 / -1; }
  .outcome-mapping-arrow { display: none; }
  .outcome-mapping-row .is-weight { grid-column: 1; }
  .accessibility-summary { grid-template-columns: 1fr; }
  .accessibility-issue { grid-template-columns: auto minmax(0, 1fr); }
  .accessibility-issue > a { grid-column: 1 / -1; justify-content: center; }
  .learning-support-dialog-actions { flex-wrap: wrap; }
  .learning-support-dialog-actions output { flex: 1 0 100%; }
}

@media (max-width: 520px) {
  .learning-support-panel { padding: 1rem; }
  .learning-support-tabs { padding-inline: .75rem; }
  .learning-support-tabs button { min-width: max-content; }
  .accommodation-card > header { grid-template-columns: auto minmax(0, 1fr); }
  .learning-support-switch { grid-column: 1 / -1; }
  .accommodation-card > footer { align-items: stretch; flex-direction: column; }
  .rubric-card dl { grid-template-columns: 1fr; }
  .rubric-level-row { grid-template-columns: minmax(0, 1fr) auto; }
  .rubric-level-row .is-points, .rubric-level-row .is-wide { grid-column: 1 / -1; }
  .learning-support-dialog { width: 100vw; max-width: none; max-height: 100vh; margin: 0; border-radius: 0; }
  .learning-support-dialog-form { max-height: 100vh; }
}

@media (prefers-reduced-motion: reduce) {
  .professor-learning-support, .learning-support-dialog, .learning-support-dialog-body { scroll-behavior: auto; }
}