/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

:root {
  --staff-ink: #171b22;
  --staff-gold: #c9972f;
  --staff-cream: #f6f1e7;
  --staff-line: #ded8cc;
  --staff-muted: #656a71;
  --staff-surface: #fff;
  --staff-canvas: #f7f7f5;
  --staff-subtle: #faf9f6;
}

.academic-panel { margin-bottom: 24px; padding: clamp(22px, 3vw, 32px); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.academic-panel > h2, .academic-panel-heading h2 { margin: 0; font: 500 27px/1.2 Georgia, serif; }
.academic-panel > h2 span { color: var(--staff-muted); font: 700 12px system-ui, sans-serif; }
.academic-panel-heading { margin-bottom: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.academic-panel-heading p { margin: 4px 0 0; color: var(--staff-muted); }
.academic-actions { display: flex; gap: 8px; }
.academic-actions form { margin: 0; }
.academic-summary-grid { margin: 0 -32px 28px; display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--staff-line); }
.academic-summary-grid div { padding: 18px 32px; display: grid; border-right: 1px solid var(--staff-line); }
.academic-summary-grid div:last-child { border-right: 0; }
.academic-summary-grid strong { font: 500 30px/1.1 Georgia, serif; }
.academic-summary-grid span, .academic-row span { color: var(--staff-muted); font-size: 11px; }
.academic-two-column, .academic-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.academic-detail-grid { grid-template-columns: minmax(0, 1.2fr) minmax(330px, .8fr); }
.academic-two-column h3, .academic-subject h3 { margin: 0 0 12px; font-size: 15px; }
.academic-row { min-height: 61px; padding: 12px 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid #e8e5df; }
.academic-row div { min-width: 0; display: grid; }
.academic-link-row { color: inherit; text-decoration: none; }
.academic-link-row:hover strong { color: #795510; }
.academic-link-row > div:last-child { flex: 0 0 auto; text-align: right; }
.staff-text-button { padding: 5px; border: 0; background: none; color: #8a4c42; font: 700 11px system-ui, sans-serif; cursor: pointer; }
.academic-inline-form, .academic-stack-form { margin-top: 15px; display: flex; flex-wrap: wrap; gap: 8px; }
.academic-inline-form input:not([type=submit]), .academic-inline-form select, .academic-stack-form input:not([type=submit]), .academic-stack-form select { min-width: 0; padding: 9px 10px; border: 1px solid #c9c5bc; background: var(--staff-surface); font: inherit; }
.academic-stack-form { display: grid; }
.academic-stack-form > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.academic-stack-form label { font-size: 12px; }
.academic-subject-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.academic-subject { padding: 20px; border: 1px solid var(--staff-line); }
.academic-subject h3 span { float: right; color: var(--staff-muted); font-size: 10px; }
.academic-new-subject, .academic-import-form { padding-top: 22px; border-top: 1px solid var(--staff-line); }
.academic-import-form { display: flex; align-items: center; gap: 12px; }
.schedule-heading { margin-bottom: 24px; display: flex; align-items: end; justify-content: space-between; gap: 32px; }
.schedule-heading h1 { margin: 5px 0 8px; font: 500 clamp(38px, 5vw, 58px)/1 Georgia, serif; }
.schedule-heading p { margin: 0; color: var(--staff-muted); }
.schedule-back { display: inline-block; margin-bottom: 20px; color: #795510; font-size: 12px; font-weight: 750; text-decoration: none; }
.schedule-heading-actions { display: flex; align-items: end; gap: 9px; }
.schedule-year-picker { min-width: 250px; }
.schedule-year-picker > label { display: block; margin-bottom: 6px; color: var(--staff-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.schedule-year-picker > div { display: flex; gap: 7px; }
.schedule-year-picker select { min-width: 135px; padding: 10px 32px 10px 11px; border: 1px solid #c9c5bc; background: var(--staff-surface); font: inherit; }
.schedule-view-switch { width: fit-content; margin: 0 0 14px auto; display: flex; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.schedule-view-switch a { min-width: 190px; padding: 10px 14px; display: grid; border-right: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.schedule-view-switch a:last-child { border-right: 0; }
.schedule-view-switch strong { font-size: 11px; }
.schedule-view-switch span { color: var(--staff-muted); font-size: 9px; }
.schedule-view-switch a.active { background: #2c3a43; color: #fff; }
.schedule-view-switch a.active span { color: #c5cdd1; }
.schedule-day-tabs { margin-bottom: 14px; display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.schedule-day-tabs a { min-width: 0; padding: 13px 16px; display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 0 8px; border-right: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.schedule-day-tabs a:last-child { border-right: 0; }
.schedule-day-tabs a > span { color: #896214; font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.schedule-day-tabs a > strong { font: 500 17px/1 Georgia, serif; }
.schedule-day-tabs a > small { grid-column: 2; color: var(--staff-muted); font-size: 9px; }
.schedule-day-tabs a.active { background: #2c3a43; color: #fff; }
.schedule-day-tabs a.active > span { color: #e4c779; }
.schedule-day-tabs a.active > small { color: #bbc4c9; }
.schedule-matrix-scroll { max-width: 100%; overflow-x: auto; border: 1px solid #cfd2d2; background: var(--staff-surface); box-shadow: 0 14px 35px rgba(29, 38, 43, .05); scrollbar-gutter: stable; }
.schedule-matrix { min-width: 1340px; display: grid; grid-template-columns: 76px repeat(9, minmax(136px, 1fr)); grid-template-rows: 62px var(--schedule-height); }
.schedule-matrix-corner, .schedule-grade-heading { position: sticky; top: 0; z-index: 3; padding: 12px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid rgba(255,255,255,.14); background: #2c3a43; color: #fff; }
.schedule-matrix-corner { left: 0; z-index: 4; align-items: center; color: #bbc4c9; font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.schedule-grade-heading > span { font: 500 16px/1.15 Georgia, serif; }
.schedule-grade-heading > small { margin-top: 4px; color: #c3cbd0; font-size: 8px; }
.schedule-time-rail { position: sticky; left: 0; z-index: 2; height: var(--schedule-height); background: #f0f1ef; border-right: 1px solid #cfd2d2; }
.schedule-time-rail time { position: absolute; top: var(--time-offset); right: 0; width: 100%; padding: 0 9px; display: flex; align-items: baseline; justify-content: flex-end; gap: 2px; transform: translateY(-7px); }
.schedule-time-rail time:first-child { transform: translateY(4px); }
.schedule-time-rail strong { font: 500 13px/1 Georgia, serif; }
.schedule-time-rail span { color: var(--staff-muted); font-size: 7px; font-weight: 800; }
.schedule-canvas { position: relative; grid-column: 2 / -1; height: var(--schedule-height); overflow: hidden; background: repeating-linear-gradient(to bottom, transparent 0, transparent 39.5px, rgba(55,65,70,.035) 40.5px); }
.schedule-grade-guide { position: absolute; top: 0; bottom: 0; left: var(--grade-left); width: var(--grade-width); border-right: 1px solid #d7d9d8; pointer-events: none; }
.schedule-block { position: absolute; z-index: 1; top: var(--block-top); left: calc(var(--block-left) + 4px); width: calc(var(--block-width) - 8px); height: var(--block-height); min-height: 18px; padding: 4px 7px; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border: 1px solid rgba(35,40,43,.25); border-radius: 2px; color: #243038; text-align: left; touch-action: none; cursor: grab; transition: filter .12s, transform .12s; }
.schedule-block:hover { z-index: 2; filter: brightness(.97); transform: scale(1.015); }
.schedule-block.is-dragging { z-index: 8; cursor: grabbing; box-shadow: 0 12px 30px rgba(35,40,43,.24); opacity: .9; transition: none; }
.schedule-block.is-saving { opacity: .55; pointer-events: none; }
.schedule-block > span { width: 100%; min-width: 0; overflow: hidden; font-size: 7px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; opacity: .68; text-overflow: ellipsis; white-space: nowrap; }
.schedule-block > strong { width: 100%; overflow: hidden; font-size: 11px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.schedule-block > strong, .schedule-block > small { min-width: 0; }
.schedule-block > small { width: 100%; overflow: hidden; font-size: 8px; opacity: .75; text-overflow: ellipsis; white-space: nowrap; }
.schedule-block.compact { padding-block: 2px; }
.schedule-block.compact > span, .schedule-block.compact > small { display: none; }
.schedule-block.compact > strong { font-size: 10px; }
.schedule-block.micro > strong { font-size: 9px; }
.schedule-resize-handle { position: absolute; right: 0; bottom: 0; left: 0; height: 6px; cursor: ns-resize; opacity: 0; transition: opacity .12s; }
.schedule-resize-handle::after { position: absolute; right: calc(50% - 9px); bottom: 2px; width: 18px; border-top: 2px solid currentColor; content: ""; opacity: .45; }
.schedule-block:hover .schedule-resize-handle, .schedule-block.is-dragging .schedule-resize-handle { opacity: 1; }
.schedule-column-add { position: absolute; left: calc(var(--grade-right) - 48px); bottom: 7px; z-index: 1; padding: 4px 7px; border: 1px dashed #b4b9ba; background: rgba(255,255,255,.88); color: #657077; font: 750 9px system-ui, sans-serif; cursor: pointer; opacity: 0; transition: opacity .15s; }
.schedule-canvas:hover .schedule-column-add { opacity: 1; }
.schedule-legend { padding: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px 18px; }
.schedule-legend span { display: flex; align-items: center; gap: 6px; color: var(--staff-muted); font-size: 9px; font-weight: 750; }
.schedule-legend i { width: 11px; height: 11px; border: 1px solid rgba(35,40,43,.2); background: var(--schedule-color); }
.category-class_period { --schedule-color: #cfe4f6; background: var(--schedule-color); }
.category-chapel { --schedule-color: #e3d7ed; background: var(--schedule-color); }
.category-morning_meeting { --schedule-color: #f0ece3; background: var(--schedule-color); }
.category-recess { --schedule-color: #f5e59d; background: var(--schedule-color); }
.category-lunch { --schedule-color: #bfe8e2; background: var(--schedule-color); }
.category-specials { --schedule-color: #f2c485; background: var(--schedule-color); }
.category-transition { --schedule-color: #e6e6e3; background: var(--schedule-color); }
.category-dismissal { --schedule-color: #d7ddd9; background: var(--schedule-color); }
.category-other { --schedule-color: #d8e1e3; background: var(--schedule-color); }
.schedule-block-popover { width: min(560px, calc(100vw - 28px)); max-height: calc(100vh - 40px); padding: 0; overflow: auto; border: 1px solid #c9c5bc; background: var(--staff-surface); color: var(--staff-ink); box-shadow: 0 24px 70px rgba(20,25,28,.28); }
.schedule-block-popover::backdrop { background: rgba(31,38,42,.45); }
.schedule-block-popover header { padding: 23px 26px; display: flex; align-items: start; justify-content: space-between; border-bottom: 1px solid var(--staff-line); }
.schedule-block-popover h2 { margin: 4px 0 0; font: 500 28px/1.1 Georgia, serif; }
.schedule-block-popover header > button { padding: 0; border: 0; background: none; color: #697177; font-size: 28px; cursor: pointer; }
.schedule-block-form { padding: 25px 26px; }
.schedule-block-form > .staff-field { margin-bottom: 20px; }
.schedule-grade-picker { margin: 0 0 20px; padding: 0; border: 0; }
.schedule-grade-picker legend { margin-bottom: 8px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.schedule-grade-picker > p { margin: -3px 0 12px; color: var(--staff-muted); font-size: 11px; }
.schedule-grade-picker > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.schedule-grade-picker > .schedule-audience-presets { margin-bottom: 8px; display: flex; flex-wrap: wrap; gap: 5px; }
.schedule-audience-presets button { padding: 5px 8px; border: 1px solid #c8c4bc; background: #f7f5f0; color: #4e585e; font: 750 9px system-ui, sans-serif; cursor: pointer; }
.schedule-audience-presets button:hover { border-color: #9d762d; color: #795510; }
.schedule-grade-picker label { position: relative; cursor: pointer; }
.schedule-grade-picker input { position: absolute; opacity: 0; }
.schedule-grade-picker span { min-height: 36px; padding: 8px; display: grid; place-items: center; border: 1px solid #cbc7bf; background: var(--staff-surface); font-size: 10px; font-weight: 750; }
.schedule-grade-picker input:checked + span { border-color: #2c3a43; background: #2c3a43; color: #fff; }
.schedule-block-actions { margin: 24px -26px -25px; padding: 18px 26px; display: flex; justify-content: space-between; gap: 9px; border-top: 1px solid var(--staff-line); background: var(--staff-cream); }
.schedule-editor-loading { padding: 60px 24px; color: var(--staff-muted); text-align: center; }
.schedule-editor-error { margin: 24px; padding: 30px; display: grid; gap: 5px; border-left: 4px solid #a13c31; background: #fdf0ed; }
.schedule-editor-error span { color: var(--staff-muted); font-size: 12px; }
.schedule-week-toolbar { margin-bottom: 14px; padding: 18px 20px; display: flex; align-items: end; justify-content: space-between; gap: 24px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.schedule-week-toolbar h2 { margin: 2px 0 3px; font: 500 24px/1.1 Georgia, serif; }
.schedule-week-toolbar > div > span { color: var(--staff-muted); font-size: 11px; }
.schedule-week-toolbar form > label { display: block; margin-bottom: 6px; color: var(--staff-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.schedule-week-toolbar form > div { display: flex; gap: 7px; }
.schedule-week-toolbar select { min-width: 160px; padding: 10px 32px 10px 11px; border: 1px solid #c9c5bc; background: var(--staff-surface); font: inherit; }
.schedule-week-matrix { min-width: 980px; display: grid; grid-template-columns: 76px repeat(5, minmax(180px, 1fr)); grid-template-rows: 62px var(--schedule-height); }
.schedule-week-canvas { position: relative; grid-column: 2 / -1; height: var(--schedule-height); overflow: hidden; background: repeating-linear-gradient(to bottom, transparent 0, transparent 39.5px, rgba(55,65,70,.035) 40.5px); }
.schedule-week-guide { position: absolute; top: 0; bottom: 0; left: var(--day-left); width: 20%; border-right: 1px solid #d7d9d8; pointer-events: none; }
.schedule-week-block { cursor: pointer; }
.attendance-heading-actions { display: flex; gap: 8px; }
.attendance-toolbar { margin-bottom: 18px; padding: 18px 20px; display: flex; align-items: end; justify-content: space-between; gap: 24px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.attendance-toolbar form { display: flex; align-items: end; gap: 9px; }
.attendance-toolbar nav { display: flex; align-items: center; gap: 18px; }
.attendance-toolbar nav a { color: #795510; font-size: 11px; font-weight: 750; text-decoration: none; }
.attendance-summary { margin-bottom: 18px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.attendance-summary div { padding: 17px 20px; display: grid; border-right: 1px solid var(--staff-line); }
.attendance-summary div:last-child { border-right: 0; }
.attendance-summary strong { font: 500 27px/1 Georgia, serif; }
.attendance-summary span { margin-top: 4px; color: var(--staff-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.attendance-notice-strip { margin-bottom: 18px; padding: 14px 18px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; border-left: 4px solid var(--staff-gold); background: #fff8e8; }
.attendance-notice-strip span { color: var(--staff-muted); font-size: 11px; }
.attendance-notice-strip a { color: #795510; font-size: 11px; font-weight: 750; }
.attendance-section-list { display: grid; gap: 18px; }
.attendance-section { border: 1px solid var(--staff-line); background: var(--staff-surface); }
.attendance-section > header { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--staff-line); background: #2c3a43; color: #fff; }
.attendance-section > header h2 { margin: 2px 0 0; font: 500 23px/1.1 Georgia, serif; }
.attendance-section > header div > span { color: #e4c779; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.attendance-section > header p { margin: 0; display: grid; text-align: right; }
.attendance-section > header p strong { color: #9fe0c8; font-size: 10px; text-transform: uppercase; letter-spacing: .07em; }
.attendance-section > header p.missing strong { color: #f1c86c; }
.attendance-section > header p span { color: #c5cdd1; font-size: 9px; }
.attendance-student { min-height: 72px; padding: 12px 18px; display: grid; grid-template-columns: minmax(170px, 1fr) auto 70px; align-items: center; gap: 18px; border-bottom: 1px solid #e7e5e0; }
.attendance-student-name { min-width: 0; display: grid; }
.attendance-student-name span { color: var(--staff-muted); font-size: 10px; }
.attendance-status-options { display: flex; gap: 5px; }
.attendance-status-options label { position: relative; cursor: pointer; }
.attendance-status-options input { position: absolute; opacity: 0; }
.attendance-status-options span { min-width: 68px; padding: 7px 9px; display: block; border: 1px solid #d0cdc6; color: #596268; font-size: 9px; font-weight: 800; text-align: center; text-transform: uppercase; }
.attendance-status-options input:checked + span { border-color: #2c3a43; background: #2c3a43; color: #fff; }
.attendance-status-options .absent input:checked + span { border-color: #9b3e35; background: #9b3e35; }
.attendance-status-options .tardy input:checked + span, .attendance-status-options .early_dismissal input:checked + span { border-color: #b47d1f; background: #d8a340; color: #222; }
.attendance-student details { position: relative; }
.attendance-student summary { color: #795510; font-size: 10px; font-weight: 750; cursor: pointer; }
.attendance-student details > div { position: absolute; z-index: 5; top: 28px; right: 0; width: min(520px, calc(100vw - 60px)); padding: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; border: 1px solid #c9c5bc; background: var(--staff-surface); box-shadow: 0 14px 35px rgba(20,25,28,.18); }
.attendance-student details label { display: grid; gap: 5px; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.attendance-student details label.full { grid-column: 1 / -1; }
.attendance-student details select, .attendance-student details input[type=number], .attendance-student details input[type=text] { min-width: 0; padding: 8px; border: 1px solid #c9c5bc; font: 12px system-ui, sans-serif; }
.attendance-student details label.attendance-excused { display: flex; align-items: center; gap: 7px; }
.attendance-roster > footer { padding: 16px 18px; display: flex; justify-content: flex-end; gap: 8px; background: var(--staff-cream); }
.attendance-notice-list { display: grid; gap: 12px; }
.attendance-notice-list article { padding: 20px; display: grid; grid-template-columns: 1fr minmax(280px, .6fr); align-items: center; gap: 25px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.attendance-notice-list h2 { margin: 3px 0; font: 500 22px/1.1 Georgia, serif; }
.attendance-notice-list p { margin: 3px 0; color: var(--staff-muted); }
.attendance-notice-list article > div > span { color: #896214; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.attendance-notice-list form { display: grid; gap: 8px; }
.attendance-notice-list select, .attendance-notice-list input { padding: 9px; border: 1px solid #c9c5bc; font: inherit; }
.attendance-history article { padding: 12px 0; display: grid; grid-template-columns: 60px 1fr; align-items: center; gap: 14px; border-top: 1px solid #e8e2d8; }
.attendance-history time, .attendance-history article > div { display: grid; }
.attendance-history time span, .attendance-history article > div span { color: #70777b; font-size: 10px; }

@media (max-width: 760px) {
  .academic-panel-heading, .academic-actions, .academic-import-form { align-items: stretch; flex-direction: column; }
  .academic-summary-grid { margin-inline: -22px; }
  .academic-summary-grid div { padding: 15px; }
  .academic-two-column, .academic-detail-grid, .academic-subject-grid { grid-template-columns: 1fr; }
  .academic-inline-form { display: grid; }
  .schedule-heading, .schedule-heading-actions { align-items: stretch; flex-direction: column; }
  .schedule-year-picker { min-width: 0; }
  .schedule-year-picker > div, .schedule-year-picker select { width: 100%; }
  .schedule-day-tabs { display: flex; overflow-x: auto; }
  .schedule-day-tabs a { min-width: 120px; flex: 1 0 auto; }
  .schedule-matrix { grid-template-columns: 64px repeat(9, 132px); }
  .schedule-column-add { opacity: 1; }
  .schedule-block-popover header, .schedule-block-form { padding-inline: 20px; }
  .schedule-block-actions { margin-inline: -20px; padding-inline: 20px; }
  .schedule-view-switch { width: 100%; margin-left: 0; }
  .schedule-view-switch a { min-width: 0; flex: 1; }
  .schedule-week-toolbar { align-items: stretch; flex-direction: column; }
  .schedule-week-toolbar form > div, .schedule-week-toolbar select { width: 100%; }
  .attendance-heading-actions, .attendance-toolbar, .attendance-toolbar form, .attendance-toolbar nav { align-items: stretch; flex-direction: column; }
  .attendance-summary { grid-template-columns: 1fr 1fr; }
  .attendance-summary div:nth-child(2) { border-right: 0; }
  .attendance-summary div:nth-child(-n+2) { border-bottom: 1px solid var(--staff-line); }
  .attendance-notice-strip { grid-template-columns: 1fr; }
  .attendance-student { grid-template-columns: 1fr; gap: 9px; }
  .attendance-status-options { display: grid; grid-template-columns: 1fr 1fr; }
  .attendance-status-options span { width: 100%; }
  .attendance-student details > div { position: static; width: 100%; margin-top: 10px; box-shadow: none; }
  .attendance-notice-list article { grid-template-columns: 1fr; }
}

* { box-sizing: border-box; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.staff-body { margin: 0; background: var(--staff-canvas); color: var(--staff-ink); font: 15px/1.5 system-ui, sans-serif; }
.staff-app-shell { min-height: 100vh; display: grid; grid-template-columns: 228px minmax(0, 1fr); }
.staff-app-sidebar { position: sticky; top: 0; height: 100vh; padding: 18px 12px; display: flex; flex-direction: column; border-right: 1px solid #dfe2e5; background: var(--staff-surface); }
.staff-app-brand { padding: 5px 10px 22px; display: block; color: inherit; text-decoration: none; }
.staff-app-brand img { width: 180px; }
.staff-app-brand span { margin-top: 8px; display: block; color: #7a838a; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }
.staff-app-sidebar > nav { min-height: 0; display: grid; gap: 3px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #c4c9cc transparent; }
.staff-app-sidebar nav p { margin: 19px 10px 6px; color: #7a838a; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.staff-app-sidebar nav a { min-height: 39px; padding: 9px 11px; display: flex; align-items: center; gap: 10px; border-radius: 4px; color: #33424b; font-size: 13px; font-weight: 650; text-decoration: none; }
.staff-app-sidebar nav a > span { width: 18px; color: #71808a; text-align: center; }
.staff-app-sidebar nav a:hover { background: #f3f5f6; }
.staff-app-sidebar nav a.active { background: #e9f4f7; color: #165d6d; }
.staff-app-sidebar nav a.active > span { color: #16849b; }
.staff-sidebar-footer { flex: 0 0 auto; margin-top: 8px; padding: 14px 10px 4px; display: grid; gap: 8px; border-top: 1px solid #e3e5e6; color: #68747b; font-size: 11px; }
.staff-sidebar-footer a { color: #375d69; font-weight: 700; text-decoration: none; }
.staff-sidebar-footer .staff-sign-out { padding: 0; text-align: left; }
.staff-app-content { min-width: 0; }
.staff-mobile-header { display: none; }
.staff-header { min-height: 72px; padding: 12px 28px; display: flex; align-items: center; gap: 36px; background: var(--staff-surface); border-bottom: 1px solid var(--staff-line); }
.staff-brand { display: flex; align-items: center; gap: 16px; color: inherit; text-decoration: none; }
.staff-brand img { width: 190px; }
.staff-brand span { padding-left: 16px; border-left: 1px solid var(--staff-line); color: var(--staff-muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.staff-header nav { display: flex; gap: 24px; margin-left: auto; }
.staff-header nav a { color: inherit; font-weight: 650; text-decoration: none; }
.staff-header nav a:hover { color: #896214; }
.staff-user { color: var(--staff-muted); font-size: 12px; }
.staff-sign-out { padding: 7px 9px; border: 0; background: none; color: #795510; font: 700 12px system-ui, sans-serif; cursor: pointer; }
.staff-main { width: min(1400px, calc(100% - 48px)); margin: 0 auto; padding: 42px 0 90px; }
.staff-flash { margin-bottom: 24px; padding: 14px 18px; border-left: 4px solid; background: var(--staff-surface); }
.staff-flash.success { border-color: #2b755a; }
.staff-flash.error { border-color: #a13c31; }
.staff-page-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 36px; }
.staff-page-heading h1, .staff-form-heading h1 { margin: 4px 0 8px; font: 500 clamp(36px, 5vw, 56px)/1.05 Georgia, serif; }
.staff-page-heading p, .staff-form-heading p { margin: 0; color: var(--staff-muted); }
.staff-eyebrow { color: #896214 !important; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; }
.staff-button { min-height: 42px; padding: 10px 17px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--staff-line); border-radius: 3px; background: var(--staff-surface); color: inherit; font: 700 13px/1 system-ui, sans-serif; text-decoration: none; cursor: pointer; }
.staff-button.primary { background: var(--staff-gold); border-color: var(--staff-gold); }
.staff-button.danger { color: #922f27; }
.staff-toolbar { padding: 13px 16px; display: flex; justify-content: space-between; background: var(--staff-ink); color: #fff; }
.staff-toolbar div { display: flex; gap: 8px; }
.staff-toolbar a { padding: 7px 10px; color: inherit; font-size: 12px; font-weight: 700; text-decoration: none; }
.staff-toolbar a.active { background: rgba(255,255,255,.15); }
.staff-event-month { margin-top: 38px; }
.staff-event-month > h2 { margin: 0 0 12px; font: 500 23px/1.2 Georgia, serif; }
.staff-event-row { min-height: 104px; padding: 18px; display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 22px; background: var(--staff-surface); border: 1px solid var(--staff-line); }
.staff-event-row + .staff-event-row { border-top: 0; }
.staff-event-date { text-align: center; }
.staff-event-date span { display: block; color: #896214; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.staff-event-date strong { display: block; font: 500 30px/1 Georgia, serif; }
.staff-event-summary h3 { margin: 5px 0 2px; font-size: 17px; }
.staff-event-summary p { margin: 0; color: var(--staff-muted); font-size: 12px; }
.staff-event-meta { display: flex; gap: 8px; }
.staff-category, .staff-draft { padding: 3px 7px; background: var(--staff-cream); color: #725113; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.staff-category.no_school, .staff-draft { background: #fdf0ed; color: #a13c31; }
.staff-category.worship { background: #f3f0f8; color: #5e4a83; }
.staff-category.community { background: #edf7f4; color: #28685d; }
.staff-event-actions { display: flex; gap: 8px; }
.staff-event-actions form { margin: 0; }
.staff-empty { margin-top: 30px; padding: 60px 24px; background: var(--staff-surface); border: 1px solid var(--staff-line); text-align: center; }
.staff-empty h2 { margin-bottom: 8px; }
.staff-empty p { color: var(--staff-muted); }
.actionable-empty .staff-button { margin-top: 12px; }
.workspace-setup { margin: 24px 0 30px; border: 1px solid var(--staff-border); border-top: 4px solid var(--staff-gold); background: var(--staff-surface); box-shadow: 0 14px 35px rgba(42, 52, 57, .06); }
.workspace-setup > header { display: flex; justify-content: space-between; gap: 28px; align-items: center; padding: 26px 28px; border-bottom: 1px solid var(--staff-border); }
.workspace-setup > header h2 { margin: 4px 0 6px; font: 400 30px/1.1 var(--staff-serif); }
.workspace-setup > header p:last-child { max-width: 680px; margin: 0; color: var(--staff-muted); font-size: 13px; }
.workspace-setup > header .staff-button { flex: 0 0 auto; }
.workspace-setup-steps { margin: 0; padding: 0; list-style: none; }
.workspace-setup-steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 14px; align-items: center; min-height: 72px; padding: 12px 28px; border-bottom: 1px solid var(--staff-border); }
.workspace-setup-steps li:last-child { border-bottom: 0; }
.workspace-setup-steps li.next { background: #fffaf0; }
.workspace-step-mark { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #c9b98f; border-radius: 50%; color: #80601b; font-size: 12px; font-weight: 850; }
.workspace-setup-steps .complete .workspace-step-mark { border-color: #8db69a; background: #e8f3eb; color: #2f7143; }
.workspace-setup-steps strong, .workspace-setup-steps div > span { display: block; }
.workspace-setup-steps strong { font-size: 13px; }
.workspace-setup-steps div > span, .workspace-setup-steps small { color: var(--staff-muted); font-size: 11px; }
.workspace-setup-steps a { color: var(--staff-gold-dark); font-size: 12px; font-weight: 800; text-decoration: none; }
.setup-form { max-width: 720px; }
@media (max-width: 760px) {
  .workspace-setup > header { align-items: stretch; flex-direction: column; padding: 22px 20px; }
  .workspace-setup > header .staff-button { width: 100%; }
  .workspace-setup-steps li { grid-template-columns: 32px minmax(0, 1fr); padding: 14px 20px; }
  .workspace-setup-steps li > a, .workspace-setup-steps li > small { grid-column: 2; }
}
.staff-form-heading { max-width: 760px; margin-bottom: 30px; }
.staff-form-heading > a { color: #795510; font-size: 13px; font-weight: 700; text-decoration: none; }
.staff-form { max-width: 840px; background: var(--staff-surface); border: 1px solid var(--staff-line); }
.staff-form-section { padding: 30px; border-bottom: 1px solid var(--staff-line); }
.staff-form-section h2, .staff-form-errors h2 { margin: 0 0 22px; font: 500 24px/1.2 Georgia, serif; }
.staff-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.staff-field { display: flex; flex-direction: column; gap: 7px; }
.staff-field.full { grid-column: 1 / -1; }
.staff-field label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.staff-field input, .staff-field select, .staff-field textarea { width: 100%; padding: 12px 13px; border: 1px solid #c9c5bc; border-radius: 2px; background: var(--staff-surface); font: inherit; }
.staff-field input:focus, .staff-field select:focus, .staff-field textarea:focus { outline: 2px solid var(--staff-gold); outline-offset: 1px; }
.staff-field small, .staff-check small { display: block; color: var(--staff-muted); font-size: 11px; }
.staff-check { padding: 14px; display: flex; gap: 11px; border: 1px solid var(--staff-line); cursor: pointer; }
.staff-check input { width: 18px; height: 18px; accent-color: var(--staff-gold); }
.staff-check strong { display: block; }
.staff-form-actions { padding: 24px 30px; display: flex; justify-content: flex-end; gap: 10px; background: var(--staff-cream); }
.staff-form-errors { margin: 25px 30px 0; padding: 18px; border-left: 4px solid #a13c31; background: #fdf0ed; }
.staff-form-errors h2 { margin-bottom: 8px; font-family: system-ui, sans-serif; font-size: 15px; font-weight: 750; }
.staff-form-errors ul { margin-bottom: 0; }
.staff-booking-row { min-height: 115px; padding: 18px; display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 22px; background: var(--staff-surface); border: 1px solid var(--staff-line); }
.staff-booking-row + .staff-booking-row { border-top: 0; }
.staff-booking-note { margin-top: 8px !important; padding-left: 10px; border-left: 2px solid var(--staff-gold); }
.staff-booking-actions { display: flex; align-items: center; gap: 8px; }
.staff-booking-actions select { min-height: 42px; padding: 8px 30px 8px 10px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-stage-filters { margin-bottom: 20px; display: flex; gap: 7px; overflow-x: auto; padding-bottom: 5px; }
.staff-stage-filters a { flex: 0 0 auto; padding: 8px 11px; border: 1px solid var(--staff-line); background: var(--staff-surface); color: inherit; font-size: 11px; font-weight: 700; text-decoration: none; }
.staff-stage-filters a.active { border-color: var(--staff-gold); background: var(--staff-gold); }
.staff-lead-table { border-top: 1px solid var(--staff-line); }
.staff-lead-row { padding: 18px; display: grid; grid-template-columns: 1.3fr 1fr 1fr auto; gap: 24px; align-items: center; border: 1px solid var(--staff-line); border-top: 0; background: var(--staff-surface); color: inherit; text-decoration: none; }
.staff-lead-row:hover { border-left: 3px solid var(--staff-gold); padding-left: 16px; }
.staff-lead-row div { min-width: 0; }
.staff-lead-row strong, .staff-lead-row span { display: block; }
.staff-lead-row span { color: var(--staff-muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.staff-lead-detail { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; }
.staff-lead-main > div, .staff-lead-sidebar { padding: 28px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-lead-main > div + div { border-top: 0; }
.staff-lead-main h2, .staff-lead-sidebar h2 { margin: 0 0 20px; font: 500 25px/1.2 Georgia, serif; }
.staff-lead-contact dl, .staff-lead-sidebar dl { margin: 0; }
.staff-lead-contact dl { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.staff-lead-contact dt, .staff-lead-sidebar dt { color: #896214; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.staff-lead-contact dd, .staff-lead-sidebar dd { margin: 3px 0 0; }
.staff-lead-timeline article { position: relative; padding: 0 0 25px 25px; display: grid; grid-template-columns: 1fr; border-left: 1px solid var(--staff-line); }
.staff-activity-dot { position: absolute; top: 3px; left: -5px; width: 9px; height: 9px; border-radius: 50%; background: var(--staff-gold); }
.staff-lead-timeline article p { margin: 4px 0; color: #454a51; }
.staff-lead-timeline article small { color: var(--staff-muted); }
.staff-note-form { margin-bottom: 30px; display: grid; gap: 9px; }
.staff-note-form textarea { width: 100%; padding: 12px; border: 1px solid var(--staff-line); font: inherit; resize: vertical; }
.staff-note-form .staff-button { justify-self: end; }
.staff-lead-sidebar { position: sticky; top: 24px; }
.staff-lead-sidebar form { display: grid; gap: 16px; padding-bottom: 28px; margin-bottom: 28px; border-bottom: 1px solid var(--staff-line); }
.staff-lead-sidebar .staff-button { width: 100%; }
.staff-lead-sidebar dl div + div { margin-top: 15px; }
.staff-kanban { width: 100%; margin-left: 0; padding: 0 0 20px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 300px); grid-template-rows: minmax(560px, auto); align-items: stretch; gap: 14px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; scrollbar-gutter: stable; }
.staff-kanban-column { min-width: 0; min-height: 560px; border: 1px solid var(--staff-line); background: #efefec; transition: border-color .15s, background .15s; }
.staff-kanban-column.is-over { border-color: var(--staff-gold); background: #f7efd9; }
.staff-kanban-column > header { padding: 14px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-kanban-column h2 { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: .07em; }
.staff-kanban-column > header span { min-width: 24px; padding: 2px 6px; border-radius: 20px; background: var(--staff-cream); text-align: center; font-size: 11px; font-weight: 800; }
.staff-kanban-cards { padding: 10px; display: grid; align-content: start; gap: 9px; }
.staff-lead-card { background: var(--staff-surface); border: 1px solid var(--staff-line); cursor: grab; box-shadow: 0 2px 8px rgba(23,27,34,.04); }
.staff-lead-card:active { cursor: grabbing; }
.staff-lead-card.is-dragging { opacity: .25; }
.staff-lead-card.is-pending { opacity: .7; }
.staff-lead-card-drag-preview { position: fixed; top: -10000px; left: -10000px; z-index: 9999; margin: 0; opacity: .96; transform: rotate(1deg); pointer-events: none; box-shadow: 0 18px 42px rgba(23,27,34,.22); cursor: grabbing; }
.staff-lead-card a { padding: 14px; display: grid; gap: 5px; color: inherit; text-decoration: none; }
.staff-lead-card span, .staff-lead-card small { color: var(--staff-muted); font-size: 11px; }
.staff-card-task { margin-top: 7px; padding-top: 7px; display: block; border-top: 1px solid var(--staff-line); color: #54636b; font-size: 10px; font-style: normal; font-weight: 700; }
.staff-card-task.overdue { color: #a13c31; }
.staff-kanban-empty { padding: 30px 10px; color: var(--staff-muted); font-size: 11px; text-align: center; }
.staff-lost-dialog { width: min(520px, calc(100% - 30px)); padding: 0; border: 1px solid var(--staff-line); color: var(--staff-ink); box-shadow: 0 30px 90px rgba(23,27,34,.24); }
.staff-lost-dialog::backdrop { background: rgba(23,27,34,.55); backdrop-filter: blur(3px); }
.staff-lost-dialog form { padding: 30px; display: grid; gap: 18px; }
.staff-lost-dialog h2 { margin: 0; font: 500 31px/1.1 Georgia, serif; }
.staff-lost-dialog p { margin: 0; color: var(--staff-muted); }
.staff-lost-dialog .staff-eyebrow { color: #896214; }
.staff-lost-dialog label span { color: var(--staff-muted); font-weight: 500; text-transform: none; letter-spacing: 0; }
.staff-dialog-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 5px; }
.staff-student-list { grid-column: 1 / -1; }
.staff-student-list ul { margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.staff-student-list li { padding: 7px 10px; display: flex; gap: 8px; background: var(--staff-cream); }
.staff-student-list li span { color: var(--staff-muted); }
.staff-conversation-help { color: var(--staff-muted); font-size: 12px; }
.staff-message-thread { margin: 24px 0; display: grid; gap: 12px; }
.staff-message { max-width: 88%; padding: 15px 17px; border: 1px solid var(--staff-line); background: var(--staff-canvas); }
.staff-message.outbound { margin-left: auto; background: #fbf4df; border-color: #dec888; }
.staff-message header { display: flex; justify-content: space-between; gap: 15px; }
.staff-message header span { color: var(--staff-muted); font-size: 10px; }
.staff-message header span.message-failed { color: #a13c31; font-weight: 800; }
.staff-message p:last-child { margin-bottom: 0; }
.staff-email-form { padding-top: 22px; display: grid; gap: 14px; border-top: 1px solid var(--staff-line); }
.staff-email-form .staff-button { justify-self: end; }
.staff-record-tabs { margin: -8px 0 22px; display: flex; gap: 24px; border-bottom: 1px solid #d9dddf; }
.staff-record-tabs a { padding: 11px 2px; border-bottom: 2px solid transparent; color: #536169; font-size: 12px; font-weight: 700; text-decoration: none; }
.staff-record-tabs a.active { border-color: #16849b; color: #165d6d; }
.staff-record-tabs a:hover { color: #165d6d; }
.staff-email-composer { border: 1px solid #cfd5d8; border-radius: 4px; background: var(--staff-surface); box-shadow: 0 5px 18px rgba(31,47,56,.08); overflow: hidden; }
.staff-composer-header { padding: 11px 15px; display: flex; align-items: center; justify-content: space-between; background: #f5f7f8; border-bottom: 1px solid #d9dddf; }
.staff-composer-header strong { font-size: 13px; }
.staff-composer-header span { color: #77838a; font-size: 10px; }
.staff-composer-address > div { min-height: 39px; padding: 8px 14px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid #e3e6e8; font-size: 11px; }
.staff-composer-address span { width: 42px; color: #77838a; }
.staff-composer-address small { color: #77838a; }
.staff-composer-tools { padding: 7px 12px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid #e3e6e8; background: #fafbfb; }
.staff-composer-tools label { padding-right: 3px; color: #5b6870; font-size: 10px; font-weight: 750; }
.staff-composer-tools select, .staff-composer-tools button, .staff-composer-tools a { min-height: 30px; padding: 6px 9px; border: 1px solid #cfd5d8; border-radius: 3px; background: var(--staff-surface); color: #3c535d; font: 650 10px system-ui, sans-serif; text-decoration: none; }
.staff-composer-tools button:disabled { opacity: .45; }
.staff-composer-subject { min-height: 41px; padding: 0 14px; display: grid; grid-template-columns: 56px 1fr; align-items: center; border-bottom: 1px solid #e3e6e8; }
.staff-composer-subject label { color: #77838a; font-size: 11px; }
.staff-composer-subject input { padding: 10px 0; border: 0; outline: 0; font: 600 12px system-ui, sans-serif; }
.staff-composer-body textarea { width: 100%; min-height: 190px; padding: 16px; border: 0; outline: 0; resize: vertical; font: 14px/1.6 system-ui, sans-serif; }
.staff-composer-footer { padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #e3e6e8; background: #fafbfb; }
.staff-composer-footer span { color: #77838a; font-size: 10px; }
.staff-composer-footer .staff-button { min-height: 34px; padding: 8px 18px; background: #16849b; border-color: #16849b; color: #fff; }
.staff-record-page { max-width: 980px; display: grid; gap: 18px; }
.staff-record-panel { padding: 24px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-record-panel-heading { margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; }
.staff-record-panel-heading h2 { margin: 4px 0 0; font: 500 27px/1.15 Georgia, serif; }
.staff-record-panel-heading > span { padding: 5px 9px; border-radius: 20px; background: #edf1f2; color: #637078; font-size: 10px; font-weight: 750; }
.staff-message-thread.paginated .staff-message { max-width: 100%; margin-left: 0; }
.staff-pagination { margin-top: 22px; padding-top: 18px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; border-top: 1px solid var(--staff-line); color: var(--staff-muted); font-size: 11px; }
.staff-pagination > :last-child { justify-self: end; }
.staff-inline-notice { margin: 0 0 14px; padding: 10px 12px; border-left: 3px solid #2b755a; background: #edf7f2; color: #245e49; font-size: 12px; font-weight: 700; }
.staff-section-heading-inline p { margin: -12px 0 22px; color: var(--staff-muted); font-size: 12px; }
.staff-task-list { margin-bottom: 24px; display: grid; gap: 8px; }
.staff-task { padding: 13px; display: grid; grid-template-columns: 30px 1fr; gap: 11px; align-items: center; border: 1px solid var(--staff-line); }
.staff-task.overdue { border-left: 3px solid #a13c31; }
.staff-task.complete { opacity: .58; }
.staff-task.complete strong { text-decoration: line-through; }
.staff-task-toggle { width: 28px; height: 28px; padding: 0; display: grid; place-items: center; border: 1px solid #aaa69d; border-radius: 50%; background: var(--staff-surface); cursor: pointer; }
.staff-task.complete .staff-task-toggle { border-color: #2b755a; background: #2b755a; color: #fff; }
.staff-task strong, .staff-task small { display: block; }
.staff-task small { margin-top: 3px; color: var(--staff-muted); font-size: 10px; }
.staff-task.overdue small { color: #a13c31; font-weight: 700; }
.staff-task-form { padding-top: 22px; display: grid; gap: 14px; border-top: 1px solid var(--staff-line); }
.staff-task-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.staff-task-form .staff-button { justify-self: end; }
.staff-lead-create-form { max-width: 940px; }
.staff-section-heading-row { margin-bottom: 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.staff-section-heading-row h2 { margin: 0; }
.staff-student-fields { display: grid; gap: 12px; }
.staff-manual-student { padding: 16px; display: grid; grid-template-columns: 1.4fr 1fr 34px; gap: 14px; align-items: end; border: 1px solid var(--staff-line); background: var(--staff-subtle); }
.staff-remove-student { width: 34px; height: 43px; border: 1px solid #d4aaa4; background: var(--staff-surface); color: #922f27; font-size: 19px; cursor: pointer; }
.staff-application-review { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.staff-application-content { display: grid; gap: 16px; }
.staff-review-card, .staff-review-panel { padding: 28px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-review-card h2, .staff-review-panel h2 { margin: 0 0 22px; font: 500 26px/1.2 Georgia, serif; }
.staff-review-card h3 { margin-top: 28px; font: 500 20px/1.2 Georgia, serif; }
.staff-review-details { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.staff-review-details dt { color: #896214; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.staff-review-details dd { margin: 3px 0 0; }
.staff-review-panel { position: sticky; top: 24px; }
.staff-review-panel form { display: grid; gap: 16px; }
.staff-review-panel .staff-button { width: 100%; }
.staff-review-lead-link { margin-top: 22px; padding-top: 20px; display: block; border-top: 1px solid var(--staff-line); color: #795510; font-weight: 700; text-decoration: none; }
.staff-enrollment-action { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--staff-line); }
.staff-enrollment-action h3 { margin: 0 0 8px; font: 500 20px/1.2 Georgia, serif; }
.staff-enrollment-action p { color: var(--staff-muted); font-size: 13px; line-height: 1.5; }
.staff-household-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.staff-household-people { display: grid; gap: 12px; }
.staff-household-people article { padding: 16px; display: grid; gap: 5px; border: 1px solid var(--staff-line); background: var(--staff-canvas); }
.staff-household-people article > span { color: var(--staff-muted); font-size: 12px; }
.staff-household-people a { color: #795510; font-size: 13px; }
.staff-household-history { display: grid; gap: 16px; }
.staff-household-history article { display: grid; gap: 4px; }
.staff-household-history article + article { padding-top: 16px; border-top: 1px solid var(--staff-line); }
.staff-household-history span { color: var(--staff-muted); font-size: 11px; }
.staff-heading-actions { margin-top: 16px; display: flex; gap: 8px; }
.staff-card-heading, .staff-person-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.staff-card-heading { margin-bottom: 22px; }
.staff-card-heading h2 { margin-bottom: 0; }
.staff-card-heading a, .staff-person-heading a { color: #795510; font-size: 12px; font-weight: 750; text-decoration: none; }
.staff-person-heading strong { min-width: 0; }
.staff-duplicate-warning { margin-bottom: 28px; padding: 24px; border: 1px solid #d8b45d; border-left: 5px solid var(--staff-gold); background: #fffbf0; }
.staff-duplicate-warning h2 { margin: 2px 0 6px; font: 500 24px/1.2 Georgia, serif; }
.staff-duplicate-warning > div > p:last-child { margin-top: 0; color: var(--staff-muted); }
.staff-duplicate-warning article { padding: 14px 0; display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid #e5d7af; }
.staff-duplicate-warning article div { min-width: 0; display: grid; gap: 3px; }
.staff-duplicate-warning article a { color: #795510; }
.staff-duplicate-warning article span { color: var(--staff-muted); font-size: 12px; }
.staff-inline-action { margin-top: 6px; padding: 0; border: 0; background: none; color: #795510; font: 750 12px/1.4 system-ui, sans-serif; text-align: left; cursor: pointer; }
.staff-inline-action.danger { color: #922f27; }
.staff-choice { padding: 9px 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--staff-line); background: var(--staff-surface); font-size: 12px; cursor: pointer; }
.staff-choice input { accent-color: var(--staff-gold); }
[hidden] { display: none !important; }

.faculty-heading { margin-bottom: 30px; display: flex; justify-content: space-between; align-items: end; gap: 28px; }
.faculty-heading h1 { margin: 4px 0 8px; font: 500 clamp(38px, 5vw, 62px)/1.02 Georgia, serif; }
.faculty-heading p { margin: 0; color: var(--staff-muted); }
.faculty-preview { margin: -10px 0 24px; padding: 13px 17px; display: flex; gap: 12px; border-left: 4px solid var(--staff-gold); background: #fff9e9; }
.faculty-preview span { color: var(--staff-muted); }
.faculty-metrics { margin-bottom: 22px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.faculty-metrics article { min-height: 104px; padding: 20px; display: flex; flex-direction: column-reverse; justify-content: space-between; border-right: 1px solid var(--staff-line); }
.faculty-metrics article:last-child { border-right: 0; }
.faculty-metrics article.needs-attention { box-shadow: inset 0 4px 0 #c9972f; }
.faculty-metrics strong { font: 500 32px/1 Georgia, serif; }
.faculty-metrics span { color: var(--staff-muted); font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.faculty-safety-panel { margin-bottom: 22px; padding: 20px 22px; display: grid; grid-template-columns: 210px 1fr; gap: 24px; border: 1px solid #d7a8a2; border-left: 5px solid #a13c31; background: var(--staff-surface); }
.faculty-safety-panel h2 { margin: 2px 0 0; font: 500 24px/1.15 Georgia, serif; }
.faculty-alert-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.faculty-alert-list a { padding: 10px 12px; display: grid; color: inherit; border: 1px solid #ead5d2; background: #fff8f7; text-decoration: none; }
.faculty-alert-list span { color: #8b4a43; font-size: 11px; }
.faculty-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(290px, .8fr); gap: 22px; align-items: start; }
.faculty-dashboard-main, .faculty-dashboard-side, .faculty-class-side { display: grid; gap: 22px; }
.faculty-panel { border: 1px solid var(--staff-line); background: var(--staff-surface); }
.faculty-panel > header { min-height: 81px; padding: 18px 21px; display: flex; justify-content: space-between; align-items: start; gap: 18px; border-bottom: 1px solid var(--staff-line); }
.faculty-panel > header h2 { margin: 2px 0 0; font: 500 25px/1.15 Georgia, serif; }
.faculty-panel > header > a { color: #795510; font-size: 12px; font-weight: 750; }
.faculty-panel-empty { padding: 35px 22px; display: grid; gap: 5px; color: var(--staff-muted); text-align: center; }
.faculty-panel-empty strong { color: var(--staff-ink); }
.faculty-panel-empty.compact { padding: 21px; }
.faculty-schedule { padding: 10px 21px 20px; }
.faculty-schedule article { min-height: 72px; display: grid; grid-template-columns: 62px 12px 1fr; align-items: stretch; gap: 10px; }
.faculty-schedule time { padding-top: 18px; font-weight: 800; }
.faculty-schedule time small { margin-left: 3px; color: var(--staff-muted); font-size: 8px; }
.faculty-schedule-line { position: relative; width: 1px; justify-self: center; background: var(--staff-line); }
.faculty-schedule-line::before { position: absolute; top: 23px; left: -4px; width: 9px; height: 9px; border-radius: 50%; background: var(--staff-gold); content: ""; }
.faculty-schedule article > div { padding: 14px 0; display: grid; align-content: center; border-bottom: 1px solid #ecebe8; }
.faculty-schedule article > div span { color: var(--staff-muted); font-size: 11px; }
.faculty-class-list article { min-height: 94px; padding: 16px 20px; display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 15px; border-bottom: 1px solid var(--staff-line); }
.faculty-class-list article:last-child { border-bottom: 0; }
.faculty-class-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--staff-cream); color: #795510; font: 500 15px Georgia, serif; }
.faculty-class-list h3 { margin: 1px 0 2px; font-size: 15px; }
.faculty-class-list article > div:nth-child(2) > span, .faculty-class-list p { margin: 0; color: var(--staff-muted); font-size: 10px; }
.faculty-class-actions { display: flex; gap: 7px; }
.faculty-class-actions a { padding: 8px 10px; border: 1px solid var(--staff-line); color: inherit; font-size: 11px; font-weight: 750; text-decoration: none; }
.faculty-work-item { padding: 14px 20px; display: grid; border-bottom: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.faculty-work-item.urgent { border-left: 4px solid var(--staff-gold); background: #fffbf0; }
.faculty-work-item span { color: var(--staff-muted); font-size: 11px; }
.faculty-event-list, .faculty-announcement-list { padding: 0 20px; }
.faculty-event-list article { padding: 14px 0; display: grid; grid-template-columns: 40px 1fr; gap: 13px; border-bottom: 1px solid var(--staff-line); }
.faculty-event-list time { text-align: center; }
.faculty-event-list time strong, .faculty-event-list time span, .faculty-event-list article div > strong, .faculty-event-list article div > span { display: block; }
.faculty-event-list time strong { font: 500 22px/1 Georgia, serif; }
.faculty-event-list time span, .faculty-event-list article div > span { color: var(--staff-muted); font-size: 10px; text-transform: uppercase; }
.faculty-announcement-list article { padding: 15px 0; display: grid; gap: 3px; border-bottom: 1px solid var(--staff-line); }
.faculty-announcement-list article span { color: var(--staff-muted); font-size: 11px; }
.faculty-class-heading > div:first-child > a { color: #795510; font-size: 12px; font-weight: 750; text-decoration: none; }
.faculty-heading-actions { display: flex; gap: 8px; }
.faculty-class-summary { margin-bottom: 22px; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.faculty-class-summary article { padding: 17px 20px; display: grid; border-right: 1px solid var(--staff-line); }
.faculty-class-summary article:last-child { border-right: 0; }
.faculty-class-summary span { color: var(--staff-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.faculty-class-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 22px; align-items: start; }
.faculty-roster-panel { min-width: 0; }
.faculty-print-note, .faculty-print-only { display: none; }
.faculty-roster-table-wrap { overflow-x: auto; }
.faculty-roster-table { width: 100%; border-collapse: collapse; }
.faculty-roster-table th, .faculty-roster-table td { padding: 14px 18px; border-bottom: 1px solid var(--staff-line); text-align: left; }
.faculty-roster-table th { color: var(--staff-muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.faculty-roster-table td { font-size: 12px; }
.faculty-roster-alert { color: #922f27; font-weight: 750; }
.faculty-meeting-list, .faculty-quick-links { display: grid; }
.faculty-meeting-list article { padding: 13px 20px; display: grid; border-bottom: 1px solid var(--staff-line); }
.faculty-meeting-list span { color: var(--staff-muted); font-size: 11px; }
.faculty-quick-links > a { padding: 15px 20px; display: grid; border-bottom: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.faculty-quick-links > a span { color: var(--staff-muted); font-size: 11px; }

@media (min-width: 761px) and (max-height: 800px) {
  .staff-app-sidebar { padding-top: 10px; padding-bottom: 10px; }
  .staff-app-brand { padding-bottom: 10px; }
  .staff-app-brand img { width: 155px; }
  .staff-app-brand span { display: none; }
  .staff-app-sidebar nav p { margin-top: 11px; }
  .staff-app-sidebar nav a { min-height: 35px; padding-block: 7px; }
  .staff-sidebar-footer { padding-top: 10px; gap: 5px; }
}

.portal-body { min-height: 100vh; margin: 0; background: #f4f0e7; color: #293137; font: 15px/1.55 system-ui, sans-serif; }
.portal-header { min-height: 82px; padding: 14px max(24px, calc((100vw - 1180px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-brand { display: flex; align-items: center; gap: 18px; color: inherit; text-decoration: none; }
.portal-brand img { width: 190px; }
.portal-brand span { padding-left: 18px; border-left: 1px solid #ded5c6; color: #70777b; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }
.portal-account { display: flex; align-items: center; gap: 16px; color: #626a6f; font-size: 12px; }
.portal-account form { margin: 0; }
.portal-account button { padding: 7px 10px; border: 1px solid #d3cabd; background: var(--staff-surface); color: #795510; font-weight: 750; cursor: pointer; }
.portal-main { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 48px 0 90px; }
.portal-auth-card { width: min(540px, 100%); margin: 6vh auto 0; padding: clamp(28px, 6vw, 52px); border: 1px solid #ded5c6; background: var(--staff-surface); box-shadow: 0 18px 45px rgba(50, 42, 28, .08); }
.portal-auth-card h1, .portal-welcome h1, .portal-form-heading h1 { margin: 5px 0 12px; font: 500 clamp(36px, 6vw, 58px)/1.04 Georgia, serif; }
.portal-auth-card > p:not(.staff-eyebrow), .portal-welcome > p:last-child, .portal-form-heading > p:last-child { color: #626a6f; }
.portal-auth-card form { margin: 30px 0 15px; display: grid; gap: 18px; }
.portal-auth-card small { color: #70777b; }
.applicant-auth-card { position: relative; width: min(620px, 100%); overflow: hidden; border-top: 4px solid var(--staff-gold); }
.portal-auth-mark { position: absolute; top: 0; right: 0; width: 72px; height: 72px; display: grid; place-items: center; background: var(--staff-ink); color: #fff; font-size: 24px; }
.applicant-auth-card h1 { max-width: 470px; margin-top: 10px; }
.portal-auth-intro { max-width: 510px; font-size: 16px; line-height: 1.65; }
.applicant-auth-card .portal-sign-in-form { margin-top: 32px; }
.applicant-auth-card .staff-button { width: fit-content; min-width: 210px; min-height: 46px; }
.portal-auth-help { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--staff-border); }
.portal-auth-help p { margin: 0; }
.portal-auth-help strong, .portal-auth-help span { display: block; }
.portal-auth-help strong { margin-bottom: 4px; color: var(--staff-ink); font-size: 12px; }
.portal-auth-help span { color: var(--staff-muted); font-size: 12px; line-height: 1.5; }
.portal-auth-help a { color: var(--staff-gold-dark); font-weight: 750; }
.portal-welcome { margin-bottom: 28px; }
.portal-student-switcher { margin-bottom: 22px; display: flex; gap: 8px; overflow-x: auto; }
.portal-student-switcher a { flex: 0 0 auto; padding: 10px 15px; border: 1px solid #d8d0c3; background: var(--staff-surface); color: inherit; font-size: 12px; font-weight: 750; text-decoration: none; }
.portal-student-switcher a.active { border-color: #b88627; background: #c9972f; }
.portal-dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.portal-panel { padding: clamp(22px, 4vw, 32px); border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-calendar-panel { grid-column: 1 / -1; }
.portal-announcements-panel { grid-column: 1 / -1; }
.portal-panel-heading { margin-bottom: 22px; display: flex; justify-content: space-between; align-items: start; gap: 18px; }
.portal-panel-heading h2 { margin: 2px 0 0; font: 500 27px/1.15 Georgia, serif; }
.portal-panel-heading > a { color: #795510; font-size: 12px; font-weight: 750; white-space: nowrap; }
.portal-details { margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.portal-details dt { color: #896214; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.portal-details dd { margin: 3px 0 0; }
.portal-pending { margin: 22px 0 0; padding: 12px; border-left: 3px solid #c9972f; background: #fffbf0; color: #626a6f; font-size: 12px; }
.portal-event-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.portal-event-list article { padding: 14px 0; display: grid; grid-template-columns: 50px 1fr; align-items: center; gap: 14px; border-top: 1px solid #e8e2d8; }
.portal-event-list time { text-align: center; }
.portal-event-list time span, .portal-event-list article div span { display: block; color: #70777b; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.portal-event-list time strong { display: block; font: 500 25px/1 Georgia, serif; }
.portal-event-list article div > strong { display: block; }
.portal-form-heading { max-width: 720px; margin-bottom: 28px; }
.portal-form-heading > a { color: #795510; font-size: 12px; font-weight: 750; text-decoration: none; }
.portal-form { padding: clamp(24px, 4vw, 36px); border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-form-actions { margin-top: 28px; display: flex; justify-content: flex-end; gap: 10px; }
.portal-announcement-list { display: grid; gap: 14px; }
.portal-announcement-list.compact { grid-template-columns: 1fr 1fr; }
.portal-announcement { position: relative; padding: 22px; border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-announcement.unread { border-left: 5px solid #c9972f; padding-left: 18px; }
.portal-announcement.urgent { background: #fff8ed; border-color: #d7a94d; }
.portal-announcement-meta { display: flex; flex-wrap: wrap; gap: 7px; color: #70777b; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.portal-announcement-meta span { padding: 3px 6px; background: #f2eee6; }
.portal-announcement-meta .urgent { background: #922f27; color: #fff; }
.portal-announcement-meta .unread { background: #c9972f; color: #24201a; }
.portal-announcement h3 { margin: 12px 0 7px; font: 500 23px/1.2 Georgia, serif; }
.portal-announcement h3 a { color: inherit; text-decoration: none; }
.portal-announcement > p { margin: 0; color: #626a6f; }
.portal-announcement-actions { margin-top: 16px; display: flex; align-items: center; gap: 18px; }
.portal-announcement-actions > a { color: #795510; font-size: 12px; font-weight: 750; }
.portal-announcement-actions form { margin: 0; }
.portal-announcement-detail { max-width: 820px; margin: 0 auto; padding: clamp(28px, 6vw, 58px); border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-announcement-detail.urgent { border-top: 6px solid #922f27; }
.portal-announcement-detail > a { color: #795510; font-size: 12px; font-weight: 750; }
.portal-announcement-detail .portal-announcement-meta { margin-top: 30px; }
.portal-announcement-detail h1 { margin: 12px 0 25px; font: 500 clamp(36px, 6vw, 58px)/1.05 Georgia, serif; }
.portal-announcement-detail p { font-size: 16px; line-height: 1.75; }
.staff-form-hint { color: var(--staff-muted); font-size: 12px; }
.staff-form-field-row { margin-top: 14px; padding: 16px; display: grid; grid-template-columns: 1.5fr 1fr 1.5fr auto auto; align-items: end; gap: 12px; border: 1px solid var(--staff-line); background: var(--staff-subtle); }
.staff-form-field-row .staff-check { min-height: 44px; align-items: center; }
.staff-form-field-preview { padding: 14px 0; display: grid; grid-template-columns: 38px 1fr auto; gap: 12px; border-top: 1px solid var(--staff-line); }
.staff-form-field-preview span, .staff-form-field-preview small { color: var(--staff-muted); font-size: 11px; }
.staff-form-responses { margin-top: 24px; }
.staff-response-row { padding: 13px 0; display: grid; grid-template-columns: 1.4fr 1fr .7fr 1fr; gap: 16px; border-top: 1px solid var(--staff-line); font-size: 12px; }
.portal-attention-panel { grid-column: 1 / -1; border-left: 5px solid #c9972f; }
.portal-attention-row { padding: 12px 0; display: grid; border-top: 1px solid #e8e2d8; color: inherit; text-decoration: none; }
.portal-attention-row span { color: #70777b; font-size: 11px; }
.portal-form-assignment-list { display: grid; gap: 10px; }
.portal-form-assignment { padding: 20px 22px; display: flex; justify-content: space-between; gap: 20px; border: 1px solid #ded5c6; background: var(--staff-surface); color: inherit; text-decoration: none; }
.portal-form-assignment > div { display: grid; gap: 4px; }
.portal-form-assignment > div:last-child { text-align: right; }
.portal-form-assignment span { color: #70777b; font-size: 11px; }
.portal-form-assignment.submitted { opacity: .65; pointer-events: none; }
.portal-official-form { max-width: 820px; padding: clamp(24px, 5vw, 46px); display: grid; gap: 24px; border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-official-form .staff-field > input, .portal-official-form .staff-field > textarea, .portal-official-form .staff-field > select { width: 100%; padding: 13px; border: 1px solid #c9c1b4; font: inherit; }
.portal-signature { margin-top: 10px; padding: 22px; border: 1px solid #d7a94d; background: #fffbf0; }
.portal-signature h2 { margin: 0 0 8px; font: 500 23px/1.2 Georgia, serif; }
.portal-signature p { color: #626a6f; font-size: 12px; }
.portal-official-form .staff-field > .family-form-signature-input {
  min-height: 66px;
  padding: 10px 16px 5px;
  border: 0;
  border-bottom: 2px solid #9d8148;
  border-radius: 0;
  background: rgba(255,255,255,.58);
  color: #25343d;
  font: 400 32px/1.2 "Snell Roundhand", "Segoe Script", "Brush Script MT", cursive;
}
.family-form-signature {
  display: block;
  color: #25343d;
  font: 400 24px/1.15 "Snell Roundhand", "Segoe Script", "Brush Script MT", cursive;
}
.staff-response-row .family-form-signature + small { display: block; margin-top: 3px; color: var(--staff-muted); font-size: 10px; }
.portal-official-form-actions { padding-top: 20px; display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid #ded5c6; }
.portal-official-form-actions > div:last-child { display: flex; gap: 8px; }
#form-save-status { color: #70777b; font-size: 11px; }
.portal-submitted-banner { padding-bottom: 18px; display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid #ded5c6; color: #687178; }
.portal-submitted-banner strong { color: #2b755a; text-transform: uppercase; letter-spacing: .08em; }
.portal-response { padding: 17px 0; display: grid; gap: 6px; border-bottom: 1px solid #e7e1d7; }
.portal-response > span { color: #6b7479; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.portal-response > strong { font-size: 16px; white-space: pre-wrap; }
.portal-form-assignment.submitted { opacity: 1; pointer-events: auto; border-left: 4px solid #2b755a; }
.staff-account-form { max-width: 760px; padding: 30px; display: grid; gap: 20px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.staff-permission-list { padding: 18px; display: grid; gap: 10px; border: 1px solid var(--staff-line); }
.staff-permission-list legend { padding: 0 7px; font-weight: 750; }
.staff-permission-list label { display: flex; align-items: center; gap: 10px; }
.staff-applicant-access { margin-bottom: 24px; padding: 18px; border: 1px solid #ded5c6; background: #faf7ef; }
.staff-applicant-access h3, .staff-applicant-access p { margin-top: 0; }
.staff-document-row { padding: 16px 0; display: grid; gap: 10px; border-top: 1px solid var(--staff-line); }
.staff-document-row span { display: block; color: var(--staff-muted); font-size: 11px; }
.staff-document-review { display: grid; grid-template-columns: 180px 1fr auto; gap: 8px; }
.staff-document-review select, .staff-document-review input { min-height: 42px; padding: 9px; border: 1px solid var(--staff-line); }
.staff-document-request-form { margin-top: 22px; padding-top: 22px; display: grid; gap: 14px; border-top: 2px solid var(--staff-line); }
.applicant-summary-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr); gap: 22px; }
.applicant-summary-grid .portal-panel { padding: clamp(24px, 4vw, 38px); }
.applicant-record-link { padding: 15px 0; display: grid; gap: 3px; border-bottom: 1px solid #e4ded4; color: inherit; text-decoration: none; }
.applicant-record-link span { color: #687178; font-size: 12px; }
.applicant-upload-card form { display: grid; gap: 16px; }
.portal-decision-card { max-width: 820px; padding: clamp(26px, 5vw, 48px); border: 1px solid #d8c28f; background: #fffaf0; }
.portal-decision-card h2 { margin: 5px 0 12px; font: 500 clamp(28px, 5vw, 42px)/1.1 Georgia, serif; }
.portal-decision-card > div { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px; }
.portal-decision-card form { margin: 0; }
.portal-enrollment-decision-form { margin-top: 24px; display: grid; gap: 14px; }
.portal-enrollment-progress { max-width: 820px; margin-bottom: 22px; padding: 22px; border: 1px solid #ded5c6; background: var(--staff-surface); }
.portal-enrollment-progress > div { display: flex; justify-content: space-between; }
.portal-enrollment-progress progress { width: 100%; height: 13px; margin-top: 12px; accent-color: #2b755a; }
.enrollment-progress-row { color: inherit; text-decoration: none; }
.auth-body { min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 24px; background: var(--staff-cream); color: var(--staff-ink); font: 15px/1.5 system-ui, sans-serif; }
.auth-shell { width: min(100%, 470px); }
.auth-card { padding: 40px; background: var(--staff-surface); border: 1px solid var(--staff-line); box-shadow: 0 24px 70px rgba(23,27,34,.08); }
.auth-logo { display: block; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid var(--staff-line); }
.auth-logo img { display: block; width: min(280px, 100%); }
.auth-heading h1 { margin: 5px 0 10px; font: 500 44px/1 Georgia, serif; }
.auth-heading > p:last-child { margin: 0; color: var(--staff-muted); }
.auth-form { display: grid; gap: 20px; margin-top: 30px; }
.auth-form .staff-button { width: 100%; margin-top: 5px; }
.auth-portal-link { margin-top: 20px; color: var(--staff-muted); font-size: 12px; text-align: center; }
.auth-portal-link a { color: #795510; font-weight: 750; }
.auth-help { color: var(--staff-muted); font-size: 12px; text-align: center; }
.auth-help a { color: #795510; font-weight: 700; }

@media (max-width: 760px) {
  .staff-app-shell { display: block; }
  .staff-app-sidebar { display: none; }
  .staff-mobile-header { min-height: 64px; padding: 10px 15px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--staff-line); background: var(--staff-surface); }
  .staff-mobile-header img { width: 170px; }
  .staff-mobile-header details { position: relative; }
  .staff-mobile-header summary { padding: 8px 10px; font-size: 12px; font-weight: 750; cursor: pointer; }
  .staff-mobile-header details nav { position: absolute; z-index: 50; top: 42px; right: 0; width: 190px; padding: 8px; display: grid; border: 1px solid var(--staff-line); background: var(--staff-surface); box-shadow: 0 14px 35px rgba(23,27,34,.15); }
  .staff-mobile-header details nav a { padding: 9px; color: inherit; font-weight: 650; text-decoration: none; }
  .staff-header { padding: 12px 16px; flex-wrap: wrap; gap: 12px; }
  .staff-brand img { width: 170px; }
  .staff-brand span, .staff-user { display: none; }
  .staff-sign-out { margin-left: auto; }
  .staff-header nav { width: 100%; margin: 0; justify-content: space-between; border-top: 1px solid var(--staff-line); padding-top: 11px; }
  .staff-header nav { justify-content: flex-start; overflow-x: auto; }
  .staff-header nav a { flex: 0 0 auto; }
  .staff-main { width: min(100% - 28px, 1400px); padding-top: 35px; }
  .staff-page-heading { align-items: stretch; flex-direction: column; }
  .staff-toolbar { align-items: flex-start; flex-direction: column; gap: 8px; }
  .staff-event-row { grid-template-columns: 45px 1fr; gap: 13px; }
  .staff-event-actions { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid var(--staff-line); }
  .staff-event-actions .staff-button { flex: 1; }
  .staff-event-actions form { display: flex; flex: 1; }
  .staff-fields { grid-template-columns: 1fr; }
  .staff-field.full { grid-column: auto; }
  .staff-form-section { padding: 23px 18px; }
  .staff-form-actions { padding: 20px 18px; }
  .staff-form-errors { margin: 20px 18px 0; }
  .staff-booking-row { grid-template-columns: 45px 1fr; gap: 13px; }
  .staff-booking-actions { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid var(--staff-line); }
  .staff-booking-actions form, .staff-booking-actions select { flex: 1; width: 100%; }
  .staff-lead-row { grid-template-columns: 1fr auto; gap: 12px; }
  .staff-lead-row div:nth-child(2), .staff-lead-row div:nth-child(3) { grid-column: 1; }
  .staff-lead-row > span { grid-column: 2; grid-row: 1; }
  .staff-lead-detail { grid-template-columns: 1fr; }
  .staff-lead-contact dl { grid-template-columns: 1fr; }
  .staff-lead-sidebar { position: static; }
  .staff-kanban { width: calc(100vw - 28px); margin-left: 0; grid-auto-columns: 84vw; grid-template-rows: minmax(480px, auto); scroll-snap-type: x proximity; }
  .staff-kanban-column { min-height: 480px; scroll-snap-align: start; }
  .staff-message { max-width: 96%; }
  .staff-message header { flex-direction: column; gap: 2px; }
  .staff-task-form-row { grid-template-columns: 1fr; }
  .staff-section-heading-row { align-items: flex-start; flex-direction: column; }
  .staff-manual-student { grid-template-columns: 1fr 38px; }
  .staff-manual-student .staff-field { grid-column: 1 / -1; }
  .staff-manual-student .staff-remove-student { grid-column: 2; }
  .staff-application-review { grid-template-columns: 1fr; }
  .staff-household-grid { grid-template-columns: 1fr; }
  .staff-duplicate-warning article { align-items: stretch; flex-direction: column; }
  .staff-duplicate-warning article form, .staff-duplicate-warning article .staff-button { width: 100%; }
  .faculty-heading { align-items: stretch; flex-direction: column; }
  .faculty-preview { align-items: flex-start; flex-direction: column; }
  .faculty-metrics { grid-template-columns: repeat(2, 1fr); }
  .faculty-metrics article { border-bottom: 1px solid var(--staff-line); }
  .faculty-metrics article:nth-child(2n) { border-right: 0; }
  .faculty-metrics article:last-child { grid-column: 1 / -1; }
  .faculty-safety-panel { grid-template-columns: 1fr; }
  .faculty-alert-list { grid-template-columns: 1fr; }
  .faculty-dashboard-grid, .faculty-class-layout { grid-template-columns: 1fr; }
  .faculty-class-list article { grid-template-columns: 42px minmax(0, 1fr); }
  .faculty-class-actions { grid-column: 1 / -1; }
  .faculty-class-actions a { flex: 1; text-align: center; }
  .faculty-heading-actions { align-items: stretch; flex-direction: column; }
  .faculty-class-summary { grid-template-columns: 1fr; }
  .faculty-class-summary article { border-right: 0; border-bottom: 1px solid var(--staff-line); }
  .faculty-class-summary article:last-child { border-bottom: 0; }
  .portal-header { min-height: 70px; padding: 12px 18px; }
  .portal-brand img { width: 140px; }
  .portal-brand span, .portal-account > span { display: none; }
  .portal-auth-card { margin-top: 2vh; }
  .portal-auth-mark { width: 54px; height: 54px; font-size: 19px; }
  .portal-auth-help { grid-template-columns: 1fr; gap: 16px; }
  .applicant-auth-card .staff-button { width: 100%; }
  .portal-main { width: min(100% - 28px, 1120px); padding-top: 28px; }
  .portal-dashboard-grid { grid-template-columns: 1fr; }
  .portal-calendar-panel { grid-column: auto; }
  .portal-announcements-panel { grid-column: auto; }
  .portal-details, .portal-event-list { grid-template-columns: 1fr; }
  .portal-panel-heading { align-items: start; flex-direction: column; }
  .portal-form-actions { align-items: stretch; flex-direction: column-reverse; }
  .portal-form-actions .staff-button { width: 100%; }
  .portal-announcement-list.compact { grid-template-columns: 1fr; }
  .portal-announcement-actions { align-items: flex-start; flex-direction: column; gap: 8px; }
  .staff-form-field-row { grid-template-columns: 1fr; }
  .staff-response-row { grid-template-columns: 1fr 1fr; }
  .portal-attention-panel { grid-column: auto; }
  .portal-form-assignment { align-items: flex-start; flex-direction: column; }
  .portal-form-assignment > div:last-child { text-align: left; }
  .applicant-summary-grid { grid-template-columns: 1fr; }
  .staff-document-review { grid-template-columns: 1fr; }
  .portal-official-form-actions { align-items: stretch; flex-direction: column; }
  .portal-official-form-actions > div:last-child { flex-direction: column; }
  .portal-official-form-actions .staff-button { width: 100%; }
  .staff-review-panel { position: static; }
  .staff-review-details { grid-template-columns: 1fr; }
  .auth-card { padding: 28px 22px; }
}

@media print {
  .staff-app-sidebar, .staff-mobile-header, .faculty-heading-actions, .faculty-class-side, .staff-flash { display: none !important; }
  .staff-app-shell { display: block; }
  .staff-body, .staff-main { background: var(--staff-surface); }
  .staff-main { width: 100%; padding: 0; }
  .faculty-class-heading { margin-bottom: 18px; }
  .faculty-class-heading h1 { font-size: 32px; }
  .faculty-class-summary { margin-bottom: 18px; }
  .faculty-class-layout { display: block; }
  .faculty-roster-panel { border-color: #777; }
  .faculty-roster-panel > header { min-height: auto; padding: 12px 14px; }
  .faculty-print-note, .faculty-print-only { display: table-cell; }
  .faculty-roster-panel .faculty-print-note { display: block; font-size: 10px; }
  .faculty-roster-table th, .faculty-roster-table td { padding: 10px 12px; border-color: #aaa; }
  .faculty-roster-table .faculty-print-only { width: 28%; }
}
/* Teacher gradebook */
.gradebook-heading { align-items: end; }
.gradebook-heading-actions { display: flex; align-items: end; gap: .75rem; }
.gradebook-scale-form { display: grid; grid-template-columns: minmax(12rem, 1fr) auto; gap: .5rem; align-items: end; min-width: 20rem; }
.gradebook-scale-form label { grid-column: 1 / -1; color: var(--staff-muted); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.gradebook-scale-form select,
.gradebook-assignment-form input,
.gradebook-assignment-form select,
.grade-entry-form input,
.grade-entry-form select,
.grade-comment textarea { border: 1px solid var(--staff-border); border-radius: 3px; background: var(--staff-surface); color: var(--staff-ink); font: inherit; }
.gradebook-scale-form select { min-height: 2.8rem; padding: .55rem .7rem; }
.gradebook-terms { display: flex; overflow-x: auto; border: 1px solid var(--staff-border); background: var(--staff-surface); margin-bottom: 1rem; }
.gradebook-terms a { flex: 1 0 9rem; padding: .85rem 1rem; border-right: 1px solid var(--staff-border); color: var(--staff-muted); font-weight: 750; text-align: center; text-decoration: none; }
.gradebook-terms a.active { background: var(--staff-ink); color: #fff; }
.gradebook-setup { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(28rem, 1.4fr); gap: 2rem; }
.gradebook-setup h2 { margin: .15rem 0 .75rem; }
.gradebook-category-list { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .8rem; }
.gradebook-category-list > span { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .6rem; background: #f4efe4; border: 1px solid #ded5c4; font-size: .82rem; font-weight: 700; }
.gradebook-category-list form { display: inline-flex; }
.gradebook-category-list button { border: 0; background: transparent; color: var(--staff-muted); cursor: pointer; font-size: 1rem; padding: 0; }
.gradebook-assignment-form { display: grid; grid-template-columns: minmax(12rem, 2fr) minmax(9rem, 1fr) 6rem 9rem auto; gap: .5rem; }
.gradebook-assignment-form input,
.gradebook-assignment-form select { min-width: 0; padding: .62rem; }
.gradebook-shell { margin: 1rem 0; border: 1px solid var(--staff-border); background: var(--staff-surface); box-shadow: 0 14px 35px rgba(42, 52, 57, .06); }
.gradebook-scroll { max-width: 100%; overflow: auto; }
.gradebook-table { min-width: 62rem; width: max-content; border-collapse: separate; border-spacing: 0; }
.gradebook-table th,
.gradebook-table td { width: 10.5rem; min-width: 10.5rem; padding: .55rem; border-right: 1px solid var(--staff-border); border-bottom: 1px solid var(--staff-border); vertical-align: top; }
.gradebook-table thead th { position: sticky; top: 0; z-index: 2; height: 7.5rem; background: #f6f3ec; text-align: left; }
.gradebook-table thead th > span,
.gradebook-table thead th > small { display: block; color: var(--staff-muted); font-size: .68rem; }
.gradebook-table thead th > span { letter-spacing: .08em; text-transform: uppercase; }
.gradebook-table thead th > strong { display: block; margin: .3rem 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gradebook-table .student-column { position: sticky; left: 0; z-index: 3; width: 14rem; min-width: 14rem; background: var(--staff-surface); }
.gradebook-table thead .student-column { z-index: 4; background: var(--staff-ink); color: #fff; }
.gradebook-table tbody .student-column span { display: block; margin-top: .2rem; color: var(--staff-muted); font-size: .75rem; font-weight: 500; }
.gradebook-table .average-column { position: sticky; right: 0; z-index: 3; background: #f9f5eb; }
.grade-entry-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: .3rem; }
.grade-entry-frame { display: block; min-height: 5.55rem; margin: -.25rem; padding: .45rem; border: 1px solid transparent; border-radius: 4px; transition: background-color .15s ease, border-color .15s ease; }
.grade-entry-state { display: block; margin-bottom: .35rem; font-size: .62rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.grade-entry-frame.ungraded { border: 1px dashed #c79b3c; background: #fffaf0; }
.grade-entry-frame.ungraded .grade-entry-state { color: #8a651d; }
.grade-entry-frame.ungraded .grade-entry-form input { border-color: #c79b3c; box-shadow: inset 0 0 0 1px rgba(199, 155, 60, .12); }
.grade-entry-frame.graded { border-color: #b8d6c1; background: #f1f8f3; }
.grade-entry-frame.graded .grade-entry-state { color: #2f7143; }
.grade-entry-frame.graded .grade-entry-form input,
.grade-entry-frame.graded .grade-entry-form select { border-color: #a9cbb3; }
.grade-entry-frame.missing { border-color: #e4b0a8; background: #fff1ef; }
.grade-entry-frame.missing .grade-entry-state { color: #a43e32; }
.grade-entry-frame.excused { border-color: #cbd2d5; background: #f2f5f6; }
.grade-entry-frame.excused .grade-entry-state { color: #58676f; }
.grade-entry-frame.incomplete { border-color: #dfc485; background: #fff8e5; }
.grade-entry-frame.incomplete .grade-entry-state { color: #85631e; }
.grade-entry-frame.saving { opacity: .65; }
.grade-entry-form input,
.grade-entry-form select { width: 100%; min-height: 2rem; padding: .3rem .4rem; font-size: .78rem; }
.grade-entry-form > span { color: var(--staff-muted); font-size: .7rem; font-weight: 700; text-align: right; }
.grade-comment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.grade-comment-grid article { padding: 1rem; border: 1px solid var(--staff-border); background: var(--staff-subtle); }
.grade-comment-grid h3 { margin: 0 0 .6rem; }
.grade-comment textarea { width: 100%; resize: vertical; padding: .7rem; line-height: 1.45; }
.grade-comment form > span { display: block; margin-top: .3rem; color: var(--staff-muted); font-size: .7rem; text-align: right; }
.report-card-list { display: grid; gap: .55rem; }
.report-card-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1rem; align-items: center; padding: .85rem 1rem; border: 1px solid var(--staff-border); background: var(--staff-surface); }
.report-card-list article div span { display: block; color: var(--staff-muted); font-size: .8rem; }
.report-card-status { padding: .35rem .55rem; background: #eee9de; color: var(--staff-muted); font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.report-card-status.published { background: #dfeee4; color: #27613a; }
.report-card-preview { max-width: 58rem; margin: 0 auto 2rem; border: 1px solid var(--staff-border); background: var(--staff-surface); box-shadow: 0 18px 45px rgba(42, 52, 57, .08); }
.report-card-preview > header { display: flex; justify-content: space-between; gap: 1rem; padding: 2rem; border-bottom: 3px solid var(--staff-gold); background: var(--staff-ink); color: #fff; }
.report-card-preview > header p { margin: 0 0 .3rem; color: #e5c980; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.report-card-preview > header h2 { margin: 0; color: #fff; font: 400 clamp(1.8rem, 4vw, 2.8rem)/1.05 var(--staff-serif); }
.report-card-preview > dl { display: grid; grid-template-columns: 2fr 1fr 1fr; margin: 0; padding: 1rem 2rem; background: #f5f1e8; }
.report-card-preview dl div { padding-right: 1rem; }
.report-card-preview dt { color: var(--staff-muted); font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.report-card-preview dd { margin: .25rem 0 0; font-weight: 750; }
.report-card-preview > section { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem 1.5rem; margin: 0 2rem; padding: 1.5rem 0; border-bottom: 1px solid var(--staff-border); }
.report-card-preview > section h3 { margin: .1rem 0 0; font: 400 1.55rem/1.1 var(--staff-serif); }
.report-card-preview > section p { margin: 0; color: var(--staff-muted); font-size: .75rem; }
.report-card-preview > section > strong { color: var(--staff-gold-dark); font: 400 1.5rem var(--staff-serif); }
.report-card-preview > section dl { display: flex; gap: 2rem; grid-column: 1 / -1; margin: .5rem 0 0; }
.report-card-preview blockquote { grid-column: 1 / -1; margin: .5rem 0 0; padding: 1rem; border-left: 3px solid var(--staff-gold); background: #faf8f2; line-height: 1.55; }
.report-card-preview blockquote span { display: block; margin-bottom: .3rem; color: var(--staff-muted); font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.safety-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.safety-record { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem; border: 1px solid var(--staff-border); border-left-width: 4px; background: var(--staff-surface); margin-bottom: .5rem; }
.safety-record span { display: block; color: var(--staff-muted); font-size: .75rem; }
.safety-record p { margin: .3rem 0 0; font-size: .85rem; }
.safety-record.routine,
.safety-record.authorized { border-left-color: #6da17b; }
.safety-record.important { border-left-color: #c89d3d; background: #fffaf0; }
.safety-record.critical,
.safety-record.prohibited { border-left-color: #b94a3d; background: #fff3f1; }
.attendance-safety-alert { display: inline-block; margin-top: .25rem; color: #a43e32; font-size: .7rem; font-weight: 800; }
.attendance-dismissal { display: inline-block !important; width: fit-content; margin-top: .2rem; padding: .15rem .35rem; background: #eef1f2; color: #4b5b63 !important; font-size: .64rem !important; font-weight: 750; text-transform: uppercase; }
.portal-safety-grid { margin-top: 1rem; }

@media (max-width: 900px) {
  .gradebook-heading { align-items: stretch; }
  .gradebook-heading-actions { align-items: stretch; flex-direction: column; }
  .gradebook-scale-form { min-width: 0; }
  .gradebook-setup { grid-template-columns: 1fr; }
  .gradebook-assignment-form { grid-template-columns: 1fr 1fr; }
  .gradebook-assignment-form input:first-of-type { grid-column: 1 / -1; }
  .grade-comment-grid { grid-template-columns: 1fr; }
  .report-card-preview > dl { grid-template-columns: 1fr; gap: .7rem; }
  .safety-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .gradebook-assignment-form { grid-template-columns: 1fr; }
  .gradebook-assignment-form input:first-of-type { grid-column: auto; }
  .gradebook-table .student-column { width: 11rem; min-width: 11rem; }
  .report-card-list article { grid-template-columns: 1fr; }
  .report-card-preview > header { flex-direction: column; }
  .report-card-preview > section { grid-template-columns: 1fr; margin: 0 1rem; }
  .report-card-preview > section > strong { grid-row: 2; }
}

.theme-toggle { padding: 5px 0; display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent; color: #50616a; font: 700 11px/1.3 system-ui, sans-serif; text-align: left; cursor: pointer; }
.theme-toggle > span:first-child { width: 17px; font-size: 14px; }
.portal-theme-toggle { padding: 7px 10px; border: 1px solid #d3cabd; color: #795510; }
.brand-logo-dark { display: none !important; }

html[data-theme="dark"] {
  color-scheme: dark;
  --staff-ink: #edf1f2;
  --staff-gold: #d4aa50;
  --staff-cream: #303a3f;
  --staff-line: #455158;
  --staff-muted: #aeb8bd;
  --staff-surface: #222b30;
  --staff-canvas: #182126;
  --staff-subtle: #293338;
}
html[data-theme="dark"] .staff-body,
html[data-theme="dark"] .portal-body { color: var(--staff-ink); }
html[data-theme="dark"] .staff-app-sidebar,
html[data-theme="dark"] .staff-mobile-header,
html[data-theme="dark"] .portal-header { border-color: var(--staff-line); background: #1d272c; }
html[data-theme="dark"] .staff-app-brand,
html[data-theme="dark"] .portal-brand { border-radius: 4px; }
html[data-theme="dark"] .brand-logo-light { display: none !important; }
html[data-theme="dark"] .brand-logo-dark { display: block !important; padding: 0; border-radius: 0; background: transparent; }
html[data-theme="dark"] .staff-app-sidebar nav a,
html[data-theme="dark"] .staff-mobile-header details nav a { color: #dce3e6; }
html[data-theme="dark"] .staff-app-sidebar nav a:hover { background: #2b363b; }
html[data-theme="dark"] .staff-app-sidebar nav a.active { background: #24434a; color: #bde5ed; }
html[data-theme="dark"] .staff-mobile-header details nav { border-color: var(--staff-line); background: var(--staff-surface); }
html[data-theme="dark"] .theme-toggle { color: #c4cdd1; }
html[data-theme="dark"] .portal-theme-toggle,
html[data-theme="dark"] .portal-account button { border-color: var(--staff-line); background: var(--staff-surface); color: #e1c57e; }
html[data-theme="dark"] :is(input, select, textarea) { border-color: #59666c !important; background-color: #172126 !important; color: #edf1f2; }
html[data-theme="dark"] :is(input, select, textarea)::placeholder { color: #87949a; }
html[data-theme="dark"] :is(.staff-button.primary, .staff-stage-filters a.active) { color: #182126; }
html[data-theme="dark"] :is(.staff-toolbar, .schedule-view-switch a.active, .schedule-day-tabs a.active, .schedule-matrix-corner, .schedule-grade-heading, .attendance-section > header, .report-card-preview > header) { background: #172126; color: #fff; }
html[data-theme="dark"] .schedule-grade-picker input:checked + span,
html[data-theme="dark"] .attendance-status-options input:checked + span { border-color: #7e929c; background: #40535c; color: #fff; }
html[data-theme="dark"] :is(.staff-kanban-column, .schedule-time-rail) { background: #1b252a; }
html[data-theme="dark"] :is(.staff-kanban-column.is-over, .faculty-preview, .staff-duplicate-warning, .attendance-notice-strip) { background: #393321; }
html[data-theme="dark"] :is(.staff-message, .auth-card, .portal-auth-card) { background: #263137; }
html[data-theme="dark"] :is(.staff-form-actions, .schedule-block-actions, .attendance-roster > footer) { background: #303a3f; }
html[data-theme="dark"] :is(.staff-category, .staff-draft, .report-card-status, .faculty-class-mark) { color: #e7cb87; }
html[data-theme="dark"] :is(.faculty-safety-panel, .faculty-alert-list a, .safety-record.critical, .safety-record.prohibited) { background: #3b2929; }
html[data-theme="dark"] :is(.grade-entry-frame.ungraded, .grade-entry-frame.incomplete) { background: #3b3425; }
html[data-theme="dark"] .grade-entry-frame.graded { background: #24372c; }
html[data-theme="dark"] .grade-entry-frame.missing { background: #3d2928; }
html[data-theme="dark"] .grade-entry-frame.excused { background: #30383c; }
html[data-theme="dark"] .report-card-preview > dl { background: #303a3f; }
html[data-theme="dark"] .report-card-preview blockquote { background: #293338; }
html[data-theme="dark"] .gradebook-table thead th { background: #303a3f; }
html[data-theme="dark"] .gradebook-table .student-column { background: var(--staff-surface); }
html[data-theme="dark"] .gradebook-table thead .student-column { background: #172126; }
html[data-theme="dark"] .gradebook-table .average-column { background: #293338; }
html[data-theme="dark"] a { text-decoration-color: #8c793f; }
html[data-theme="dark"] img { opacity: .94; }

@media print {
  html[data-theme="dark"] {
    color-scheme: light;
    --staff-ink: #171b22;
    --staff-line: #777;
    --staff-muted: #656a71;
    --staff-surface: #fff;
    --staff-canvas: #fff;
    --staff-subtle: #fff;
  }
  html[data-theme="dark"] .staff-body { color: #171b22; }
}

.billing-summary { margin-bottom: 22px; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--staff-line); background: var(--staff-surface); }
.billing-summary article { padding: 20px; display: grid; border-right: 1px solid var(--staff-line); }
.billing-summary article:last-child { border-right: 0; }
.billing-summary span, .billing-balance span { color: var(--staff-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.billing-summary strong { font: 500 30px/1.2 Georgia, serif; }
.billing-aging-summary { grid-template-columns: repeat(4, 1fr); }
.billing-aging-summary article.needs-attention { box-shadow: inset 0 4px 0 #a13c31; }
.billing-panel { margin-bottom: 22px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.billing-panel > header { padding: 18px 21px; border-bottom: 1px solid var(--staff-line); }
.billing-panel > header h2 { margin: 2px 0 0; font: 500 25px/1.15 Georgia, serif; }
.billing-account-list > a { min-height: 76px; padding: 15px 20px; display: grid; grid-template-columns: minmax(0, 1fr) auto 130px; align-items: center; gap: 20px; border-bottom: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.billing-account-list > a div { display: grid; }
.billing-account-list > a div span, .billing-unbilled-list article span { color: var(--staff-muted); font-size: 11px; }
.billing-account-list > a > strong { text-align: right; font-size: 16px; }
.billing-account-list > a > strong small { display: block; color: var(--staff-muted); font-size: 8px; text-transform: uppercase; }
.billing-status { padding: 4px 7px; background: var(--staff-cream); color: var(--staff-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.billing-status.active { background: #e2f0e7; color: #286640; }
.billing-unbilled-list article { padding: 14px 20px; display: flex; justify-content: space-between; align-items: center; gap: 20px; border-bottom: 1px solid var(--staff-line); }
.billing-unbilled-list article > div { display: grid; }
.billing-heading > div:first-child > a { color: #795510; font-size: 12px; font-weight: 750; }
.billing-balance { min-width: 230px; padding: 18px 21px; display: grid; border-left: 4px solid var(--staff-gold); background: var(--staff-surface); }
.billing-balance strong { font: 500 36px/1.15 Georgia, serif; }
.billing-balance small { color: var(--staff-muted); }
.credit { color: #2d7651 !important; }
.debit { color: inherit; }
.billing-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(320px, .65fr); gap: 22px; align-items: start; }
.billing-account-toolbar { margin-bottom: 22px; padding: 12px; display: grid; grid-template-columns: repeat(4, 1fr) auto; align-items: center; gap: 1px; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.billing-account-toolbar > div { padding: 8px 14px; display: grid; border-right: 1px solid var(--staff-line); }
.billing-account-toolbar > div span { color: var(--staff-muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.billing-ledger article { min-height: 70px; padding: 13px 18px; display: grid; grid-template-columns: 90px minmax(0, 1fr) 105px 105px; align-items: center; gap: 14px; border-bottom: 1px solid var(--staff-line); }
.billing-ledger time, .billing-ledger article > span { color: var(--staff-muted); font-size: 10px; }
.billing-ledger article > div { display: grid; }
.billing-ledger article > div span { color: var(--staff-muted); font-size: 10px; }
.billing-ledger article > strong, .billing-ledger article > span { text-align: right; }
.billing-ledger article.reversed { opacity: .62; }
.billing-reversal { grid-column: 2 / -1; justify-self: end; }
.billing-reversal summary { color: #8a4c42; font-size: 10px; font-weight: 750; cursor: pointer; }
.billing-reversal form { margin-top: 6px; display: flex; gap: 5px; }
.billing-reversal input { min-width: 240px; padding: 6px 8px; font-size: 11px; }
.billing-plan { padding: 19px 20px; display: grid; grid-template-columns: 1fr auto; gap: 15px; border-bottom: 1px solid var(--staff-line); }
.billing-plan > div:first-child { display: grid; }
.billing-plan > div:first-child span { color: var(--staff-muted); font-size: 11px; }
.billing-installments, .portal-installments { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--staff-line); }
.billing-installments span, .portal-installments span { padding: 8px; display: grid; border-right: 1px solid var(--staff-line); color: var(--staff-muted); font-size: 10px; }
.billing-installments span strong, .portal-installments span strong { color: var(--staff-ink); }
.billing-installments span small, .portal-installments span small { font-size: 8px; font-weight: 800; text-transform: uppercase; }
.billing-installments span.paid, .portal-installments span.paid { background: #e5f1e8; color: #2d6d45; }
.billing-installments span.overdue, .portal-installments span.overdue { background: #fff0ed; color: #9a4035; }
.billing-installments span.due, .portal-installments span.due { background: #fff8e6; color: #85631e; }
.billing-side { display: grid; gap: 0; }
.billing-follow-ups article { padding: 13px 20px; display: flex; justify-content: space-between; align-items: start; gap: 12px; border-bottom: 1px solid var(--staff-line); }
.billing-follow-ups article div { display: grid; }
.billing-follow-ups article p { margin: 3px 0; font-size: 12px; }
.billing-follow-ups article span { color: var(--staff-muted); font-size: 9px; }
.billing-follow-ups article.completed { opacity: .58; }
.billing-follow-ups article.overdue { border-left: 4px solid #a13c31; background: #fff4f1; }
.billing-form { padding: 20px; display: grid; gap: 14px; }
.billing-direction-guide { padding: 11px 13px; display: grid; gap: 4px; border-left: 3px solid var(--staff-gold); background: var(--staff-cream); color: var(--staff-muted); font-size: 10px; }
.billing-direction-guide strong { color: var(--staff-ink); }
.billing-reminder-settings > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.billing-reminder-form { padding: 20px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 140px 1fr auto; align-items: end; gap: 12px; }
.billing-reminder-form .staff-check { min-height: 67px; }
.billing-email-history article { padding: 13px 20px; display: flex; justify-content: space-between; align-items: center; gap: 14px; border-bottom: 1px solid var(--staff-line); }
.billing-email-history article > div { min-width: 0; display: grid; }
.billing-email-history article span { color: var(--staff-muted); font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.billing-statement-links { display: grid; }
.billing-statement-links > a { padding: 12px 20px; display: flex; justify-content: space-between; gap: 15px; border-top: 1px solid var(--staff-line); color: inherit; font-size: 11px; text-decoration: none; }
.financial-statement { width: min(920px, 100%); margin: 0 auto; border: 1px solid var(--staff-line); background: var(--staff-surface); }
.financial-statement > header { padding: 24px 28px; display: flex; justify-content: space-between; align-items: center; border-bottom: 4px solid var(--staff-gold); }
.financial-statement > header img { width: 210px; padding: 5px; background: #f6f1e7; }
.financial-statement > header div { display: grid; text-align: right; }
.financial-statement > header p { margin: 0; color: var(--staff-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.statement-address { padding: 24px 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.statement-address div { display: grid; align-content: start; }
.statement-address div:last-child { text-align: right; }
.statement-address span { color: var(--staff-muted); font-size: 9px; text-transform: uppercase; }
.statement-address p { margin: 4px 0 0; color: var(--staff-muted); }
.statement-balance { padding: 16px 28px; display: flex; justify-content: flex-end; gap: 35px; background: var(--staff-cream); }
.financial-statement table { width: 100%; border-collapse: collapse; }
.financial-statement th, .financial-statement td { padding: 12px 16px; border-bottom: 1px solid var(--staff-line); text-align: left; }
.financial-statement th { color: var(--staff-muted); font-size: 9px; text-transform: uppercase; }
.financial-statement th:nth-last-child(-n+2), .financial-statement td:nth-last-child(-n+2) { text-align: right; }
.financial-statement footer { padding: 24px 28px; display: grid; color: var(--staff-muted); font-size: 10px; }
.statement-empty { padding: 30px; text-align: center; }
.statement-actions { width: min(920px, 100%); margin: 18px auto; display: flex; justify-content: flex-end; gap: 8px; }
.portal-billing-balance { margin-bottom: 18px; padding: 28px; display: grid; grid-template-columns: 240px 1fr; gap: 30px; border-left: 5px solid var(--staff-gold); background: var(--staff-surface); }
.portal-billing-balance > div { display: grid; }
.portal-billing-balance span { color: var(--staff-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.portal-billing-balance strong { font: 500 40px/1.1 Georgia, serif; }
.portal-billing-balance p { color: var(--staff-muted); }
.portal-billing-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 18px; align-items: start; }
.portal-billing-grid > div { display: grid; gap: 18px; }
.online-payment-panel { margin-bottom: 18px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: 30px; align-items: end; border-top: 4px solid var(--staff-gold); }
.online-payment-panel h2 { margin: 4px 0 8px; }
.online-payment-panel p { margin: 0; color: var(--staff-muted); }
.online-payment-form { display: flex; gap: 12px; align-items: end; }
.online-payment-form .staff-field { flex: 1; }
.payment-unavailable { padding: 14px; border: 1px solid var(--staff-line); background: var(--staff-soft); }
.payment-attempt-list { display: grid; }
.payment-attempt-list > :is(a, article) { padding: 13px 0; display: flex; justify-content: space-between; gap: 16px; align-items: center; border-bottom: 1px solid var(--staff-line); color: inherit; text-decoration: none; }
.payment-attempt-list > :is(a, article):last-child { border-bottom: 0; }
.payment-attempt-list div { display: grid; gap: 3px; }
.payment-attempt-list span:not(.payment-status) { color: var(--staff-muted); font-size: 12px; }
.payment-status { width: max-content; padding: 5px 9px; border-radius: 999px; background: var(--staff-soft); color: var(--staff-muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.payment-status.succeeded { background: #dcebdd; color: #315c36; }
.payment-status.processing, .payment-status.checkout_open { background: #f5e9bd; color: #725711; }
.payment-status.failed, .payment-status.canceled { background: #f1d8d5; color: #873f38; }
.payment-status-panel { max-width: 720px; padding: 38px; }
.payment-status-panel h2 { margin: 18px 0 8px; }
.payment-status-panel p { margin-bottom: 24px; color: var(--staff-muted); }
.staff-attribution-timeline { display: grid; margin-top: 10px; border-top: 1px solid var(--staff-line); }
.staff-attribution-timeline article { padding: 12px 0; display: grid; gap: 3px; border-bottom: 1px solid var(--staff-line); }
.staff-attribution-timeline span { color: var(--staff-gold-dark); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.staff-attribution-timeline small, .staff-attribution-timeline time { color: var(--staff-muted); font-size: 11px; }
.acquisition-filters { margin-bottom: 18px; padding: 16px; display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)) auto; gap: 12px; align-items: end; background: var(--staff-surface); border: 1px solid var(--staff-line); }
.acquisition-funnel { margin-bottom: 18px; display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); border: 1px solid var(--staff-line); background: var(--staff-surface); overflow-x: auto; }
.acquisition-funnel article { min-width: 110px; padding: 18px; display: grid; gap: 4px; border-right: 1px solid var(--staff-line); }
.acquisition-funnel article:last-child { border-right: 0; }
.acquisition-funnel span { color: var(--staff-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.acquisition-funnel strong { font: 500 30px/1 Georgia, serif; }
.acquisition-funnel small { color: var(--staff-muted); font-size: 10px; }
.acquisition-funnel .lost { background: var(--staff-soft); }
.acquisition-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; align-items: start; }
.acquisition-table-wrap { overflow-x: auto; }
.acquisition-table { width: 100%; min-width: 780px; border-collapse: collapse; font-size: 12px; }
.acquisition-table th { padding: 10px; color: var(--staff-muted); text-align: right; font-size: 9px; text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--staff-line); }
.acquisition-table th:first-child { text-align: left; }
.acquisition-table td { padding: 13px 10px; text-align: right; border-bottom: 1px solid var(--staff-line); }
.acquisition-table td:first-child { display: grid; gap: 3px; text-align: left; }
.acquisition-table td span { color: var(--staff-muted); font-size: 10px; }
.acquisition-delivery > article { padding: 12px 0; display: grid; gap: 6px; border-bottom: 1px solid var(--staff-line); }
.acquisition-delivery > article span { display: flex; justify-content: space-between; color: var(--staff-muted); font-size: 11px; }
.acquisition-delivery > p { color: var(--staff-muted); font-size: 11px; }
.portal-ledger article { padding: 14px 0; display: flex; justify-content: space-between; gap: 18px; border-top: 1px solid var(--staff-line); }
.portal-ledger article > div { display: grid; }
.portal-ledger article span { color: var(--staff-muted); font-size: 11px; }
.portal-installments { grid-template-columns: repeat(2, 1fr); margin: 0 20px 20px; }

html[data-theme="dark"] .billing-status.active { background: #263c30; color: #8bc19b; }
html[data-theme="dark"] .credit { color: #8bc9a2 !important; }
html[data-theme="dark"] :is(.billing-installments span.paid, .portal-installments span.paid) { background: #263c30; color: #8bc19b; }
html[data-theme="dark"] :is(.billing-installments span.overdue, .portal-installments span.overdue, .billing-follow-ups article.overdue) { background: #402a29; color: #e0a098; }
html[data-theme="dark"] :is(.billing-installments span.due, .portal-installments span.due) { background: #403821; color: #dec27e; }

@media (max-width: 760px) {
  .billing-summary { grid-template-columns: 1fr; }
  .billing-summary article { border-right: 0; border-bottom: 1px solid var(--staff-line); }
  .billing-account-list > a { grid-template-columns: 1fr auto; }
  .billing-account-list > a > strong { grid-column: 1 / -1; text-align: left; }
  .billing-layout, .portal-billing-grid, .portal-billing-balance, .online-payment-panel { grid-template-columns: 1fr; }
  .online-payment-form { align-items: stretch; flex-direction: column; }
  .acquisition-filters, .acquisition-layout { grid-template-columns: 1fr; }
  .billing-reminder-settings > header { align-items: stretch; flex-direction: column; }
  .billing-reminder-form { grid-template-columns: 1fr; }
  .billing-account-toolbar { grid-template-columns: repeat(2, 1fr); }
  .billing-account-toolbar .staff-button { grid-column: 1 / -1; }
  .billing-ledger { overflow-x: auto; }
  .billing-ledger article { min-width: 650px; }
  .billing-installments { grid-template-columns: repeat(2, 1fr); }
  .statement-address { grid-template-columns: 1fr; }
  .statement-address div:last-child { text-align: left; }
  .financial-statement { overflow-x: auto; }
  .financial-statement table { min-width: 650px; }
}

@media print {
  .statement-actions, .portal-header { display: none !important; }
  .financial-statement { width: 100%; border: 0; color: #171b22; background: #fff; }
}