/* User-pinned Stitch workspace: mint canvas, compact clinical cards, forest navigation. */
:root {
  --font-body: "Inter", sans-serif;
  --font-display: "Plus Jakarta Sans", sans-serif;
  --forest: #023631;
  --forest-deep: #023631;
  --forest-paper: #f1fcfb;
  --forest-panel: #fff;
  --forest-line: #dce6e5;
  --forest-ink: #141e1d;
  --forest-muted: #494641;
  --forest-mint: #aceee7;
  --attendance-neutral: #f2f1f0;
  --attendance-neutral-hover: #e8e6e4;
  --attendance-neutral-line: #d0cecb;
  --teal: #1f4d48;
  --teal-dark: #023631;
  --teal-light: #e5f0ef;
  --green: #2a6a64;
  --green-soft: #e5f8f6;
  --danger: #ba1a3d;
  --danger-soft: #ffeff2;
  --amber: #8c4b0b;
  --amber-soft: #fff4df;
  --text-light: #676159;
  --warm-gray: #e5f0ef;
  --workspace-rail: 248px;
  --shadow-sm: 0 1px 3px rgb(20 30 29 / 5%);
}
body, button, input, select, textarea { font-family: var(--font-body); }
h1, h2, h3, .app-topbar-brand, .sidebar-brand-block h1 { font-family: var(--font-display); }
body { color: var(--forest-ink); }
.app-update-notice { position: fixed; z-index: 1100; inset: auto 20px max(20px, env(safe-area-inset-bottom)); margin-left: auto; width: min(420px, calc(100% - 40px)); padding: 16px; border: 1px solid var(--forest-line); border-left: 3px solid var(--forest); border-radius: 12px; color: var(--forest-ink); background: var(--forest-panel); box-shadow: 0 8px 32px #02362624; }
.app-update-notice[hidden] { display: none; }
.app-update-notice strong { color: var(--forest); font-size: 1rem; }
.app-update-notice p { margin: 4px 0 12px; font-size: .875rem; line-height: 1.5; overflow-wrap: anywhere; }
.app-update-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.app-update-actions button { min-height: 48px; padding: 10px 18px; font-size: .875rem; }
.app-update-actions #app-update-reload { color: var(--forest-panel); background: var(--forest); border: 1px solid var(--forest); border-radius: 8px; font-weight: 600; cursor: pointer; }
.app-update-actions button:disabled { opacity: .6; cursor: default; }
.app-update-actions button:focus-visible { outline: 3px solid var(--forest); outline-offset: 3px; }
.workspace-sync { position: relative; flex-shrink: 0; margin-left: auto; }
.workspace-sync[hidden], .workspace-sync-message[hidden] { display: none; }
.workspace-sync-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 76px; min-height: 44px; padding: 8px 10px; border: 1px solid var(--forest-line); border-radius: 9px; background: var(--forest-panel); color: var(--forest-muted); font: 600 13px var(--font-body); cursor: pointer; touch-action: manipulation; }
.workspace-sync-button:focus-visible { outline: 3px solid var(--forest); outline-offset: 3px; }
.workspace-sync-button:active:not(:disabled) { transform: scale(.97); }
.workspace-sync-button:disabled { cursor: default; }
.workspace-sync-icon { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.workspace-sync-icon>* { display: none; }
[data-sync-state=synced] { color: var(--teal); }
[data-sync-state=pending], [data-sync-state=offline], [data-sync-state=attention] { color: var(--amber); }
[data-sync-state=synced] .sync-check, [data-sync-state=pending] .sync-warning, [data-sync-state=offline] .sync-warning, [data-sync-state=attention] .sync-warning, [data-sync-state=loading] .sync-arrows, [data-sync-state=syncing] .sync-arrows { display: block; }
[data-sync-state=loading] .workspace-sync-icon, [data-sync-state=syncing] .workspace-sync-icon { animation: sync-turn 1s linear infinite; }
.workspace-sync-message { position: absolute; right: 0; top: calc(100% + 8px); z-index: 1200; width: min(270px, calc(100vw - 32px)); margin: 0; padding: 12px 14px; border: 1px solid var(--forest-line); border-radius: 10px; background: var(--forest-panel); color: var(--forest-ink); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; box-shadow: 0 6px 18px rgb(20 30 29 / 10%); }
.app-topbar-inner>.notification-button { margin-left: 0; }
@keyframes sync-turn { to { transform: rotate(360deg); } }
@media (max-width: 600px) { .workspace-sync-button { min-width: 65px; padding-inline: 8px; gap: 4px; font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { [data-sync-state] .workspace-sync-icon { animation: none; } .workspace-sync-button:active:not(:disabled) { transform: none; } }
.legacy-history-banner {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  background: var(--forest-panel);
  border: 1px solid var(--forest-line);
  border-left: 3px solid var(--green);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}
.legacy-history-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--green-soft); color: var(--green); }
.legacy-history-icon svg { width: 26px; height: 26px; }
.legacy-history-copy { display: grid; gap: 7px; min-width: 0; }
.legacy-history-copy strong { color: var(--forest); font-family: var(--font-display); font-size: 16px; line-height: 1.4; font-weight: 700; }
.legacy-history-copy > span { width: fit-content; color: var(--forest-muted); background: var(--forest-paper); border-radius: 999px; padding: 3px 9px; font-size: 12px; line-height: 1.5; }
.legacy-history-cutoff { display: grid; gap: 5px; text-align: right; }
.legacy-history-cutoff span { color: var(--forest-muted); font-size: 12px; line-height: 1.5; }
.legacy-history-cutoff time { color: var(--forest); font-size: 14px; line-height: 1.5; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 600px) {
  .legacy-history-banner { grid-template-columns: 40px minmax(0, 1fr); padding: 16px; gap: 12px; }
  .legacy-history-icon { width: 40px; height: 40px; }
  .legacy-history-cutoff { grid-column: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; text-align: left; }
}
button { touch-action: manipulation; }
body :focus-visible { outline: 3px solid #2a6a64 !important; outline-offset: 3px !important; }
.app-sidebar :focus-visible, .mobile-primary-nav :focus-visible { outline-color: #aceee7 !important; }
input::placeholder, textarea::placeholder { color: #676159; }
.app-topbar { background: var(--forest-paper); }
.app-brand-mark { background: var(--forest); width: 32px; height: 32px; border-radius: 8px; }
.app-brand-mark svg { width: 21px; height: 21px; }
.app-topbar-brand { color: var(--forest); font-size: 20px; font-weight: 700; }
.notification-button { border: 0; background: transparent; box-shadow: none; }
.app-sidebar { padding-top: 26px; scrollbar-color: #547572 var(--forest); }
.sidebar-brand-mark { background: var(--forest-mint); }
.sidebar-brand-block h1 { font-weight: 700; font-size: 19px; }
.app-sidebar .tab-button.active { background: var(--forest-mint); }
.app-sidebar .tab-button { font-weight: 500; }
.clinical-scope-bar { display: none; }
.view-stack { max-width: 1380px; padding: 28px 32px 64px; gap: 20px; }
.workspace-page-heading { align-items: flex-start; gap: 12px; }
.workspace-page-heading h1 { color: var(--forest); font-size: 28px; line-height: 1.3; font-weight: 700; letter-spacing: -.035em; }
.workspace-page-heading p { max-width: 40ch; font-size: 12px; }
.section-heading h2, .dashboard-surface-heading h2, .home-workspace-section h2 { font-size: 18px; font-weight: 700; }
.student-dashboard-shell { gap: 20px; }
.student-home-header { background: white; border: 1px solid var(--forest-line); border-radius: 12px; padding: 24px; display: flex; }
.student-home-date { margin-bottom: 6px; font-size: 12px; font-weight: 600; }
.student-home-intro h1 { font-family: "DM Serif Display", Georgia, serif; font-size: 30px; font-weight: 400; letter-spacing: -.02em; }
.student-home-intro > p:last-child { margin-top: 8px; font-size: 12px; }
.student-home-period { background: #ebf6f5; border: 1px solid #dce9e8; border-radius: 8px; padding: 12px 16px; min-width: 0; }
.student-home-period strong { font: 600 14px var(--font-body); line-height: 1.5; }
.student-period-label, .student-home-period small { color: var(--forest-muted); font-size: 11px; }
.student-home-main-grid { grid-template-columns: minmax(0, 1.6fr) minmax(230px, 1fr); gap: 24px; padding: 0; border: 0; align-items: start; }
.view-panel .student-today-card { padding: 0 !important; border: 0 !important; background: transparent; border-radius: 0; }
.dashboard-surface-heading { margin-bottom: 12px; gap: 12px; }
.student-today-list { display: grid; gap: 12px; }
.student-today-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px 12px; padding: 16px; min-height: 110px; border: 1px solid var(--forest-line); border-radius: 12px; background: white; text-align: left; box-shadow: 0 1px 2px rgb(20 30 29 / 3%); }
.student-today-row:hover { background: #faffff; border-color: #9cb6b3; }
.student-today-row.pending { border-color: var(--forest); }
.student-today-row.is-current { border-color: var(--forest); box-shadow: inset 3px 0 var(--forest); }
.student-today-row.is-current .student-today-status { background: #aceee7; color: #023631; }
.student-today-row.safe { border-color: #bcdcd9; }
.student-today-row.risk { border-color: #edbfc9; }
.student-today-time { grid-column: 1; grid-row: 1; justify-self: start; border-radius: 4px; padding: 3px 7px; background: #e5f0ef; color: var(--forest-muted); font-size: 11px; font-weight: 500; }
.student-today-line { display: none; }
.student-today-details { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.student-today-details strong { color: var(--forest-ink); font-size: 14px; line-height: 1.5; font-weight: 700; }
.student-today-details small { display: block; font-size: 12px; line-height: 1.5; color: var(--forest-muted); margin-top: 3px; }
.student-today-status { grid-column: 2; grid-row: 1; justify-self: end; align-self: start; background: #e5f0ef; color: #494641; border-radius: 999px; font-size: 11px; padding: 3px 9px; }
.student-today-status.safe { background: var(--forest); color: white; }
.student-today-status.risk { background: #ffd6df; color: #930020; }
.student-today-status.pending { background: #fff0d5; color: #7b4208; }
.view-panel .student-focus-card { border: 1px solid #cde1df !important; padding: 20px !important; background: #ebf6f5; border-radius: 12px; }
.student-focus-row { border-color: #d3e5e3; padding: 14px 0; }
.student-focus-row strong { color: var(--forest); font-size: 13px; }
.student-focus-row small { color: #494641; font-size: 12px; }
.student-focus-row:hover { background: #e5f0ef; }
.home-attention-range { margin: 0; color: var(--forest-muted); font-size: 12px; line-height: 1.5; }
.home-attention-note { margin: 10px 0 0; color: var(--forest-muted); font-size: 12px; line-height: 1.5; }
.student-focus-row.community .student-focus-indicator { background: var(--green); }
.student-focus-indicator { background: #ba1a3d; }
.student-focus-arrow { color: #494641; }
.student-focus-card .student-empty-state.compact { min-height: 0; padding: 0; }
.student-focus-card .dashboard-surface-heading { margin-bottom: 12px; }
.home-workspace-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; border: 0; margin-top: 12px; }
.home-module-link, .home-module-link:nth-child(even), .home-module-link:nth-child(n+3) { display: flex; flex-direction: column; align-items: start; padding: 16px; border: 1px solid var(--forest-line); border-radius: 12px; background: white; gap: 12px; min-height: 150px; }
.home-module-link:hover { background: #faffff; }
.home-module-link > .lucide { display: none; }
.module-symbol { width: 32px; height: 32px; border-radius: 6px; background: #d8f4f1; color: #2a6a64; }
.module-symbol svg { width: 20px; height: 20px; }
.home-module-link strong { font-size: 13px; font-weight: 700; }
.home-module-link small { margin-top: 5px; font-size: 12px; line-height: 1.5; color: #494641; }
.tracker-tab-toggle { width: 100%; padding: 5px; border: 0; border-radius: 8px; background: #e5f0ef; gap: 4px; }
.tracker-tab-toggle .tracker-icon-button { flex: 1; border-radius: 6px; min-height: 38px; height: auto; padding: 8px 12px; color: #494641; }
.tracker-tab-toggle .tracker-icon-button.active { color: var(--forest); font-weight: 600; box-shadow: none; }
.tracker-button-label { font-size: 12px; font-weight: 500; }
.month-controls { gap: 8px; }
.month-title { font-size: 15px; font-weight: 600; }
.student-home-metrics { display: grid; grid-template-columns: minmax(180px,1fr) 1fr 1fr; background: white; border: 1px solid var(--forest-line); border-radius: 12px; padding: 20px; gap: 16px; overflow: visible; }
.student-home-metrics .student-metric-card { padding: 16px; border: 0; border-radius: 8px; background: #ebf6f5; display: flex; flex-direction: column; gap: 10px; }
.student-metric-card + .student-metric-card { border: 0; }
.student-home-metrics .student-metric-card:first-child { padding: 0; background: transparent; }
.student-metric-topline { min-height: 0; display: flex; align-items: start; flex-wrap: wrap; gap: 4px; }
.student-metric-topline > span:first-child { color: var(--forest-ink); font-size: 13px; font-weight: 600; }
.student-metric-status { display: block; width: 100%; color: #494641; font-size: 11px; }
.student-metric-card.risk .student-metric-status { color: #a71938; }
.student-metric-value { font-family: var(--font-body); color: var(--forest); font-size: 28px; line-height: 1.2; font-weight: 700; margin: 0; }
.student-metric-progress { width: 100%; height: 5px; margin: 0; background: #d6e4e3; }
.student-metric-progress span { background: var(--forest); }
.student-metric-foot { display: flex; flex-wrap: wrap; gap: 4px 12px; color: #494641; font-size: 11px; }
.student-metric-foot span { width: auto; }
.clinical-gauge { position: relative; width: 112px; height: 112px; margin: 0 auto; display: grid; place-items: center; }
.clinical-gauge svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); fill: none; stroke-width: 7; }
.clinical-gauge-track { stroke: #d9e5e4; }
.clinical-gauge-value { stroke: #023631; stroke-linecap: round; }
.clinical-gauge .student-metric-value { font-size: 23px; }
.student-metric-card:first-child > .student-metric-progress { display: none; }
.subject-dashboard-grid { gap: 12px; }
.subject-mini-card { border-radius: 12px; padding: 18px; background: white; }
.subject-mini-card h3 { color: var(--forest-ink); font-size: 15px; font-weight: 600; }
.subject-card-heading { gap: 10px; align-items: center; }
.subject-card-status { background: #e5f8f6; color: #215a54; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 500; }
.subject-mini-card.risk .subject-card-status { background: #ffd6df; color: #930020; }
.subject-mini-rows { gap: 14px; }
.subject-mini-row { --subject-status-ink: var(--forest-muted); min-width: 0; margin-top: 0; padding: 16px; border: 1px solid var(--forest-line); border-radius: 12px; background: var(--teal-light); }
.subject-mini-row.ok { --subject-status-ink: #315b57; border-color: #addbd6; background: var(--green-soft); }
.subject-mini-row.bad { --subject-status-ink: #713b47; border-color: #efb7c3; background: var(--danger-soft); }
.subject-mini-row.ok .subject-progress { background: #d3e8e6; }
.subject-mini-row.bad .subject-progress { background: #edd8dd; }
.subject-mini-head span { font-size: 12px; font-weight: 500; }
.subject-mini-head strong { font-size: 19px; font-weight: 700; }
.subject-compact-metric { color: #494641; font-size: 11px; }
.subject-mini-row small { font-size: 11px; }
.subject-mini-row p, .subject-mini-row small, .subject-mini-row .subject-mini-head span { color: var(--subject-status-ink); }
.subject-mini-row.bad .subject-mini-head strong { color: var(--danger); }
.subject-monthly-details { display: grid; gap: 7px; margin: 12px 0; font-size: 13px; line-height: 1.45; }
.subject-monthly-details > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.subject-monthly-details dt { min-width: 0; color: var(--subject-status-ink); }
.subject-monthly-details dd { flex: 0 0 auto; margin: 0; font-weight: 600; color: var(--forest-ink); }
.subject-monthly-row .subject-compact-metric { font-size: 12px; margin-top: 6px; }
.subject-monthly-disclosure { margin-top: 8px; border-top: 1px solid var(--forest-line); }
.subject-monthly-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; cursor: pointer; color: var(--forest-ink); font-size: 13px; font-weight: 600; list-style: none; }
.subject-monthly-disclosure > summary::-webkit-details-marker { display: none; }
.subject-monthly-disclosure > summary:focus-visible { outline: 2px solid var(--forest); outline-offset: 3px; border-radius: 6px; }
.subject-monthly-chevron::after { content: "+"; font-size: 19px; font-weight: 400; }
.subject-monthly-disclosure[open] .subject-monthly-chevron::after { content: "−"; }
.subject-monthly-row .subject-monthly-guidance { font-size: 13px; line-height: 1.5; }
.subject-monthly-row .subject-monthly-buffer { display: grid; gap: 3px; margin-top: 12px; padding-top: 10px; border-top: 1px solid currentColor; font-size: 13px; line-height: 1.45; }
.subject-monthly-buffer span { font-size: 12px; }
.fine-calc-button { background: #ffeff2; border-color: #efc3cd; color: #a71938; }
.view-panel .calendar-panel { padding: 20px !important; background: white !important; border: 1px solid var(--forest-line) !important; border-radius: 12px !important; }
.calendar-actions { flex-wrap: wrap; }
.calendar-grid { gap: 5px; }
.calendar-day { min-height: 58px; background: white; border: 0; border-radius: 8px; }
.calendar-day.selected, .calendar-day.selected.today { background: var(--forest); color: white; box-shadow: 0 2px 5px rgb(2 54 49 / 15%); }
.calendar-day.selected .day-number { color: white; }
.calendar-day.today { background: #ebf6f5; }
.calendar-weekdays { color: #494641; font-size: 11px; }
.legend-row { gap: 8px 12px; font-size: 10px; padding-bottom: 12px; }
.view-panel .detail-panel { padding: 0 !important; border: 0 !important; background: transparent; }
.detail-panel > .section-heading { margin-bottom: 12px; }
.detail-panel h2 { font-size: 21px; line-height: 1.4; }
.today-chip, .session-pill { border-radius: 999px; background: #e5f0ef; color: #023631; font-size: 11px; }
.sessions-list { gap: 14px; }
.session-item { padding: 18px; border: 1px solid #dce6e5; border-radius: 12px; background: white; box-shadow: 0 1px 2px rgb(20 30 29 / 5%); }
.session-item.needs-marking { border-color: #93b7b3; }
.session-item.not-counted { background: #eaf3f2; border-style: dashed; opacity: 1; color: #676159; }
.session-item.not-counted .session-title { color: #676159; text-decoration: line-through; }
.clinical-slot-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 11px; margin-bottom: 10px; }
.clinical-slot-number { padding: 4px 7px; background: #e5f0ef; color: #023631; border-radius: 4px; font-size: 11px; }
.clinical-slot-status { margin-left: auto; background: #e5f0ef; color: #494641; padding: 4px 9px; border-radius: 999px; font-size: 11px; }
.marked-present .clinical-slot-status { background: #aceee7; color: #0a514a; }
.marked-absent .clinical-slot-status { background: #ffd6df; color: #930020; }
.session-title { color: #141e1d; font-size: 17px; line-height: 1.4; }
.session-meta { color: #494641; font-size: 12px; line-height: 1.5; }
.session-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; border-top: 1px solid #e5edec; padding-top: 12px; margin-top: 14px; }
.attendance-choice-group { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; padding: 5px; border-radius: 12px; background: var(--attendance-neutral-hover); box-shadow: inset 0 1px 3px rgb(20 30 29 / 7%); }
.attendance-choice-group .choice-button { border-color: transparent; box-shadow: 0 1px 2px rgb(20 30 29 / 6%); }
.attendance-choice-group .choice-button.active { box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 3px 5px rgb(20 30 29 / 13%); }
.attendance-choice-group .choice-button.active .attendance-choice-icon { background: rgb(255 255 255 / 14%); }
.session-actions:has(.subject-override-control) { display: flex; flex-wrap: wrap; }
.choice-button, .small-button.attendance-bulk { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 48px; border-radius: 8px; border: 1px solid var(--attendance-neutral-line); background: var(--attendance-neutral); color: var(--forest-muted); font-size: 13px; font-weight: 600; box-shadow: 0 2px 3px rgb(20 30 29 / 6%); transition: transform 130ms cubic-bezier(.2,.8,.2,1), background-color 180ms ease-out, color 180ms ease-out, box-shadow 130ms ease-out; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.choice-button.present.active, .small-button.attendance-bulk.present.active { background: var(--teal); border-color: var(--teal); color: var(--forest-panel); }
.choice-button.absent.active, .small-button.attendance-bulk.absent.active { background: var(--danger); border-color: var(--danger); color: var(--forest-panel); }
.attendance-choice-icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; flex-shrink: 0; border: 1px solid currentColor; border-radius: 50%; }
.attendance-choice-icon svg { width: 14px; height: 14px; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.choice-button:disabled { opacity: .55; cursor: default; box-shadow: none; }
@media (hover: hover) {
  .choice-button:hover:not(:disabled):not(.active), .small-button.attendance-bulk:hover:not(:disabled):not(.active) { background: var(--attendance-neutral-hover); color: var(--forest-ink); }
  .choice-button.active:hover:not(:disabled), .small-button.attendance-bulk.active:hover:not(:disabled) { filter: brightness(.95); }
}
.choice-button:active:not(:disabled), .small-button.attendance-bulk:active:not(:disabled) { transform: translateY(1px) scale(.965); box-shadow: none; }
.choice-button:focus-visible, .small-button.attendance-bulk:focus-visible { outline: 3px solid var(--forest); outline-offset: 3px; }
.attendance-confirmed { animation: attendance-settle 320ms cubic-bezier(.16,1,.3,1); }
.attendance-confirmed .attendance-choice-icon { animation: attendance-icon-settle 320ms cubic-bezier(.16,1,.3,1); }
.attendance-confirmed .attendance-choice-icon path { stroke-dasharray: 20; animation: attendance-check-draw 220ms ease-out; }
@keyframes attendance-settle { 0% { transform: translateY(1px) scale(.92); } 48% { transform: translateY(-1px) scale(1.035); } 78% { transform: scale(.994); } 100% { transform: scale(1); } }
@keyframes attendance-icon-settle { from { transform: rotate(-12deg) scale(.8); } to { transform: rotate(0) scale(1); } }
@keyframes attendance-check-draw { from { stroke-dashoffset: 20; } to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) {
  .choice-button, .small-button.attendance-bulk { transition: none; }
  .choice-button:active:not(:disabled), .small-button.attendance-bulk:active:not(:disabled) { transform: none; }
  .attendance-confirmed { animation: none; }
  .attendance-confirmed .attendance-choice-icon, .attendance-confirmed .attendance-choice-icon path { animation: none; }
}
.entry-status { border: 0; padding-top: 10px; color: #494641; font-size: 11px; }
.view-panel .calibration-panel, .calibration-round-card { border: 1px solid var(--forest-line) !important; border-radius: 12px !important; background: white !important; padding: 20px !important; }
.calibration-round-head { gap: 12px; }
.calibration-round-head h3 { font-size: 16px; color: #023631; }
.calibration-round-chip { border-radius: 999px; background: #aceee7; color: #0a514a; font-size: 11px; }
.calibration-metric-row { background: #ebf6f5; border-color: #d6e5e4; border-radius: 8px; padding: 14px; }
.calibration-metric-name strong { font-size: 14px; }
.calibration-metric-stat label { font-size: 11px; color: #494641; }
.calibration-metric-stat strong { font-family: var(--font-body); color: #023631; }
.primary-button, .view-panel .primary-button, .small-button, .auth-submit { background: #1f4d48; border-color: #1f4d48; color: white; border-radius: 8px; box-shadow: none; }
.primary-button:hover:not(:disabled), .small-button:hover:not(:disabled), .auth-submit:hover:not(:disabled) { background: #023631; color: white; }
.ghost-button, .view-panel .ghost-button { border-radius: 8px; color: #023631; background: #e5f0ef; border-color: #d5e3e2; }
.view-panel input, .view-panel select, .view-panel textarea, .batch-dialog input, .batch-dialog select { border-color: #c8c5c0; border-radius: 8px; }
.batch-dialog { background: #f1fcfb; border-radius: 16px; box-shadow: 0 12px 36px rgb(2 54 49 / 16%); }
.batch-dialog h2 { font: 700 24px var(--font-display); color: #023631; }
.batch-library-tabs { display: flex; gap: 4px; padding: 5px; border-radius: 8px; background: #e5f0ef; margin: 16px 0; }
.batch-library-tabs button { flex: 1; border: 0; min-height: 38px; padding: 8px; font-size: 12px; background: transparent; }
.batch-library-tabs button[aria-pressed=true] { background: white; color: #023631; font-weight: 600; }
.batch-library-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 16px; }
.batch-library-row { align-items: start; gap: 12px; padding: 20px; background: white; border: 1px solid #d4e1e0; border-radius: 12px; }
.batch-library-row > div { min-width: 0; flex-basis: 100%; }
.batch-library-row strong { display: block; font: 600 17px var(--font-display); line-height: 1.5; color: #023631; }
.batch-library-row small { font-size: 12px; line-height: 1.5; color: #494641; }
.batch-library-row.is-selected { border-color: #1f4d48; }
.batch-library-row.is-completed { background: #faffff; }
.batch-library-card-state { display: inline-flex; padding: 4px 8px; border-radius: 999px; margin-bottom: 10px; background: #e5f0ef; color: #494641; font-size: 10px; font-weight: 600; }
.is-selected .batch-library-card-state { background: #1f4d48; color: white; }
.is-pending .batch-library-card-state { background: #fff0d5; color: #7b4208; }
.batch-library-row button[data-open], .batch-library-row button[data-apply] { background: #1f4d48; border-color: #1f4d48; color: white; flex-grow: 1; }
.batch-library-row button[data-cancel-application] { background: #ffd6df; border: 0; color: #930020; }
.batch-status-note { background: #e5f0ef; color: #214f4a; border-radius: 8px; font-size: 12px; line-height: 1.5; }
@media (max-width: 1199px) {
  .home-workspace-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .view-stack { padding-inline: 24px; }
}
@media (max-width: 999px) {
  :root { --app-topbar-height: 104px; }
  .app-topbar-inner { min-height: 58px; padding: 10px 16px; gap: 10px; }
  .sidebar-toggle-button { width: 30px; height: 32px; min-height: 32px; padding: 4px; border: 0; background: transparent; box-shadow: none; }
  .sidebar-toggle-button .sidebar-toggle-label { display: none; }
  .app-topbar-brand { font-size: 18px; gap: 8px; }
  .clinical-scope-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 16px; min-height: 46px; background: #ebf6f5; border-top: 1px solid #dfebea; }
  #clinical-batch-shortcut { display: flex; align-items: center; min-height: 32px; gap: 6px; min-width: 0; max-width: 74%; border: 1px solid #dce6e5; background: white; color: #023631; border-radius: 6px; padding: 5px 8px; font-size: 11px; font-weight: 600; }
  #clinical-batch-shortcut[hidden] { display: none; }
  #clinical-batch-shortcut span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #clinical-batch-shortcut svg { flex-shrink: 0; width: 15px; height: 15px; }
  .clinical-role-label { padding: 3px 8px; border-radius: 999px; background: #dce9e8; color: #214f4a; font-size: 10px; line-height: 1.4; text-align: center; }
  .app-sidebar { bottom: calc(64px + env(safe-area-inset-bottom)); }
  .mobile-primary-nav { background: #023631; border: 0; min-height: 64px; padding: 6px 12px calc(6px + env(safe-area-inset-bottom)); gap: 8px; }
  .mobile-primary-nav button { flex: 1; max-width: 96px; min-height: 52px; gap: 3px; padding: 6px 4px; border-radius: 999px; color: #eff8f7; background: transparent; font-size: 10px; font-weight: 500; }
  .mobile-primary-nav button.active { color: #023631; background: #aceee7; }
  .mobile-primary-nav button[aria-expanded=true] { background: #1f4d48; color: white; }
  .mobile-primary-nav button.active[aria-expanded=true] { color: #023631; background: #aceee7; }
  .mobile-primary-nav svg { width: 21px; height: 21px; }
  .mobile-primary-nav button:focus-visible { outline-color: #aceee7; }
  .view-stack { padding-bottom: 100px; }
  .student-home-main-grid { grid-template-columns: minmax(0,1.5fr) minmax(200px,1fr); }
}
@media (max-width: 680px) {
  .view-stack { padding: 16px 16px 100px; gap: 16px; }
  .workspace-page-heading { flex-direction: column; gap: 6px; }
  .workspace-page-heading h1 { font-size: 23px; }
  .workspace-page-heading p { text-align: left; max-width: none; font-size: 12px; }
  .student-dashboard-shell { gap: 16px; }
  .student-home-header { display: block; padding: 16px; }
  .student-home-intro h1 { font-size: 24px; line-height: 1.3; }
  .student-home-intro > p:last-child { margin-top: 6px; font-size: 11px; }
  .student-home-period { display: grid; gap: 3px; margin-top: 16px; padding: 12px; }
  .student-home-period .student-period-label { display: block; }
  .student-home-period small { display: none; }
  .student-home-main-grid { display: flex; flex-direction: column; gap: 16px; }
  .student-today-card, .student-focus-card { width: 100%; }
  .student-today-card { order: 1; }
  .student-focus-card { order: 2; }
  .view-panel .student-focus-card { padding: 16px !important; }
  .dashboard-surface-heading h2, .home-workspace-section h2 { font-size: 16px; }
  .dashboard-text-action { font-size: 11px; }
  .student-today-row { padding: 14px; gap: 9px 10px; }
  .student-today-time { font-size: 11px; }
  .student-today-details strong { font-size: 14px; }
  .student-today-status { grid-column: 2; grid-row: 1; font-size: 10px; }
  .clinical-attendance-watch { padding: 16px; }
  .clinical-attendance-watch strong { font-size: 13px; }
  .clinical-watch-copy { font-size: 12px; }
  .home-workspace-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .home-module-link, .home-module-link:nth-child(even), .home-module-link:nth-child(n+3) { min-height: 140px; padding: 13px; gap: 10px; }
  .tracker-tab-toggle .tracker-icon-button { padding: 8px 3px; gap: 4px; }
  .tracker-tab-toggle svg { display: none; }
  .tracker-button-label { font-size: 11px; }
  .student-home-metrics { grid-template-columns: minmax(0, .9fr) minmax(0,1.1fr); gap: 12px; padding: 16px; }
  .student-metric-card:first-child { grid-row: 1 / 3; }
  .student-home-metrics .student-metric-card { padding: 12px; display: flex; gap: 7px; }
  .student-home-metrics .student-metric-card:first-child { padding: 0; }
  .student-metric-topline > span:first-child { font-size: 12px; }
  .student-metric-status { font-size: 10px; }
  .student-metric-value { font-size: 22px; }
  .student-metric-foot { font-size: 10px; gap: 3px; }
  .student-metric-foot span { width: 100%; }
  .clinical-gauge { width: 112px; max-width: 100%; }
  .clinical-gauge .student-metric-value { font-size: 22px; }
  .student-subject-heading { flex-direction: row; align-items: center; margin-bottom: 12px; }
  .subject-mini-card { padding: 12px; }
  .subject-card-heading { margin-bottom: 8px; }
  .subject-mini-card h3 { font-size: 14px; }
  .subject-mini-rows { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .subject-mini-row { padding: 14px; }
  .subject-mini-row small { margin-top: 6px; font-size: 12px; line-height: 1.5; }
  .subject-mini-row .subject-compact-metric { flex-wrap: wrap; gap: 4px 12px; font-size: 12px; }
  .subject-mini-head strong { font-size: 18px; }
  .fine-calc-button { font-size: 10px; padding: 6px 9px; min-height: 36px; }
  .view-panel .calendar-panel { padding: 16px !important; }
  #calendar-section-heading { flex-direction: row; align-items: center; gap: 8px; }
  #calendar-section-heading .calendar-actions { flex: 0 0 auto; width: auto; gap: 4px; }
  #calendar-section-heading h2 { font-size: 16px; }
  .calendar-actions .icon-tool { width: 30px; min-height: 32px; padding: 6px; }
  .calendar-day { min-height: 44px; padding: 5px; }
  .day-number { font-size: 16px; }
  .legend-row { font-size: 10px; line-height: 1.5; }
  .detail-panel h2 { font-size: 20px; }
  .session-item { padding: 16px; }
  .session-title { font-size: 16px; }
  .session-actions { grid-template-columns: 1fr; }
  .session-actions .choice-button[data-value=clear] { grid-column: 1 / -1; min-height: 44px; background: transparent; border: 0; font-size: 12px; box-shadow: none; }
  .session-top { gap: 8px; }
  .session-pill { font-size: 10px; padding: 4px 8px; }
  .view-panel .calibration-panel, .calibration-round-card { padding: 16px !important; }
  .calibration-round-head { flex-wrap: wrap; }
  .calibration-round-head h3 { font-size: 15px; }
  .batch-dialog { width: calc(100vw - 24px); padding: 18px; }
  .batch-library-list { grid-template-columns: minmax(0,1fr); }
  .batch-library-tabs button { padding: 6px; font-size: 11px; }
  .batch-library-row { padding: 16px; }
}
@media (max-width: 360px) {
  .app-topbar-inner { padding-inline: 12px; gap: 6px; }
  .app-topbar-brand { font-size: 16px; gap: 6px; }
  .app-brand-mark { width: 28px; height: 28px; }
  .workspace-sync-button { min-width: 60px; padding-inline: 6px; }
}
@media print {
  .clinical-scope-bar, .mobile-primary-nav, .workspace-sync { display: none; }
  body { background: white; }
}
